@stacksjs/stx 0.2.112 → 0.2.114

package/dist/slots.js

@@ -27,32 +27,117 @@ function findMatchingTemplateClose(content, startIndex) {
   }
   return depth === 0 ? i : -1;
 }
+const VOID_ELEMENTS = new Set([
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "link",
+  "meta",
+  "param",
+  "source",
+  "track",
+  "wbr"
+]);
+function findTagEnd(content, startIndex) {
+  let quote = null;
+  for (let index = startIndex;index < content.length; index++) {
+    const character = content[index];
+    if (quote) {
+      if (character === "\\") {
+        index++;
+        continue;
+      }
+      if (character === quote)
+        quote = null;
+      continue;
+    }
+    if (character === '"' || character === "'") {
+      quote = character;
+      continue;
+    }
+    if (character === ">")
+      return index + 1;
+  }
+  return -1;
+}
+function findDirectNamedSlotTemplates(content) {
+  const slots = [], stack = [], slotOpenPattern = /^<template\s+(?:#([a-zA-Z][\w-]*)|v-slot:([a-zA-Z][\w-]*)|slot="([a-zA-Z][\w-]*)")(?:\s*=\s*"([^"]*)")?[^>]*>$/i;
+  let cursor = 0;
+  while (cursor < content.length) {
+    const tagStart = content.indexOf("<", cursor);
+    if (tagStart === -1)
+      break;
+    if (content.startsWith("<!--", tagStart)) {
+      const commentEnd = content.indexOf("-->", tagStart + 4);
+      cursor = commentEnd === -1 ? content.length : commentEnd + 3;
+      continue;
+    }
+    const tagEnd = findTagEnd(content, tagStart + 1);
+    if (tagEnd === -1)
+      break;
+    const tag = content.slice(tagStart, tagEnd), tagMatch = tag.match(/^<\s*(\/?)\s*([a-zA-Z][\w-]*)/);
+    if (!tagMatch) {
+      cursor = tagEnd;
+      continue;
+    }
+    const closing = tagMatch[1] === "/", tagName = tagMatch[2].toLowerCase();
+    if (closing) {
+      const matchingIndex = stack.lastIndexOf(tagName);
+      if (matchingIndex !== -1)
+        stack.splice(matchingIndex);
+      cursor = tagEnd;
+      continue;
+    }
+    if (tagName === "template" && stack.length === 0) {
+      const slotMatch = tag.match(slotOpenPattern);
+      if (slotMatch) {
+        const closeEnd = findMatchingTemplateClose(content, tagEnd);
+        if (closeEnd !== -1) {
+          const slotName = slotMatch[1] || slotMatch[2] || slotMatch[3];
+          slots.push({
+            start: tagStart,
+            end: closeEnd,
+            slotName,
+            content: content.slice(tagEnd, closeEnd - 11).trim(),
+            propsBinding: slotMatch[4] || void 0
+          });
+          cursor = closeEnd;
+          continue;
+        }
+      }
+    }
+    if (!/\/\s*>$/.test(tag) && !VOID_ELEMENTS.has(tagName)) {
+      stack.push(tagName);
+      if (tagName === "script" || tagName === "style") {
+        const rawClose = content.toLowerCase().indexOf(`</${tagName}>`, tagEnd);
+        if (rawClose !== -1) {
+          cursor = rawClose;
+          continue;
+        }
+      }
+    }
+    cursor = tagEnd;
+  }
+  return slots;
+}
 export function parseSlots(childContent) {
   const result = {
     default: "",
     named: new Map
   };
   let workingContent = childContent;
-  const slotOpenRegex = /<template\s+(?:#([a-zA-Z][\w-]*)|v-slot:([a-zA-Z][\w-]*)|slot="([a-zA-Z][\w-]*)")(?:\s*=\s*"([^"]*)")?[^>]*>/gi, slotsToRemove = [];
-  let match;
-  while ((match = slotOpenRegex.exec(childContent)) !== null) {
-    const [fullOpenTag, hashName, vSlotName, slotAttrName, propsBinding] = match, slotName = hashName || vSlotName || slotAttrName, openTagEnd = match.index + fullOpenTag.length, closeEnd = findMatchingTemplateClose(childContent, openTagEnd);
-    if (closeEnd !== -1) {
-      const content = childContent.slice(openTagEnd, closeEnd - 11).trim();
-      slotsToRemove.push({
-        start: match.index,
-        end: closeEnd,
-        slotName,
-        content,
-        propsBinding: propsBinding || void 0
-      });
-      result.named.set(slotName, {
-        name: slotName,
-        content,
-        propsBinding: propsBinding || void 0
-      });
-    }
-  }
+  const slotsToRemove = findDirectNamedSlotTemplates(childContent);
+  for (const slot of slotsToRemove)
+    result.named.set(slot.slotName, {
+      name: slot.slotName,
+      content: slot.content,
+      propsBinding: slot.propsBinding
+    });
   slotsToRemove.sort((a, b) => b.start - a.start);
   for (const slot of slotsToRemove)
     workingContent = workingContent.slice(0, slot.start) + workingContent.slice(slot.end);