@memberjunction/ng-explorer-core 5.31.0 → 5.33.0

package/dist/lib/about/about-dialog.component.js

@@ -0,0 +1,689 @@
+import { Component, EventEmitter, Input, Output, ChangeDetectorRef, inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { InstanceConfigEngine } from '@memberjunction/core-entities';
+import { GraphQLDataProvider, PACKAGE_VERSION } from '@memberjunction/graphql-dataprovider';
+import { MJAuthBase } from '@memberjunction/ng-auth-services';
+import { BaseAngularComponent } from '@memberjunction/ng-base-types';
+import { ThemeService } from '@memberjunction/ng-shared';
+import { ServerConnectivityService } from '../services/server-connectivity.service';
+import * as i0 from "@angular/core";
+function AboutDialogComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 14);
+    i0.ɵɵtext(1, " Connected to ");
+    i0.ɵɵdomElementStart(2, "span", 50);
+    i0.ɵɵtext(3);
+    i0.ɵɵdomElementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r1.ConnectionLabel);
+} }
+function AboutDialogComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵdomElementStart(0, "img", 51);
+    i0.ɵɵdomListener("error", function AboutDialogComponent_Conditional_18_Template_img_error_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnAvatarLoadError()); });
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵdomProperty("src", ctx_r1.AvatarUrl, i0.ɵɵsanitizeUrl);
+} }
+function AboutDialogComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 17);
+    i0.ɵɵdomElement(1, "i");
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵclassMap(ctx_r1.AvatarIconClass);
+} }
+function AboutDialogComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 18);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.UserInitials);
+} }
+function AboutDialogComponent_Conditional_129_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 49);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r1.ToastMessage);
+} }
+/**
+ * About dialog for MemberJunction. Shows brand identity, version, lightweight
+ * usage stats, the current user, and a collapsible diagnostics panel.
+ *
+ * Self-contained standalone component. Opened via {@link AboutDialogService}.
+ *
+ * Easter eggs:
+ *  - Click the version pill 7× → toast + logo spin
+ *  - Click the logo → quick wiggle
+ *  - Konami code (↑↑↓↓←→←→ B A) → barrel roll
+ */
+export class AboutDialogComponent extends BaseAngularComponent {
+    CloseRequested = new EventEmitter();
+    /** Optional avatar image URL — passed in from the shell where it's already resolved. */
+    AvatarUrl = null;
+    /** Optional Font Awesome icon class fallback when no image is available. */
+    AvatarIconClass = null;
+    /** Static framework version, generated at build time. */
+    Version = PACKAGE_VERSION;
+    EntityCount = 0;
+    ApplicationCount = 0;
+    QueryCount = 0;
+    UserName = 'Unknown User';
+    UserEmail = '';
+    UserInitials = '?';
+    UserRolesText = 'None';
+    ApiUrl = '';
+    ApiUrlShort = '';
+    AuthProvider = 'Unknown';
+    Environment = 'production';
+    ThemeLabel = '';
+    BrowserLabel = '';
+    IsConnected = true;
+    DiagnosticsOpen = false;
+    /** Friendly "Connected to X" label — display name from InstanceConfig or just the API hostname. */
+    ConnectionLabel = '';
+    ToastMessage = '';
+    CopyConfirmed = false;
+    authBase = inject(MJAuthBase);
+    themeService = inject(ThemeService);
+    connectivity = inject(ServerConnectivityService);
+    cdr = inject(ChangeDetectorRef);
+    connSub;
+    themeSub;
+    versionClickCount = 0;
+    versionClickResetTimer = null;
+    toastTimer = null;
+    konamiIndex = 0;
+    konamiSequence = ['ArrowUp', 'ArrowUp', 'ArrowDown', 'ArrowDown', 'ArrowLeft', 'ArrowRight', 'ArrowLeft', 'ArrowRight', 'b', 'a'];
+    konamiHandler = (event) => {
+        const key = event.key.length === 1 ? event.key.toLowerCase() : event.key;
+        if (key === this.konamiSequence[this.konamiIndex]) {
+            this.konamiIndex++;
+            if (this.konamiIndex === this.konamiSequence.length) {
+                this.konamiIndex = 0;
+                this.showToast('🚀 You found it. Now you must tell no one.', 3500);
+                this.barrelRoll();
+            }
+        }
+        else {
+            this.konamiIndex = 0;
+        }
+    };
+    get UserMeta() {
+        if (this.UserEmail && this.UserRolesText && this.UserRolesText !== 'None') {
+            return `${this.UserEmail} · ${this.UserRolesText}`;
+        }
+        return this.UserEmail || this.UserRolesText;
+    }
+    ngOnInit() {
+        this.populate();
+        this.connSub = this.connectivity.IsConnected$.subscribe(connected => {
+            this.IsConnected = connected;
+            this.cdr.markForCheck();
+        });
+        this.themeSub = this.themeService.AppliedTheme$.subscribe(() => {
+            this.ThemeLabel = this.computeThemeLabel();
+            this.cdr.markForCheck();
+        });
+        document.addEventListener('keydown', this.konamiHandler);
+    }
+    ngOnDestroy() {
+        this.connSub?.unsubscribe();
+        this.themeSub?.unsubscribe();
+        document.removeEventListener('keydown', this.konamiHandler);
+        if (this.versionClickResetTimer)
+            clearTimeout(this.versionClickResetTimer);
+        if (this.toastTimer)
+            clearTimeout(this.toastTimer);
+    }
+    populate() {
+        const provider = this.ProviderToUse;
+        this.EntityCount = provider?.Entities?.length ?? 0;
+        this.ApplicationCount = provider?.Applications?.length ?? 0;
+        this.QueryCount = provider?.Queries?.length ?? 0;
+        const user = provider?.CurrentUser;
+        if (user) {
+            this.UserName = user.Name || `${user.FirstName ?? ''} ${user.LastName ?? ''}`.trim() || 'User';
+            this.UserEmail = user.Email || '';
+            this.UserInitials = this.computeInitials(this.UserName);
+            const roles = (user.UserRoles ?? [])
+                .map((r) => r.Role)
+                .filter((n) => !!n);
+            this.UserRolesText = roles.length > 0 ? roles.join(', ') : 'None';
+        }
+        if (provider instanceof GraphQLDataProvider) {
+            this.ApiUrl = provider.ConfigData?.URL ?? '';
+            this.ApiUrlShort = this.shortenUrl(this.ApiUrl);
+        }
+        this.AuthProvider = this.computeAuthLabel(this.authBase?.type);
+        this.Environment = this.detectEnvironment();
+        this.ThemeLabel = this.computeThemeLabel();
+        this.BrowserLabel = this.computeBrowserLabel();
+        this.IsConnected = this.connectivity.IsConnected;
+        this.ConnectionLabel = this.computeConnectionLabel();
+    }
+    /**
+     * Build the "Connected to X" label. Prefers `Instance.DisplayName` from
+     * InstanceConfigEngine if set, otherwise falls back to the API hostname.
+     */
+    computeConnectionLabel() {
+        let displayName;
+        try {
+            displayName = InstanceConfigEngine.Instance.Get('Instance.DisplayName');
+        }
+        catch {
+            displayName = undefined;
+        }
+        const host = this.ApiUrlShort?.split('/')[0] ?? '';
+        if (displayName && host)
+            return `${displayName} · ${host}`;
+        return displayName || host;
+    }
+    ToggleDiagnostics() {
+        this.DiagnosticsOpen = !this.DiagnosticsOpen;
+    }
+    OnCloseClick() {
+        this.CloseRequested.emit();
+    }
+    OnLogoClick() {
+        this.wiggleLogo();
+    }
+    OnAvatarLoadError() {
+        // Image failed to load — fall back to initials
+        this.AvatarUrl = null;
+        this.cdr.markForCheck();
+    }
+    OnVersionClick() {
+        this.versionClickCount++;
+        if (this.versionClickResetTimer)
+            clearTimeout(this.versionClickResetTimer);
+        this.versionClickResetTimer = setTimeout(() => (this.versionClickCount = 0), 2000);
+        if (this.versionClickCount === 3)
+            this.showToast('Keep going...');
+        else if (this.versionClickCount === 5)
+            this.showToast("You're committed now.");
+        else if (this.versionClickCount === 7) {
+            this.versionClickCount = 0;
+            this.showToast('🎉 Developer mode? In THIS economy?');
+            this.spinLogo();
+        }
+    }
+    async CopyDiagnostics() {
+        const block = [
+            `MemberJunction v${this.Version}`,
+            `Environment: ${this.Environment}`,
+            `API: ${this.ApiUrl || '(unknown)'}`,
+            `Auth: ${this.AuthProvider}`,
+            `User: ${this.UserEmail || this.UserName} (${this.UserRolesText})`,
+            `Theme: ${this.ThemeLabel}`,
+            `Browser: ${this.BrowserLabel}`,
+            `Entities loaded: ${this.EntityCount}`,
+            `Applications: ${this.ApplicationCount}`,
+            `Queries: ${this.QueryCount}`
+        ].join('\n');
+        try {
+            await navigator.clipboard.writeText(block);
+            this.CopyConfirmed = true;
+            this.showToast('Diagnostics copied to clipboard');
+            setTimeout(() => {
+                this.CopyConfirmed = false;
+                this.cdr.markForCheck();
+            }, 1800);
+        }
+        catch {
+            this.showToast('Copy failed — clipboard unavailable');
+        }
+    }
+    // ---------- helpers ----------
+    computeInitials(name) {
+        const parts = name.trim().split(/\s+/).filter(Boolean);
+        if (parts.length === 0)
+            return '?';
+        if (parts.length === 1)
+            return parts[0].slice(0, 2).toUpperCase();
+        return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
+    }
+    shortenUrl(url) {
+        if (!url)
+            return '(not configured)';
+        try {
+            const u = new URL(url);
+            return u.host + (u.pathname && u.pathname !== '/' ? u.pathname : '');
+        }
+        catch {
+            return url;
+        }
+    }
+    computeAuthLabel(type) {
+        switch ((type ?? '').toLowerCase()) {
+            case 'msal': return 'Microsoft Entra (MSAL)';
+            case 'auth0': return 'Auth0';
+            case 'okta': return 'Okta';
+            case 'cognito': return 'Amazon Cognito';
+            case '': return 'Unknown';
+            default: return type ?? 'Unknown';
+        }
+    }
+    detectEnvironment() {
+        const host = typeof window !== 'undefined' ? window.location.hostname : '';
+        if (host === 'localhost' || host === '127.0.0.1' || host.endsWith('.local'))
+            return 'development';
+        if (host.startsWith('dev.') || host.includes('-dev.') || host.includes('.dev.'))
+            return 'development';
+        if (host.startsWith('staging.') || host.includes('-staging.') || host.includes('.staging.'))
+            return 'staging';
+        return 'production';
+    }
+    computeThemeLabel() {
+        const applied = this.themeService.AppliedTheme;
+        const preference = this.themeService.Preference;
+        const def = this.themeService.GetThemeDefinition(applied);
+        const themeName = def?.Name ?? applied;
+        return preference === 'system' ? `${themeName} · System` : themeName;
+    }
+    computeBrowserLabel() {
+        const ua = typeof navigator !== 'undefined' ? navigator.userAgent : '';
+        let browser = 'Unknown';
+        if (/Edg\//.test(ua))
+            browser = 'Edge';
+        else if (/OPR\//.test(ua))
+            browser = 'Opera';
+        else if (/Chrome\//.test(ua) && !/Chromium/.test(ua))
+            browser = 'Chrome';
+        else if (/Firefox\//.test(ua))
+            browser = 'Firefox';
+        else if (/Safari\//.test(ua))
+            browser = 'Safari';
+        let os = 'Unknown';
+        if (/iPhone|iPad|iPod/.test(ua))
+            os = 'iOS';
+        else if (/Android/.test(ua))
+            os = 'Android';
+        else if (/Mac OS X|Macintosh/.test(ua))
+            os = 'macOS';
+        else if (/Windows/.test(ua))
+            os = 'Windows';
+        else if (/Linux/.test(ua))
+            os = 'Linux';
+        return `${browser} / ${os}`;
+    }
+    showToast(message, durationMs = 2400) {
+        this.ToastMessage = message;
+        if (this.toastTimer)
+            clearTimeout(this.toastTimer);
+        this.toastTimer = setTimeout(() => {
+            this.ToastMessage = '';
+            this.cdr.markForCheck();
+        }, durationMs);
+    }
+    wiggleLogo() {
+        const svg = document.querySelector('.mj-about__logo');
+        svg?.animate([
+            { transform: 'rotate(0)' },
+            { transform: 'rotate(-6deg)' },
+            { transform: 'rotate(6deg)' },
+            { transform: 'rotate(0)' }
+        ], { duration: 400, easing: 'ease-in-out' });
+    }
+    spinLogo() {
+        const svg = document.querySelector('.mj-about__logo');
+        svg?.animate([
+            { transform: 'rotate(0) scale(1)', offset: 0 },
+            { transform: 'rotate(720deg) scale(1.1)', offset: 0.85 },
+            { transform: 'rotate(720deg) scale(1)', offset: 1 }
+        ], { duration: 2800, easing: 'cubic-bezier(0.22, 1, 0.36, 1)' });
+    }
+    barrelRoll() {
+        const dialog = document.querySelector('.mj-about');
+        dialog?.animate([{ transform: 'rotate(0)' }, { transform: 'rotate(360deg)' }], { duration: 900, easing: 'cubic-bezier(0.65, 0, 0.35, 1)' });
+    }
+    static ɵfac = /*@__PURE__*/ (() => { let ɵAboutDialogComponent_BaseFactory; return function AboutDialogComponent_Factory(__ngFactoryType__) { return (ɵAboutDialogComponent_BaseFactory || (ɵAboutDialogComponent_BaseFactory = i0.ɵɵgetInheritedFactory(AboutDialogComponent)))(__ngFactoryType__ || AboutDialogComponent); }; })();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: AboutDialogComponent, selectors: [["mj-about-dialog"]], inputs: { AvatarUrl: "AvatarUrl", AvatarIconClass: "AvatarIconClass" }, outputs: { CloseRequested: "CloseRequested" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 130, vars: 36, consts: [["aboutLogo", ""], ["role", "document", 1, "mj-about"], ["type", "button", "aria-label", "Close", 1, "mj-about__close", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "mj-about__hero"], [1, "mj-about__logo-wrap", 3, "click"], ["xmlns", "http://www.w3.org/2000/svg", "viewBox", "0 0 448.28 57.11", "aria-label", "MemberJunction", 1, "mj-about__logo"], ["fill", "#fff", "d", "M428.73,44.89v-16.92c.7-1.34,1.66-2.37,2.88-3.09,1.22-.72,2.59-1.08,4.12-1.08,2.2,0,3.92.65,5.17,1.94,1.25,1.3,1.87,3.07,1.87,5.33v13.81h2.01v-14.36c0-1.71-.36-3.21-1.08-4.51-.72-1.3-1.72-2.3-3.02-3.02-1.3-.72-2.8-1.08-4.51-1.08-3.14,0-5.63,1.21-7.46,3.61v-3.16h-2.01v22.51h2.01ZM407.08,42.12c-1.39-.87-2.49-2.04-3.29-3.52-.81-1.48-1.21-3.13-1.21-4.96s.4-3.48,1.21-4.96c.81-1.48,1.91-2.65,3.29-3.52,1.39-.87,2.94-1.31,4.64-1.31s3.25.44,4.64,1.31c1.39.87,2.49,2.04,3.29,3.52.81,1.48,1.21,3.13,1.21,4.96s-.41,3.48-1.21,4.96c-.81,1.48-1.91,2.65-3.29,3.52-1.39.87-2.94,1.3-4.64,1.3s-3.26-.43-4.64-1.3M417.42,43.79c1.69-1.04,3.04-2.45,4.03-4.23.99-1.78,1.49-3.76,1.49-5.92s-.5-4.18-1.49-5.95c-.99-1.77-2.33-3.17-4.03-4.21-1.69-1.04-3.59-1.56-5.69-1.56s-3.97.52-5.67,1.56c-1.71,1.04-3.06,2.44-4.05,4.21-.99,1.77-1.49,3.75-1.49,5.95s.5,4.14,1.49,5.92c.99,1.79,2.34,3.19,4.05,4.23,1.71,1.04,3.6,1.56,5.67,1.56s4-.52,5.69-1.56M397.14,16.8c.32-.34.48-.75.48-1.24s-.16-.9-.48-1.24c-.32-.34-.74-.5-1.26-.5-.49,0-.9.17-1.24.5-.34.34-.5.75-.5,1.24s.17.9.5,1.24c.34.34.75.5,1.24.5.52,0,.94-.17,1.26-.5M396.89,22.38h-2.01v22.51h2.01v-22.51ZM390.57,45.21c.61-.09,1.2-.25,1.78-.46v-1.97c-.52.21-1.02.37-1.51.48-.49.11-1.08.16-1.79.16-1.31,0-2.25-.28-2.81-.84s-.85-1.49-.85-2.77v-15.6h6.95v-1.83h-6.95v-6.31l-2.01.64v5.67h-4.94v1.83h4.94v16.29c0,1.52.46,2.71,1.37,3.57.91.85,2.23,1.28,3.94,1.28.64,0,1.26-.05,1.87-.14M373.12,44.43c1.54-.61,2.89-1.45,4.05-2.51l-1.37-1.65c-.98.95-2.1,1.71-3.36,2.29s-2.57.87-3.91.87c-1.71,0-3.25-.43-4.64-1.3-1.39-.87-2.49-2.04-3.29-3.52-.81-1.48-1.21-3.13-1.21-4.96s.4-3.48,1.21-4.96c.81-1.48,1.9-2.65,3.29-3.52,1.39-.87,2.93-1.31,4.64-1.31,1.34,0,2.64.28,3.91.85,1.27.56,2.39,1.33,3.36,2.31l1.37-1.65c-1.16-1.07-2.51-1.91-4.05-2.52-1.54-.61-3.07-.91-4.6-.91-2.07,0-3.96.52-5.67,1.56s-3.06,2.44-4.05,4.21c-.99,1.77-1.49,3.75-1.49,5.95s.49,4.18,1.49,5.95c.99,1.77,2.34,3.17,4.05,4.21s3.6,1.56,5.67,1.56c1.52,0,3.06-.31,4.6-.92M337.65,44.89v-16.92c.7-1.34,1.66-2.37,2.88-3.09,1.22-.72,2.59-1.08,4.12-1.08,2.2,0,3.92.65,5.17,1.94,1.25,1.3,1.88,3.07,1.88,5.33v13.81h2.01v-14.36c0-1.71-.36-3.21-1.07-4.51-.72-1.3-1.73-2.3-3.02-3.02s-2.8-1.08-4.5-1.08c-3.14,0-5.63,1.21-7.46,3.61v-3.16h-2.01v22.51h2.01ZM328.7,41.78v3.11h2.01v-22.51h-2.01v16.92c-.7,1.31-1.66,2.33-2.88,3.06-1.22.73-2.59,1.1-4.12,1.1-2.2,0-3.92-.65-5.17-1.97-1.25-1.31-1.87-3.08-1.87-5.31v-13.81h-2.01v14.36c0,1.71.37,3.21,1.1,4.51.73,1.3,1.74,2.3,3.04,3.02,1.3.72,2.78,1.08,4.46,1.08,3.2,0,5.69-1.19,7.46-3.57M303.64,43.88c1.74-1.01,3.08-2.43,4.02-4.28.95-1.84,1.42-4.05,1.42-6.61V12.87h-2.1v20.13c0,3.2-.85,5.74-2.56,7.62-1.71,1.88-4.01,2.81-6.91,2.81-2.17,0-4.02-.56-5.58-1.69-1.56-1.13-2.77-2.75-3.66-4.85l-1.92.87c1.01,2.5,2.46,4.4,4.37,5.7,1.9,1.3,4.15,1.94,6.75,1.94,2.38,0,4.44-.5,6.18-1.51M279.77,44.89v-15.37c.61-.97,1.41-1.73,2.4-2.26.99-.53,2.07-.8,3.22-.8.64,0,1.27.06,1.88.18.61.12,1.16.3,1.65.55v-6.45c-.55-.37-1.48-.56-2.79-.59-1.31,0-2.5.25-3.57.75-1.07.5-2,1.24-2.79,2.22v-2.42h-7.41v24.2h7.41ZM253.44,28.07c.47-.56,1.04-1,1.72-1.3.67-.3,1.42-.46,2.24-.46s1.52.16,2.2.48c.67.32,1.26.76,1.76,1.33.5.56.88,1.24,1.12,2.04h-10.11c.24-.82.6-1.52,1.07-2.08M263.5,44.47c1.6-.58,3.17-1.51,4.69-2.79l-4.9-4.35c-.58.58-1.28,1.03-2.1,1.35-.82.32-1.74.48-2.75.48-.91,0-1.77-.16-2.56-.48-.79-.32-1.47-.77-2.03-1.35-.56-.58-1.02-1.25-1.35-2.01h17.25v-1.83c0-2.56-.53-4.83-1.58-6.82-1.05-1.98-2.49-3.54-4.32-4.69-1.83-1.14-3.94-1.72-6.31-1.72s-4.48.55-6.4,1.67c-1.92,1.11-3.44,2.62-4.55,4.5-1.11,1.89-1.67,4.01-1.67,6.36s.58,4.47,1.74,6.36c1.16,1.89,2.74,3.39,4.73,4.51,2,1.11,4.23,1.67,6.7,1.67,2.01,0,3.82-.29,5.42-.87M227.12,38.44c-.88-.34-1.65-.79-2.29-1.37v-8.46c.67-.64,1.43-1.12,2.29-1.44s1.8-.48,2.84-.48c1.19,0,2.26.27,3.23.8.96.53,1.72,1.26,2.29,2.2.56.93.84,1.97.84,3.13s-.28,2.2-.84,3.13c-.56.93-1.32,1.66-2.27,2.2-.95.54-2.03.8-3.25.8-1.01,0-1.95-.17-2.84-.5M224.74,44.89v-1.37c.92.55,1.91.97,2.97,1.26,1.07.29,2.16.43,3.29.43,2.35,0,4.48-.55,6.38-1.65,1.91-1.1,3.41-2.58,4.53-4.46,1.11-1.88,1.67-3.97,1.67-6.29s-.55-4.42-1.65-6.29c-1.1-1.88-2.58-3.37-4.44-4.49-1.86-1.11-3.95-1.67-6.27-1.67s-4.51.67-6.41,2.01v-10.66l-7.41,1.14v32.02h7.32ZM183.69,44.89v-16.56c.46-.58,1.01-1.01,1.67-1.3.66-.29,1.4-.43,2.22-.43,1.19,0,2.14.4,2.86,1.19.72.79,1.07,1.86,1.07,3.2v13.91h7.41v-14.91c0-.28,0-.54-.02-.8-.01-.26-.04-.51-.07-.76.49-.61,1.07-1.07,1.74-1.37.67-.31,1.42-.46,2.24-.46,1.19,0,2.14.4,2.86,1.19s1.08,1.86,1.08,3.2v13.91h7.41v-14.91c0-1.92-.41-3.61-1.21-5.08-.81-1.46-1.91-2.61-3.31-3.43-1.4-.82-3.02-1.23-4.85-1.23-1.59,0-3.05.29-4.39.87-1.34.58-2.5,1.4-3.48,2.47-.83-1.07-1.85-1.89-3.07-2.47-1.22-.58-2.59-.87-4.12-.87-2.32,0-4.33.67-6.04,2.01v-1.56h-7.41v24.2h7.41ZM157.36,28.07c.47-.56,1.04-1,1.72-1.3.67-.3,1.42-.46,2.24-.46s1.52.16,2.2.48c.67.32,1.26.76,1.76,1.33.5.56.88,1.24,1.12,2.04h-10.11c.24-.82.6-1.52,1.08-2.08M167.42,44.47c1.6-.58,3.16-1.51,4.69-2.79l-4.9-4.35c-.58.58-1.28,1.03-2.1,1.35-.83.32-1.74.48-2.75.48-.91,0-1.77-.16-2.56-.48-.79-.32-1.47-.77-2.03-1.35-.56-.58-1.02-1.25-1.35-2.01h17.25v-1.83c0-2.56-.53-4.83-1.58-6.82-1.05-1.98-2.49-3.54-4.32-4.69-1.83-1.14-3.93-1.72-6.31-1.72s-4.48.55-6.41,1.67c-1.92,1.11-3.44,2.62-4.55,4.5-1.11,1.89-1.67,4.01-1.67,6.36s.58,4.47,1.74,6.36c1.16,1.89,2.74,3.39,4.74,4.51,2,1.11,4.23,1.67,6.7,1.67,2.01,0,3.82-.29,5.42-.87M118.71,44.89v-21.91l10.52,19.62,10.52-19.53v21.82h7.41V12.87h-9.93l-7.91,15.1-7.91-15.1h-9.93v32.02h7.23Z"], ["fill", "#fff", "d", "M88.82,12.69v27.95s9.76,5.58,9.76,5.58c.01-.24.02-34.61.02-34.61,0-3.72-1.57-6.76-4.3-8.35-2.73-1.59-6.15-1.44-9.38.39l-33.88,19.27L17.17,3.66c-3.23-1.84-6.65-1.98-9.38-.39-2.73,1.59-4.3,4.63-4.3,8.35,0,0,0,34.39.02,34.64l9.75-5.58V12.69l27.89,15.87L4.21,49.57c.71,1.84,1.93,3.32,3.57,4.28,1.26.73,2.67,1.1,4.13,1.1,1.71,0,3.51-.5,5.25-1.49L88.82,12.69Z"], ["fill", "#fff", "d", "M64.22,30.43l-9.86,5.64,30.56,17.39c1.74.99,3.54,1.49,5.26,1.49,1.46,0,2.87-.37,4.13-1.1,1.65-.96,2.87-2.46,3.59-4.31l-33.67-19.11Z"], [1, "mj-about__version-row"], ["role", "button", "tabindex", "0", 1, "mj-about__version-pill", 3, "click"], [1, "mj-about__version-dot"], [1, "mj-about__body"], [1, "mj-about__connection-line"], [1, "mj-about__user-card"], ["alt", "", 1, "mj-about__user-avatar", "mj-about__user-avatar--img", 3, "src"], [1, "mj-about__user-avatar", "mj-about__user-avatar--icon"], [1, "mj-about__user-avatar"], [1, "mj-about__user-info"], [1, "mj-about__user-name"], [1, "mj-about__user-meta"], [1, "mj-about__conn-pill"], [1, "fa-solid", "fa-circle"], ["type", "button", 1, "mj-about__diag-toggle", 3, "click"], [1, "mj-about__diag-toggle-left"], [1, "fa-solid", "fa-stethoscope"], [1, "fa-solid", "fa-chevron-down", "mj-about__diag-chev"], [1, "mj-about__diag-panel"], [1, "mj-about__diag-section"], [1, "fa-solid", "fa-cube"], [1, "mj-about__diag-row"], [1, "k"], [1, "v"], [1, "fa-solid", "fa-plug"], [1, "v", 3, "title"], [1, "fa-solid", "fa-database"], [1, "fa-solid", "fa-user"], ["type", "button", 1, "mj-about__copy-btn", 3, "click"], [1, "fa-solid"], [1, "mj-about__footer"], ["href", "https://docs.memberjunction.org", "target", "_blank", "rel", "noopener", 1, "mj-about__footer-link"], [1, "fa-solid", "fa-book"], ["href", "https://github.com/MemberJunction/MJ", "target", "_blank", "rel", "noopener", 1, "mj-about__footer-link"], [1, "fa-brands", "fa-github"], ["href", "https://memberjunction.com", "target", "_blank", "rel", "noopener", 1, "mj-about__footer-link"], [1, "fa-solid", "fa-globe"], [1, "mj-about__credit"], [1, "mj-about__heart"], [1, "mj-about__toast"], [1, "mj-about__connection-name"], ["alt", "", 1, "mj-about__user-avatar", "mj-about__user-avatar--img", 3, "error", "src"]], template: function AboutDialogComponent_Template(rf, ctx) { if (rf & 1) {
+            const _r1 = i0.ɵɵgetCurrentView();
+            i0.ɵɵdomElementStart(0, "div", 1)(1, "button", 2);
+            i0.ɵɵdomListener("click", function AboutDialogComponent_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.OnCloseClick()); });
+            i0.ɵɵdomElement(2, "i", 3);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(3, "div", 4)(4, "div", 5);
+            i0.ɵɵdomListener("click", function AboutDialogComponent_Template_div_click_4_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.OnLogoClick()); });
+            i0.ɵɵnamespaceSVG();
+            i0.ɵɵdomElementStart(5, "svg", 6, 0);
+            i0.ɵɵdomElement(7, "path", 7)(8, "path", 8)(9, "path", 9);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵnamespaceHTML();
+            i0.ɵɵdomElementStart(10, "div", 10)(11, "span", 11);
+            i0.ɵɵdomListener("click", function AboutDialogComponent_Template_span_click_11_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.OnVersionClick()); });
+            i0.ɵɵdomElement(12, "span", 12);
+            i0.ɵɵdomElementStart(13, "span");
+            i0.ɵɵtext(14);
+            i0.ɵɵdomElementEnd()()()();
+            i0.ɵɵdomElementStart(15, "div", 13);
+            i0.ɵɵconditionalCreate(16, AboutDialogComponent_Conditional_16_Template, 4, 1, "div", 14);
+            i0.ɵɵdomElementStart(17, "div", 15);
+            i0.ɵɵconditionalCreate(18, AboutDialogComponent_Conditional_18_Template, 1, 1, "img", 16)(19, AboutDialogComponent_Conditional_19_Template, 2, 2, "div", 17)(20, AboutDialogComponent_Conditional_20_Template, 2, 1, "div", 18);
+            i0.ɵɵdomElementStart(21, "div", 19)(22, "div", 20);
+            i0.ɵɵtext(23);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(24, "div", 21);
+            i0.ɵɵtext(25);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(26, "div", 22);
+            i0.ɵɵdomElement(27, "i", 23);
+            i0.ɵɵtext(28);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(29, "button", 24);
+            i0.ɵɵdomListener("click", function AboutDialogComponent_Template_button_click_29_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.ToggleDiagnostics()); });
+            i0.ɵɵdomElementStart(30, "span", 25);
+            i0.ɵɵdomElement(31, "i", 26);
+            i0.ɵɵtext(32);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElement(33, "i", 27);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(34, "div", 28)(35, "div", 29)(36, "h5");
+            i0.ɵɵdomElement(37, "i", 30);
+            i0.ɵɵtext(38, " Build");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(39, "div", 31)(40, "span", 32);
+            i0.ɵɵtext(41, "Version");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(42, "span", 33);
+            i0.ɵɵtext(43);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(44, "div", 31)(45, "span", 32);
+            i0.ɵɵtext(46, "Environment");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(47, "span", 33);
+            i0.ɵɵtext(48);
+            i0.ɵɵdomElementEnd()()();
+            i0.ɵɵdomElementStart(49, "div", 29)(50, "h5");
+            i0.ɵɵdomElement(51, "i", 34);
+            i0.ɵɵtext(52, " Connection");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(53, "div", 31)(54, "span", 32);
+            i0.ɵɵtext(55, "API endpoint");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(56, "span", 35);
+            i0.ɵɵtext(57);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(58, "div", 31)(59, "span", 32);
+            i0.ɵɵtext(60, "Auth provider");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(61, "span", 33);
+            i0.ɵɵtext(62);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(63, "div", 31)(64, "span", 32);
+            i0.ɵɵtext(65, "Status");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(66, "span", 33);
+            i0.ɵɵtext(67);
+            i0.ɵɵdomElementEnd()()();
+            i0.ɵɵdomElementStart(68, "div", 29)(69, "h5");
+            i0.ɵɵdomElement(70, "i", 36);
+            i0.ɵɵtext(71, " Loaded");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(72, "div", 31)(73, "span", 32);
+            i0.ɵɵtext(74, "Entities");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(75, "span", 33);
+            i0.ɵɵtext(76);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(77, "div", 31)(78, "span", 32);
+            i0.ɵɵtext(79, "Applications");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(80, "span", 33);
+            i0.ɵɵtext(81);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(82, "div", 31)(83, "span", 32);
+            i0.ɵɵtext(84, "Queries");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(85, "span", 33);
+            i0.ɵɵtext(86);
+            i0.ɵɵdomElementEnd()()();
+            i0.ɵɵdomElementStart(87, "div", 29)(88, "h5");
+            i0.ɵɵdomElement(89, "i", 37);
+            i0.ɵɵtext(90, " Session");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(91, "div", 31)(92, "span", 32);
+            i0.ɵɵtext(93, "User");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(94, "span", 33);
+            i0.ɵɵtext(95);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(96, "div", 31)(97, "span", 32);
+            i0.ɵɵtext(98, "Roles");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(99, "span", 33);
+            i0.ɵɵtext(100);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(101, "div", 31)(102, "span", 32);
+            i0.ɵɵtext(103, "Theme");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(104, "span", 33);
+            i0.ɵɵtext(105);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(106, "div", 31)(107, "span", 32);
+            i0.ɵɵtext(108, "Browser");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(109, "span", 33);
+            i0.ɵɵtext(110);
+            i0.ɵɵdomElementEnd()()();
+            i0.ɵɵdomElementStart(111, "button", 38);
+            i0.ɵɵdomListener("click", function AboutDialogComponent_Template_button_click_111_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.CopyDiagnostics()); });
+            i0.ɵɵdomElement(112, "i", 39);
+            i0.ɵɵtext(113);
+            i0.ɵɵdomElementEnd()()();
+            i0.ɵɵdomElementStart(114, "div", 40)(115, "a", 41);
+            i0.ɵɵdomElement(116, "i", 42);
+            i0.ɵɵtext(117, " Documentation ");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(118, "a", 43);
+            i0.ɵɵdomElement(119, "i", 44);
+            i0.ɵɵtext(120, " GitHub ");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(121, "a", 45);
+            i0.ɵɵdomElement(122, "i", 46);
+            i0.ɵɵtext(123, " Website ");
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵdomElementStart(124, "div", 47);
+            i0.ɵɵtext(125, " Built with ");
+            i0.ɵɵdomElementStart(126, "span", 48);
+            i0.ɵɵtext(127, "\u2665");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵtext(128, " by the MemberJunction community ");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵconditionalCreate(129, AboutDialogComponent_Conditional_129_Template, 2, 1, "div", 49);
+            i0.ɵɵdomElementEnd();
+        } if (rf & 2) {
+            i0.ɵɵadvance(14);
+            i0.ɵɵtextInterpolate1("Version ", ctx.Version);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.ConnectionLabel ? 16 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.AvatarUrl ? 18 : ctx.AvatarIconClass ? 19 : 20);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.UserName);
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.UserMeta);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("mj-about__conn-pill--offline", !ctx.IsConnected);
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate1(" ", ctx.IsConnected ? "Connected" : "Offline", " ");
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("mj-about__diag-toggle--open", ctx.DiagnosticsOpen);
+            i0.ɵɵadvance(3);
+            i0.ɵɵtextInterpolate1(" ", ctx.DiagnosticsOpen ? "Hide diagnostics" : "Show diagnostics", " ");
+            i0.ɵɵadvance(2);
+            i0.ɵɵclassProp("mj-about__diag-panel--open", ctx.DiagnosticsOpen);
+            i0.ɵɵadvance(9);
+            i0.ɵɵtextInterpolate(ctx.Version);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.Environment);
+            i0.ɵɵadvance(8);
+            i0.ɵɵdomProperty("title", ctx.ApiUrl);
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate(ctx.ApiUrlShort);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.AuthProvider);
+            i0.ɵɵadvance(4);
+            i0.ɵɵclassProp("mj-about__success", ctx.IsConnected)("mj-about__error", !ctx.IsConnected);
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate(ctx.IsConnected ? "Connected" : "Offline");
+            i0.ɵɵadvance(9);
+            i0.ɵɵtextInterpolate(ctx.EntityCount);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.ApplicationCount);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.QueryCount);
+            i0.ɵɵadvance(9);
+            i0.ɵɵtextInterpolate(ctx.UserEmail);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.UserRolesText);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.ThemeLabel);
+            i0.ɵɵadvance(5);
+            i0.ɵɵtextInterpolate(ctx.BrowserLabel);
+            i0.ɵɵadvance(2);
+            i0.ɵɵclassProp("fa-clipboard", !ctx.CopyConfirmed)("fa-check", ctx.CopyConfirmed);
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate1(" ", ctx.CopyConfirmed ? "Copied!" : "Copy diagnostics", " ");
+            i0.ɵɵadvance(16);
+            i0.ɵɵconditional(ctx.ToastMessage ? 129 : -1);
+        } }, dependencies: [CommonModule], styles: ["[_nghost-%COMP%] {\n    display: block;\n    width: 100%;\n    height: 100%;\n}\n.mj-about[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    height: 100%;\n    min-height: 0;\n    position: relative;\n    font-family: inherit;\n}\n.mj-about__close[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 12px;\n    right: 12px;\n    width: 36px;\n    height: 36px;\n    border: none;\n    border-radius: 8px;\n    background: rgba(255, 255, 255, 0.18);\n    backdrop-filter: blur(8px);\n    color: #fff;\n    cursor: pointer;\n    font-size: 16px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.15s;\n    z-index: 2;\n}\n.mj-about__close[_ngcontent-%COMP%]:hover { background: rgba(255, 255, 255, 0.3); }\n\n.mj-about__hero[_ngcontent-%COMP%] {\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    padding: 36px 24px 28px;\n    position: relative;\n    overflow: hidden;\n    flex-shrink: 0;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 14px;\n}\n.mj-about__hero[_ngcontent-%COMP%]::before {\n    content: '';\n    position: absolute;\n    inset: -50%;\n    background: radial-gradient(circle, rgba(255, 255, 255, 0.10) 0%, transparent 60%);\n    animation: _ngcontent-%COMP%_mj-about-rotate 24s linear infinite;\n    pointer-events: none;\n}\n@media (prefers-reduced-motion: reduce) {\n    .mj-about__hero[_ngcontent-%COMP%]::before { animation: none; }\n}\n@keyframes _ngcontent-%COMP%_mj-about-rotate { to { transform: rotate(360deg); } }\n\n.mj-about__logo-wrap[_ngcontent-%COMP%] {\n    position: relative;\n    z-index: 1;\n    cursor: pointer;\n    display: block;\n    text-align: center;\n}\n.mj-about__logo[_ngcontent-%COMP%] {\n    width: 280px;\n    max-width: 80%;\n    height: auto;\n    display: inline-block;\n    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.15));\n    transition: transform 0.3s ease-out;\n}\n.mj-about__logo-wrap[_ngcontent-%COMP%]:hover   .mj-about__logo[_ngcontent-%COMP%] { transform: scale(1.03); }\n\n.mj-about__version-row[_ngcontent-%COMP%] {\n    position: relative;\n    z-index: 1;\n    text-align: center;\n}\n.mj-about__version-pill[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 7px;\n    background: rgba(255, 255, 255, 0.18);\n    backdrop-filter: blur(8px);\n    border: 1px solid rgba(255, 255, 255, 0.28);\n    border-radius: 100px;\n    padding: 5px 14px;\n    font-size: 12px;\n    font-weight: 600;\n    cursor: pointer;\n    user-select: none;\n    color: #fff;\n    transition: background 0.15s;\n    letter-spacing: 0.2px;\n}\n.mj-about__version-pill[_ngcontent-%COMP%]:hover { background: rgba(255, 255, 255, 0.28); }\n.mj-about__version-dot[_ngcontent-%COMP%] {\n    width: 7px;\n    height: 7px;\n    border-radius: 50%;\n    background: #4ade80;\n    box-shadow: 0 0 6px #4ade80;\n}\n\n.mj-about__body[_ngcontent-%COMP%] {\n    padding: 22px 24px 16px;\n    overflow-y: auto;\n    flex: 1;\n    min-height: 0;\n}\n\n.mj-about__connection-line[_ngcontent-%COMP%] {\n    text-align: center;\n    font-size: 11.5px;\n    color: var(--mj-text-muted);\n    margin-bottom: 14px;\n    letter-spacing: 0.2px;\n}\n.mj-about__connection-name[_ngcontent-%COMP%] {\n    color: var(--mj-text-secondary);\n    font-weight: 600;\n}\n\n.mj-about__user-card[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 14px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 10px;\n    margin-bottom: 16px;\n}\n.mj-about__user-avatar[_ngcontent-%COMP%] {\n    width: 40px;\n    height: 40px;\n    border-radius: 50%;\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-weight: 700;\n    font-size: 15px;\n    flex-shrink: 0;\n    object-fit: cover;\n    overflow: hidden;\n}\nimg.mj-about__user-avatar[_ngcontent-%COMP%] { background: var(--mj-bg-surface-card); }\n.mj-about__user-avatar--icon[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 18px; }\n.mj-about__user-info[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n.mj-about__user-name[_ngcontent-%COMP%] {\n    font-size: 13.5px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.mj-about__user-meta[_ngcontent-%COMP%] {\n    font-size: 11.5px;\n    color: var(--mj-text-muted);\n    margin-top: 2px;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.mj-about__conn-pill[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 5px;\n    font-size: 11px;\n    color: var(--mj-status-success);\n    font-weight: 600;\n    background: color-mix(in srgb, var(--mj-status-success) 12%, transparent);\n    padding: 3px 8px;\n    border-radius: 100px;\n    flex-shrink: 0;\n}\n.mj-about__conn-pill[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 6px; }\n.mj-about__conn-pill--offline[_ngcontent-%COMP%] {\n    color: var(--mj-status-error);\n    background: color-mix(in srgb, var(--mj-status-error) 12%, transparent);\n}\n\n.mj-about__diag-toggle[_ngcontent-%COMP%] {\n    width: 100%;\n    background: transparent;\n    border: 1px solid var(--mj-border-default);\n    border-radius: 10px;\n    padding: 12px 14px;\n    font-size: 13px;\n    font-weight: 500;\n    color: var(--mj-text-secondary);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    transition: background 0.15s, border-color 0.15s, color 0.15s;\n    font-family: inherit;\n}\n.mj-about__diag-toggle[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-border-strong);\n    color: var(--mj-text-primary);\n}\n.mj-about__diag-toggle-left[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n}\n.mj-about__diag-chev[_ngcontent-%COMP%] {\n    transition: transform 0.25s;\n    color: var(--mj-text-muted);\n}\n.mj-about__diag-toggle--open[_ngcontent-%COMP%]   .mj-about__diag-chev[_ngcontent-%COMP%] { transform: rotate(180deg); }\n\n.mj-about__diag-panel[_ngcontent-%COMP%] {\n    max-height: 0;\n    overflow: hidden;\n    transition: max-height 0.35s ease-out, margin-top 0.25s;\n}\n.mj-about__diag-panel--open[_ngcontent-%COMP%] {\n    max-height: 800px;\n    margin-top: 12px;\n}\n.mj-about__diag-section[_ngcontent-%COMP%]    + .mj-about__diag-section[_ngcontent-%COMP%] { margin-top: 12px; }\n.mj-about__diag-section[_ngcontent-%COMP%] {\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-subtle);\n    border-radius: 10px;\n    padding: 12px 14px;\n}\n.mj-about__diag-section[_ngcontent-%COMP%]   h5[_ngcontent-%COMP%] {\n    margin: 0 0 8px;\n    font-size: 10.5px;\n    font-weight: 700;\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n    color: var(--mj-text-muted);\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n.mj-about__diag-section[_ngcontent-%COMP%]   h5[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n.mj-about__diag-row[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    font-size: 12.5px;\n    padding: 4px 0;\n    min-width: 0;\n}\n.mj-about__diag-row[_ngcontent-%COMP%]   .k[_ngcontent-%COMP%] { color: var(--mj-text-secondary); flex-shrink: 0; }\n.mj-about__diag-row[_ngcontent-%COMP%]   .v[_ngcontent-%COMP%] {\n    color: var(--mj-text-primary);\n    font-family: 'SF Mono', Menlo, Consolas, monospace;\n    font-size: 11.5px;\n    font-weight: 500;\n    text-align: right;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    min-width: 0;\n}\n.mj-about__success[_ngcontent-%COMP%] { color: var(--mj-status-success) !important; }\n.mj-about__error[_ngcontent-%COMP%]   { color: var(--mj-status-error)   !important; }\n\n.mj-about__copy-btn[_ngcontent-%COMP%] {\n    width: 100%;\n    margin-top: 12px;\n    padding: 10px;\n    border: 1px dashed var(--mj-border-strong);\n    background: transparent;\n    border-radius: 8px;\n    font-size: 12.5px;\n    color: var(--mj-text-secondary);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: border-color 0.15s, color 0.15s, background 0.15s;\n    font-family: inherit;\n}\n.mj-about__copy-btn[_ngcontent-%COMP%]:hover {\n    border-color: var(--mj-brand-primary);\n    color: var(--mj-brand-primary);\n    background: color-mix(in srgb, var(--mj-brand-primary) 4%, transparent);\n}\n\n.mj-about__footer[_ngcontent-%COMP%] {\n    border-top: 1px solid var(--mj-border-subtle);\n    padding: 14px 20px;\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n    justify-content: center;\n    flex-shrink: 0;\n}\n.mj-about__footer-link[_ngcontent-%COMP%] {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 7px 12px;\n    border-radius: 7px;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    text-decoration: none;\n    transition: background 0.15s, color 0.15s;\n    cursor: pointer;\n}\n.mj-about__footer-link[_ngcontent-%COMP%]:hover {\n    background: var(--mj-bg-surface-hover);\n    color: var(--mj-brand-primary);\n}\n\n.mj-about__credit[_ngcontent-%COMP%] {\n    text-align: center;\n    font-size: 10.5px;\n    color: var(--mj-text-muted);\n    padding: 0 20px 14px;\n    flex-shrink: 0;\n}\n.mj-about__heart[_ngcontent-%COMP%] {\n    color: var(--mj-status-error);\n    display: inline-block;\n    animation: _ngcontent-%COMP%_mj-about-heart 2s ease-in-out infinite;\n}\n@media (prefers-reduced-motion: reduce) {\n    .mj-about__heart[_ngcontent-%COMP%] { animation: none; }\n}\n@keyframes _ngcontent-%COMP%_mj-about-heart {\n    50% { transform: scale(1.18); }\n}\n\n.mj-about__toast[_ngcontent-%COMP%] {\n    position: absolute;\n    top: 16px;\n    left: 50%;\n    transform: translateX(-50%);\n    background: var(--mj-text-primary);\n    color: var(--mj-bg-surface);\n    padding: 10px 18px;\n    border-radius: 10px;\n    font-size: 13px;\n    font-weight: 500;\n    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);\n    z-index: 5;\n    pointer-events: none;\n    animation: _ngcontent-%COMP%_mj-about-toast-in 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);\n    max-width: calc(100% - 32px);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n@keyframes _ngcontent-%COMP%_mj-about-toast-in {\n    from { transform: translateX(-50%) translateY(-30px); opacity: 0; }\n    to   { transform: translateX(-50%) translateY(0);     opacity: 1; }\n}\n\n@media (max-width: 480px) {\n    .mj-about__hero[_ngcontent-%COMP%] { padding: 30px 18px 22px; gap: 12px; }\n    .mj-about__logo[_ngcontent-%COMP%] { width: 220px; }\n    .mj-about__body[_ngcontent-%COMP%] { padding: 18px 16px 14px; }\n    .mj-about__footer[_ngcontent-%COMP%] { padding: 12px 14px; }\n}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AboutDialogComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-about-dialog', standalone: true, imports: [CommonModule], template: `
+<div class="mj-about" role="document">
+    <button class="mj-about__close" type="button" aria-label="Close" (click)="OnCloseClick()">
+        <i class="fa-solid fa-xmark"></i>
+    </button>
+
+    <div class="mj-about__hero">
+        <div class="mj-about__logo-wrap" (click)="OnLogoClick()">
+            <svg class="mj-about__logo" #aboutLogo
+                 xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448.28 57.11"
+                 aria-label="MemberJunction">
+                <path fill="#fff"
+                    d="M428.73,44.89v-16.92c.7-1.34,1.66-2.37,2.88-3.09,1.22-.72,2.59-1.08,4.12-1.08,2.2,0,3.92.65,5.17,1.94,1.25,1.3,1.87,3.07,1.87,5.33v13.81h2.01v-14.36c0-1.71-.36-3.21-1.08-4.51-.72-1.3-1.72-2.3-3.02-3.02-1.3-.72-2.8-1.08-4.51-1.08-3.14,0-5.63,1.21-7.46,3.61v-3.16h-2.01v22.51h2.01ZM407.08,42.12c-1.39-.87-2.49-2.04-3.29-3.52-.81-1.48-1.21-3.13-1.21-4.96s.4-3.48,1.21-4.96c.81-1.48,1.91-2.65,3.29-3.52,1.39-.87,2.94-1.31,4.64-1.31s3.25.44,4.64,1.31c1.39.87,2.49,2.04,3.29,3.52.81,1.48,1.21,3.13,1.21,4.96s-.41,3.48-1.21,4.96c-.81,1.48-1.91,2.65-3.29,3.52-1.39.87-2.94,1.3-4.64,1.3s-3.26-.43-4.64-1.3M417.42,43.79c1.69-1.04,3.04-2.45,4.03-4.23.99-1.78,1.49-3.76,1.49-5.92s-.5-4.18-1.49-5.95c-.99-1.77-2.33-3.17-4.03-4.21-1.69-1.04-3.59-1.56-5.69-1.56s-3.97.52-5.67,1.56c-1.71,1.04-3.06,2.44-4.05,4.21-.99,1.77-1.49,3.75-1.49,5.95s.5,4.14,1.49,5.92c.99,1.79,2.34,3.19,4.05,4.23,1.71,1.04,3.6,1.56,5.67,1.56s4-.52,5.69-1.56M397.14,16.8c.32-.34.48-.75.48-1.24s-.16-.9-.48-1.24c-.32-.34-.74-.5-1.26-.5-.49,0-.9.17-1.24.5-.34.34-.5.75-.5,1.24s.17.9.5,1.24c.34.34.75.5,1.24.5.52,0,.94-.17,1.26-.5M396.89,22.38h-2.01v22.51h2.01v-22.51ZM390.57,45.21c.61-.09,1.2-.25,1.78-.46v-1.97c-.52.21-1.02.37-1.51.48-.49.11-1.08.16-1.79.16-1.31,0-2.25-.28-2.81-.84s-.85-1.49-.85-2.77v-15.6h6.95v-1.83h-6.95v-6.31l-2.01.64v5.67h-4.94v1.83h4.94v16.29c0,1.52.46,2.71,1.37,3.57.91.85,2.23,1.28,3.94,1.28.64,0,1.26-.05,1.87-.14M373.12,44.43c1.54-.61,2.89-1.45,4.05-2.51l-1.37-1.65c-.98.95-2.1,1.71-3.36,2.29s-2.57.87-3.91.87c-1.71,0-3.25-.43-4.64-1.3-1.39-.87-2.49-2.04-3.29-3.52-.81-1.48-1.21-3.13-1.21-4.96s.4-3.48,1.21-4.96c.81-1.48,1.9-2.65,3.29-3.52,1.39-.87,2.93-1.31,4.64-1.31,1.34,0,2.64.28,3.91.85,1.27.56,2.39,1.33,3.36,2.31l1.37-1.65c-1.16-1.07-2.51-1.91-4.05-2.52-1.54-.61-3.07-.91-4.6-.91-2.07,0-3.96.52-5.67,1.56s-3.06,2.44-4.05,4.21c-.99,1.77-1.49,3.75-1.49,5.95s.49,4.18,1.49,5.95c.99,1.77,2.34,3.17,4.05,4.21s3.6,1.56,5.67,1.56c1.52,0,3.06-.31,4.6-.92M337.65,44.89v-16.92c.7-1.34,1.66-2.37,2.88-3.09,1.22-.72,2.59-1.08,4.12-1.08,2.2,0,3.92.65,5.17,1.94,1.25,1.3,1.88,3.07,1.88,5.33v13.81h2.01v-14.36c0-1.71-.36-3.21-1.07-4.51-.72-1.3-1.73-2.3-3.02-3.02s-2.8-1.08-4.5-1.08c-3.14,0-5.63,1.21-7.46,3.61v-3.16h-2.01v22.51h2.01ZM328.7,41.78v3.11h2.01v-22.51h-2.01v16.92c-.7,1.31-1.66,2.33-2.88,3.06-1.22.73-2.59,1.1-4.12,1.1-2.2,0-3.92-.65-5.17-1.97-1.25-1.31-1.87-3.08-1.87-5.31v-13.81h-2.01v14.36c0,1.71.37,3.21,1.1,4.51.73,1.3,1.74,2.3,3.04,3.02,1.3.72,2.78,1.08,4.46,1.08,3.2,0,5.69-1.19,7.46-3.57M303.64,43.88c1.74-1.01,3.08-2.43,4.02-4.28.95-1.84,1.42-4.05,1.42-6.61V12.87h-2.1v20.13c0,3.2-.85,5.74-2.56,7.62-1.71,1.88-4.01,2.81-6.91,2.81-2.17,0-4.02-.56-5.58-1.69-1.56-1.13-2.77-2.75-3.66-4.85l-1.92.87c1.01,2.5,2.46,4.4,4.37,5.7,1.9,1.3,4.15,1.94,6.75,1.94,2.38,0,4.44-.5,6.18-1.51M279.77,44.89v-15.37c.61-.97,1.41-1.73,2.4-2.26.99-.53,2.07-.8,3.22-.8.64,0,1.27.06,1.88.18.61.12,1.16.3,1.65.55v-6.45c-.55-.37-1.48-.56-2.79-.59-1.31,0-2.5.25-3.57.75-1.07.5-2,1.24-2.79,2.22v-2.42h-7.41v24.2h7.41ZM253.44,28.07c.47-.56,1.04-1,1.72-1.3.67-.3,1.42-.46,2.24-.46s1.52.16,2.2.48c.67.32,1.26.76,1.76,1.33.5.56.88,1.24,1.12,2.04h-10.11c.24-.82.6-1.52,1.07-2.08M263.5,44.47c1.6-.58,3.17-1.51,4.69-2.79l-4.9-4.35c-.58.58-1.28,1.03-2.1,1.35-.82.32-1.74.48-2.75.48-.91,0-1.77-.16-2.56-.48-.79-.32-1.47-.77-2.03-1.35-.56-.58-1.02-1.25-1.35-2.01h17.25v-1.83c0-2.56-.53-4.83-1.58-6.82-1.05-1.98-2.49-3.54-4.32-4.69-1.83-1.14-3.94-1.72-6.31-1.72s-4.48.55-6.4,1.67c-1.92,1.11-3.44,2.62-4.55,4.5-1.11,1.89-1.67,4.01-1.67,6.36s.58,4.47,1.74,6.36c1.16,1.89,2.74,3.39,4.73,4.51,2,1.11,4.23,1.67,6.7,1.67,2.01,0,3.82-.29,5.42-.87M227.12,38.44c-.88-.34-1.65-.79-2.29-1.37v-8.46c.67-.64,1.43-1.12,2.29-1.44s1.8-.48,2.84-.48c1.19,0,2.26.27,3.23.8.96.53,1.72,1.26,2.29,2.2.56.93.84,1.97.84,3.13s-.28,2.2-.84,3.13c-.56.93-1.32,1.66-2.27,2.2-.95.54-2.03.8-3.25.8-1.01,0-1.95-.17-2.84-.5M224.74,44.89v-1.37c.92.55,1.91.97,2.97,1.26,1.07.29,2.16.43,3.29.43,2.35,0,4.48-.55,6.38-1.65,1.91-1.1,3.41-2.58,4.53-4.46,1.11-1.88,1.67-3.97,1.67-6.29s-.55-4.42-1.65-6.29c-1.1-1.88-2.58-3.37-4.44-4.49-1.86-1.11-3.95-1.67-6.27-1.67s-4.51.67-6.41,2.01v-10.66l-7.41,1.14v32.02h7.32ZM183.69,44.89v-16.56c.46-.58,1.01-1.01,1.67-1.3.66-.29,1.4-.43,2.22-.43,1.19,0,2.14.4,2.86,1.19.72.79,1.07,1.86,1.07,3.2v13.91h7.41v-14.91c0-.28,0-.54-.02-.8-.01-.26-.04-.51-.07-.76.49-.61,1.07-1.07,1.74-1.37.67-.31,1.42-.46,2.24-.46,1.19,0,2.14.4,2.86,1.19s1.08,1.86,1.08,3.2v13.91h7.41v-14.91c0-1.92-.41-3.61-1.21-5.08-.81-1.46-1.91-2.61-3.31-3.43-1.4-.82-3.02-1.23-4.85-1.23-1.59,0-3.05.29-4.39.87-1.34.58-2.5,1.4-3.48,2.47-.83-1.07-1.85-1.89-3.07-2.47-1.22-.58-2.59-.87-4.12-.87-2.32,0-4.33.67-6.04,2.01v-1.56h-7.41v24.2h7.41ZM157.36,28.07c.47-.56,1.04-1,1.72-1.3.67-.3,1.42-.46,2.24-.46s1.52.16,2.2.48c.67.32,1.26.76,1.76,1.33.5.56.88,1.24,1.12,2.04h-10.11c.24-.82.6-1.52,1.08-2.08M167.42,44.47c1.6-.58,3.16-1.51,4.69-2.79l-4.9-4.35c-.58.58-1.28,1.03-2.1,1.35-.83.32-1.74.48-2.75.48-.91,0-1.77-.16-2.56-.48-.79-.32-1.47-.77-2.03-1.35-.56-.58-1.02-1.25-1.35-2.01h17.25v-1.83c0-2.56-.53-4.83-1.58-6.82-1.05-1.98-2.49-3.54-4.32-4.69-1.83-1.14-3.93-1.72-6.31-1.72s-4.48.55-6.41,1.67c-1.92,1.11-3.44,2.62-4.55,4.5-1.11,1.89-1.67,4.01-1.67,6.36s.58,4.47,1.74,6.36c1.16,1.89,2.74,3.39,4.74,4.51,2,1.11,4.23,1.67,6.7,1.67,2.01,0,3.82-.29,5.42-.87M118.71,44.89v-21.91l10.52,19.62,10.52-19.53v21.82h7.41V12.87h-9.93l-7.91,15.1-7.91-15.1h-9.93v32.02h7.23Z" />
+                <path fill="#fff"
+                    d="M88.82,12.69v27.95s9.76,5.58,9.76,5.58c.01-.24.02-34.61.02-34.61,0-3.72-1.57-6.76-4.3-8.35-2.73-1.59-6.15-1.44-9.38.39l-33.88,19.27L17.17,3.66c-3.23-1.84-6.65-1.98-9.38-.39-2.73,1.59-4.3,4.63-4.3,8.35,0,0,0,34.39.02,34.64l9.75-5.58V12.69l27.89,15.87L4.21,49.57c.71,1.84,1.93,3.32,3.57,4.28,1.26.73,2.67,1.1,4.13,1.1,1.71,0,3.51-.5,5.25-1.49L88.82,12.69Z" />
+                <path fill="#fff"
+                    d="M64.22,30.43l-9.86,5.64,30.56,17.39c1.74.99,3.54,1.49,5.26,1.49,1.46,0,2.87-.37,4.13-1.1,1.65-.96,2.87-2.46,3.59-4.31l-33.67-19.11Z" />
+            </svg>
+        </div>
+
+        <div class="mj-about__version-row">
+            <span class="mj-about__version-pill" (click)="OnVersionClick()" role="button" tabindex="0">
+                <span class="mj-about__version-dot"></span>
+                <span>Version {{ Version }}</span>
+            </span>
+        </div>
+    </div>
+
+    <div class="mj-about__body">
+        @if (ConnectionLabel) {
+            <div class="mj-about__connection-line">
+                Connected to <span class="mj-about__connection-name">{{ ConnectionLabel }}</span>
+            </div>
+        }
+
+        <div class="mj-about__user-card">
+            @if (AvatarUrl) {
+                <img class="mj-about__user-avatar mj-about__user-avatar--img"
+                     [src]="AvatarUrl" alt="" (error)="OnAvatarLoadError()" />
+            } @else if (AvatarIconClass) {
+                <div class="mj-about__user-avatar mj-about__user-avatar--icon">
+                    <i [class]="AvatarIconClass"></i>
+                </div>
+            } @else {
+                <div class="mj-about__user-avatar">{{ UserInitials }}</div>
+            }
+            <div class="mj-about__user-info">
+                <div class="mj-about__user-name">{{ UserName }}</div>
+                <div class="mj-about__user-meta">{{ UserMeta }}</div>
+            </div>
+            <div class="mj-about__conn-pill" [class.mj-about__conn-pill--offline]="!IsConnected">
+                <i class="fa-solid fa-circle"></i>
+                {{ IsConnected ? 'Connected' : 'Offline' }}
+            </div>
+        </div>
+
+        <button class="mj-about__diag-toggle" type="button" [class.mj-about__diag-toggle--open]="DiagnosticsOpen"
+                (click)="ToggleDiagnostics()">
+            <span class="mj-about__diag-toggle-left">
+                <i class="fa-solid fa-stethoscope"></i>
+                {{ DiagnosticsOpen ? 'Hide diagnostics' : 'Show diagnostics' }}
+            </span>
+            <i class="fa-solid fa-chevron-down mj-about__diag-chev"></i>
+        </button>
+
+        <div class="mj-about__diag-panel" [class.mj-about__diag-panel--open]="DiagnosticsOpen">
+            <div class="mj-about__diag-section">
+                <h5><i class="fa-solid fa-cube"></i> Build</h5>
+                <div class="mj-about__diag-row"><span class="k">Version</span><span class="v">{{ Version }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Environment</span><span class="v">{{ Environment }}</span></div>
+            </div>
+            <div class="mj-about__diag-section">
+                <h5><i class="fa-solid fa-plug"></i> Connection</h5>
+                <div class="mj-about__diag-row"><span class="k">API endpoint</span><span class="v" [title]="ApiUrl">{{ ApiUrlShort }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Auth provider</span><span class="v">{{ AuthProvider }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Status</span><span class="v" [class.mj-about__success]="IsConnected" [class.mj-about__error]="!IsConnected">{{ IsConnected ? 'Connected' : 'Offline' }}</span></div>
+            </div>
+            <div class="mj-about__diag-section">
+                <h5><i class="fa-solid fa-database"></i> Loaded</h5>
+                <div class="mj-about__diag-row"><span class="k">Entities</span><span class="v">{{ EntityCount }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Applications</span><span class="v">{{ ApplicationCount }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Queries</span><span class="v">{{ QueryCount }}</span></div>
+            </div>
+            <div class="mj-about__diag-section">
+                <h5><i class="fa-solid fa-user"></i> Session</h5>
+                <div class="mj-about__diag-row"><span class="k">User</span><span class="v">{{ UserEmail }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Roles</span><span class="v">{{ UserRolesText }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Theme</span><span class="v">{{ ThemeLabel }}</span></div>
+                <div class="mj-about__diag-row"><span class="k">Browser</span><span class="v">{{ BrowserLabel }}</span></div>
+            </div>
+            <button class="mj-about__copy-btn" type="button" (click)="CopyDiagnostics()">
+                <i class="fa-solid" [class.fa-clipboard]="!CopyConfirmed" [class.fa-check]="CopyConfirmed"></i>
+                {{ CopyConfirmed ? 'Copied!' : 'Copy diagnostics' }}
+            </button>
+        </div>
+    </div>
+
+    <div class="mj-about__footer">
+        <a class="mj-about__footer-link" href="https://docs.memberjunction.org" target="_blank" rel="noopener">
+            <i class="fa-solid fa-book"></i> Documentation
+        </a>
+        <a class="mj-about__footer-link" href="https://github.com/MemberJunction/MJ" target="_blank" rel="noopener">
+            <i class="fa-brands fa-github"></i> GitHub
+        </a>
+        <a class="mj-about__footer-link" href="https://memberjunction.com" target="_blank" rel="noopener">
+            <i class="fa-solid fa-globe"></i> Website
+        </a>
+    </div>
+
+    <div class="mj-about__credit">
+        Built with <span class="mj-about__heart">&hearts;</span> by the MemberJunction community
+    </div>
+
+    @if (ToastMessage) {
+        <div class="mj-about__toast">{{ ToastMessage }}</div>
+    }
+</div>
+    `, styles: ["\n:host {\n    display: block;\n    width: 100%;\n    height: 100%;\n}\n.mj-about {\n    display: flex;\n    flex-direction: column;\n    background: var(--mj-bg-surface);\n    color: var(--mj-text-primary);\n    height: 100%;\n    min-height: 0;\n    position: relative;\n    font-family: inherit;\n}\n.mj-about__close {\n    position: absolute;\n    top: 12px;\n    right: 12px;\n    width: 36px;\n    height: 36px;\n    border: none;\n    border-radius: 8px;\n    background: rgba(255, 255, 255, 0.18);\n    backdrop-filter: blur(8px);\n    color: #fff;\n    cursor: pointer;\n    font-size: 16px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: background 0.15s;\n    z-index: 2;\n}\n.mj-about__close:hover { background: rgba(255, 255, 255, 0.3); }\n\n.mj-about__hero {\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    padding: 36px 24px 28px;\n    position: relative;\n    overflow: hidden;\n    flex-shrink: 0;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 14px;\n}\n.mj-about__hero::before {\n    content: '';\n    position: absolute;\n    inset: -50%;\n    background: radial-gradient(circle, rgba(255, 255, 255, 0.10) 0%, transparent 60%);\n    animation: mj-about-rotate 24s linear infinite;\n    pointer-events: none;\n}\n@media (prefers-reduced-motion: reduce) {\n    .mj-about__hero::before { animation: none; }\n}\n@keyframes mj-about-rotate { to { transform: rotate(360deg); } }\n\n.mj-about__logo-wrap {\n    position: relative;\n    z-index: 1;\n    cursor: pointer;\n    display: block;\n    text-align: center;\n}\n.mj-about__logo {\n    width: 280px;\n    max-width: 80%;\n    height: auto;\n    display: inline-block;\n    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.15));\n    transition: transform 0.3s ease-out;\n}\n.mj-about__logo-wrap:hover .mj-about__logo { transform: scale(1.03); }\n\n.mj-about__version-row {\n    position: relative;\n    z-index: 1;\n    text-align: center;\n}\n.mj-about__version-pill {\n    display: inline-flex;\n    align-items: center;\n    gap: 7px;\n    background: rgba(255, 255, 255, 0.18);\n    backdrop-filter: blur(8px);\n    border: 1px solid rgba(255, 255, 255, 0.28);\n    border-radius: 100px;\n    padding: 5px 14px;\n    font-size: 12px;\n    font-weight: 600;\n    cursor: pointer;\n    user-select: none;\n    color: #fff;\n    transition: background 0.15s;\n    letter-spacing: 0.2px;\n}\n.mj-about__version-pill:hover { background: rgba(255, 255, 255, 0.28); }\n.mj-about__version-dot {\n    width: 7px;\n    height: 7px;\n    border-radius: 50%;\n    background: #4ade80;\n    box-shadow: 0 0 6px #4ade80;\n}\n\n.mj-about__body {\n    padding: 22px 24px 16px;\n    overflow-y: auto;\n    flex: 1;\n    min-height: 0;\n}\n\n.mj-about__connection-line {\n    text-align: center;\n    font-size: 11.5px;\n    color: var(--mj-text-muted);\n    margin-bottom: 14px;\n    letter-spacing: 0.2px;\n}\n.mj-about__connection-name {\n    color: var(--mj-text-secondary);\n    font-weight: 600;\n}\n\n.mj-about__user-card {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 14px;\n    background: var(--mj-bg-surface-sunken);\n    border-radius: 10px;\n    margin-bottom: 16px;\n}\n.mj-about__user-avatar {\n    width: 40px;\n    height: 40px;\n    border-radius: 50%;\n    background: linear-gradient(135deg, #264FAF 0%, #0076b6 100%);\n    color: #fff;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    font-weight: 700;\n    font-size: 15px;\n    flex-shrink: 0;\n    object-fit: cover;\n    overflow: hidden;\n}\nimg.mj-about__user-avatar { background: var(--mj-bg-surface-card); }\n.mj-about__user-avatar--icon i { font-size: 18px; }\n.mj-about__user-info { flex: 1; min-width: 0; }\n.mj-about__user-name {\n    font-size: 13.5px;\n    font-weight: 600;\n    color: var(--mj-text-primary);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.mj-about__user-meta {\n    font-size: 11.5px;\n    color: var(--mj-text-muted);\n    margin-top: 2px;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n.mj-about__conn-pill {\n    display: inline-flex;\n    align-items: center;\n    gap: 5px;\n    font-size: 11px;\n    color: var(--mj-status-success);\n    font-weight: 600;\n    background: color-mix(in srgb, var(--mj-status-success) 12%, transparent);\n    padding: 3px 8px;\n    border-radius: 100px;\n    flex-shrink: 0;\n}\n.mj-about__conn-pill i { font-size: 6px; }\n.mj-about__conn-pill--offline {\n    color: var(--mj-status-error);\n    background: color-mix(in srgb, var(--mj-status-error) 12%, transparent);\n}\n\n.mj-about__diag-toggle {\n    width: 100%;\n    background: transparent;\n    border: 1px solid var(--mj-border-default);\n    border-radius: 10px;\n    padding: 12px 14px;\n    font-size: 13px;\n    font-weight: 500;\n    color: var(--mj-text-secondary);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 8px;\n    transition: background 0.15s, border-color 0.15s, color 0.15s;\n    font-family: inherit;\n}\n.mj-about__diag-toggle:hover {\n    background: var(--mj-bg-surface-hover);\n    border-color: var(--mj-border-strong);\n    color: var(--mj-text-primary);\n}\n.mj-about__diag-toggle-left {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n}\n.mj-about__diag-chev {\n    transition: transform 0.25s;\n    color: var(--mj-text-muted);\n}\n.mj-about__diag-toggle--open .mj-about__diag-chev { transform: rotate(180deg); }\n\n.mj-about__diag-panel {\n    max-height: 0;\n    overflow: hidden;\n    transition: max-height 0.35s ease-out, margin-top 0.25s;\n}\n.mj-about__diag-panel--open {\n    max-height: 800px;\n    margin-top: 12px;\n}\n.mj-about__diag-section + .mj-about__diag-section { margin-top: 12px; }\n.mj-about__diag-section {\n    background: var(--mj-bg-surface-card);\n    border: 1px solid var(--mj-border-subtle);\n    border-radius: 10px;\n    padding: 12px 14px;\n}\n.mj-about__diag-section h5 {\n    margin: 0 0 8px;\n    font-size: 10.5px;\n    font-weight: 700;\n    text-transform: uppercase;\n    letter-spacing: 0.6px;\n    color: var(--mj-text-muted);\n    display: flex;\n    align-items: center;\n    gap: 6px;\n}\n.mj-about__diag-section h5 i { color: var(--mj-brand-primary); }\n.mj-about__diag-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    gap: 8px;\n    font-size: 12.5px;\n    padding: 4px 0;\n    min-width: 0;\n}\n.mj-about__diag-row .k { color: var(--mj-text-secondary); flex-shrink: 0; }\n.mj-about__diag-row .v {\n    color: var(--mj-text-primary);\n    font-family: 'SF Mono', Menlo, Consolas, monospace;\n    font-size: 11.5px;\n    font-weight: 500;\n    text-align: right;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n    min-width: 0;\n}\n.mj-about__success { color: var(--mj-status-success) !important; }\n.mj-about__error   { color: var(--mj-status-error)   !important; }\n\n.mj-about__copy-btn {\n    width: 100%;\n    margin-top: 12px;\n    padding: 10px;\n    border: 1px dashed var(--mj-border-strong);\n    background: transparent;\n    border-radius: 8px;\n    font-size: 12.5px;\n    color: var(--mj-text-secondary);\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    transition: border-color 0.15s, color 0.15s, background 0.15s;\n    font-family: inherit;\n}\n.mj-about__copy-btn:hover {\n    border-color: var(--mj-brand-primary);\n    color: var(--mj-brand-primary);\n    background: color-mix(in srgb, var(--mj-brand-primary) 4%, transparent);\n}\n\n.mj-about__footer {\n    border-top: 1px solid var(--mj-border-subtle);\n    padding: 14px 20px;\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n    justify-content: center;\n    flex-shrink: 0;\n}\n.mj-about__footer-link {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 7px 12px;\n    border-radius: 7px;\n    font-size: 12px;\n    color: var(--mj-text-secondary);\n    text-decoration: none;\n    transition: background 0.15s, color 0.15s;\n    cursor: pointer;\n}\n.mj-about__footer-link:hover {\n    background: var(--mj-bg-surface-hover);\n    color: var(--mj-brand-primary);\n}\n\n.mj-about__credit {\n    text-align: center;\n    font-size: 10.5px;\n    color: var(--mj-text-muted);\n    padding: 0 20px 14px;\n    flex-shrink: 0;\n}\n.mj-about__heart {\n    color: var(--mj-status-error);\n    display: inline-block;\n    animation: mj-about-heart 2s ease-in-out infinite;\n}\n@media (prefers-reduced-motion: reduce) {\n    .mj-about__heart { animation: none; }\n}\n@keyframes mj-about-heart {\n    50% { transform: scale(1.18); }\n}\n\n.mj-about__toast {\n    position: absolute;\n    top: 16px;\n    left: 50%;\n    transform: translateX(-50%);\n    background: var(--mj-text-primary);\n    color: var(--mj-bg-surface);\n    padding: 10px 18px;\n    border-radius: 10px;\n    font-size: 13px;\n    font-weight: 500;\n    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);\n    z-index: 5;\n    pointer-events: none;\n    animation: mj-about-toast-in 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);\n    max-width: calc(100% - 32px);\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n}\n@keyframes mj-about-toast-in {\n    from { transform: translateX(-50%) translateY(-30px); opacity: 0; }\n    to   { transform: translateX(-50%) translateY(0);     opacity: 1; }\n}\n\n@media (max-width: 480px) {\n    .mj-about__hero { padding: 30px 18px 22px; gap: 12px; }\n    .mj-about__logo { width: 220px; }\n    .mj-about__body { padding: 18px 16px 14px; }\n    .mj-about__footer { padding: 12px 14px; }\n}\n    "] }]
+    }], null, { CloseRequested: [{
+            type: Output
+        }], AvatarUrl: [{
+            type: Input
+        }], AvatarIconClass: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(AboutDialogComponent, { className: "AboutDialogComponent", filePath: "src/lib/about/about-dialog.component.ts", lineNumber: 530 }); })();
+//# sourceMappingURL=about-dialog.component.js.map