@genesislcap/foundation-utils 14.314.2 → 14.314.3-alpha-c442ac5.0

package/dist/dts/inactivity/inactivity-manager.d.ts

@@ -0,0 +1,24 @@
+import { InactivityService, InactivityConfig } from './inactivity-service';
+export interface InactivityManagerConfig extends InactivityConfig {
+    onLogout: () => void;
+}
+export declare class InactivityManager {
+    private service;
+    private dialog;
+    private config;
+    private isDialogVisible;
+    constructor(config: InactivityManagerConfig);
+    private setupEventListeners;
+    private showWarningDialog;
+    private hideWarningDialog;
+    private handleContinue;
+    private handleLogout;
+    private handleTimeout;
+    start(): void;
+    stop(): void;
+    reset(): void;
+    destroy(): void;
+    getService(): InactivityService;
+    isWarningVisible(): boolean;
+}
+//# sourceMappingURL=inactivity-manager.d.ts.map

package/dist/dts/inactivity/inactivity-manager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"inactivity-manager.d.ts","sourceRoot":"","sources":["../../../src/inactivity/inactivity-manager.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAE3E,MAAM,WAAW,uBAAwB,SAAQ,gBAAgB;IAC/D,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,qBAAa,iBAAiB;IAC5B,OAAO,CAAC,OAAO,CAAoB;IACnC,OAAO,CAAC,MAAM,CAAiC;IAC/C,OAAO,CAAC,MAAM,CAA0B;IACxC,OAAO,CAAC,eAAe,CAAkB;gBAE7B,MAAM,EAAE,uBAAuB;IAU3C,OAAO,CAAC,mBAAmB;IAU3B,OAAO,CAAC,iBAAiB;IAoBzB,OAAO,CAAC,iBAAiB;IAYzB,OAAO,CAAC,cAAc;IAKtB,OAAO,CAAC,YAAY;IAMpB,OAAO,CAAC,aAAa;IAQd,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAKZ,KAAK,IAAI,IAAI;IAKb,OAAO,IAAI,IAAI;IAKf,UAAU,IAAI,iBAAiB;IAI/B,gBAAgB,IAAI,OAAO;CAGnC"}

package/dist/dts/inactivity/inactivity-service.d.ts

@@ -0,0 +1,34 @@
+export interface InactivityConfig {
+    timeoutMinutes: number;
+    warningMinutes: number;
+}
+export interface InactivityEvents {
+    'inactivity-warning': {
+        remainingSeconds: number;
+    };
+    'inactivity-timeout': void;
+    'inactivity-reset': void;
+}
+type EventListener<T = any> = (data: T) => void;
+export declare class InactivityService {
+    private config;
+    private warningId;
+    private timeoutId;
+    private lastActivity;
+    private isActive;
+    private eventListeners;
+    constructor(config: InactivityConfig);
+    private setupActivityListeners;
+    private checkTimeout;
+    on<K extends keyof InactivityEvents>(event: K, listener: EventListener<InactivityEvents[K]>): void;
+    off<K extends keyof InactivityEvents>(event: K, listener: EventListener<InactivityEvents[K]>): void;
+    private emit;
+    start(): void;
+    stop(): void;
+    resetTimer(): void;
+    private scheduleTimers;
+    private clearTimers;
+    destroy(): void;
+}
+export {};
+//# sourceMappingURL=inactivity-service.d.ts.map

