Draw and clear link cells

src/Linkifier.ts

@@ -246,17 +246,17 @@ export class Linkifier extends EventEmitter implements ILinkifier {
         window.open(uri, '_blank');
       },
       e => {
-        this.emit(LinkHoverEventTypes.HOVER, <ILinkHoverEvent>{ x, y, length: uri.length});
+        this.emit(LinkHoverEventTypes.HOVER, this._createLinkHoverEvent(x, y, uri));
         this._terminal.element.style.cursor = 'pointer';
       },
       e => {
-        this.emit(LinkHoverEventTypes.TOOLTIP, <ILinkHoverEvent>{ x, y, length: uri.length});
+        this.emit(LinkHoverEventTypes.TOOLTIP, this._createLinkHoverEvent(x, y, uri));
         if (matcher.hoverTooltipCallback) {
           matcher.hoverTooltipCallback(e, uri);
         }
       },
       () => {
-        this.emit(LinkHoverEventTypes.LEAVE, <ILinkHoverEvent>{ x, y, length: uri.length});
+        this.emit(LinkHoverEventTypes.LEAVE, this._createLinkHoverEvent(x, y, uri));
         this._terminal.element.style.cursor = '';
         if (matcher.hoverLeaveCallback) {
           matcher.hoverLeaveCallback();
@@ -270,4 +270,15 @@ export class Linkifier extends EventEmitter implements ILinkifier {
       }
     ));
   }
+
+  private _createLinkHoverEvent(x: number, y: number, uri: string): ILinkHoverEvent {
+    return {
+      x1: x,
+      y1: y,
+      // TODO: Verify links on boundary work fine (x vs x + 1)
+      x2: (x + uri.length) % this._terminal.cols,
+      y2: y + Math.floor((x + uri.length) / this._terminal.cols),
+      cols: this._terminal.cols
+    };
+  }
 }

src/Types.ts

@@ -172,9 +172,11 @@ export interface ICharset {
 }
 
 export interface ILinkHoverEvent {
-  x: number;
-  y: number;
-  length: number;
+  x1: number;
+  y1: number;
+  x2: number;
+  y2: number;
+  cols: number;
 }
 
 export interface ITerminal extends PublicTerminal, IElementAccessor, IBufferAccessor, ILinkifierAccessor {

src/input/MouseZoneManager.ts

@@ -59,7 +59,9 @@ export class MouseZoneManager implements IMouseZoneManager {
     // Iterate through zones and clear them out if they're within the range
     for (let i = 0; i < this._zones.length; i++) {
       const zone = this._zones[i];
-      if (zone.y1 > start && zone.y1 <= end + 1) {
+      if ((zone.y1 > start && zone.y1 <= end + 1) ||
+          (zone.y2 > start && zone.y2 <= end + 1) ||
+          (zone.y1 < start && zone.y2 > end + 1)) {
         if (this._currentZone && this._currentZone === zone) {
           this._currentZone.leaveCallback();
           this._currentZone = null;

src/renderer/LinkRenderLayer.ts

@@ -31,14 +31,29 @@ export class LinkRenderLayer extends BaseRenderLayer {
 
   private _clearCurrentLink(): void {
     if (this._state) {
-      this.clearCells(this._state.x, this._state.y, this._state.length, 1);
+      this.clearCells(this._state.x1, this._state.y1, this._state.cols - this._state.x1, 1);
+      const middleRowCount = this._state.y2 - this._state.y1 - 1;
+      if (middleRowCount > 0) {
+        this.clearCells(0, this._state.y1 + 1, this._state.cols, middleRowCount);
+      }
+      this.clearCells(0, this._state.y2, this._state.x2, 1);
       this._state = null;
     }
   }
 
   private _onLinkHover(e: ILinkHoverEvent): void {
     this._ctx.fillStyle = this._colors.foreground;
-    this.fillBottomLineAtCells(e.x, e.y, e.length);
+    if (e.y1 === e.y2) {
+      // Single line link
+      this.fillBottomLineAtCells(e.x1, e.y1, e.x2 - e.x1);
+    } else {
+      // Multi-line link
+      this.fillBottomLineAtCells(e.x1, e.y1, e.cols - e.x1);
+      for (let y = e.y1 + 1; y < e.y2; y++) {
+        this.fillBottomLineAtCells(0, y, e.cols);
+      }
+      this.fillBottomLineAtCells(0, e.y2, e.x2);
+    }
     this._state = e;
   }