from annotation with line range

packages/mdx/dev/content/assets/bar.js

@@ -0,0 +1,7 @@
+console.log("one")
+console.log("two")
+console.log("three")
+console.log("four")
+console.log("five")
+console.log("six")
+console.log("seven")

packages/mdx/dev/content/external.mdx

@@ -2,6 +2,10 @@
 // from ./assets/foo.js
 ```
 
+```js bar.js
+// from ./assets/bar.js 3:5
+```
+
 ```py foo.py
 # from ./assets/foo.py
 ```

packages/mdx/src/remark/code.ts

@@ -212,7 +212,9 @@ async function getCodeFromExternalFileIfNeeded(
  .map(t => t.content)
  .join("")
 
- const codepath = commentData.data
+ const [codepath, range] = commentData.data
+ ?.trim()
+ .split(/\s+/)
 
  let fs, path
 
@@ -242,18 +244,34 @@ Looks like node "fs" and "path" modules are not available.`
  const dir = path.dirname(config.filepath)
  const absoluteCodepath = path.resolve(dir, codepath)
 
- let nodeValue
+ let content: string
  try {
- nodeValue = fs.readFileSync(absoluteCodepath, "utf8")
+ content = fs.readFileSync(absoluteCodepath, "utf8")
  } catch (e) {
  e.message = `Code Hike couldn't resolve this annotation:
 ${fileText}
 ${absoluteCodepath} doesn't exist.`
  throw e
  }
 
+ if (range) {
+ const [start, end] = range.split(":")
+ const startLine = parseInt(start)
+ const endLine = parseInt(end)
+ if (isNaN(startLine) || isNaN(endLine)) {
+ throw new Error(
+ `Code Hike couldn't resolve this annotation:
+${fileText}
+The range is not valid. Should be something like:
+ ${codepath} 2:5`
+ )
+ }
+ const lines = content.split("\n")
+ content = lines.slice(startLine - 1, endLine).join("\n")
+ }
+
  return await highlight({
- code: nodeValue,
+ code: content,
  lang: code.lang,
  theme: config.theme,
  })