@oxvo/ai-live-assist 7.3.0

package/lib/messages.js

@@ -0,0 +1,92 @@
+export const defaultMessages = {
+    launcher: "Ask AI",
+    introTitle: "AI Live Assist",
+    disclosure: "You are interacting with an AI assistant.",
+    requiredConsent: "I understand that I am interacting with an AI assistant.",
+    consentAgreement: "I agree to use AI Live Assist.",
+    legalDetails: "Terms and privacy",
+    legalTitle: "AI Live Assist terms and privacy",
+    legalClose: "Close details",
+    termsOfService: "Terms of service",
+    microphoneConsent: "Send microphone audio to the AI provider for this session.",
+    pageConsent: "Share a limited, sanitized description of this page.",
+    controlConsent: "Allow approved low-risk page actions within this site.",
+    visualConsent: "Allow bounded visual context when I request it.",
+    visualRequest: "Share one privacy-filtered page layout?",
+    shareVisual: "Share layout",
+    declineVisual: "Do not share",
+    visualShared: "Privacy-filtered visual context shared",
+    visualUnavailable: "Visual context was not shared. The assistant can continue with page structure.",
+    pauseVisual: "Pause visual sharing",
+    resumeVisual: "Resume visual sharing",
+    handoffConsent: "Share a short conversation summary if I request a human.",
+    retentionConsent: "Retain a redacted transcript under this site’s policy.",
+    startText: "Start with text",
+    startVoice: "Start with voice",
+    connecting: "Connecting securely",
+    listening: "Listening",
+    thinking: "Thinking",
+    speaking: "Speaking",
+    ready: "Ready",
+    paused: "AI actions are paused. You remain in control.",
+    reconnecting: "Reconnecting securely",
+    end: "End session",
+    restart: "Start a new session",
+    close: "Close",
+    minimize: "Minimize",
+    maximize: "Expand conversation",
+    activeCall: "AI Live Assist is still active",
+    movePanel: "Move AI Live Assist",
+    mute: "Mute",
+    unmute: "Unmute",
+    interrupt: "Stop AI response",
+    usePushToTalk: "Use push to talk",
+    useAutomaticTurns: "Return to automatic listening",
+    automaticTurnsUnavailable: "Automatic listening unavailable",
+    startSpeaking: "Start speaking",
+    sendVoiceTurn: "Send voice turn",
+    microphoneUnavailable: "The microphone is unavailable. Continuing with text.",
+    pauseActions: "Pause page actions",
+    resumeActions: "Resume page actions",
+    captionsOn: "Hide live captions",
+    captionsOff: "Show live captions",
+    textOnly: "Switch to text only",
+    send: "Send",
+    messagePlaceholder: "Type a message",
+    requestHuman: "Request human support",
+    continueWithFullAssist: "Continue with Full Assist",
+    requestHumanFallback: "Request human support",
+    approve: "Approve",
+    decline: "Decline",
+    actionRequest: "Review this action before it continues.",
+    actionRunning: "Applying the approved action",
+    actionVerified: "Action completed and verified",
+    actionFailed: "The action could not be verified",
+    limitReached: "This session reached its configured limit.",
+    ended: "This AI Live Assist session has ended.",
+    idleEnded: "This session ended after no visitor activity.",
+    feedbackQuestion: "Did this resolve your issue?",
+    resolved: "Resolved",
+    partiallyResolved: "Partly resolved",
+    notResolved: "Not resolved",
+    submitFeedback: "Submit feedback",
+    error: "AI Live Assist is temporarily unavailable.",
+    retry: "Retry",
+    activeElsewhere: "AI Live Assist is active in another tab.",
+    visitorLimitReached: "The daily AI Live Assist limit has been reached for this visitor.",
+    visitorCooldown: "Please wait before starting another AI Live Assist session.",
+    visitorAlreadyActive: "An AI Live Assist session is already active for this visitor.",
+    safetyBoundary: "Payment details, passwords, and verification codes are always handled by you. You can pause actions or end this session at any time.",
+    privacyPolicy: "Privacy policy",
+    moreControls: "More controls",
+    emptyConversation: "Messages and live captions appear here.",
+    audioPaused: "Audio playback is paused. Select the panel to continue.",
+    humanConnected: "Connected to human support",
+    humanConnecting: "Connecting to human support",
+    humanUnavailable: "Human support is unavailable",
+    textMode: "Text-only mode",
+    reconnectFailed: "The secure session could not reconnect.",
+    connectedTool: "connected tool",
+    approvedService: "approved service",
+    approvedToolEffect: "This approved tool may change account data.",
+};

