@shikijs/core 1.2.4 → 1.4.0

package/dist/chunk-tokens.d.mts

@@ -881,6 +881,7 @@ interface ShikiTransformerContext extends ShikiTransformerContextSource {
     readonly pre: Element;
     readonly code: Element;
     readonly lines: Element[];
+    readonly structure: CodeToHastOptions['structure'];
     /**
      * Utility to append class to a hast node
      *
@@ -1093,6 +1094,15 @@ interface CodeToHastOptionsCommon<Languages extends string = string> extends Tra
      * @default true
      */
     mergeWhitespaces?: boolean | 'never';
+    /**
+     * The structure of the generated HAST and HTML.
+     *
+     * - `classic`: The classic structure with `<pre>` and `<code>` elements, each line wrapped with a `<span class="line">` element.
+     * - `inline`: All tokens are rendered as `<span>`, line breaks are rendered as `<br>`. No `<pre>` or `<code>` elements. Default forground and background colors are not applied.
+     *
+     * @default 'classic'
+     */
+    structure?: 'classic' | 'inline';
 }
 interface CodeOptionsMeta {
     /**

package/dist/index.mjs

@@ -1032,10 +1032,11 @@ function codeToHast(internal, code, options, transformerContext = {
 function tokensToHast(tokens, options, transformerContext) {
     const transformers = getTransformers(options);
     const lines = [];
-    const tree = {
+    const root = {
         type: 'root',
         children: [],
     };
+    const { structure = 'classic', } = options;
     let preNode = {
         type: 'element',
         tagName: 'pre',
@@ -1057,6 +1058,7 @@ function tokensToHast(tokens, options, transformerContext) {
     const lineNodes = [];
     const context = {
         ...transformerContext,
+        structure,
         addClassToHast,
         get source() {
             return transformerContext.source;
@@ -1068,7 +1070,7 @@ function tokensToHast(tokens, options, transformerContext) {
             return options;
         },
         get root() {
-            return tree;
+            return root;
         },
         get pre() {
             return preNode;
@@ -1081,8 +1083,12 @@ function tokensToHast(tokens, options, transformerContext) {
         },
     };
     tokens.forEach((line, idx) => {
-        if (idx)
-            lines.push({ type: 'text', value: '\n' });
+        if (idx) {
+            if (structure === 'inline')
+                root.children.push({ type: 'element', tagName: 'br', properties: {}, children: [] });
+            else if (structure === 'classic')
+                lines.push({ type: 'text', value: '\n' });
+        }
         let lineNode = {
             type: 'element',
             tagName: 'span',
@@ -1102,21 +1108,28 @@ function tokensToHast(tokens, options, transformerContext) {
                 tokenNode.properties.style = style;
             for (const transformer of transformers)
                 tokenNode = transformer?.span?.call(context, tokenNode, idx + 1, col, lineNode) || tokenNode;
-            lineNode.children.push(tokenNode);
+            if (structure === 'inline')
+                root.children.push(tokenNode);
+            else if (structure === 'classic')
+                lineNode.children.push(tokenNode);
             col += token.content.length;
         }
-        for (const transformer of transformers)
-            lineNode = transformer?.line?.call(context, lineNode, idx + 1) || lineNode;
-        lineNodes.push(lineNode);
-        lines.push(lineNode);
+        if (structure === 'classic') {
+            for (const transformer of transformers)
+                lineNode = transformer?.line?.call(context, lineNode, idx + 1) || lineNode;
+            lineNodes.push(lineNode);
+            lines.push(lineNode);
+        }
     });
-    for (const transformer of transformers)
-        codeNode = transformer?.code?.call(context, codeNode) || codeNode;
-    preNode.children.push(codeNode);
-    for (const transformer of transformers)
-        preNode = transformer?.pre?.call(context, preNode) || preNode;
-    tree.children.push(preNode);
-    let result = tree;
+    if (structure === 'classic') {
+        for (const transformer of transformers)
+            codeNode = transformer?.code?.call(context, codeNode) || codeNode;
+        preNode.children.push(codeNode);
+        for (const transformer of transformers)
+            preNode = transformer?.pre?.call(context, preNode) || preNode;
+        root.children.push(preNode);
+    }
+    let result = root;
     for (const transformer of transformers)
         result = transformer?.root?.call(context, result) || result;
     return result;
@@ -3259,6 +3272,12 @@ function stringifyEntities(value, options) {
  */
 
 
+const htmlCommentRegex = /^>|^->|<!--|-->|--!>|<!-$/g;
+
+// Declare arrays as variables so it can be cached by `stringifyEntities`
+const bogusCommentEntitySubset = ['>'];
+const commentEntitySubset = ['<', '>'];
+
 /**
  * Serialize a comment.
  *
@@ -3279,10 +3298,12 @@ function comment(node, _1, _2, state) {
     ? '<?' +
         stringifyEntities(
           node.value,
-          Object.assign({}, state.settings.characterReferences, {subset: ['>']})
+          Object.assign({}, state.settings.characterReferences, {
+            subset: bogusCommentEntitySubset
+          })
         ) +
         '>'
-    : '<!--' + node.value.replace(/^>|^->|<!--|-->|--!>|<!-$/g, encode) + '-->'
+    : '<!--' + node.value.replace(htmlCommentRegex, encode) + '-->'
 
   /**
    * @param {string} $0
@@ -3291,7 +3312,7 @@ function comment(node, _1, _2, state) {
     return stringifyEntities(
       $0,
       Object.assign({}, state.settings.characterReferences, {
-        subset: ['<', '>']
+        subset: commentEntitySubset
       })
     )
   }
@@ -4116,7 +4137,7 @@ function element(node, index, parent, state) {
     state.schema = svg;
   }
 
-  const attrs = serializeAttributes(state, node.properties);
+  const attributes = serializeAttributes(state, node.properties);
 
   const content = state.all(
     schema.space === 'html' && node.tagName === 'template' ? node.content : node
@@ -4132,14 +4153,14 @@ function element(node, index, parent, state) {
   // longer void.
   if (content) selfClosing = false;
 
-  if (attrs || !omit || !opening(node, index, parent)) {
-    parts.push('<', node.tagName, attrs ? ' ' + attrs : '');
+  if (attributes || !omit || !opening(node, index, parent)) {
+    parts.push('<', node.tagName, attributes ? ' ' + attributes : '');
 
     if (
       selfClosing &&
       (schema.space === 'svg' || state.settings.closeSelfClosing)
     ) {
-      last = attrs.charAt(attrs.length - 1);
+      last = attributes.charAt(attributes.length - 1);
       if (
         !state.settings.tightSelfClosing ||
         last === '/' ||
@@ -4165,20 +4186,20 @@ function element(node, index, parent, state) {
 
 /**
  * @param {State} state
- * @param {Properties | null | undefined} props
+ * @param {Properties | null | undefined} properties
  * @returns {string}
  */
-function serializeAttributes(state, props) {
+function serializeAttributes(state, properties) {
   /** @type {Array<string>} */
   const values = [];
   let index = -1;
   /** @type {string} */
   let key;
 
-  if (props) {
-    for (key in props) {
-      if (props[key] !== null && props[key] !== undefined) {
-        const value = serializeAttribute(state, key, props[key]);
+  if (properties) {
+    for (key in properties) {
+      if (properties[key] !== null && properties[key] !== undefined) {
+        const value = serializeAttribute(state, key, properties[key]);
         if (value) values.push(value);
       }
     }
@@ -4317,6 +4338,9 @@ function serializeAttribute(state, key, value) {
  */
 
 
+// Declare array as variable so it can be cached by `stringifyEntities`
+const textEntitySubset = ['<', '&'];
+
 /**
  * Serialize a text node.
  *
@@ -4340,7 +4364,7 @@ function text(node, _, parent, state) {
     : stringifyEntities(
         node.value,
         Object.assign({}, state.settings.characterReferences, {
-          subset: ['<', '&']
+          subset: textEntitySubset
         })
       )
 }
@@ -4921,7 +4945,7 @@ function isResponse(dataOrOptions) {
 function isArrayBuffer(data) {
     return (typeof ArrayBuffer !== 'undefined' && (data instanceof ArrayBuffer || ArrayBuffer.isView(data)))
         // eslint-disable-next-line node/prefer-global/buffer
-        || (typeof Buffer !== 'undefined' && Buffer.isBuffer(data))
+        || (typeof Buffer !== 'undefined' && Buffer.isBuffer?.(data))
         || (typeof SharedArrayBuffer !== 'undefined' && data instanceof SharedArrayBuffer)
         || (typeof Uint32Array !== 'undefined' && data instanceof Uint32Array);
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@shikijs/core",
   "type": "module",
-  "version": "1.2.4",
+  "version": "1.4.0",
   "description": "Core of Shiki",
   "author": "Pine Wu <octref@gmail.com>; Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -60,7 +60,7 @@
     "dist"
   ],
   "devDependencies": {
-    "hast-util-to-html": "^9.0.0",
+    "hast-util-to-html": "^9.0.1",
     "vscode-oniguruma": "^1.7.0"
   },
   "scripts": {