@eclipse-lyra/core 0.0.0

package/src/core/taskservice.ts

@@ -0,0 +1,72 @@
+import {activeTasksSignal} from "./appstate";
+import {rootContext} from "./di";
+
+export interface ProgressMonitor {
+    name: string
+    message: string
+    currentStep: number
+    totalSteps: number
+    progress: number  // Manual progress percentage (0-100), overrides step-based calculation if >= 0
+}
+
+export type Task = (progressMonitor: ProgressMonitor) => any
+export type AsyncTask = (progressMonitor: ProgressMonitor) => Promise<any>
+
+export class TaskService {
+    private tasks: ProgressMonitor[] = []
+    private updateCounter = 0
+
+    private notifyUpdate() {
+        // Always increment counter to ensure signal value changes and triggers re-render
+        this.updateCounter++
+        activeTasksSignal.set(this.updateCounter)
+    }
+
+    public run(name: string, task: Task) {
+        const progressMonitor = this.createProgressMonitor(name)
+        try {
+            this.tasks.push(progressMonitor)
+            this.notifyUpdate()
+            task(progressMonitor)
+        } finally {
+            this.tasks.splice(this.tasks.indexOf(progressMonitor), 1)
+            this.notifyUpdate()
+        }
+    }
+
+    public async runAsync(name: string, task: AsyncTask) {
+        const progressMonitor = this.createProgressMonitor(name)
+        this.tasks.push(progressMonitor)
+        this.notifyUpdate()
+        return task(progressMonitor).finally(() => {
+            this.tasks.splice(this.tasks.indexOf(progressMonitor), 1)
+            this.notifyUpdate()
+        })
+    }
+
+    private createProgressMonitor(name: string): ProgressMonitor {
+        const monitor = {
+            name: name,
+            message: "",
+            currentStep: 0,
+            totalSteps: -1,  // -1 indicates indefinite progress
+            progress: -1  // -1 means use step-based calculation
+        } as ProgressMonitor
+        
+        // Create a proxy to detect property changes and trigger UI updates
+        return new Proxy(monitor, {
+            set: (target, prop, value) => {
+                (target as any)[prop] = value
+                this.notifyUpdate()
+                return true
+            }
+        })
+    }
+
+    getActiveTasks() {
+        return this.tasks
+    }
+}
+
+export const taskService = new TaskService()
+rootContext.put("taskService", taskService)

package/src/core/toast.ts

@@ -0,0 +1,21 @@
+import Toastify from 'toastify-js';
+import 'toastify-js/src/toastify.css';
+
+const DURATION = 4000;
+const BASE = { duration: DURATION, gravity: 'bottom' as const, position: 'right' as const, close: true };
+
+const show = (msg: string, style: { background: string; color: string }) => {
+  Toastify({ ...BASE, text: msg, style }).showToast();
+};
+
+export const toastInfo = (msg: string) => {
+  show(msg, { background: 'var(--wa-color-brand-50)', color: 'var(--wa-color-brand-on)' });
+};
+
+export const toastError = (msg: string) => {
+  show(msg, { background: 'var(--wa-color-danger-50)', color: 'var(--wa-color-danger-on)' });
+};
+
+export const toastWarning = (msg: string) => {
+  show(msg, { background: 'var(--wa-color-warning-50)', color: 'var(--wa-color-warning-on)' });
+};

package/src/core/tree-utils.ts

@@ -0,0 +1,24 @@
+import {Contribution} from "./contributionregistry";
+
+export interface TreeNode {
+    data: any;
+    label: string;
+    icon?: string;
+    leaf: boolean;
+    children: TreeNode[];
+}
+
+export const treeNodeComparator = (c1: TreeNode, c2: TreeNode) => {
+    if (!c1.leaf && c2.leaf) {
+        return -1
+    }
+    if (c1.leaf && !c2.leaf) {
+        return 1
+    }
+    return c1.label.localeCompare(c2.label)
+}
+
+export interface TreeContribution extends Contribution {
+    contributionId?: string;
+    state?: { [key: string]: any }
+}

package/src/dialogs/confirm-dialog.ts

