keep support for both product options syntax options

+more readable mdx bundler errors

Author: a-hariti

src/mdx.ts

@@ -456,6 +456,10 @@ export async function getFileBySlug(slug: string) {
 
       return options;
     },
+  }).catch(e => {
+    // eslint-disable-next-line no-console
+    console.error('Error occurred during MDX compilation:', e.errors);
+    throw e;
   });
 
   const {code, frontmatter} = result;

src/rehype-onboarding-lines.js

@@ -3,6 +3,7 @@
  * @typedef {import('hast').Root} Root
  */
 import {toString} from 'hast-util-to-string';
+import rangeParser from 'parse-numeric-range';
 import {visit} from 'unist-util-visit';
 
 /**
@@ -34,6 +35,18 @@ function visitor(node) {
     return;
   }
 
+  const meta = /** @type {string} */ (
+    node?.data?.meta || node?.properties?.metastring || ''
+  );
+
+  if (meta.includes('onboardingOptions')) {
+    handle_metadata_options(node, meta);
+    return;
+  }
+  handle_inline_options(node);
+}
+
+function handle_inline_options(node) {
   /* @type {string | undefined} */
   let currentOption;
 
@@ -57,3 +70,74 @@ function visitor(node) {
     }
   });
 }
+
+/**
+ * Parse the line numbers from the metastring
+ * @param {string} meta
+ * @return {number[]}
+ * @example
+ * parseLines('1, 3-4') // [1, 3, 4]
+ * parseLines('') // []
+ */
+const parseLines = meta => {
+  const RE = /([\d,-]+)/;
+  // Remove space between {} e.g. {1, 3}
+  const parsedMeta = meta
+    .split(',')
+    .map(str => str.trim())
+    .join(',');
+  if (RE.test(parsedMeta)) {
+    const strlineNumbers = RE.exec(parsedMeta)?.[1];
+    if (!strlineNumbers) {
+      return [];
+    }
+    const lineNumbers = rangeParser(strlineNumbers);
+    return lineNumbers;
+  }
+  return [];
+};
+
+/**
+ * Create a closure that returns an onboarding option `id` for a given line if it exists
+ *
+ * @param {string} meta
+ * @return { (index:number) => string | undefined }
+ */
+const getOptionForLine = meta => {
+  // match the onboardingOptions object, but avoid `other stuff`
+  const optionsRE = /{"onboardingOptions":\s*({[^}]*})\s*}/;
+  let linesForOptions = {};
+  const options = optionsRE.exec(meta)?.[1];
+  if (!options) {
+    return () => undefined;
+  }
+
+  // eval provides the convenience of not having to wrap the object properties in quotes
+  const parsedOptions = JSON.parse(options);
+  linesForOptions = Object.keys(parsedOptions).reduce((acc, key) => {
+    acc[key] = parseLines(parsedOptions[key]);
+    return acc;
+  }, {});
+  return index => {
+    for (const key in linesForOptions) {
+      if (linesForOptions[key].includes(index + 1)) {
+        return key;
+      }
+    }
+    return undefined;
+  };
+};
+
+/**
+ * @param {Element} node
+ */
+function handle_metadata_options(node, meta) {
+  const optionForLine = getOptionForLine(meta);
+
+  node.children.forEach((line, index) => {
+    const option = optionForLine(index);
+    if (option) {
+      line.properties['data-onboarding-option'] = option;
+    }
+  });
+}