@difizen/libro-common 0.3.4 → 1.0.0

package/src/core/application/mock-window-service.ts

@@ -0,0 +1,17 @@
+import { Event } from '../../common/index.js';
+import { singleton } from '../../ioc/index.js';
+
+import type { WindowService } from './application-protocol';
+
+@singleton()
+export class MockWindowService implements WindowService {
+  openNewWindow(): undefined {
+    return undefined;
+  }
+  canUnload(): boolean {
+    return true;
+  }
+  get onUnload(): Event<void> {
+    return Event.None;
+  }
+}

package/src/core/browser.ts

@@ -0,0 +1,144 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+/**
+ * Resolves after the next animation frame if no parameter is given,
+ * or after the given number of animation frames.
+ */
+export function animationFrame(n = 1): Promise<void> {
+  return new Promise((resolve) => {
+    function frameFunc(): void {
+      if (n <= 0) {
+        resolve();
+      } else {
+        n -= 1;
+        requestAnimationFrame(frameFunc);
+      }
+    }
+    frameFunc();
+  });
+}
+
+/**
+ * Parse a magnitude value (e.g. width, height, left, top) from a CSS attribute value.
+ * Returns the given default value (or undefined) if the value cannot be determined,
+ * e.g. because it is a relative value like `50%` or `auto`.
+ */
+export function parseCssMagnitude(value: string | null, defaultValue: number): number;
+export function parseCssMagnitude(
+  value: string | null,
+  defaultValue?: number,
+): number | undefined {
+  if (value) {
+    let parsed: number;
+    if (value.endsWith('px')) {
+      parsed = parseFloat(value.substring(0, value.length - 2));
+    } else {
+      parsed = parseFloat(value);
+    }
+    if (!Number.isNaN(parsed)) {
+      return parsed;
+    }
+  }
+  return defaultValue;
+}
+
+/**
+ * Parse the number of milliseconds from a CSS time value.
+ * Returns the given default value (or undefined) if the value cannot be determined.
+ */
+export function parseCssTime(time: string | null, defaultValue: number): number;
+export function parseCssTime(
+  time: string | null,
+  defaultValue?: number,
+): number | undefined {
+  if (time) {
+    let parsed: number;
+    if (time.endsWith('ms')) {
+      parsed = parseFloat(time.substring(0, time.length - 2));
+    } else if (time.endsWith('s')) {
+      parsed = parseFloat(time.substring(0, time.length - 1)) * 1000;
+    } else {
+      parsed = parseFloat(time);
+    }
+    if (!Number.isNaN(parsed)) {
+      return parsed;
+    }
+  }
+  return defaultValue;
+}
+
+type ElementScroll = {
+  left: number;
+  top: number;
+  maxLeft: number;
+  maxTop: number;
+};
+
+function getMonacoEditorScroll(elem: HTMLElement): ElementScroll | undefined {
+  const linesContent = elem.querySelector('.lines-content') as HTMLElement;
+  const viewLines = elem.querySelector('.view-lines') as HTMLElement;
+  if (linesContent === null || viewLines === null) {
+    return undefined;
+  }
+  const linesContentStyle = linesContent.style;
+  const elemStyle = elem.style;
+  const viewLinesStyle = viewLines.style;
+  return {
+    left: -parseCssMagnitude(linesContentStyle.left, 0),
+    top: -parseCssMagnitude(linesContentStyle.top, 0),
+    maxLeft:
+      parseCssMagnitude(viewLinesStyle.width, 0) -
+      parseCssMagnitude(elemStyle.width, 0),
+    maxTop:
+      parseCssMagnitude(viewLinesStyle.height, 0) -
+      parseCssMagnitude(elemStyle.height, 0),
+  };
+}
+
+/**
+ * Prevent browser back/forward navigation of a mouse wheel event.
+ */
+export function preventNavigation(event: WheelEvent): void {
+  const { currentTarget, deltaX, deltaY } = event;
+  const absDeltaX = Math.abs(deltaX);
+  const absDeltaY = Math.abs(deltaY);
+  let elem = event.target as Element | null;
+
+  while (elem && elem !== currentTarget) {
+    let scroll: ElementScroll | undefined;
+    if (elem.classList.contains('monaco-scrollable-element')) {
+      scroll = getMonacoEditorScroll(elem as HTMLElement);
+    } else {
+      scroll = {
+        left: elem.scrollLeft,
+        top: elem.scrollTop,
+        maxLeft: elem.scrollWidth - elem.clientWidth,
+        maxTop: elem.scrollHeight - elem.clientHeight,
+      };
+    }
+    if (scroll) {
+      const scrollH =
+        scroll.maxLeft > 0 &&
+        ((deltaX < 0 && scroll.left > 0) ||
+          (deltaX > 0 && scroll.left < scroll.maxLeft));
+      const scrollV =
+        scroll.maxTop > 0 &&
+        ((deltaY < 0 && scroll.top > 0) || (deltaY > 0 && scroll.top < scroll.maxTop));
+      if (
+        (scrollH && scrollV) ||
+        (scrollH && absDeltaX > absDeltaY) ||
+        (scrollV && absDeltaY > absDeltaX)
+      ) {
+        // The event is consumed by the scrollable child element
+        return;
+      }
+    }
+    elem = elem.parentElement;
+  }
+
+  event.preventDefault();
+  event.stopPropagation();
+}