package/lib/placement.d.ts

@@ -0,0 +1,52 @@
+export type LauncherSide = 'bottom_right' | 'bottom_left';
+export type PlacementRect = {
+    left: number;
+    top: number;
+    right: number;
+    bottom: number;
+    width: number;
+    height: number;
+};
+export type PlacementViewport = PlacementRect & {
+    layoutWidth: number;
+    layoutHeight: number;
+};
+export type LauncherPlacement = {
+    side: LauncherSide;
+    inlineOffset: number;
+    blockOffset: number;
+    rect: PlacementRect;
+    displaced: boolean;
+};
+export declare const getDocumentDirection: () => "ltr" | "rtl";
+export declare const computeLauncherPlacement: (input: {
+    preferredSide: LauncherSide;
+    direction: "ltr" | "rtl";
+    viewport: PlacementViewport;
+    size: number;
+    inlineOffset: number;
+    blockOffset: number;
+    obstacles: PlacementRect[];
+    gap?: number;
+}) => LauncherPlacement;
+export declare const collectPlacementObstacles: (host: HTMLElement, viewport?: PlacementViewport) => PlacementRect[];
+export declare class LauncherPlacementController {
+    private readonly input;
+    private frame;
+    private scrollTimer;
+    private observer;
+    private destroyed;
+    constructor(input: {
+        host: HTMLElement;
+        preferredSide: LauncherSide;
+        inlineOffset: number;
+        blockOffset: number;
+        size: number;
+        isActive: () => boolean;
+    });
+    refresh(allowActive?: boolean): void;
+    destroy(): void;
+    private schedule;
+    private onResize;
+    private onScroll;
+}

package/lib/placement.js