@@ -0,0 +1,72 @@
+import { html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { LyraDialogContent } from "../parts/dialog-content";
+import { contributionRegistry } from "../core/contributionregistry";
+import { DIALOG_CONTRIBUTION_TARGET, OK_BUTTON, CANCEL_BUTTON, DialogContribution, dialogService } from "../core/dialogservice";
+
+@customElement('lyra-confirm-dialog-content')
+export class LyraConfirmDialogContent extends LyraDialogContent {
+    @property({ type: String })
+    message: string = '';
+
+    @property({ type: Boolean })
+    markdown: boolean = false;
+
+    getResult(): boolean {
+        return false;
+    }
+
+    render() {
+        return html`
+            ${this.renderMessage(this.message, this.markdown)}
+        `;
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'lyra-confirm-dialog-content': LyraConfirmDialogContent;
+    }
+}
+
+contributionRegistry.registerContribution(DIALOG_CONTRIBUTION_TARGET, {
+    id: 'confirm',
+    label: 'Confirm',
+    buttons: [OK_BUTTON, CANCEL_BUTTON],
+    component: (state?: any) => {
+        if (!state) {
+            return html`<div>Error: No confirm dialog state</div>`;
+        }
+        
+        return html`
+            <lyra-confirm-dialog-content 
+                .message="${state.message}"
+                .markdown="${state.markdown}"
+            ></lyra-confirm-dialog-content>
+        `;
+    },
+    onButton: async (id: string, result: any, state?: any) => {
+        if (!state) {
+            return true;
+        }
+        
+        if (id === 'ok') {
+            state.resolve(true);
+        } else {
+            state.resolve(false);
+        }
+        
+        return true;
+    }
+});
+
+export async function confirmDialog(message: string, markdown: boolean = false): Promise<boolean> {
+    return new Promise((resolve) => {
+        dialogService.open('confirm', {
+            message,
+            markdown,
+            resolve
+        });
+    });
+}
+

package/src/dialogs/index.ts

@@ -0,0 +1,4 @@
+export { promptDialog } from './prompt-dialog';
+export { infoDialog } from './info-dialog';
+export { confirmDialog } from './confirm-dialog';
+export { navigableInfoDialog, type NavigableDialogAction } from './navigable-info-dialog';

package/src/dialogs/info-dialog.ts

@@ -0,0 +1,67 @@
+import { html } from "lit";
+import { customElement, property } from "lit/decorators.js";
+import { LyraDialogContent } from "../parts/dialog-content";
+import { contributionRegistry } from "../core/contributionregistry";
+import { DIALOG_CONTRIBUTION_TARGET, OK_BUTTON, DialogContribution, dialogService } from "../core/dialogservice";
+
+@customElement('lyra-info-dialog-content')
+export class LyraInfoDialogContent extends LyraDialogContent {
+    @property({ type: String })
+    message: string = '';
+
+    @property({ type: Boolean })
+    markdown: boolean = false;
+
+    render() {
+        return html`
+            ${this.renderMessage(this.message, this.markdown)}
+        `;
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'lyra-info-dialog-content': LyraInfoDialogContent;
+    }
+}
+
+contributionRegistry.registerContribution(DIALOG_CONTRIBUTION_TARGET, {
+    id: 'info',
+    label: 'Information',
+    buttons: [OK_BUTTON],
+    component: (state?: any) => {
+        if (!state) {
+            return html`<div>Error: No info dialog state</div>`;
+        }
+        
+        return html`
+            <lyra-info-dialog-content 
+                .message="${state.message}"
+                .markdown="${state.markdown}"
+            ></lyra-info-dialog-content>
+        `;
+    },
+    onButton: async (id: string, result: any, state?: any) => {
+        if (!state) {
+            return true;
+        }
+        
+        if (state.resolve) {
+            state.resolve();
+        }
+        
+        return true;
+    }
+});
+
+export async function infoDialog(title: string, message: string, markdown: boolean = false): Promise<void> {
+    return new Promise((resolve) => {
+        dialogService.open('info', {
+            title,
+            message,
+            markdown,
+            resolve
+        });
+    });
+}
+

package/src/dialogs/navigable-info-dialog.ts

@@ -0,0 +1,256 @@
+import { html, css, PropertyValues } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { LyraDialogContent } from "../parts/dialog-content";
+import { contributionRegistry } from "../core/contributionregistry";
+import { DIALOG_CONTRIBUTION_TARGET, CLOSE_BUTTON, DialogContribution, dialogService } from "../core/dialogservice";
+
+export interface NavigableDialogAction {
+    label: string;
+    variant?: 'default' | 'primary' | 'success' | 'neutral' | 'warning' | 'danger';
+    disabled?: boolean;
+    callback: () => void;
+}
+
+@customElement('lyra-navigable-info-dialog-content')
+export class LyraNavigableInfoDialogContent extends LyraDialogContent {
+    @property({ type: String })
+    title: string = '';
+
+    @property({ type: String })
+    message: string = '';
+
+    @property({ type: Boolean })
+    markdown: boolean = false;
+
+    @state()
+    actions: NavigableDialogAction[] = [];
+
+    @state()
+    private currentTitle: string = '';
+
+    @state()
+    private currentMessage: string = '';
+
+    resolveCallback?: () => void;
+    private dialogElement: HTMLElement | null = null;
+
+    async firstUpdated(changedProperties: PropertyValues) {
+        super.firstUpdated(changedProperties);
+        this.currentTitle = this.title;
+        this.currentMessage = this.message;
+        
+        await this.updateComplete;
+        const dialog = this.closest('wa-dialog');
+        if (dialog) {
+            this.dialogElement = dialog as HTMLElement;
+            this.updateDialogLabel();
+        }
+        
+        const contentContainer = this.closest('.dialog-service-content');
+        if (contentContainer) {
+            const footer = contentContainer.parentElement?.querySelector('.dialog-service-footer');
+            if (footer) {
+                (footer as HTMLElement).style.display = 'none';
+            }
+        }
+    }
+
+    updated(changedProperties: PropertyValues) {
+        super.updated(changedProperties);
+        if (changedProperties.has('title')) {
+            this.currentTitle = this.title;
+            this.updateDialogLabel();
+        }
+        if (changedProperties.has('message')) {
+            this.currentMessage = this.message;
+        }
+    }
+
+    private updateDialogLabel() {
+        if (this.dialogElement) {
+            this.dialogElement.setAttribute('label', this.currentTitle);
+        }
+    }
+
+    updateDialog(newTitle: string, newMessage: string, newActions: NavigableDialogAction[]) {
+        this.currentTitle = newTitle;
+        this.currentMessage = newMessage;
+        this.actions = [...newActions];
+        this.updateDialogLabel();
+        this.requestUpdate();
+    }
+
+    private handleActionClick(action: NavigableDialogAction) {
+        action.callback();
+    }
+
+    private handleClose() {
+        const dialog = this.closest('wa-dialog');
+        if (dialog && this.resolveCallback) {
+            this.resolveCallback();
+        }
+    }
+
+    static styles = [
+        ...LyraDialogContent.styles,
+        css`
+            :host {
+                display: block;
+            }
+
+            :host-context(.dialog-service-content) {
+                padding: 0;
+            }
+            
+            .dialog-content {
+                display: flex;
+                flex-direction: column;
+                gap: 1rem;
+                min-width: 400px;
+                max-width: 600px;
+                height: 500px;
+                padding: 1rem;
+            }
+            
+            .dialog-scroller {
+                flex: 1;
+                overflow-y: auto;
+            }
+            
+            .dialog-actions {
+                display: flex;
+                gap: 0.5rem;
+                justify-content: space-between;
+                margin-top: 0.5rem;
+            }
+            
+            .dialog-actions-left,
+            .dialog-actions-right {
+                display: flex;
+                gap: 0.5rem;
+            }
+        `
+    ];
+
+    render() {
+        const leftActions = this.actions.filter(a => a.label !== 'Close');
+        const rightActions = this.actions.filter(a => a.label === 'Close');
+
+        return html`
+            <div class="dialog-content">
+                <wa-scroller class="dialog-scroller">
+                    ${this.renderMessage(this.currentMessage, this.markdown)}
+                </wa-scroller>
+                
+                <div class="dialog-actions">
+                    <div class="dialog-actions-left">
+                        ${leftActions.map(action => html`
+                            <wa-button 
+                                variant="${action.variant || 'default'}"
+                                ?disabled=${action.disabled}
+                                @click=${() => this.handleActionClick(action)}
+                            >
+                                ${action.label}
+                            </wa-button>
+                        `)}
+                    </div>
+                    <div class="dialog-actions-right">
+                        ${rightActions.map(action => html`
+                            <wa-button 
+                                variant="${action.variant || 'primary'}"
+                                @click=${() => {
+                                    this.handleActionClick(action);
+                                    this.handleClose();
+                                }}
+                            >
+                                ${action.label}
+                            </wa-button>
+                        `)}
+                    </div>
+                </div>
+            </div>
+        `;
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'lyra-navigable-info-dialog-content': LyraNavigableInfoDialogContent;
+    }
+}
+
+contributionRegistry.registerContribution(DIALOG_CONTRIBUTION_TARGET, {
+    id: 'navigable-info',
+    label: 'Information',
+    buttons: [CLOSE_BUTTON],
+    component: (state?: any) => {
+        if (!state) {
+            return html`<div>Error: No navigable info dialog state</div>`;
+        }
+        
+        const componentHtml = html`
+            <lyra-navigable-info-dialog-content 
+                .title="${state.title}"
+                .message="${state.message}"
+                .markdown="${state.markdown}"
+            ></lyra-navigable-info-dialog-content>
+        `;
+        
+        (async () => {
+            const element = document.querySelector('lyra-navigable-info-dialog-content') as LyraNavigableInfoDialogContent;
+            if (element) {
+                await element.updateComplete;
+                element.actions = state.actions || [];
+                element.resolveCallback = state.resolve;
+                if (state.updateDialogRef) {
+                    state.updateDialogRef.current = (newTitle: string, newMessage: string, newActions: NavigableDialogAction[]) => {
+                        element.updateDialog(newTitle, newMessage, newActions);
+                    };
+                }
+            }
+        })();
+        
+        return componentHtml;
+    },
+    onButton: async (id: string, result: any, state?: any) => {
+        if (!state) {
+            return false;
+        }
+        
+        if (id === 'close' && state.resolve) {
+            state.resolve();
+            return true;
+        }
+        
+        return false;
+    }
+});
+
+export async function navigableInfoDialog(
+    title: string,
+    message: string,
+    actions: NavigableDialogAction[],
+    markdown: boolean = false
+): Promise<void> {
+    return new Promise((resolve) => {
+        const updateDialogRef: { current?: (title: string, message: string, actions: NavigableDialogAction[]) => void } = {};
+        
+        dialogService.open('navigable-info', {
+            title,
+            message,
+            actions,
+            markdown,
+            resolve,
+            updateDialogRef
+        });
+
+        const updateDialog = (newTitle: string, newMessage: string, newActions: NavigableDialogAction[]) => {
+            if (updateDialogRef.current) {
+                updateDialogRef.current(newTitle, newMessage, newActions);
+            }
+        };
+
+        (actions as any).updateDialog = updateDialog;
+    });
+}
+

package/src/dialogs/prompt-dialog.ts

@@ -0,0 +1,123 @@
+import { html, css, PropertyValues } from "lit";
+import { customElement, state, property } from "lit/decorators.js";
+import { LyraDialogContent } from "../parts/dialog-content";
+import { contributionRegistry } from "../core/contributionregistry";
+import { DIALOG_CONTRIBUTION_TARGET, OK_BUTTON, CANCEL_BUTTON, DialogContribution, dialogService } from "../core/dialogservice";
+
+@customElement('lyra-prompt-dialog-content')
+export class LyraPromptDialogContent extends LyraDialogContent {
+    @property({ type: String })
+    message: string = '';
+
+    @property({ type: String, attribute: 'default-value' })
+    defaultValue: string = '';
+
+    @property({ type: Boolean })
+    markdown: boolean = false;
+
+    @state()
+    private inputValue: string = '';
+
+    static styles = [
+        ...LyraDialogContent.styles,
+        css`
+            wa-input {
+                width: 100%;
+            }
+        `
+    ];
+
+    async firstUpdated(changedProperties: PropertyValues) {
+        super.firstUpdated(changedProperties);
+        this.inputValue = this.defaultValue;
+
+        await this.updateComplete;
+        const input = this.shadowRoot?.querySelector('wa-input');
+        if (input) {
+            const inputEl = (input as any).shadowRoot?.querySelector('input');
+            if (inputEl) {
+                inputEl.focus();
+                inputEl.select();
+            }
+        }
+    }
+
+    getResult(): string | null {
+        return this.inputValue;
+    }
+
+    private handleInput(e: Event) {
+        this.inputValue = (e.target as any).value;
+    }
+
+    private handleKeyDown(e: KeyboardEvent) {
+        if (e.key === 'Enter') {
+            e.preventDefault();
+            this.dispatchEvent(new CustomEvent('dialog-ok', { bubbles: true, composed: true }));
+        } else if (e.key === 'Escape') {
+            e.preventDefault();
+            this.dispatchEvent(new CustomEvent('dialog-cancel', { bubbles: true, composed: true }));
+        }
+    }
+
+    render() {
+        return html`
+            ${this.renderMessage(this.message, this.markdown)}
+            <wa-input
+                value="${this.inputValue}"
+                @input=${this.handleInput}
+                @keydown=${this.handleKeyDown}
+                autofocus
+            ></wa-input>
+        `;
+    }
+}
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'lyra-prompt-dialog-content': LyraPromptDialogContent;
+    }
+}
+
+contributionRegistry.registerContribution(DIALOG_CONTRIBUTION_TARGET, {
+    id: 'prompt',
+    label: 'Input',
+    buttons: [OK_BUTTON, CANCEL_BUTTON],
+    component: (state?: any) => {
+        if (!state) {
+            return html`<div>Error: No prompt dialog state</div>`;
+        }
+        
+        return html`
+            <lyra-prompt-dialog-content 
+                .message="${state.message}"
+                .defaultValue="${state.defaultValue}"
+                .markdown="${state.markdown}"
+            ></lyra-prompt-dialog-content>
+        `;
+    },
+    onButton: async (id: string, result: any, state?: any) => {
+        if (!state) {
+            return true;
+        }
+        
+        if (id === 'ok') {
+            state.resolve(result || '');
+        } else {
+            state.resolve(null);
+        }
+        
+        return true;
+    }
+});
+
+export async function promptDialog(message: string, defaultValue: string = '', markdown: boolean = false): Promise<string | null> {
+    return new Promise((resolve) => {
+        dialogService.open('prompt', {
+            message,
+            defaultValue,
+            markdown,
+            resolve
+        });
+    });
+}

