markdown-magic 2.5.1 → 2.6.1

package/lib/utils/new-parser.test.js

@@ -0,0 +1,324 @@
+const { inspect } = require('util')
+const { test } = require('uvu')
+const assert = require('uvu/assert')
+const weirdParse = require('./weird-parse')
+const { parseBlocks } = require('./new-parser')
+ 
+function deepLog(v) {
+   console.log(inspect(v, {showHidden: false, depth: null}))
+}
+
+const md = `<h1 id="jdjdj">Netlify + FaunaDB &nbsp;&nbsp;&nbsp; 
+ <a href="https://app.netlify.com/start/deploy?repository=https://github.com/netlify/netlify-faunadb-example&stack=fauna">
+   <img src="https://www.netlify.com/img/deploy/button.svg">
+ </a>
+</h1>
+
+<\!-- XYZ:START functionName foo={{ rad: 'yellow' }} -->
+nice
+<\!-- XYZ:END -->
+
+<\!-- XYZ:START {functionName} foo={{ rad: 'blue' }} -->
+nice
+<\!-- XYZ:END -->
+
+
+<\!-- XYZ:START {functionName} foo={{ rad: 'red' }} -->
+nice
+<\!-- XYZ:END -->
+
+
+<\!-- XYZ:START [wootName] foo=['one', 'two'] -->
+nice
+<\!-- XYZ:END -->
+
+
+<\!-- XYZ:START -->
+lol
+<\!-- XYZ:END -->
+
+
+<\!-- xyz:start (lowerCase) foo=['one', 'two'] heading=false -->
+nice
+<\!-- XYZ:END -->
+
+
+<\!-- XYZ:START(cool) 
+ width={999} 
+ height={{111}}
+ numberAsString="12345"   
+ great={["scoot", "sco ot", 'scooo ttt']} 
+ nice={{ value: nice, cool: "true" }}
+ soclose=[jdjdjd, hdhfhfhffh]
+ rad="boss"
+ cool=true notCool=false
+ nooooo={[one, two, 3, 4]}
+ numberZero=0,
+ xyz=999,
+ nope=false,
+ // comment
+ yes={true} -->
+
+actual content
+
+<\!-- XYZ:END -->
+
+
+<img src="https://www.netlify.com/img/deploy/button.svg"/>
+
+
+<img src="https://www.hehhehehehe.com/img/deploy/button.svg" />
+
+
+<\!-- XYZ:START(cool) xxx
+hhddh=cool -->
+wowow
+whatever we want 
+<\!-- XYZ:END -->
+
+
+<\!-- XYZ:START(hhh) -->
+xyz
+<\!-- XYZ:END -->
+
+
+<\!-- XYZ:START(cool) isCool -->
+nice
+<\!-- XYZ:END -->
+
+
+<button 
+ great={[one, two, 3, 4]}
+>
+ wow
+</button>
+
+
+<\!-- XYZ:START(niceeeee) 
+  xxx
+  // comment here
+  hhddh=cool 
+-->
+contents
+<\!-- XYZ:END -->
+
+<button 
+ width={999} 
+ great={["scoot", "scoot"]} 
+ nice={{ value: nice, cool: true }}
+ rad="boss" 
+ cool=true 
+ nope=false 
+ what='xnxnx' 
+ isLoading 
+ src="https://user-images.githubusercontent.com/532272/123136878-46f1a300-d408-11eb-82f2-ad452498457b.jpg"
+>
+ coooooll
+</button>
+
+
+<hr />
+
+
+<br />
+
+
+<ReactComponent>lolol</ReactComponent>
+
+
+<ReactComponent width={123} lol={["no", "cool"]}>
+ lolol
+</ReactComponent>
+
+
+<OtherComponent width={123} lol={["no", "cool"]} nice={{ value: "nice", cool: true }}>
+ lolol
+</OtherComponent>
+
+
+<table style="width:100%">
+ <tr>
+   <th>Firstname</th>
+   <th>Lastname</th>
+   <th>Age</th>
+ </tr>
+ <tr>
+   <td>Jill</td>
+   <td>Smith</td>
+   <td>50</td>
+ </tr>
+ <tr>
+   <td>Eve</td>
+   <td>Jackson</td>
+   <td>94</td>
+ </tr>
+</table>
+
+
+<div>
+ <p>
+   <img align="right" isLoading={false} width="250" src="https://user-images.githubusercontent.com/532272/123136878-46f1a300-d408-11eb-82f2-ad452498457b.jpg" />
+ </p>
+ <p>
+  cool
+ </p>
+<div>
+
+
+<p>
+ <img align="left" width="250" src="https://user-images.githubusercontent.com/532272/123136889-4953fd00-d408-11eb-8a3e-f82f1d073298.jpg" />
+</p>
+
+
+ Add a little magic to your markdown 
+
+
+## About
+
+
+<img align="right" width="200" height="183" src="https://cloud.githubusercontent.com/assets/532272/21507867/3376e9fe-cc4a-11e6-9350-7ec4f680da36.gif" />Markdown magic uses comment blocks in markdown files to automatically sync or transform its contents.
+
+
+Markdown magic uses comment blocks in markdown files to automatically sync or transform its contents. <img align="right" width="200" height="183" src="https://cloud.githubusercontent.com/assets/532272/21507867/3376e9fe-cc4a-11e6-9350-7ec4f680da36.gif" />
+`
+
+test('parser', () => {
+  const parsedValue = parseBlocks(md)
+  /*
+  console.log('parsedValue')
+  deepLog(parsedValue)
+  /** */
+  assert.equal(true, true)
+})
+
+const inlineOne = `<!--XYZ:START functionName foo={{ rad: 'bar' }}-->99<!--XYZ:END-->`
+const inlineTwo = ` <!-- XYZ:START transformX foo=111 -->99<!-- XYZ:END -->`
+test('inline parser', () => {
+  const one = parseBlocks(inlineOne)
+  /*
+  console.log('inline one')
+  deepLog(one)
+  /** */
+  // assert.equal(one, [
+  //   {
+  //     transform: 'functionName',
+  //     args: { foo: { rad: 'bar' } },
+  //     location: 66
+  //   }
+  // ])
+  const two = parseBlocks(inlineTwo)
+  //*
+  console.log('inline two ───────────────────────')
+  deepLog(two)
+  /** */
+  assert.equal(two, [
+    { transform: 'transformX', args: { foo: 111 }, location: 55 }
+  ])
+})
+
+const fnBlocks = `
+<!-- XYZ:START functionName foo={{ rad: 'yellow' }} -->
+nice
+<!-- XYZ:END -->
+
+<!-- XYZ:START {functionName} foo={{ rad: 'blue' }} -->
+nice
+<!-- XYZ:END -->
+
+<!-- XYZ:START (functionName) foo={{ rad: 'red' }} -->
+nice
+<!-- XYZ:END -->
+
+<!-- XYZ:START [functionName] foo={{ rad: 'purple' }} -->
+nice
+<!-- XYZ:END -->
+
+<!-- XYZ:START {{functionName}} foo={{ rad: 'black' }} -->
+nice
+<!-- XYZ:END -->
+
+<!-- XYZ:START ((functionName)) foo={{ rad: 'white' }} -->
+nice
+<!-- XYZ:END -->
+
+<!-- XYZ:START [[functionName]] foo={{ rad: 'orange' }} -->
+nice
+<!-- XYZ:END -->
+`
+
+test('function names', () => {
+  const parsedValue = parseBlocks(fnBlocks)
+  /*
+  console.log('fn names')
+  deepLog(parsedValue)
+  /** */
+  assert.equal(parsedValue, [
+    {
+      transform: 'functionName',
+      args: { foo: { rad: 'yellow' } },
+      location: 78
+    },
+    {
+      transform: 'functionName',
+      args: { foo: { rad: 'blue' } },
+      location: 157
+    },
+    {
+      transform: 'functionName',
+      args: { foo: { rad: 'red' } },
+      location: 235
+    },
+    {
+      transform: 'functionName',
+      args: { foo: { rad: 'purple' } },
+      location: 316
+    },
+    {
+      transform: 'functionName',
+      args: { foo: { rad: 'black' } },
+      location: 398
+    },
+    {
+      transform: 'functionName',
+      args: { foo: { rad: 'white' } },
+      location: 480
+    },
+    {
+      transform: 'functionName',
+      args: { foo: { rad: 'orange' } },
+      location: 563
+    }
+  ])
+})
+
+
+const backwardCompat = `
+<!-- XYZ:START functionName foo={{ rad: 'yellow' }} -->
+nice
+<!-- XYZ:END -->
+
+<!-- XYZ:START lol width={999}
+  height={{111}}
+  numberAsString="12345"
+  great={["scoot", "sco ot", 'scooo ttt']}
+  nope=false -->
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer vitae mauris arcu, eu pretium nisi. Praesent fringilla ornare ullamcorper. Pellentesque diam orci, sodales in blandit ut, placerat quis felis. Vestibulum at sem massa, in tempus nisi. Vivamus ut fermentum odio. Etiam porttitor faucibus volutpat. Vivamus vitae mi ligula, non hendrerit urna. Suspendisse potenti. Quisque eget massa a massa semper mollis.
+<!-- XYZ:END -->
+
+
+<!-- XYZ:START (CODE:src=./relative/path/to/code.js&lines=22-44) -->
+This content will be dynamically replaced with code from the file lines 22 through 44
+<!-- XYZ:END -->
+`
+
+test.only('function names', () => {
+  const parsedValue = parseBlocks(backwardCompat)
+  //*
+  console.log('backwardCompat')
+  deepLog(parsedValue)
+  /** */
+  // assert.equal(parsedValue, [])
+})
+
+
+test.run()