@@ -0,0 +1,286 @@
+const DEFAULT_GAP = 12;
+const MAX_OBSTACLES = 64;
+export const getDocumentDirection = () => {
+    const declared = document.documentElement.dir.toLowerCase();
+    if (declared === 'rtl')
+        return 'rtl';
+    if (declared === 'ltr')
+        return 'ltr';
+    return getComputedStyle(document.documentElement).direction === 'rtl' ? 'rtl' : 'ltr';
+};
+const finite = (value, fallback = 0) => Number.isFinite(value) ? value : fallback;
+const rect = (left, top, width, height) => ({
+    left,
+    top,
+    right: left + width,
+    bottom: top + height,
+    width,
+    height,
+});
+const physicalRight = (side, direction) => direction === 'ltr' ? side === 'bottom_right' : side === 'bottom_left';
+const intersects = (first, second, gap = 0) => first.left < second.right + gap &&
+    first.right > second.left - gap &&
+    first.top < second.bottom + gap &&
+    first.bottom > second.top - gap;
+const overlapArea = (first, second) => Math.max(0, Math.min(first.right, second.right) - Math.max(first.left, second.left)) *
+    Math.max(0, Math.min(first.bottom, second.bottom) - Math.max(first.top, second.top));
+const normalizeObstacle = (value, viewport) => {
+    const left = Math.max(viewport.left, finite(value.left));
+    const top = Math.max(viewport.top, finite(value.top));
+    const right = Math.min(viewport.right, finite(value.right));
+    const bottom = Math.min(viewport.bottom, finite(value.bottom));
+    if (right - left < 2 || bottom - top < 2)
+        return null;
+    return rect(left, top, right - left, bottom - top);
+};
+const candidateForSide = (input) => {
+    const { side, preferredSide, direction, viewport, size, inlineOffset, blockOffset, gap, obstacles, } = input;
+    const anchorRight = physicalRight(side, direction);
+    const initialLeft = anchorRight
+        ? viewport.right - inlineOffset - size
+        : viewport.left + inlineOffset;
+    const initialTop = viewport.bottom - blockOffset - size;
+    let top = Math.max(viewport.top + gap, initialTop);
+    const horizontallyRelevant = obstacles
+        .filter((obstacle) => initialLeft < obstacle.right + gap && initialLeft + size > obstacle.left - gap)
+        .sort((first, second) => second.bottom - first.bottom);
+    for (let pass = 0; pass < horizontallyRelevant.length + 1; pass += 1) {
+        const current = rect(initialLeft, top, size, size);
+        const collision = horizontallyRelevant.find((obstacle) => intersects(current, obstacle, gap));
+        if (!collision)
+            break;
+        const nextTop = collision.top - gap - size;
+        if (nextTop >= viewport.top + gap) {
+            top = Math.min(top, nextTop);
+            continue;
+        }
+        break;
+    }
+    const candidateRect = rect(initialLeft, top, size, size);
+    const overlap = obstacles.reduce((total, obstacle) => total + overlapArea(candidateRect, obstacle), 0);
+    const displacement = Math.max(0, initialTop - top);
+    const alternateSidePenalty = side === preferredSide ? 0 : 20;
+    const score = overlap * 1000 + displacement + alternateSidePenalty;
+    const inline = anchorRight
+        ? viewport.layoutWidth - candidateRect.right
+        : candidateRect.left;
+    return {
+        side,
+        inlineOffset: Math.max(0, Math.round(inline)),
+        blockOffset: Math.max(0, Math.round(viewport.layoutHeight - candidateRect.bottom)),
+        rect: candidateRect,
+        displaced: displacement > 0 || side !== preferredSide,
+        score,
+    };
+};
+export const computeLauncherPlacement = (input) => {
+    const gap = Math.max(4, finite(input.gap ?? DEFAULT_GAP, DEFAULT_GAP));
+    const size = Math.max(44, finite(input.size, 52));
+    const inlineOffset = Math.max(gap, finite(input.inlineOffset, 20));
+    const blockOffset = Math.max(gap, finite(input.blockOffset, 20));
+    const obstacles = input.obstacles
+        .map((value) => normalizeObstacle(value, input.viewport))
+        .filter((value) => value !== null)
+        .slice(0, MAX_OBSTACLES);
+    const alternateSide = input.preferredSide === 'bottom_right' ? 'bottom_left' : 'bottom_right';
+    const candidates = [input.preferredSide, alternateSide].map((side) => candidateForSide({
+        side,
+        preferredSide: input.preferredSide,
+        direction: input.direction,
+        viewport: input.viewport,
+        size,
+        inlineOffset,
+        blockOffset,
+        gap,
+        obstacles,
+    }));
+    const selected = candidates.sort((first, second) => first.score - second.score)[0];
+    if (!selected) {
+        return {
+            side: input.preferredSide,
+            inlineOffset,
+            blockOffset,
+            rect: rect(0, 0, size, size),
+            displaced: false,
+        };
+    }
+    return {
+        side: selected.side,
+        inlineOffset: selected.inlineOffset,
+        blockOffset: selected.blockOffset,
+        rect: selected.rect,
+        displaced: selected.displaced,
+    };
+};
+const currentViewport = () => {
+    const visual = window.visualViewport;
+    const left = visual?.offsetLeft ?? 0;
+    const top = visual?.offsetTop ?? 0;
+    const width = visual?.width ?? window.innerWidth;
+    const height = visual?.height ?? window.innerHeight;
+    return {
+        ...rect(left, top, width, height),
+        layoutWidth: window.innerWidth,
+        layoutHeight: window.innerHeight,
+    };
+};
+const visibleElementRect = (element, host, viewport) => {
+    if (!(element instanceof HTMLElement) || element === host || host.contains(element)) {
+        return null;
+    }
+    const style = getComputedStyle(element);
+    const role = element.getAttribute('role');
+    const explicit = element.hasAttribute('data-oxvo-ai-obstacle');
+    const dialog = role === 'dialog' ||
+        role === 'alertdialog' ||
+        element.getAttribute('aria-modal') === 'true' ||
+        (typeof HTMLDialogElement !== 'undefined' &&
+            element instanceof HTMLDialogElement &&
+            element.open);
+    const stickyAtEdge = style.position === 'sticky' &&
+        (element.getBoundingClientRect().top <= viewport.top + 2 ||
+            element.getBoundingClientRect().bottom >= viewport.bottom - 2);
+    if (style.position !== 'fixed' && !stickyAtEdge && !dialog && !explicit) {
+        return null;
+    }
+    if (style.display === 'none' ||
+        style.visibility === 'hidden' ||
+        Number.parseFloat(style.opacity || '1') <= 0 ||
+        element.getAttribute('aria-hidden') === 'true') {
+        return null;
+    }
+    const bounds = element.getBoundingClientRect();
+    if (!dialog &&
+        !explicit &&
+        (style.pointerEvents === 'none' ||
+            bounds.width * bounds.height > viewport.width * viewport.height * 0.85)) {
+        return null;
+    }
+    return normalizeObstacle(rect(bounds.left, bounds.top, bounds.width, bounds.height), viewport);
+};
+export const collectPlacementObstacles = (host, viewport = currentViewport()) => {
+    const elements = new Set();
+    for (const child of Array.from(document.body?.children ?? []))
+        elements.add(child);
+    for (const candidate of Array.from(document.querySelectorAll('iframe,dialog,[role="dialog"],[role="alertdialog"],[aria-modal="true"],[data-oxvo-ai-obstacle]')).slice(0, MAX_OBSTACLES)) {
+        elements.add(candidate);
+        let parent = candidate.parentElement;
+        for (let depth = 0; parent && depth < 4; depth += 1, parent = parent.parentElement) {
+            elements.add(parent);
+        }
+    }
+    const sampleXs = [
+        viewport.left + 20,
+        viewport.left + 76,
+        viewport.right - 76,
+        viewport.right - 20,
+    ];
+    const sampleYs = [
+        viewport.bottom - 20,
+        viewport.bottom - 82,
+        viewport.bottom - 164,
+    ];
+    const elementsFromPoint = document.elementsFromPoint?.bind(document);
+    if (elementsFromPoint) {
+        for (const x of sampleXs) {
+            for (const y of sampleYs) {
+                for (const candidate of elementsFromPoint(x, y).slice(0, 8)) {
+                    elements.add(candidate);
+                    let parent = candidate.parentElement;
+                    for (let depth = 0; parent && depth < 4; depth += 1, parent = parent.parentElement) {
+                        elements.add(parent);
+                    }
+                }
+            }
+        }
+    }
+    const obstacles = [];
+    for (const element of elements) {
+        const value = visibleElementRect(element, host, viewport);
+        if (value)
+            obstacles.push(value);
+        if (obstacles.length >= MAX_OBSTACLES)
+            break;
+    }
+    return obstacles;
+};
+export class LauncherPlacementController {
+    constructor(input) {
+        this.input = input;
+        this.frame = null;
+        this.scrollTimer = null;
+        this.observer = null;
+        this.destroyed = false;
+        this.onResize = () => this.schedule(true);
+        this.onScroll = () => {
+            if (this.scrollTimer)
+                clearTimeout(this.scrollTimer);
+            this.scrollTimer = setTimeout(() => {
+                this.scrollTimer = null;
+                this.schedule(false);
+            }, 120);
+        };
+        window.addEventListener('resize', this.onResize, { passive: true });
+        window.addEventListener('orientationchange', this.onResize, { passive: true });
+        window.addEventListener('scroll', this.onScroll, { passive: true });
+        window.visualViewport?.addEventListener('resize', this.onResize, { passive: true });
+        window.visualViewport?.addEventListener('scroll', this.onResize, { passive: true });
+        this.observer = new MutationObserver(() => this.schedule(false));
+        this.observer.observe(document.documentElement, {
+            attributes: true,
+            attributeFilter: ['dir'],
+        });
+        if (document.body) {
+            this.observer.observe(document.body, { childList: true, subtree: true });
+        }
+        this.schedule(true);
+    }
+    refresh(allowActive = false) {
+        if (this.destroyed || (this.input.isActive() && !allowActive))
+            return;
+        const viewport = currentViewport();
+        const direction = getDocumentDirection();
+        this.input.host.setAttribute('dir', direction);
+        this.input.host.style.setProperty('--voice-viewport-left', `${viewport.left}px`);
+        this.input.host.style.setProperty('--voice-viewport-top', `${viewport.top}px`);
+        this.input.host.style.setProperty('--voice-viewport-width', `${viewport.width}px`);
+        this.input.host.style.setProperty('--voice-viewport-height', `${viewport.height}px`);
+        const placement = computeLauncherPlacement({
+            preferredSide: this.input.preferredSide,
+            direction,
+            viewport,
+            size: this.input.size,
+            inlineOffset: this.input.inlineOffset,
+            blockOffset: this.input.blockOffset,
+            obstacles: collectPlacementObstacles(this.input.host, viewport),
+        });
+        this.input.host.dataset.position = placement.side;
+        this.input.host.dataset.placement = placement.displaced ? 'adjusted' : 'preferred';
+        this.input.host.style.setProperty('--voice-inline-offset', `${placement.inlineOffset}px`);
+        this.input.host.style.setProperty('--voice-block-offset', `${placement.blockOffset}px`);
+    }
+    destroy() {
+        if (this.destroyed)
+            return;
+        this.destroyed = true;
+        if (this.frame !== null)
+            cancelAnimationFrame(this.frame);
+        if (this.scrollTimer)
+            clearTimeout(this.scrollTimer);
+        this.observer?.disconnect();
+        window.removeEventListener('resize', this.onResize);
+        window.removeEventListener('orientationchange', this.onResize);
+        window.removeEventListener('scroll', this.onScroll);
+        window.visualViewport?.removeEventListener('resize', this.onResize);
+        window.visualViewport?.removeEventListener('scroll', this.onResize);
+    }
+    schedule(allowActive) {
+        if (this.destroyed || (this.input.isActive() && !allowActive) || this.frame !== null) {
+            return;
+        }
+        this.frame = requestAnimationFrame(() => {
+            this.frame = null;
+            this.refresh(allowActive);
+        });
+    }
+}