package/dist/dts/inactivity/inactivity-service.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"inactivity-service.d.ts","sourceRoot":"","sources":["../../../src/inactivity/inactivity-service.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,gBAAgB;IAC/B,cAAc,EAAE,MAAM,CAAC;IACvB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,gBAAgB;IAC/B,oBAAoB,EAAE;QAAE,gBAAgB,EAAE,MAAM,CAAA;KAAE,CAAC;IACnD,oBAAoB,EAAE,IAAI,CAAC;IAC3B,kBAAkB,EAAE,IAAI,CAAC;CAC1B;AAED,KAAK,aAAa,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;AAEhD,qBAAa,iBAAiB;IAC5B,OAAO,CAAC,MAAM,CAAmB;IACjC,OAAO,CAAC,SAAS,CAAuB;IACxC,OAAO,CAAC,SAAS,CAAuB;IACxC,OAAO,CAAC,YAAY,CAAsB;IAC1C,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,cAAc,CAA2D;gBAErE,MAAM,EAAE,gBAAgB;IAKpC,OAAO,CAAC,sBAAsB;IA6B9B,OAAO,CAAC,YAAY;IAkBb,EAAE,CAAC,CAAC,SAAS,MAAM,gBAAgB,EACxC,KAAK,EAAE,CAAC,EACR,QAAQ,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,GAC3C,IAAI;IAKA,GAAG,CAAC,CAAC,SAAS,MAAM,gBAAgB,EACzC,KAAK,EAAE,CAAC,EACR,QAAQ,EAAE,aAAa,CAAC,gBAAgB,CAAC,CAAC,CAAC,CAAC,GAC3C,IAAI;IAOP,OAAO,CAAC,IAAI;IAYL,KAAK,IAAI,IAAI;IAMb,IAAI,IAAI,IAAI;IAKZ,UAAU,IAAI,IAAI;IAQzB,OAAO,CAAC,cAAc;IAkBtB,OAAO,CAAC,WAAW;IAWZ,OAAO,IAAI,IAAI;CAIvB"}

package/dist/dts/inactivity/index.d.ts

@@ -0,0 +1,4 @@
+export * from './inactivity-dialog';
+export * from './inactivity-manager';
+export * from './inactivity-service';
+//# sourceMappingURL=index.d.ts.map

package/dist/dts/inactivity/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/inactivity/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC"}

package/dist/dts/index.d.ts

@@ -19,4 +19,5 @@ export * from './styles';
 export * from './utils';
 export * from './uuid';
 export * from './window';
+export * from './inactivity';
 //# sourceMappingURL=index.d.ts.map

package/dist/dts/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC"}

package/dist/esm/inactivity/inactivity-dialog.js