package/src/externals/lit.ts

@@ -0,0 +1,36 @@
+/**
+ * Lit library exports
+ * Centralized Lit imports for use across packages.
+ * This ensures a single source of truth for Lit dependencies.
+ */
+
+// Re-export everything from lit core
+export * from "lit";
+
+// Re-export decorators
+export * from "lit/decorators.js";
+
+// Re-export commonly used directives
+export * from "lit/directives/when.js";
+export * from "lit/directives/repeat.js";
+export * from "lit/directives/keyed.js";
+export * from "lit/directives/class-map.js";
+export * from "lit/directives/style-map.js";
+export * from "lit/directives/if-defined.js";
+export * from "lit/directives/guard.js";
+export * from "lit/directives/cache.js";
+export * from "lit/directives/unsafe-html.js";
+export * from "lit/directives/until.js";
+export * from "lit/directives/live.js";
+export * from "lit/directives/ref.js";
+
+// Re-export only signal APIs to avoid conflict with lit's html/svg
+export {
+    signal,
+    computed,
+    Signal,
+    watch,
+    SignalWatcher,
+    withWatch,
+} from "@lit-labs/signals";
+

package/src/externals/third-party.ts

@@ -0,0 +1,10 @@
+/**
+ * Third-party library re-exports
+ * Centralized re-exports for commonly used third-party libraries.
+ * This ensures a single source of truth for these dependencies.
+ */
+
+export function v4(): string {
+  return crypto.randomUUID();
+}
+