package/lib/presentation.d.ts

@@ -0,0 +1,41 @@
+import type { PresentationIntent, PresentationResult, PresentationTarget } from './types.js';
+type PresentationCallbacks = {
+    resolveTarget: (targetId: string, revision: number) => PresentationTarget | null;
+    currentPage: () => {
+        pageId: string;
+        revision: number;
+    };
+    onResult: (result: PresentationResult) => void;
+    onVisibility: (pageId: string, revision: number, presentationIds: string[]) => void;
+    launcherRect?: () => DOMRectReadOnly | null;
+    obstacleRects?: () => DOMRectReadOnly[];
+    spatialTrail?: boolean;
+    kindEnabled?: (kind: PresentationIntent['kind']) => boolean;
+};
+export declare const parsePresentationIntent: (input: Record<string, unknown>) => PresentationIntent | null;
+export declare class PresentationPlane {
+    private readonly maxActiveCues;
+    private readonly reducedMotion;
+    private readonly callbacks;
+    private readonly host;
+    private readonly svg;
+    private readonly cues;
+    private raf;
+    private suspendedUntil;
+    private resumeTimer;
+    private destroyed;
+    constructor(accent: string, maxActiveCues: number, reducedMotion: boolean, callbacks: PresentationCallbacks);
+    render(intent: PresentationIntent): PresentationResult;
+    clear(reason: 'all' | 'group' | 'navigation', groupId?: string | null): void;
+    destroy(): void;
+    private draw;
+    private drawSpatialTrail;
+    private calloutPlacement;
+    private result;
+    private remove;
+    private emitVisibility;
+    private scheduleFrame;
+    private onVisitorActivity;
+    private onVisibilityChange;
+}
+export {};