@@ -0,0 +1,213 @@
+import { __decorate } from "tslib";
+import { customElement, FASTElement, observable, html, css } from '@microsoft/fast-element';
+import { getCurrentDesignSystemPrefix } from '../design-system/design-system';
+// Constants for time conversions
+const MILLISECONDS_PER_SECOND = 1000;
+const getPrefixedInactivityDialog = (prefix) => html `
+  <div class="inactivity-overlay" ?hidden=${(x) => !x.isVisible}>
+    <${prefix}-card class="dialog-card">
+      <div class="card-body">
+        <div class="dialog-header">
+          <${prefix}-icon name="warning" class="warning-icon"></${prefix}-icon>
+          <h2>Session Timeout Warning</h2>
+        </div>
+        <div class="dialog-content">
+          <p>
+            You have been inactive for too long. You will be automatically logged out in
+            <strong>${(x) => x.remainingSeconds}</strong>
+            seconds.
+          </p>
+          <p>
+            Click "Continue Session" to stay logged in, or "Logout Now" to end your session
+            immediately.
+          </p>
+        </div>
+        <div class="dialog-actions">
+          <${prefix}-button
+            appearance="accent"
+            @click=${(x) => x.handleContinue()}
+            class="continue-button"
+          >
+            Continue Session
+          </${prefix}-button>
+          <${prefix}-button
+            appearance="outline"
+            @click=${(x) => x.handleLogout()}
+            class="logout-button"
+          >
+            Logout Now
+          </${prefix}-button>
+        </div>
+      </div>
+    </${prefix}-card>
+  </div>
+`;
+let InactivityDialog = class InactivityDialog extends FASTElement {
+    constructor() {
+        super(...arguments);
+        this.isVisible = false;
+        this.remainingSeconds = 0;
+        this.startTime = 0;
+        this.totalSeconds = 0;
+    }
+    show(options) {
+        this.totalSeconds = options.remainingSeconds;
+        this.remainingSeconds = options.remainingSeconds;
+        this.onContinue = options.onContinue;
+        this.onLogout = options.onLogout;
+        this.isVisible = true;
+        this.startCountdown();
+    }
+    hide() {
+        this.isVisible = false;
+        this.stopCountdown();
+    }
+    startCountdown() {
+        this.startTime = Date.now();
+        this.countdownInterval = window.setInterval(() => {
+            try {
+                // Calculate actual elapsed time since dialog started
+                const elapsedMs = Date.now() - this.startTime;
+                const elapsedSeconds = Math.floor(elapsedMs / MILLISECONDS_PER_SECOND);
+                // Calculate remaining time based on actual elapsed time
+                this.remainingSeconds = Math.max(0, this.totalSeconds - elapsedSeconds);
+                if (this.remainingSeconds <= 0) {
+                    this.stopCountdown();
+                    this.handleLogout();
+                }
+            }
+            catch (error) {
+                // If there's an error during countdown, stop the timer
+                this.stopCountdown();
+                console.warn('Error during inactivity countdown:', error);
+            }
+        }, MILLISECONDS_PER_SECOND);
+    }
+    stopCountdown() {
+        if (this.countdownInterval) {
+            clearInterval(this.countdownInterval);
+            this.countdownInterval = undefined;
+        }
+    }
+    handleContinue() {
+        this.hide();
+        if (this.onContinue) {
+            this.onContinue();
+        }
+    }
+    handleLogout() {
+        this.hide();
+        if (this.onLogout) {
+            this.onLogout();
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.stopCountdown();
+    }
+};
+__decorate([
+    observable
+], InactivityDialog.prototype, "isVisible", void 0);
+__decorate([
+    observable
+], InactivityDialog.prototype, "remainingSeconds", void 0);
+InactivityDialog = __decorate([
+    customElement({
+        name: 'inactivity-dialog',
+        template: html `
+    ${(x) => getPrefixedInactivityDialog(getCurrentDesignSystemPrefix(x, 'rapid'))}
+  `,
+        styles: css `
+    .inactivity-overlay {
+      position: fixed;
+      inset: 0;
+      width: 100vw;
+      height: 100vh;
+      background-color: rgba(0, 0, 0, 0.6);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      z-index: 9999;
+      backdrop-filter: blur(2px);
+    }
+
+    .dialog-card {
+      height: 260px;
+      max-height: 260px;
+      max-width: 520px;
+      width: 92%;
+    }
+
+    .card-body {
+      padding: 24px;
+      box-sizing: border-box;
+    }
+
+    .dialog-header {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+      margin-bottom: 16px;
+    }
+
+    .warning-icon {
+      color: var(--accent-fill-rest);
+      font-size: 24px;
+    }
+
+    .dialog-header h2 {
+      margin: 0;
+      color: var(--neutral-foreground-rest);
+      font-size: 20px;
+      font-weight: 600;
+    }
+
+    .dialog-content {
+      margin-bottom: 24px;
+    }
+
+    .dialog-content p {
+      margin: 0 0 12px 0;
+      color: var(--neutral-foreground-rest);
+      line-height: 1.5;
+    }
+
+    .dialog-content p:last-child {
+      margin-bottom: 0;
+    }
+
+    .dialog-content strong {
+      color: var(--accent-foreground-rest);
+      font-weight: 600;
+    }
+
+    .dialog-actions {
+      display: flex;
+      gap: 12px;
+      justify-content: flex-end;
+    }
+
+    .continue-button {
+      min-width: 140px;
+    }
+    .logout-button {
+      min-width: 120px;
+    }
+
+    @media (max-width: 480px) {
+      .card-body {
+        padding: 20px;
+      }
+      .dialog-actions {
+        flex-direction: column;
+      }
+      .continue-button,
+      .logout-button {
+        width: 100%;
+      }
+    }
+  `,
+    })
+], InactivityDialog);
+export { InactivityDialog };

package/dist/esm/inactivity/inactivity-manager.js

@@ -0,0 +1,87 @@
+import { InactivityService } from './inactivity-service';
+export class InactivityManager {
+    constructor(config) {
+        this.dialog = null;
+        this.isDialogVisible = false;
+        this.config = config;
+        this.service = new InactivityService({
+            timeoutMinutes: config.timeoutMinutes,
+            warningMinutes: config.warningMinutes,
+        });
+        this.setupEventListeners();
+        console.log('InactivityManager constructor ', this.config);
+    }
+    setupEventListeners() {
+        this.service.on('inactivity-warning', (data) => {
+            this.showWarningDialog(data.remainingSeconds);
+        });
+        this.service.on('inactivity-timeout', () => {
+            this.handleTimeout();
+        });
+    }
+    showWarningDialog(remainingSeconds) {
+        if (this.isDialogVisible)
+            return;
+        if (!this.dialog) {
+            this.dialog = document.createElement('inactivity-dialog');
+            console.log('Creating dialog', this.dialog);
+        }
+        if (!this.dialog.isConnected) {
+            document.body.appendChild(this.dialog);
+        }
+        this.isDialogVisible = true;
+        this.dialog.show({
+            remainingSeconds,
+            onContinue: () => this.handleContinue(),
+            onLogout: () => this.handleLogout(),
+        });
+    }
+    hideWarningDialog() {
+        if (!this.isDialogVisible || !this.dialog)
+            return;
+        this.isDialogVisible = false;
+        this.dialog.hide();
+        // Remove from DOM
+        if (this.dialog.parentNode) {
+            this.dialog.parentNode.removeChild(this.dialog);
+        }
+    }
+    handleContinue() {
+        this.service.resetTimer();
+        this.hideWarningDialog();
+    }
+    handleLogout() {
+        this.hideWarningDialog();
+        this.service.stop();
+        if (this.config.onLogout)
+            this.config.onLogout();
+    }
+    handleTimeout() {
+        // If dialog is visible, let it handle the countdown
+        if (this.isDialogVisible)
+            return;
+        // Otherwise, logout immediately
+        this.handleLogout();
+    }
+    start() {
+        this.service.start();
+    }
+    stop() {
+        this.service.stop();
+        this.hideWarningDialog();
+    }
+    reset() {
+        this.service.resetTimer();
+        this.hideWarningDialog();
+    }
+    destroy() {
+        this.service.destroy();
+        this.hideWarningDialog();
+    }
+    getService() {
+        return this.service;
+    }
+    isWarningVisible() {
+        return this.isDialogVisible;
+    }
+}

package/dist/esm/inactivity/inactivity-service.js

@@ -0,0 +1,128 @@
+// Constants for time conversions
+const SECONDS_PER_MINUTE = 60;
+const MILLISECONDS_PER_SECOND = 1000;
+const MILLISECONDS_PER_MINUTE = SECONDS_PER_MINUTE * MILLISECONDS_PER_SECOND;
+export class InactivityService {
+    constructor(config) {
+        this.warningId = null;
+        this.timeoutId = null;
+        this.lastActivity = Date.now();
+        this.isActive = false;
+        this.eventListeners = new Map();
+        this.config = config;
+        this.setupActivityListeners();
+    }
+    setupActivityListeners() {
+        const events = [
+            'mousedown',
+            'mousemove',
+            'keydown',
+            'touchstart',
+            'click',
+            'focus',
+            'blur',
+            'wheel',
+            'touchmove',
+        ];
+        const handler = () => this.resetTimer();
+        events.forEach((event) => {
+            document.addEventListener(event, handler, { passive: true });
+        });
+        // Handle scroll events
+        window.addEventListener('scroll', handler, { passive: true, capture: true });
+        document.addEventListener('scroll', handler, { passive: true, capture: true });
+        // Handle sleep/wake cycles
+        document.addEventListener('visibilitychange', () => {
+            if (document.visibilityState === 'visible' && this.isActive) {
+                this.checkTimeout();
+            }
+        });
+    }
+    checkTimeout() {
+        const timeSinceLastActivity = Date.now() - this.lastActivity;
+        const timeoutMs = this.config.timeoutMinutes * MILLISECONDS_PER_MINUTE;
+        const warningMs = (this.config.timeoutMinutes - this.config.warningMinutes) * MILLISECONDS_PER_MINUTE;
+        if (timeSinceLastActivity >= timeoutMs) {
+            this.emit('inactivity-timeout');
+        }
+        else if (timeSinceLastActivity >= warningMs) {
+            const remainingSeconds = Math.round((timeoutMs - timeSinceLastActivity) / MILLISECONDS_PER_SECOND);
+            this.emit('inactivity-warning', { remainingSeconds });
+        }
+        else {
+            this.resetTimer();
+        }
+    }
+    on(event, listener) {
+        if (!this.eventListeners.has(event))
+            this.eventListeners.set(event, []);
+        this.eventListeners.get(event).push(listener);
+    }
+    off(event, listener) {
+        const listeners = this.eventListeners.get(event);
+        if (!listeners)
+            return;
+        const i = listeners.indexOf(listener);
+        if (i > -1)
+            listeners.splice(i, 1);
+    }
+    emit(event, data) {
+        const listeners = this.eventListeners.get(event);
+        if (!listeners)
+            return;
+        for (const l of listeners) {
+            try {
+                l(data);
+            }
+            catch (e) {
+                console.error('InactivityService listener error', e);
+            }
+        }
+    }
+    start() {
+        this.isActive = true;
+        this.lastActivity = Date.now();
+        this.scheduleTimers();
+    }
+    stop() {
+        this.isActive = false;
+        this.clearTimers();
+    }
+    resetTimer() {
+        if (!this.isActive)
+            return;
+        this.lastActivity = Date.now();
+        this.clearTimers();
+        this.scheduleTimers();
+        this.emit('inactivity-reset');
+    }
+    scheduleTimers() {
+        const warningDelayMs = (this.config.timeoutMinutes - this.config.warningMinutes) * MILLISECONDS_PER_MINUTE;
+        this.warningId = window.setTimeout(() => {
+            if (this.isActive) {
+                const remainingSeconds = Math.round(this.config.warningMinutes * SECONDS_PER_MINUTE);
+                this.emit('inactivity-warning', { remainingSeconds });
+            }
+        }, warningDelayMs);
+        const timeoutDelayMs = this.config.timeoutMinutes * MILLISECONDS_PER_MINUTE;
+        this.timeoutId = window.setTimeout(() => {
+            if (this.isActive) {
+                this.emit('inactivity-timeout');
+            }
+        }, timeoutDelayMs);
+    }
+    clearTimers() {
+        if (this.warningId) {
+            clearTimeout(this.warningId);
+            this.warningId = null;
+        }
+        if (this.timeoutId) {
+            clearTimeout(this.timeoutId);
+            this.timeoutId = null;
+        }
+    }
+    destroy() {
+        this.stop();
+        this.eventListeners.clear();
+    }
+}

package/dist/esm/inactivity/index.js

@@ -0,0 +1,3 @@
+export * from './inactivity-dialog';
+export * from './inactivity-manager';
+export * from './inactivity-service';

package/dist/esm/index.js

@@ -19,3 +19,4 @@ export * from './styles';
 export * from './utils';
 export * from './uuid';
 export * from './window';
+export * from './inactivity';