Fixes https://github.com/xtermjs/xterm.js/issues/5896 TypeScript path mappings for common/*, browser/*, and headless/* were not rewritten in emitted JavaScript, which forced webpack resolve aliases and NODE_PATH workarounds so runtime could resolve modules. That added build complexity and broke tooling such as ESLint import/no-cycle. Changes: - Convert ~750 imports across src/, addons/, and test/ to relative paths - Remove common/browser/headless paths and src catch-all mappings from tsconfigs (keep @xterm/addon-* demo and addon typings paths) - Remove webpack resolve.alias for common, browser, headless, and vs - Drop NODE_PATH from unit tests, benchmarks, and VS Code launch config - Fix addon-image IIPImageStorage to import ./Types after removing catch-all * Verified: npm run build, esbuild, package, package-headless Co-authored-by: Cursor <cursoragent@cursor.com>
111 lines
3.8 KiB
TypeScript
111 lines
3.8 KiB
TypeScript
/*---------------------------------------------------------------------------------------------
|
|
* Copyright (c) Microsoft Corporation. All rights reserved.
|
|
* Licensed under the MIT License. See License.txt in the project root for license information.
|
|
*--------------------------------------------------------------------------------------------*/
|
|
|
|
import { GlobalPointerMoveMonitor } from './globalPointerMoveMonitor';
|
|
import { Widget } from './widget';
|
|
import { TimeoutTimer } from '../../common/Async';
|
|
import * as dom from '../Dom';
|
|
|
|
export interface IScrollbarArrowOptions {
|
|
handleActivate: () => void;
|
|
className: string;
|
|
// icon: ThemeIcon;
|
|
|
|
bgWidth: number;
|
|
bgHeight: number;
|
|
|
|
top?: number;
|
|
left?: number;
|
|
bottom?: number;
|
|
right?: number;
|
|
}
|
|
|
|
export class ScrollbarArrow extends Widget {
|
|
|
|
private _handleActivate: () => void;
|
|
public bgDomNode: HTMLElement;
|
|
public domNode: HTMLElement;
|
|
private _pointerdownRepeatTimer: dom.WindowIntervalTimer;
|
|
private _pointerdownScheduleRepeatTimer: TimeoutTimer;
|
|
private _pointerMoveMonitor: GlobalPointerMoveMonitor;
|
|
|
|
constructor(opts: IScrollbarArrowOptions) {
|
|
super();
|
|
this._handleActivate = opts.handleActivate;
|
|
|
|
this.bgDomNode = document.createElement('div');
|
|
this.bgDomNode.className = 'xterm-arrow-background';
|
|
this.bgDomNode.style.position = 'absolute';
|
|
this.bgDomNode.style.width = opts.bgWidth + 'px';
|
|
this.bgDomNode.style.height = opts.bgHeight + 'px';
|
|
if (typeof opts.top !== 'undefined') {
|
|
this.bgDomNode.style.top = '0px';
|
|
}
|
|
if (typeof opts.left !== 'undefined') {
|
|
this.bgDomNode.style.left = '0px';
|
|
}
|
|
if (typeof opts.bottom !== 'undefined') {
|
|
this.bgDomNode.style.bottom = '0px';
|
|
}
|
|
if (typeof opts.right !== 'undefined') {
|
|
this.bgDomNode.style.right = '0px';
|
|
}
|
|
|
|
this.domNode = document.createElement('div');
|
|
this.domNode.className = opts.className;
|
|
// this.domNode.classList.add(...ThemeIcon.asClassNameArray(opts.icon));
|
|
|
|
this.domNode.style.position = 'absolute';
|
|
const arrowSize = Math.min(opts.bgWidth, opts.bgHeight);
|
|
this.domNode.style.width = arrowSize + 'px';
|
|
this.domNode.style.height = arrowSize + 'px';
|
|
if (typeof opts.top !== 'undefined') {
|
|
this.domNode.style.top = opts.top + 'px';
|
|
}
|
|
if (typeof opts.left !== 'undefined') {
|
|
this.domNode.style.left = opts.left + 'px';
|
|
}
|
|
if (typeof opts.bottom !== 'undefined') {
|
|
this.domNode.style.bottom = opts.bottom + 'px';
|
|
}
|
|
if (typeof opts.right !== 'undefined') {
|
|
this.domNode.style.right = opts.right + 'px';
|
|
}
|
|
|
|
this._pointerMoveMonitor = this._register(new GlobalPointerMoveMonitor());
|
|
this._register(dom.addStandardDisposableListener(this.bgDomNode, dom.eventType.POINTER_DOWN, (e) => this._arrowPointerDown(e)));
|
|
this._register(dom.addStandardDisposableListener(this.domNode, dom.eventType.POINTER_DOWN, (e) => this._arrowPointerDown(e)));
|
|
|
|
this._pointerdownRepeatTimer = this._register(new dom.WindowIntervalTimer());
|
|
this._pointerdownScheduleRepeatTimer = this._register(new TimeoutTimer());
|
|
}
|
|
|
|
private _arrowPointerDown(e: PointerEvent): void {
|
|
if (!e.target || !(e.target instanceof Element)) {
|
|
return;
|
|
}
|
|
const scheduleRepeater = (): void => {
|
|
this._pointerdownRepeatTimer.cancelAndSet(() => this._handleActivate(), 1000 / 24, dom.getWindow(e));
|
|
};
|
|
|
|
this._handleActivate();
|
|
this._pointerdownRepeatTimer.cancel();
|
|
this._pointerdownScheduleRepeatTimer.cancelAndSet(scheduleRepeater, 200);
|
|
|
|
this._pointerMoveMonitor.startMonitoring(
|
|
e.target,
|
|
e.pointerId,
|
|
e.buttons,
|
|
(pointerMoveData) => { /* Intentional empty */ },
|
|
() => {
|
|
this._pointerdownRepeatTimer.cancel();
|
|
this._pointerdownScheduleRepeatTimer.cancel();
|
|
}
|
|
);
|
|
|
|
e.preventDefault();
|
|
}
|
|
}
|