boxwood 2.6.0 → 2.8.2

package/index.js

@@ -3,6 +3,70 @@ const { readFileSync, realpathSync, lstatSync } = require("fs")
 const csstree = require("css-tree")
 const { createHash } = require("./utilities/hash")
 
+class TranslationError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "TranslationError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
+class FileError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "FileError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
+class RawError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "RawError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
+class CSSError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "CSSError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
+class ImageError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "ImageError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
+class SVGError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "SVGError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
+class JSONError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "JSONError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
+class ComponentError extends Error {
+  constructor(message) {
+    super(message)
+    this.name = "ComponentError"
+    Error.captureStackTrace(this, this.constructor)
+  }
+}
+
 function compile(path) {
   const fn = require(path)
   return {
@@ -37,7 +101,7 @@ function compile(path) {
           if (
             attributes.src ||
             ["application/json", "application/ld+json"].includes(
-              attributes.type
+              attributes.type,
             )
           ) {
             node.ignore = false
@@ -179,7 +243,7 @@ function validateSymlinks(path, base) {
     if (!part) continue
     current = resolve(current, part)
     if (lstatSync(current).isSymbolicLink()) {
-      throw new Error(`FileError: symlinks are not allowed ("${current}")`)
+      throw new FileError(`symlinks are not allowed ("${current}")`)
     }
   }
 }
@@ -191,33 +255,31 @@ function validateFile(path, base) {
   const type = extension(normalizedPath)
 
   if (!type) {
-    throw new Error(`FileError: path "${path}" has no extension`)
+    throw new FileError(`path "${path}" has no extension`)
   }
 
   if (!ALLOWED_READ_EXTENSIONS.includes(type)) {
-    throw new Error(
-      `FileError: unsupported file type "${type}" for path "${path}"`
-    )
+    throw new FileError(`unsupported file type "${type}" for path "${path}"`)
   }
 
   const stats = lstatSync(normalizedPath)
   if (!stats.isFile()) {
-    throw new Error(`FileError: path "${path}" is not a file`)
+    throw new FileError(`path "${path}" is not a file`)
   }
 
   if (stats.isSymbolicLink()) {
-    throw new Error(`FileError: path "${path}" is a symbolic link`)
+    throw new FileError(`path "${path}" is a symbolic link`)
   }
 
   if (normalizedPath === normalizedBase) {
-    throw new Error(
-      `FileError: path "${path}" is the same as the current working directory "${base}"`
+    throw new FileError(
+      `path "${path}" is the same as the current working directory "${base}"`,
     )
   }
 
   if (!normalizedPath.startsWith(normalizedBase + "/")) {
-    throw new Error(
-      `FileError: real path "${realPath}" is not within the current working directory "${realBase}"`
+    throw new FileError(
+      `real path "${normalizedPath}" is not within the current working directory "${normalizedBase}"`,
     )
   }
 }
@@ -235,9 +297,7 @@ function readFile(path, encoding) {
 
     return readFileSync(path, encoding)
   } catch (exception) {
-    throw new Error(
-      `FileError: cannot read file "${path}": ${exception.message}`
-    )
+    throw new FileError(`cannot read file "${path}": ${exception.message}`)
   }
 }
 
@@ -286,7 +346,7 @@ const ALIASES = {
 }
 
 // Pre-compiled regex for better performance
-const KEY_VALIDATION_REGEX = /^[a-zA-Z0-9\-_]+$/
+const KEY_VALIDATION_REGEX = /^[a-zA-Z0-9\-_:]+$/
 const isKeyValid = (key) => KEY_VALIDATION_REGEX.test(key)
 
 const attributes = (options) => {
@@ -309,7 +369,6 @@ const attributes = (options) => {
         result.push(key)
       } else {
         const name = ALIASES[key] || key
-        const value = options[key]
         const content = Array.isArray(value) ? classes(...value) : value
         result.push(`${name}="${escapeHTML(content)}"`)
       }
@@ -330,8 +389,8 @@ const attributes = (options) => {
           const left = result.left || "0"
           styles.push(
             `${decamelize(param)}:${escapeHTML(
-              `${top} ${right} ${bottom} ${left}`
-            )}`
+              `${top} ${right} ${bottom} ${left}`,
+            )}`,
           )
         } else if (typeof result === "string" || typeof result === "number") {
           styles.push(`${decamelize(param)}:${escapeHTML(result)}`)
@@ -378,7 +437,7 @@ const render = (input, escape = true) => {
   if (Array.isArray(input)) {
     let result = ""
     for (let i = 0, ilen = input.length; i < ilen; i++) {
-      result += render(input[i])
+      result += render(input[i], escape)
     }
     return result
   }
@@ -480,9 +539,7 @@ const sanitizeHTML = (content) => {
 raw.load = function (path, options = {}) {
   const type = extension(path)
   if (!ALLOWED_RAW_EXTENSIONS.includes(type)) {
-    throw new Error(
-      `RawError: unsupported raw type "${type}" for path "${path}"`
-    )
+    throw new RawError(`unsupported raw type "${type}" for path "${path}"`)
   }
 
   let content = readFile(path, "utf8")
@@ -495,22 +552,48 @@ raw.load = function (path, options = {}) {
   return raw(content)
 }
 
-const tag = (a, b, c) => {
-  if (typeof b === "string" || typeof b === "number" || Array.isArray(b)) {
-    const name = a
-    const children = b
+const tag = (tagName, attrsOrChildren, ...restChildren) => {
+  // Check if second argument is children (not attributes)
+  const isChildrenNotAttributes =
+    typeof attrsOrChildren === "string" ||
+    typeof attrsOrChildren === "number" ||
+    Array.isArray(attrsOrChildren) ||
+    (attrsOrChildren &&
+      typeof attrsOrChildren === "object" &&
+      "name" in attrsOrChildren &&
+      "children" in attrsOrChildren)
+
+  // If we have rest arguments, they must be additional children
+  if (restChildren.length > 0) {
+    if (isChildrenNotAttributes) {
+      // tagName is name, attrsOrChildren is first child, restChildren are more children
+      return {
+        name: tagName,
+        children: [attrsOrChildren, ...restChildren],
+      }
+    } else {
+      // tagName is name, attrsOrChildren is attributes, restChildren are children
+      return {
+        name: tagName,
+        attributes: attrsOrChildren,
+        children: restChildren,
+      }
+    }
+  }
+
+  // Original two-argument logic
+  if (isChildrenNotAttributes) {
     return {
-      name,
-      children: children,
+      name: tagName,
+      children: attrsOrChildren,
     }
   }
-  const name = a
-  const attributes = b
-  const children = typeof c === "number" ? c : c || []
+
+  // attrsOrChildren is attributes, no children provided
   return {
-    name,
-    children,
-    attributes,
+    name: tagName,
+    children: [],
+    attributes: attrsOrChildren,
   }
 }
 
@@ -585,7 +668,7 @@ function css(inputs) {
   }
 }
 
-function occurences(input, string) {
+function occurrences(input, string) {
   if (string.length <= 0) {
     return input.length + 1
   }
@@ -606,8 +689,8 @@ function occurences(input, string) {
 }
 
 const validateCSS = (content, character1, character2) => {
-  const count1 = occurences(content, character1)
-  const count2 = occurences(content, character2)
+  const count1 = occurrences(content, character1)
+  const count2 = occurrences(content, character2)
   if (count1 !== count2) {
     return {
       valid: false,
@@ -639,7 +722,7 @@ css.load = function (path) {
   const content = readFile(file, "utf8")
   const { valid, message } = isCSSValid(content)
   if (!valid) {
-    throw new Error(`CSSError: invalid CSS for path "${file}": ${message}`)
+    throw new CSSError(`invalid CSS for path "${file}": ${message}`)
   }
   return css`
     ${content}
@@ -696,7 +779,10 @@ js.load = function (path, options = {}) {
   return { js: tag("script", attributes, content) }
 }
 
-const node = (name) => (options, children) => tag(name, options, children)
+const node =
+  (name) =>
+  (options, ...children) =>
+    tag(name, options, ...children)
 const Doctype = node("!DOCTYPE html")
 
 const nodes = [
@@ -871,9 +957,7 @@ function base64({ content, path }) {
 nodes.Img.load = function (path) {
   const type = extension(path)
   if (!ALLOWED_IMAGE_EXTENSIONS.includes(type)) {
-    throw new Error(
-      `ImageError: unsupported image type "${type}" for path "${path}"`
-    )
+    throw new ImageError(`unsupported image type "${type}" for path "${path}"`)
   }
   const content = readFile(path, "base64")
   return (options) => {
@@ -926,9 +1010,7 @@ const sanitizeSVG = (content) => {
 nodes.Svg.load = function (path, options = {}) {
   const type = extension(path)
   if (type !== "svg") {
-    throw new Error(
-      `SVGError: unsupported SVG type "${type}" for path "${path}"`
-    )
+    throw new SVGError(`unsupported SVG type "${type}" for path "${path}"`)
   }
   let content = readFile(path, "utf8")
   if (options.sanitize !== false) {
@@ -968,15 +1050,29 @@ const json = {
     try {
       return JSON.parse(content)
     } catch (exception) {
-      throw new Error(
-        `JSONError: cannot parse file "${file}": ${exception.message}`
-      )
+      throw new JSONError(`cannot parse file "${file}": ${exception.message}`)
     }
   },
 }
 
 function i18n(translations) {
   return function translate(language, key) {
+    if (key === undefined) {
+      throw new TranslationError("key is undefined")
+    }
+    if (language === undefined) {
+      throw new TranslationError("language is undefined")
+    }
+    if (translations[key] === undefined) {
+      throw new TranslationError(
+        `translation [${key}][${language}] is undefined`,
+      )
+    }
+    if (translations[key][language] === undefined) {
+      throw new TranslationError(
+        `translation [${key}][${language}] is undefined`,
+      )
+    }
     return translations[key][language]
   }
 }
@@ -995,14 +1091,14 @@ i18n.load = function (path, options = {}) {
 
   return function translate(language, key) {
     if (!language) {
-      throw new Error(`TranslationError: language is undefined`)
+      throw new TranslationError(`language is undefined`)
     }
     if (!key) {
-      throw new Error(`TranslationError: key is undefined`)
+      throw new TranslationError(`key is undefined`)
     }
     if (!data[key] || !data[key][language]) {
-      throw new Error(
-        `TranslationError: translation [${key}][${language}] is undefined`
+      throw new TranslationError(
+        `translation [${key}][${language}] is undefined`,
       )
     }
     return data[key][language]
@@ -1016,20 +1112,20 @@ function component(fn, { styles, i18n, scripts } = {}) {
     }
     if (i18n) {
       if (!a || !a.language) {
-        throw new Error(
-          `TranslationError: language is undefined for component:\n${fn.toString()}`
+        throw new TranslationError(
+          `language is undefined for component:\n${fn.toString()}`,
         )
       }
       const { language } = a
       function translate(key) {
         if (!key) {
-          throw new Error(
-            `TranslationError: key is undefined for component:\n${fn.toString()}`
+          throw new TranslationError(
+            `key is undefined for component:\n${fn.toString()}`,
           )
         }
         if (!i18n[key] || !i18n[key][language]) {
-          throw new Error(
-            `TranslationError: translation [${key}][${language}] is undefined for component:\n${fn.toString()}`
+          throw new TranslationError(
+            `translation [${key}][${language}] is undefined for component:\n${fn.toString()}`,
           )
         }
         const translation = i18n[key][language]
@@ -1045,11 +1141,27 @@ function component(fn, { styles, i18n, scripts } = {}) {
 
     if (styles) {
       const data = Array.isArray(styles) ? styles : [styles]
+      data.forEach((style, index) => {
+        if (!style || typeof style !== "object" || !style.css) {
+          throw new ComponentError(
+            `Invalid style object at index ${index}: missing .css property. ` +
+              `Styles must be created using the css\`...\` template tag or css.load() function.`,
+          )
+        }
+      })
       nodes = nodes.concat(data.map((style) => style.css))
     }
 
     if (scripts) {
       const data = Array.isArray(scripts) ? scripts : [scripts]
+      data.forEach((script, index) => {
+        if (!script || typeof script !== "object" || !script.js) {
+          throw new ComponentError(
+            `Invalid script object at index ${index}: missing .js property. ` +
+              `Scripts must be created using the js\`...\` template tag or js.load() function.`,
+          )
+        }
+      })
       nodes = nodes.concat(data.map((script) => script.js))
     }
 
@@ -1069,5 +1181,13 @@ module.exports = {
   json,
   tag,
   i18n,
+  TranslationError,
+  ComponentError,
+  FileError,
+  RawError,
+  CSSError,
+  ImageError,
+  SVGError,
+  JSONError,
   ...nodes,
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "boxwood",
-  "version": "2.6.0",
+  "version": "2.8.2",
   "description": "Compile HTML templates into JS",
   "main": "index.js",
   "types": "index.d.ts",
@@ -47,12 +47,12 @@
   "homepage": "https://github.com/buxlabs/boxwood#readme",
   "devDependencies": {
     "benchmark": "2.1.4",
-    "c8": "^10.1.3",
+    "c8": "^11.0.0",
     "express": "^5.2.1",
     "handlebars": "^4.7.8",
-    "jsdom": "^27.3.0",
+    "jsdom": "^28.1.0",
     "mustache": "^4.2.0",
-    "underscore": "^1.13.7"
+    "underscore": "^1.13.8"
   },
   "standard": {
     "ignore": [
@@ -62,7 +62,7 @@
     ]
   },
   "dependencies": {
-    "css-tree": "^3.1.0"
+    "css-tree": "^3.2.1"
   },
   "prettier": {
     "semi": false

package/ui/markdown/index.js

@@ -1,42 +1,181 @@
-const { component, H1, H2, H3, H4, H5, H6, P, Blockquote } = require("../..")
+const {
+  component,
+  H1,
+  H2,
+  H3,
+  H4,
+  H5,
+  H6,
+  P,
+  Blockquote,
+  Ul,
+  Ol,
+  Li,
+  Strong,
+  Em,
+  Code,
+} = require("../..")
+
+const ORDERED_LIST_REGEXP = /^\d+\.\s/
+const UNORDERED_MARKERS = ["- ", "— ", "– ", "• "]
+const HEADINGS = [
+  { prefix: "###### ", type: "h6" },
+  { prefix: "##### ", type: "h5" },
+  { prefix: "#### ", type: "h4" },
+  { prefix: "### ", type: "h3" },
+  { prefix: "## ", type: "h2" },
+  { prefix: "# ", type: "h1" },
+]
+const COMPONENTS = {
+  h1: H1,
+  h2: H2,
+  h3: H3,
+  h4: H4,
+  h5: H5,
+  h6: H6,
+  blockquote: Blockquote,
+}
+
+function format(text) {
+  if (!text.includes("*") && !text.includes("`")) {
+    return text
+  }
+
+  const result = []
+  let i = 0
+  while (i < text.length) {
+    if (text[i] === "`") {
+      const start = i + 1
+      const end = text.indexOf("`", start)
+      if (end === -1) {
+        result.push(text[i])
+        i++
+      } else {
+        result.push(Code({}, text.substring(start, end)))
+        i = end + 1
+      }
+    } else if (text[i] === "*" && text[i + 1] === "*") {
+      const start = i + 2
+      const end = text.indexOf("**", start)
+      if (end === -1) {
+        result.push(text[i])
+        i++
+      } else {
+        result.push(Strong(text.substring(start, end)))
+        i = end + 2
+      }
+    } else if (text[i] === "*") {
+      const start = i + 1
+      const end = text.indexOf("*", start)
+      if (end === -1) {
+        result.push(text[i])
+        i++
+      } else {
+        result.push(Em(text.substring(start, end)))
+        i = end + 1
+      }
+    } else {
+      let next = text.length
+      const nextCode = text.indexOf("`", i)
+      const nextStar = text.indexOf("*", i)
+      if (nextCode !== -1 && nextCode < next) next = nextCode
+      if (nextStar !== -1 && nextStar < next) next = nextStar
+      if (next === text.length) {
+        result.push(text.substring(i))
+        break
+      }
+      result.push(text.substring(i, next))
+      i = next
+    }
+  }
+  return result.length > 0 ? result : text
+}
 
 function Markdown(params, children) {
-  if (typeof children === "string") {
-    const lines = children
-      .trim()
-      .split("\n")
-      .map((line) => line.trim())
-      .filter(Boolean)
-
-    return lines.map((line) => {
-      if (line.startsWith("# ")) {
-        const text = line.substring(2)
-        return H1(params, text)
-      } else if (line.startsWith("## ")) {
-        const text = line.substring(3)
-        return H2(params, text)
-      } else if (line.startsWith("### ")) {
-        const text = line.substring(4)
-        return H3(params, text)
-      } else if (line.startsWith("#### ")) {
-        const text = line.substring(5)
-        return H4(params, text)
-      } else if (line.startsWith("##### ")) {
-        const text = line.substring(6)
-        return H5(params, text)
-      } else if (line.startsWith("###### ")) {
-        const text = line.substring(7)
-        return H6(params, text)
-      } else if (line.startsWith("> ")) {
-        const text = line.substring(2)
-        return Blockquote(params, text)
-      }
-
-      return P(params, line)
-    })
-  } else {
+  if (Array.isArray(children)) {
+    return children.map((child) => Markdown(params, child))
+  }
+
+  if (typeof children !== "string") {
     return null
   }
+
+  const lines = children
+    .trim()
+    .split("\n")
+    .map((line) => line.trim())
+    .filter(Boolean)
+
+  const items = lines
+    .map((line) => {
+      if (UNORDERED_MARKERS.some((marker) => line.startsWith(marker))) {
+        const content = line.substring(2)
+        if (!content) return null
+        return { type: "li", list: "ul", content }
+      }
+
+      if (ORDERED_LIST_REGEXP.test(line)) {
+        const content = line.replace(ORDERED_LIST_REGEXP, "")
+        if (!content) return null
+        return { type: "li", list: "ol", content }
+      }
+
+      for (const { prefix, type } of HEADINGS) {
+        if (line.startsWith(prefix)) {
+          return { type, content: line.substring(prefix.length) }
+        }
+      }
+
+      if (line.startsWith("> ")) {
+        return { type: "blockquote", content: line.substring(2) }
+      }
+
+      return { type: "p", content: line }
+    })
+    .filter(Boolean)
+
+  const nodes = []
+  let i = 0
+
+  while (i < items.length) {
+    const item = items[i]
+
+    if (item.type === "li") {
+      const list = []
+      const parent = item.list
+
+      while (
+        i < items.length &&
+        items[i].type === "li" &&
+        items[i].list === parent
+      ) {
+        list.push(Li(params, format(items[i].content)))
+        i++
+      }
+
+      if (parent === "ul") {
+        nodes.push(Ul(params, list))
+      } else if (parent === "ol") {
+        nodes.push(Ol(params, list))
+      }
+    } else if (item.type === "blockquote") {
+      const lines = []
+
+      while (i < items.length && items[i].type === "blockquote") {
+        lines.push(items[i].content)
+        i++
+      }
+
+      nodes.push(Blockquote(params, P(params, format(lines.join("\n")))))
+    } else {
+      const { type, content } = item
+      const Component = COMPONENTS[type] || P
+      nodes.push(Component(params, format(content)))
+      i++
+    }
+  }
+
+  return nodes
 }
 
 module.exports = component(Markdown)