package/src/core/command/command-protocol.ts

@@ -0,0 +1,152 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import type { Event, WaitUntilEvent } from '../../common/index.js';
+import type React from 'react';
+
+/**
+ * A command is a unique identifier of a function
+ * which can be executed by a user via a keyboard shortcut,
+ * a menu action or directly.
+ */
+export type Command = {
+  /**
+   * A unique identifier of this command.
+   */
+  id: string;
+  /**
+   * A label of this command.
+   */
+  label?: string;
+  /**
+   * An icon class of this command.
+   */
+  icon?: React.ReactNode | React.FC;
+  /**
+   * A category of this command.
+   */
+  category?: string;
+};
+
+export namespace Command {
+  /* Determine whether object is a Command */
+  export function is(arg: Command | any): arg is Command {
+    return !!arg && arg === Object(arg) && 'id' in arg;
+  }
+
+  /** Comparator function for when sorting commands */
+  export function compareCommands(a: Command, b: Command): number {
+    if (a.label && b.label) {
+      const aCommand = (
+        a.category ? `${a.category}: ${a.label}` : a.label
+      ).toLowerCase();
+      const bCommand = (
+        b.category ? `${b.category}: ${b.label}` : b.label
+      ).toLowerCase();
+      return aCommand.localeCompare(bCommand);
+    }
+    return 0;
+  }
+
+  /**
+   * Determine if two commands are equal.
+   *
+   * @param a the first command for comparison.
+   * @param b the second command for comparison.
+   */
+  export function equals(a: Command, b: Command): boolean {
+    return a.id === b.id && a.label === b.label && a.category === b.category;
+  }
+}
+export type ExecuteHandler = {
+  execute?: ((...args: any[]) => any) | undefined;
+};
+export type EnabledHandler = {
+  /**
+   * Test whether this handler is enabled (active).
+   */
+  isEnabled?: ((...args: any[]) => boolean) | undefined;
+};
+
+export type VisibleHandler = {
+  /**
+   * Test whether menu items for this handler should be visible.
+   */
+  isVisible?: ((...args: any[]) => boolean) | undefined;
+};
+
+export type ActiveHandler = {
+  /**
+   * Test whether menu items for this handler should be active.
+   */
+  isActive?: ((...args: any[]) => boolean) | undefined;
+};
+/**
+ * A command handler is an implementation of a command.
+ *
+ * A command can have multiple handlers
+ * but they should be active in different contexts,
+ * otherwise first active will be executed.
+ */
+export type CommandHandler = {
+  /**
+   * Execute this handler.
+   */
+  execute: (...args: any[]) => any;
+} & EnabledHandler &
+  ActiveHandler &
+  VisibleHandler;
+
+/**
+ * A command handler is an implementation of a command.
+ *
+ * A command can have multiple handlers
+ * but they should be active in different contexts,
+ * otherwise first active will be executed.
+ */
+export type CommandHandlerWithContext<T = any> = {
+  /**
+   * Execute this handler.
+   */
+  execute: (ctx: T, ...args: any[]) => any;
+  /**
+   * Test whether this handler is enabled (active).
+   */
+  isEnabled?: (ctx: T, ...args: any[]) => boolean;
+  /**
+   * Test whether menu items for this handler should be visible.
+   */
+  isVisible?: (ctx: T, ...args: any[]) => boolean;
+  /**
+   * Test whether menu items for this handler should be active.
+   */
+  isActive?: (ctx: T, ...args: any[]) => boolean;
+};
+
+export type CommandEvent = {
+  commandId: string;
+  args: any[];
+};
+
+export type WillExecuteCommandEvent = Record<any, any> & WaitUntilEvent & CommandEvent;
+
+export const CommandService = Symbol('CommandService');
+/**
+ * The command service should be used to execute commands.
+ */
+export type CommandService = {
+  /**
+   * Execute the active handler for the given command and arguments.
+   *
+   * Reject if a command cannot be executed.
+   */
+  executeCommand: <T>(command: string, ...args: any[]) => Promise<T | undefined>;
+  /**
+   * An event is emitted when a command is about to be executed.
+   *
+   * It can be used to install or activate a command handler.
+   */
+  readonly onWillExecuteCommand: Event<WillExecuteCommandEvent>;
+  /**
+   * An event is emitted when a command was executed.
+   */
+  readonly onDidExecuteCommand: Event<CommandEvent>;
+};