package/lib/utils/regex.js

@@ -15,11 +15,6 @@ module.exports.matchClosingCommentTag = function (word) {
 
 module.exports.removeLeadingAndTrailingLineBreaks = /^(?:[\t ]*(?:\r?\n|\r))+|\s+$/g
 
-// Regex to remove all comment blocks
-const removeCommentsREGEX = / *?\<\!-- ([\s\S]*?) ?--\>\n\n*?/g
-// content.replace(removeComments, '')
-
-
 const jsRegex = /\/\* Step([\s\S]*?)\*\//g
 const ymlRegex = / *?# Step([\s\S]*?) #\n*?/g
 const htmlRegex = / *?\<\!-- Step([\s\S]*?) ?--\>\n*?/
@@ -59,4 +54,23 @@ function getSteps() {
   }).map((item) => {
     return item.value
   })
-}
+}
+
+// Regex to remove all comment blocks
+const REMOVE_COMMENTS_REGEX = / *?\<\!-- ([\s\S]*?) ?--\>\n\n*?/g
+// content.replace(removeComments, '')
+
+// https://github.com/vendia/blog/commit/0c231fa928423ab050fbdb8d308eaa905b553aff
+const HIDDEN_FRONTMATTER_REGEX = /^<!--.*((.|\r?\n)*?.*-->)/g
+const FRONTMATTER_REGEX = /^---.*((.|\r?\n)*?.*---)/g
+
+const LEADING_NEW_LINE_REGEX = /^(\r?\n|\r)/
+const SQUARE_BRACKETS_REGEX = /^\[(\\.|[^\]])+\]/
+const TABEL_ROW_REGEX = /^\s*\|.*?\|\s*$/
+/**
+ * Validates whether a text is Markdown table row (starts and ends with a pipe).
+ *
+ * @param {string} text  The text to validate.
+ * @returns {boolean}
+ */
+const isTableRow = (text) => text.match(TABEL_ROW_REGEX);

