babel-code-frame - npm Package Compare versions

Comparing version 7.0.0-alpha.9 to 7.0.0-alpha.11

lib/index.js

 "use strict";
 
 exports.__esModule = true;
+exports.codeFrameColumns = codeFrameColumns;
 
@@ -8,50 +9,20 @@ exports.default = function (rawLines, lineNumber, colNumber) {
 
-  colNumber = Math.max(colNumber, 0);
+  if (!deprecationWarningShown) {
+    deprecationWarningShown = true;
 
-  var highlighted = opts.highlightCode && _chalk2.default.supportsColor || opts.forceColor;
-  var chalk = _chalk2.default;
-  if (opts.forceColor) {
-    chalk = new _chalk2.default.constructor({ enabled: true });
-  }
-  var maybeHighlight = function maybeHighlight(chalkFn, string) {
-    return highlighted ? chalkFn(string) : string;
-  };
-  var defs = getDefs(chalk);
-  if (highlighted) rawLines = highlight(defs, rawLines);
+    var deprecationError = new Error("Passing lineNumber and colNumber is deprecated to babel-code-frame. Please use `codeFrameColumns`.");
+    deprecationError.name = "DeprecationWarning";
 
-  var linesAbove = opts.linesAbove || 2;
-  var linesBelow = opts.linesBelow || 3;
-
-  var lines = rawLines.split(NEWLINE);
-  var start = Math.max(lineNumber - (linesAbove + 1), 0);
-  var end = Math.min(lines.length, lineNumber + linesBelow);
-
-  if (!lineNumber && !colNumber) {
-    start = 0;
-    end = lines.length;
+    if (process.emitWarning) {
+      process.emitWarning(deprecationError);
+    } else {
+      console.warn(deprecationError);
+    }
   }
 
-  var numberMaxWidth = String(end).length;
+  colNumber = Math.max(colNumber, 0);
 
-  var frame = lines.slice(start, end).map(function (line, index) {
-    var number = start + 1 + index;
-    var paddedNumber = (" " + number).slice(-numberMaxWidth);
-    var gutter = " " + paddedNumber + " | ";
-    if (number === lineNumber) {
-      var markerLine = "";
-      if (colNumber) {
-        var markerSpacing = line.slice(0, colNumber - 1).replace(/[^\t]/g, " ");
-        markerLine = ["\n ", maybeHighlight(defs.gutter, gutter.replace(/\d/g, " ")), markerSpacing, maybeHighlight(defs.marker, "^")].join("");
-      }
-      return [maybeHighlight(defs.marker, ">"), maybeHighlight(defs.gutter, gutter), line, markerLine].join("");
-    } else {
-      return " " + maybeHighlight(defs.gutter, gutter) + line;
-    }
-  }).join("\n");
+  var location = { start: { column: colNumber, line: lineNumber } };
 
-  if (highlighted) {
-    return chalk.reset(frame);
-  } else {
-    return frame;
-  }
+  return codeFrameColumns(rawLines, location, opts);
 };
@@ -73,2 +44,4 @@
 
+var deprecationWarningShown = false;
+
 function getDefs(chalk) {
@@ -141,2 +114,109 @@ return {
   });
+}
+
+function getMarkerLines(loc, source, opts) {
+  var startLoc = Object.assign({}, { column: 0, line: -1 }, loc.start);
+  var endLoc = Object.assign({}, startLoc, loc.end);
+  var linesAbove = opts.linesAbove || 2;
+  var linesBelow = opts.linesBelow || 3;
+
+  var startLine = startLoc.line;
+  var startColumn = startLoc.column;
+  var endLine = endLoc.line;
+  var endColumn = endLoc.column;
+
+  var start = Math.max(startLine - (linesAbove + 1), 0);
+  var end = Math.min(source.length, endLine + linesBelow);
+
+  if (startLine === -1) {
+    start = 0;
+  }
+
+  if (endLine === -1) {
+    end = source.length;
+  }
+
+  var lineDiff = endLine - startLine;
+  var markerLines = {};
+
+  if (lineDiff) {
+    for (var i = 0; i <= lineDiff; i++) {
+      var lineNumber = i + startLine;
+
+      if (!startColumn) {
+        markerLines[lineNumber] = true;
+      } else if (i === 0) {
+        var sourceLength = source[lineNumber - 1].length;
+
+        markerLines[lineNumber] = [startColumn, sourceLength - startColumn];
+      } else if (i === lineDiff) {
+        markerLines[lineNumber] = [0, endColumn];
+      } else {
+        var _sourceLength = source[lineNumber - i].length;
+
+        markerLines[lineNumber] = [0, _sourceLength];
+      }
+    }
+  } else {
+    if (startColumn === endColumn) {
+      if (startColumn) {
+        markerLines[startLine] = [startColumn, 0];
+      } else {
+        markerLines[startLine] = true;
+      }
+    } else {
+      markerLines[startLine] = [startColumn, endColumn - startColumn];
+    }
+  }
+
+  return { start: start, end: end, markerLines: markerLines };
+}
+
+function codeFrameColumns(rawLines, loc) {
+  var opts = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+
+  var highlighted = opts.highlightCode && _chalk2.default.supportsColor || opts.forceColor;
+  var chalk = _chalk2.default;
+  if (opts.forceColor) {
+    chalk = new _chalk2.default.constructor({ enabled: true });
+  }
+  var maybeHighlight = function maybeHighlight(chalkFn, string) {
+    return highlighted ? chalkFn(string) : string;
+  };
+  var defs = getDefs(chalk);
+  if (highlighted) rawLines = highlight(defs, rawLines);
+
+  var lines = rawLines.split(NEWLINE);
+
+  var _getMarkerLines = getMarkerLines(loc, lines, opts),
+      start = _getMarkerLines.start,
+      end = _getMarkerLines.end,
+      markerLines = _getMarkerLines.markerLines;
+
+  var numberMaxWidth = String(end).length;
+
+  var frame = lines.slice(start, end).map(function (line, index) {
+    var number = start + 1 + index;
+    var paddedNumber = (" " + number).slice(-numberMaxWidth);
+    var gutter = " " + paddedNumber + " | ";
+    var hasMarker = markerLines[number];
+    if (hasMarker) {
+      var markerLine = "";
+      if (Array.isArray(hasMarker)) {
+        var markerSpacing = line.slice(0, Math.max(hasMarker[0] - 1, 0)).replace(/[^\t]/g, " ");
+        var numberOfMarkers = hasMarker[1] || 1;
+
+        markerLine = ["\n ", maybeHighlight(defs.gutter, gutter.replace(/\d/g, " ")), markerSpacing, maybeHighlight(defs.marker, "^").repeat(numberOfMarkers)].join("");
+      }
+      return [maybeHighlight(defs.marker, ">"), maybeHighlight(defs.gutter, gutter), line, markerLine].join("");
+    } else {
+      return " " + maybeHighlight(defs.gutter, gutter) + line;
+    }
+  }).join("\n");
+
+  if (highlighted) {
+    return chalk.reset(frame);
+  } else {
+    return frame;
+  }
 }