package/lib/utils/weird-parse.js

@@ -0,0 +1,230 @@
+const { parseJSON } = require('json-alexander')
+
+function convert(value) {
+  if (value === 'false') {
+    return false
+  }
+  if (value === 'true') {
+    return true
+  }
+
+  const isNumber = Number(value)
+  if (typeof isNumber === 'number' && !isNaN(isNumber)) {
+    return isNumber
+  }
+
+  // console.log(typeof value)
+  // console.log('value', value)
+  try {
+    const val = parseJSON(value) // last attempt to format an array like [ one, two ]
+    if (typeof val === 'string' && val.match(/^\[/) && val.match(/\]$/)) {
+      const inner = val.match(/^\[(.*)\]/)
+      if (inner && inner[1]) {
+        const newVal = inner[1].split(', ').map((x) => {
+          return convert(x.trim())
+        })
+        return newVal
+      }
+    }
+    return val
+  } catch (err) {
+    console.log('val', value)
+    console.log('err', err)
+  }
+  return value
+}
+
+const RESERVED = '__private'
+
+function doWeirdParse(x) {
+  // https://regex101.com/r/bx8DXm/1/ Match everything but spaces/newlines
+  var y = /("|'|{)[^"}]+("|'|})|(\S+)/g
+
+  const cleanLines = x
+    .split(/\n/)
+    .filter((line) => {
+      // Trim all comment blocks
+      return !line.trim().match(/^(\/\/+|\/\*+|#+)/gm)
+    })
+    .join('\n')
+
+  var lines = cleanLines.match(y)
+  // console.log('lines', lines.length)
+  // console.log('lines', lines)
+  var isEnding = /(['"}\]]|true,?|false,?)$/
+
+  const values = lines.reduce((acc, curr, i) => {
+    const isLastLoop = lines.length === (i + 1)
+    const nextItem = lines[i + 1] || '' 
+    const hasText = curr.match(/^[A-Za-z]/)
+    let alreadyAdded = false
+
+    /*
+    console.log('isLastLoop', isLastLoop)
+    console.log('RESERVED', acc[RESERVED]) 
+    console.log("current item", curr) 
+    console.log('next item   ', nextItem) 
+    /** */
+
+    // If has no = its a true boolean. e.g isThingy
+    if (hasText && acc[RESERVED].match(/^[A-Za-z]/) && !isValuePair(acc[RESERVED])) {
+      // console.log('xxxxxxx', acc[RESERVED])
+      acc[trimTrailingComma(acc[RESERVED])] = true
+      acc[RESERVED] = ''
+    } 
+    // If has no = its a true boolean
+    if (hasText && !curr.match(isEnding) && acc[RESERVED].match(isEnding)) {
+      // console.log('end', curr)
+      const kv = getKeyAndValueFromString(acc[RESERVED])
+      if (kv) {
+        acc[kv.key] = kv.value
+      }
+      acc[RESERVED] = ''
+    }
+
+    if (!acc[RESERVED].match(/^[A-Za-z]+={+/) && isValuePair(curr) && curr.match(isEnding)) {
+      const kv = getKeyAndValueFromString(curr)
+      if (kv) {
+        // console.log(`ADDED`, kv)
+        acc[kv.key] = kv.value
+      }
+    } else {
+      // console.log('Add', curr)
+      alreadyAdded = true
+      acc[RESERVED] = acc[RESERVED] + curr
+    }
+
+
+    if (acc[RESERVED].match(isEnding) && nextItem.match(/^[A-Za-z0-9_-]/)) {
+      const kv = getKeyAndValueFromString(acc[RESERVED])
+      if (kv) {
+        // console.log(`acc[RESERVED].match(isEnding)`, kv)
+        acc[kv.key] = kv.value
+      }
+      acc[RESERVED] = ''
+    }
+
+    // If ends in number foo=2 or bar=3,
+    if (isValuePair(curr) && curr.match(/\d,?$/)) {
+      const kv = getKeyAndValueFromString(acc[RESERVED])
+      if (kv) {
+        // console.log(`acc[RESERVED].match(isEnding)`, kv)
+        acc[kv.key] = kv.value
+      }
+      acc[RESERVED] = ''
+    }
+
+    // If last loop and still no match and looks like KV. Parse it
+    if (isLastLoop) {
+      // If single isCool boolean
+      if (hasText && !curr.match(/=/)) {
+        // console.log(`ADDED`, kv)
+        // acc[curr] = true
+        // acc[RESERVED] = ''
+      }
+      // console.log('currrrrr', curr)
+      // console.log("acc[RESERVED]", acc[RESERVED])
+      // console.log('combined', acc[RESERVED] + curr)
+      // If value empty but __private have accumulated values
+      if (acc[RESERVED]) {
+      // if (acc[RESERVED] && (acc[RESERVED].match(isEnding) || isValuePair(acc[RESERVED]))) {
+        const valueToCheck = (curr.match(isEnding) && !alreadyAdded) ? acc[RESERVED] + curr : acc[RESERVED]
+        // console.log('valueToCheck', valueToCheck)
+        const kv = getKeyAndValueFromString(valueToCheck)
+        if (kv) {
+          // console.log(`acc[RESERVED].match(isEnding)`, kv)
+          acc[kv.key] = kv.value
+        }
+        acc[RESERVED] = ''
+      }
+    }
+
+    return acc
+  }, {
+    [RESERVED]: '',
+  })
+
+  delete values[RESERVED]
+
+  /* // If no keys last attempt to parse
+  if (!Object.keys(values).length) {
+    const kv = getKeyAndValueFromString(x)
+    if (kv) {
+      return {  
+        [`${kv.key}`]: kv.value
+      }
+    }
+  }
+  */
+
+  return values
+}
+
+function isValuePair(str) {
+  return str.match(/=/)
+}
+
+// https://melvingeorge.me/blog/check-if-string-contain-emojis-javascript OR https://www.npmjs.com/package/emoji-regex
+function hasEmoji(str) {
+  const regexExp = /^(\u00a9|\u00ae|[\u2000-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])/gi;
+  return regexExp.test(str)
+}
+
+function getKeyAndValueFromString(string) {
+  if (!string) return
+  // const keyValueRegex = /([A-Za-z-_$]+)=['{"]?(.*)['}"]?/g
+  // const match = keyValueRegex.exec(string)
+  // if (!match) {
+  //   return
+  // }
+  // console.log('getKeyAndValueFromString')
+
+  const [key, ...values] = string.split('=')
+  /* If no key or key starts with --- */
+  if (!key || key.charAt(0) === '-' || hasEmoji(key)) {
+    return
+  }
+  // console.log('string', string)
+  // console.log('key', key)
+  // console.log('values', values)
+  /* If no value, isThing === true */
+  if (!values.length) {
+    return {
+      key: key,
+      value: true,
+    }
+  }
+
+  const value = values.join('')
+
+  let cleanValue = value
+    .replace(/^{{2,}/, '{')
+    .replace(/}{2,}$/, '}')
+    .replace(/^\[{2,}/, '[')
+    .replace(/\]{2,}$/, ']')
+    // Trim trailing commas
+    .replace(/,$/, '')
+
+  if (value.match(/^{[^:,]*}/)) {
+    cleanValue = removeSurroundingBrackets(cleanValue)
+  } else if (value.match(/^{\s*\[\s*[^:]*\s*\]\s*\}/)) {
+    // Match { [ one, two ,3,4 ]   }
+    cleanValue = removeSurroundingBrackets(cleanValue)
+  }
+
+  return {
+    key: key,
+    value: convert(cleanValue),
+  }
+}
+
+function trimTrailingComma(str = '') {
+  // Trim trailing commas
+  return str.replace(/,$/, '')
+}
+
+function removeSurroundingBrackets(val) {
+  return val.replace(/^{/, '').replace(/}$/, '')
+}
+
+module.exports = doWeirdParse