package.json

 {
   "name": "babel-code-frame",
-  "version": "7.0.0-alpha.9",
+  "version": "7.0.0-alpha.11",
   "description": "Generate errors that contain a code frame that point to source locations.",
@@ -5,0 +5,0 @@ "author": "Sebastian McKenzie <[e-mail]>",

README.md

@@ -14,3 +14,3 @@ # babel-code-frame
 ```js
-import codeFrame from 'babel-code-frame';
+import { codeFrameColumns } from 'babel-code-frame';
 
@@ -20,6 +20,5 @@ const rawLines = `class Foo {
 }`;
-const lineNumber = 2;
-const colNumber = 16;
+const location = { start: { line: 2, column: 16 } };
 
-const result = codeFrame(rawLines, lineNumber, colNumber, { /* options */ });
+const result = codeFrameColumns(rawLines, location, { /* options */ });
 
@@ -29,3 +28,3 @@ console.log(result);
 
-```sh
+```
   1 | class Foo {
@@ -37,4 +36,32 @@ > 2 |   constructor()
 
-If the column number is not known, you may pass `null` instead.
+If the column number is not known, you may omit it.
 
+You can also pass an `end` hash in `location`.
+
+```js
+import { codeFrameColumns } from 'babel-code-frame';
+
+const rawLines = `class Foo {
+  constructor() {
+    console.log("hello");
+  }
+}`;
+const location = { start: { line: 2, column: 17 }, end: { line: 4, column: 3 } };
+
+const result = codeFrameColumns(rawLines, location, { /* options */ });
+
+console.log(result);
+```
+
+```
+  1 | class Foo {
+> 2 |   constructor() {
+    |                 ^
+> 3 |     console.log("hello");
+    | ^^^^^^^^^^^^^^^^^^^^^^^^^
+> 4 |   }
+    | ^^^
+  5 | };
+```
+
 ## Options
@@ -65,1 +92,40 @@
 Enable this to forcibly syntax highlight the code as JavaScript (for non-terminals); overrides `highlightCode`.
+
+## Upgrading from prior versions
+
+Prior to version 7, the only API exposed by this module was for a single line and optional column pointer. The old API will now log a deprecation warning.
+
+The new API takes a `location` object, similar to what is available in an AST.
+
+This is an example of the deprecated (but still available) API:
+
+```js
+import codeFrame from 'babel-code-frame';
+
+const rawLines = `class Foo {
+  constructor()
+}`;
+const lineNumber = 2;
+const colNumber = 16;
+
+const result = codeFrame(rawLines, lineNumber, colNumber, { /* options */ });
+
+console.log(result);
+```
+
+To get the same highlighting using the new API:
+
+```js
+import { codeFrameColumns } from 'babel-code-frame';
+
+const rawLines = `class Foo {
+  constructor() {
+    console.log("hello");
+  }
+}`;
+const location = { start: { line: 2, column: 16 } };
+
+const result = codeFrameColumns(rawLines, location, { /* options */ });
+
+console.log(result);
+```

No alert changes

Improved metrics

Total package byte prevSize

9153

increased by71.24%

Lines of code

169

increased by57.94%

Number of lines in readme file

127

increased by108.2%

No dependency changes