@weapp-vite/web 1.0.1 → 1.2.0

package/dist/index.mjs

@@ -30,6 +30,7 @@ import MagicString from "magic-string";
 import { dirname as dirname2, extname, join, normalize, posix, relative as relative2, resolve } from "pathe";
 
 // src/compiler/wxml.ts
+import { readFileSync } from "fs";
 import { parseDocument } from "htmlparser2";
 import { dirname, relative } from "pathe";
 
@@ -96,6 +97,8 @@ function normalizeTagName(name) {
       return "select";
     case "block":
       return "#fragment";
+    case "slot":
+      return "slot";
     default:
       return name || "div";
   }
@@ -111,6 +114,13 @@ function normalizeAttributeName(name) {
 }
 
 // src/compiler/wxml.ts
+function shouldMarkWxsImport(pathname) {
+  const lower = pathname.toLowerCase();
+  if (lower.endsWith(".wxs") || lower.endsWith(".wxs.ts") || lower.endsWith(".wxs.js")) {
+    return false;
+  }
+  return lower.endsWith(".ts") || lower.endsWith(".js");
+}
 function isRenderableNode(node) {
   if (node.type === "directive" || node.type === "comment") {
     return false;
@@ -317,6 +327,140 @@ function buildExpression(parts, scopeVar, wxsVar) {
   });
   return `(${segments.join(" + ")})`;
 }
+function hasTopLevelColon(expression) {
+  let depth = 0;
+  let inSingleQuote = false;
+  let inDoubleQuote = false;
+  let inTemplate = false;
+  let escaped = false;
+  let sawTopLevelQuestion = false;
+  for (let index = 0; index < expression.length; index += 1) {
+    const char = expression[index];
+    if (inSingleQuote) {
+      if (escaped) {
+        escaped = false;
+        continue;
+      }
+      if (char === "\\") {
+        escaped = true;
+        continue;
+      }
+      if (char === "'") {
+        inSingleQuote = false;
+      }
+      continue;
+    }
+    if (inDoubleQuote) {
+      if (escaped) {
+        escaped = false;
+        continue;
+      }
+      if (char === "\\") {
+        escaped = true;
+        continue;
+      }
+      if (char === '"') {
+        inDoubleQuote = false;
+      }
+      continue;
+    }
+    if (inTemplate) {
+      if (escaped) {
+        escaped = false;
+        continue;
+      }
+      if (char === "\\") {
+        escaped = true;
+        continue;
+      }
+      if (char === "`") {
+        inTemplate = false;
+      }
+      continue;
+    }
+    if (char === "'") {
+      inSingleQuote = true;
+      continue;
+    }
+    if (char === '"') {
+      inDoubleQuote = true;
+      continue;
+    }
+    if (char === "`") {
+      inTemplate = true;
+      continue;
+    }
+    if (char === "(" || char === "[" || char === "{") {
+      depth += 1;
+      continue;
+    }
+    if (char === ")" || char === "]" || char === "}") {
+      depth = Math.max(0, depth - 1);
+      continue;
+    }
+    if (depth !== 0) {
+      continue;
+    }
+    if (char === "?") {
+      sawTopLevelQuestion = true;
+      continue;
+    }
+    if (char === ":") {
+      return !sawTopLevelQuestion;
+    }
+  }
+  return false;
+}
+function shouldWrapShorthandObject(expression) {
+  const trimmed = expression.trim();
+  if (!trimmed) {
+    return false;
+  }
+  if (trimmed.startsWith("{") || trimmed.startsWith("[") || trimmed.startsWith("(")) {
+    return false;
+  }
+  return hasTopLevelColon(trimmed);
+}
+function buildTemplateDataExpression(raw, scopeVar, wxsVar) {
+  const trimmed = raw.trim();
+  const parts = parseInterpolations(trimmed);
+  if (parts.length === 1 && parts[0]?.type === "expr") {
+    const expr = parts[0].value.trim();
+    if (expr) {
+      const normalizedExpr = shouldWrapShorthandObject(expr) ? `{ ${expr} }` : expr;
+      return buildExpression([{ type: "expr", value: normalizedExpr }], scopeVar, wxsVar);
+    }
+  }
+  return buildExpression(parseInterpolations(raw), scopeVar, wxsVar);
+}
+function createDependencyContext() {
+  return {
+    warnings: [],
+    dependencies: [],
+    dependencySet: /* @__PURE__ */ new Set(),
+    visited: /* @__PURE__ */ new Set(),
+    active: /* @__PURE__ */ new Set(),
+    circularWarnings: /* @__PURE__ */ new Set()
+  };
+}
+function addDependency(value, context, direct) {
+  if (!context.dependencySet.has(value)) {
+    context.dependencySet.add(value);
+    context.dependencies.push(value);
+    direct?.push(value);
+  }
+}
+function warnReadTemplate(context, target) {
+  context.warnings.push(`[web] \u65E0\u6CD5\u8BFB\u53D6\u6A21\u677F\u4F9D\u8D56: ${target}`);
+}
+function warnCircularTemplate(context, from, target) {
+  const key = `${from}=>${target}`;
+  if (context.circularWarnings.has(key)) {
+    return;
+  }
+  context.circularWarnings.add(key);
+  context.warnings.push(`[web] WXML \u5FAA\u73AF\u5F15\u7528: ${from} -> ${target}`);
+}
 function extractFor(attribs) {
   const expr = attribs["wx:for"];
   const itemName = attribs["wx:for-item"]?.trim() || "item";
@@ -361,6 +505,25 @@ function parseEventAttribute(name) {
   }
   return { prefix: name.slice(0, name.length - match[1].length), rawEvent: match[1] };
 }
+function resolveComponentTagName(name, componentTags) {
+  if (!componentTags) {
+    return void 0;
+  }
+  return componentTags[name] ?? componentTags[name.toLowerCase()];
+}
+var PROPERTY_BIND_EXCLUSIONS = /* @__PURE__ */ new Set(["class", "style", "id", "slot"]);
+function shouldBindAsProperty(name) {
+  if (PROPERTY_BIND_EXCLUSIONS.has(name)) {
+    return false;
+  }
+  if (name.startsWith("data-") || name.startsWith("aria-")) {
+    return false;
+  }
+  return true;
+}
+function normalizePropertyName(name) {
+  return name.replace(/-([a-z])/g, (_, char) => char.toUpperCase());
+}
 function renderAttributes(attribs, scopeVar, wxsVar, options) {
   let buffer = "";
   for (const [rawName, rawValue] of Object.entries(attribs)) {
@@ -379,24 +542,31 @@ function renderAttributes(attribs, scopeVar, wxsVar, options) {
       buffer += ` @${domEvent}=\${ctx.event(${JSON.stringify(event)}, ${handlerExpr}, ${scopeVar}, ${wxsVar}, ${JSON.stringify(flags)})}`;
       continue;
     }
-    const name = normalizeAttributeName(rawName);
+    const useProperty = options?.preferProperty && shouldBindAsProperty(rawName);
+    const name = useProperty ? normalizePropertyName(rawName) : normalizeAttributeName(rawName);
     const expr = buildExpression(parseInterpolations(rawValue ?? ""), scopeVar, wxsVar);
-    buffer += ` ${name}=\${${expr}}`;
+    buffer += ` ${useProperty ? "." : ""}${name}=\${${expr}}`;
   }
   return buffer;
 }
 var Renderer = class {
-  renderNodes(nodes, scopeVar, wxsVar) {
+  renderNodes(nodes, scopeVar, wxsVar, componentTags) {
     const parts = [];
     for (let index = 0; index < nodes.length; index += 1) {
       const node = nodes[index];
       if (isConditionalElement(node)) {
-        const { rendered, endIndex } = this.renderConditionalSequence(nodes, index, scopeVar, wxsVar);
+        const { rendered, endIndex } = this.renderConditionalSequence(
+          nodes,
+          index,
+          scopeVar,
+          wxsVar,
+          componentTags
+        );
         parts.push(rendered);
         index = endIndex;
         continue;
       }
-      parts.push(this.renderNode(node, scopeVar, wxsVar));
+      parts.push(this.renderNode(node, scopeVar, wxsVar, componentTags));
     }
     if (parts.length === 0) {
       return '""';
@@ -406,7 +576,7 @@ var Renderer = class {
     }
     return `[${parts.join(", ")}]`;
   }
-  renderConditionalSequence(nodes, startIndex, scopeVar, wxsVar) {
+  renderConditionalSequence(nodes, startIndex, scopeVar, wxsVar, componentTags) {
     const branches = [];
     let cursor = startIndex;
     while (cursor < nodes.length) {
@@ -432,44 +602,44 @@ var Renderer = class {
       if (!node) {
         return { rendered: '""', endIndex: startIndex };
       }
-      return { rendered: this.renderNode(node, scopeVar, wxsVar), endIndex: startIndex };
+      return { rendered: this.renderNode(node, scopeVar, wxsVar, componentTags), endIndex: startIndex };
     }
     let expr = '""';
     for (let index = branches.length - 1; index >= 0; index -= 1) {
       const { node, attribs } = branches[index];
       const cleanedAttribs = stripControlAttributes(attribs);
       if ("wx:else" in attribs) {
-        expr = this.renderElement(node, scopeVar, wxsVar, { overrideAttribs: cleanedAttribs });
+        expr = this.renderElement(node, scopeVar, wxsVar, componentTags, { overrideAttribs: cleanedAttribs });
         continue;
       }
       const conditionExpr = attribs["wx:if"] ?? attribs["wx:elif"] ?? "";
-      const rendered = this.renderElement(node, scopeVar, wxsVar, { overrideAttribs: cleanedAttribs });
+      const rendered = this.renderElement(node, scopeVar, wxsVar, componentTags, { overrideAttribs: cleanedAttribs });
       const condition = buildExpression(parseInterpolations(conditionExpr), scopeVar, wxsVar);
       expr = `(${condition} ? ${rendered} : ${expr})`;
     }
     return { rendered: expr, endIndex: startIndex + branches.length - 1 };
   }
-  renderNode(node, scopeVar, wxsVar) {
+  renderNode(node, scopeVar, wxsVar, componentTags) {
     if (node.type === "text") {
       const parts = parseInterpolations(node.data ?? "");
       return buildExpression(parts, scopeVar, wxsVar);
     }
     if (node.type === "element") {
       if (node.name === "template" && node.attribs?.is) {
-        return this.renderTemplateInvoke(node, scopeVar, wxsVar);
+        return this.renderTemplateInvoke(node, scopeVar, wxsVar, componentTags);
       }
-      return this.renderElement(node, scopeVar, wxsVar);
+      return this.renderElement(node, scopeVar, wxsVar, componentTags);
     }
     return '""';
   }
-  renderTemplateInvoke(node, scopeVar, wxsVar) {
+  renderTemplateInvoke(node, scopeVar, wxsVar, _componentTags) {
     const attribs = node.attribs ?? {};
     const isExpr = buildExpression(parseInterpolations(attribs.is ?? ""), scopeVar, wxsVar);
-    const dataExpr = attribs.data ? buildExpression(parseInterpolations(attribs.data), scopeVar, wxsVar) : void 0;
+    const dataExpr = attribs.data ? buildTemplateDataExpression(attribs.data, scopeVar, wxsVar) : void 0;
     const scopeExpr = dataExpr ? `ctx.mergeScope(${scopeVar}, ${dataExpr})` : scopeVar;
     return `ctx.renderTemplate(__templates, ${isExpr}, ${scopeExpr}, ctx)`;
   }
-  renderElement(node, scopeVar, wxsVar, options = {}) {
+  renderElement(node, scopeVar, wxsVar, componentTags, options = {}) {
     const attribs = options.overrideAttribs ?? node.attribs ?? {};
     if (!options.skipFor) {
       const forInfo = extractFor(node.attribs ?? {});
@@ -483,19 +653,24 @@ var Renderer = class {
           node,
           "__scope",
           wxsVar,
+          componentTags,
           { skipFor: true, overrideAttribs: forInfo.restAttribs }
         );
         const keyExpr = `ctx.key(${JSON.stringify(forInfo.key ?? "")}, ${itemVar}, ${indexVar}, ${scopeExpr}, ${wxsVar})`;
         return `repeat(${listExpr}, (${itemVar}, ${indexVar}) => ${keyExpr}, (${itemVar}, ${indexVar}) => { const __scope = ${scopeExpr}; return ${itemRender}; })`;
       }
     }
-    const tagName = normalizeTagName(node.name ?? "");
+    const customTag = resolveComponentTagName(node.name ?? "", componentTags);
+    const tagName = customTag ?? normalizeTagName(node.name ?? "");
     if (tagName === "#fragment") {
-      return this.renderNodes(node.children ?? [], scopeVar, wxsVar);
+      return this.renderNodes(node.children ?? [], scopeVar, wxsVar, componentTags);
     }
-    const attrs = renderAttributes(attribs, scopeVar, wxsVar, { skipControl: true });
+    const attrs = renderAttributes(attribs, scopeVar, wxsVar, {
+      skipControl: true,
+      preferProperty: Boolean(customTag)
+    });
     const childNodes = node.children ?? [];
-    const children = childNodes.map((child) => `\${${this.renderNode(child, scopeVar, wxsVar)}}`).join("");
+    const children = childNodes.map((child) => `\${${this.renderNode(child, scopeVar, wxsVar, componentTags)}}`).join("");
     if (SELF_CLOSING_TAGS.has(tagName) && childNodes.length === 0) {
       return `html\`<${tagName}${attrs} />\``;
     }
@@ -515,29 +690,38 @@ function collectSpecialNodes(nodes, context) {
         });
         continue;
       }
-      if (name === "import" && node.attribs?.src) {
+      if ((name === "import" || name === "wx-import") && node.attribs?.src) {
         const resolved = context.resolveTemplate(node.attribs.src);
         if (resolved) {
           context.imports.push({
             id: resolved,
             importName: `__wxml_import_${context.imports.length}`
           });
+        } else {
+          context.warnings.push(`[web] \u65E0\u6CD5\u89E3\u6790\u6A21\u677F\u4F9D\u8D56: ${node.attribs.src} (from ${context.sourceId})`);
         }
         continue;
       }
-      if (name === "include" && node.attribs?.src) {
+      if ((name === "include" || name === "wx-include") && node.attribs?.src) {
         const resolved = context.resolveTemplate(node.attribs.src);
         if (resolved) {
           context.includes.push({
             id: resolved,
             importName: `__wxml_include_${context.includes.length}`
           });
+        } else {
+          context.warnings.push(`[web] \u65E0\u6CD5\u89E3\u6790\u6A21\u677F\u4F9D\u8D56: ${node.attribs.src} (from ${context.sourceId})`);
         }
         continue;
       }
       if (name === "wxs") {
         const moduleName = node.attribs?.module?.trim();
         if (moduleName) {
+          const previousSource = context.wxsModules.get(moduleName);
+          if (previousSource) {
+            context.warnings.push(`[web] WXS \u6A21\u5757\u540D\u91CD\u590D: ${moduleName} (from ${context.sourceId})`);
+          }
+          context.wxsModules.set(moduleName, context.sourceId);
           if (node.attribs?.src) {
             const resolved = context.resolveWxs(node.attribs.src);
             if (resolved) {
@@ -580,8 +764,50 @@ function normalizeTemplatePath(pathname) {
   return pathname.split("\\").join("/");
 }
 function compileWxml(options) {
+  const dependencyContext = options.dependencyContext ?? createDependencyContext();
+  const expandDependencies = options.expandDependencies ?? !options.dependencyContext;
+  const warnings = dependencyContext.warnings;
+  const expandDependencyTree = (dependencies2, importer) => {
+    for (const target of dependencies2) {
+      if (!target) {
+        continue;
+      }
+      if (dependencyContext.active.has(target)) {
+        warnCircularTemplate(dependencyContext, importer, target);
+        continue;
+      }
+      if (dependencyContext.visited.has(target)) {
+        continue;
+      }
+      dependencyContext.visited.add(target);
+      dependencyContext.active.add(target);
+      let source;
+      try {
+        source = readFileSync(target, "utf8");
+      } catch {
+        warnReadTemplate(dependencyContext, target);
+        dependencyContext.active.delete(target);
+        continue;
+      }
+      try {
+        const result = compileWxml({
+          id: target,
+          source,
+          resolveTemplatePath: options.resolveTemplatePath,
+          resolveWxsPath: options.resolveWxsPath,
+          dependencyContext,
+          expandDependencies: false
+        });
+        expandDependencyTree(result.dependencies, target);
+      } catch (error) {
+        if (error instanceof Error && error.message) {
+          warnings.push(`[web] \u65E0\u6CD5\u89E3\u6790\u6A21\u677F\u4F9D\u8D56: ${target} ${error.message}`);
+        }
+      }
+      dependencyContext.active.delete(target);
+    }
+  };
   let nodes = parseWxml(options.source);
-  const warnings = [];
   let navigationBarAttrs;
   if (options.navigationBar) {
     const extracted = extractNavigationBarFromPageMeta(nodes);
@@ -595,11 +821,15 @@ function compileWxml(options) {
   const includes = [];
   const imports = [];
   const wxs = [];
+  const wxsModules = /* @__PURE__ */ new Map();
   const renderNodesList = collectSpecialNodes(nodes, {
     templates,
     includes,
     imports,
     wxs,
+    wxsModules,
+    warnings,
+    sourceId: options.id,
     resolveTemplate: (raw) => options.resolveTemplatePath(raw, options.id),
     resolveWxs: (raw) => options.resolveWxsPath(raw, options.id)
   });
@@ -616,22 +846,23 @@ function compileWxml(options) {
     `import { repeat } from 'lit/directives/repeat.js'`
   ];
   const bodyLines = [];
-  const dependencies = [];
+  const directDependencies = [];
   for (const entry of imports) {
     const importPath = normalizeTemplatePath(toRelativeImport(options.id, entry.id));
     importLines.push(`import { templates as ${entry.importName} } from '${importPath}'`);
-    dependencies.push(entry.id);
+    addDependency(entry.id, dependencyContext, directDependencies);
   }
   for (const entry of includes) {
     const importPath = normalizeTemplatePath(toRelativeImport(options.id, entry.id));
     importLines.push(`import { render as ${entry.importName} } from '${importPath}'`);
-    dependencies.push(entry.id);
+    addDependency(entry.id, dependencyContext, directDependencies);
   }
   for (const entry of wxs) {
     if (entry.kind === "src") {
-      const importPath = normalizeTemplatePath(toRelativeImport(options.id, entry.value));
+      const baseImport = normalizeTemplatePath(toRelativeImport(options.id, entry.value));
+      const importPath = shouldMarkWxsImport(entry.value) ? `${baseImport}?wxs` : baseImport;
       importLines.push(`import ${entry.importName} from '${importPath}'`);
-      dependencies.push(entry.value);
+      addDependency(entry.value, dependencyContext, directDependencies);
     }
   }
   if (templates.length > 0 || imports.length > 0) {
@@ -640,7 +871,7 @@ function compileWxml(options) {
       templatePairs.push(`...${entry.importName}`);
     }
     for (const template of templates) {
-      const rendered = renderer.renderNodes(template.nodes, "scope", "__wxs_modules");
+      const rendered = renderer.renderNodes(template.nodes, "scope", "__wxs_modules", options.componentTags);
       templatePairs.push(`${JSON.stringify(template.name)}: (scope, ctx) => ${rendered}`);
     }
     bodyLines.push(`const __templates = { ${templatePairs.join(", ")} }`);
@@ -677,7 +908,7 @@ function compileWxml(options) {
     bodyLines.push(`const __wxs_modules = {}`);
   }
   const includesRender = includes.map((entry) => `${entry.importName}(scope, ctx)`);
-  const renderContent = renderer.renderNodes(renderNodesList, "scope", "__wxs_modules");
+  const renderContent = renderer.renderNodes(renderNodesList, "scope", "__wxs_modules", options.componentTags);
   const contentExpr = includesRender.length > 0 ? `[${[...includesRender, renderContent].join(", ")}]` : renderContent;
   bodyLines.push(`export function render(scope, ctx) {`);
   if (wxs.length > 0) {
@@ -687,7 +918,14 @@ function compileWxml(options) {
   bodyLines.push(`}`);
   bodyLines.push(`export const templates = __templates`);
   bodyLines.push(`export default render`);
+  if (expandDependencies) {
+    dependencyContext.visited.add(options.id);
+    dependencyContext.active.add(options.id);
+    expandDependencyTree(directDependencies, options.id);
+    dependencyContext.active.delete(options.id);
+  }
   const code = [...importLines, "", ...bodyLines].join("\n");
+  const dependencies = expandDependencies ? dependencyContext.dependencies : directDependencies;
   return {
     code,
     dependencies,
@@ -696,37 +934,76 @@ function compileWxml(options) {
 }
 
 // src/compiler/wxs.ts
-var REQUIRE_RE = /require\\(\\s*['"]([^'"]+)['"]\\s*\\)/g;
+var REQUIRE_RE = /require\(\s*['"]([^'"]+)['"]\s*\)/g;
 function normalizePath(p) {
   return p.split("\\\\").join("/");
 }
-function ensureWxsExtension(pathname) {
-  if (pathname.endsWith(".wxs") || pathname.endsWith(".wxs.ts") || pathname.endsWith(".wxs.js")) {
+function isPlainWxsScript(pathname) {
+  const lower = pathname.toLowerCase();
+  if (lower.endsWith(".wxs") || lower.endsWith(".wxs.ts") || lower.endsWith(".wxs.js")) {
+    return false;
+  }
+  return lower.endsWith(".ts") || lower.endsWith(".js");
+}
+function appendWxsQuery(pathname) {
+  if (pathname.includes("?wxs") || pathname.includes("&wxs")) {
     return pathname;
   }
-  return `${pathname}.wxs`;
+  return `${pathname}${pathname.includes("?") ? "&" : "?"}wxs`;
+}
+function isSupportedRequirePath(request) {
+  return request.startsWith(".") || request.startsWith("/");
 }
 function transformWxsToEsm(code, id, options) {
   const dependencies = [];
   const importLines = [];
   const mapEntries = [];
-  let match;
+  const warnings = [];
   const seen = /* @__PURE__ */ new Set();
-  while (match = REQUIRE_RE.exec(code)) {
+  while (true) {
+    const match = REQUIRE_RE.exec(code);
+    if (!match) {
+      break;
+    }
     const request = match[1];
     if (!request || seen.has(request)) {
       continue;
     }
     seen.add(request);
-    const resolved = ensureWxsExtension(options.resolvePath(request, id) ?? request);
-    const importPath = normalizePath(options.toImportPath?.(resolved, id) ?? resolved);
+    if (!isSupportedRequirePath(request)) {
+      warnings.push(`[@weapp-vite/web] WXS require \u4EC5\u652F\u6301\u76F8\u5BF9\u6216\u7EDD\u5BF9\u8DEF\u5F84: ${request} (from ${id})`);
+      continue;
+    }
+    const resolved = options.resolvePath(request, id);
+    if (!resolved) {
+      warnings.push(`[@weapp-vite/web] \u65E0\u6CD5\u89E3\u6790 WXS require: ${request} (from ${id})`);
+      continue;
+    }
+    let importPath = normalizePath(options.toImportPath?.(resolved, id) ?? resolved);
+    if (isPlainWxsScript(resolved)) {
+      importPath = appendWxsQuery(importPath);
+    }
     const importName = `__wxs_dep_${dependencies.length}`;
     importLines.push(`import ${importName} from '${importPath}'`);
     mapEntries.push(`[${JSON.stringify(request)}, ${importName}]`);
     dependencies.push(resolved);
   }
   const requireMap = `const __wxs_require_map = new Map([${mapEntries.join(", ")}])`;
-  const requireFn = `function require(id) { return __wxs_require_map.get(id) }`;
+  const requireFn = [
+    `const __wxs_require_warned = new Set()`,
+    `function require(id) {`,
+    `  if (__wxs_require_map.has(id)) {`,
+    `    return __wxs_require_map.get(id)`,
+    `  }`,
+    `  if (!__wxs_require_warned.has(id)) {`,
+    `    __wxs_require_warned.add(id)`,
+    `    if (typeof console !== 'undefined' && typeof console.warn === 'function') {`,
+    `      console.warn(\`[@weapp-vite/web] WXS require \u672A\u89E3\u6790: \${id}\`)`,
+    `    }`,
+    `  }`,
+    `  return undefined`,
+    `}`
+  ].join("\\n");
   const moduleInit = `const module = { exports: {} }\\nconst exports = module.exports`;
   const helpers = `const getRegExp = (pattern, flags) => new RegExp(pattern, flags)\\nconst getDate = (value) => (value == null ? new Date() : new Date(value))`;
   const body = [
@@ -738,7 +1015,17 @@ function transformWxsToEsm(code, id, options) {
     code,
     `export default module.exports`
   ].join("\\n");
-  return { code: body, dependencies };
+  return {
+    code: body,
+    dependencies,
+    warnings: warnings.length > 0 ? warnings : void 0
+  };
+}
+
+// src/shared/slugify.ts
+function slugify(id, prefix) {
+  const normalized = id.replace(/[^a-z0-9]+/gi, "-").replace(/^-+|-+$/g, "").toLowerCase();
+  return `${prefix}-${normalized || "index"}`;
 }
 
 // src/plugin.ts
@@ -764,6 +1051,7 @@ var STYLE_EXTS = [".wxss", ".scss", ".less", ".css"];
 var TRANSFORM_STYLE_EXTS = [".wxss"];
 var TEMPLATE_EXTS = [".wxml", ".axml", ".swan", ".ttml", ".qml", ".ksml", ".xhsml", ".html"];
 var WXS_EXTS = [".wxs", ".wxs.ts", ".wxs.js"];
+var WXS_RESOLVE_EXTS = [".wxs", ".wxs.ts", ".wxs.js", ".ts", ".js"];
 var ENTRY_ID = "\0@weapp-vite/web/entry";
 function isTemplateFile(id) {
   const lower = id.toLowerCase();
@@ -773,13 +1061,20 @@ function isWxsFile(id) {
   const lower = id.toLowerCase();
   return WXS_EXTS.some((ext) => lower.endsWith(ext));
 }
+function hasWxsQuery(id) {
+  return id.includes("?wxs") || id.includes("&wxs");
+}
 function weappWebPlugin(options = {}) {
   let root = process.cwd();
   let srcRoot = resolve(root, options.srcDir ?? "src");
   let enableHmr = false;
   const moduleMeta = /* @__PURE__ */ new Map();
   const pageNavigationMap = /* @__PURE__ */ new Map();
+  const templateComponentMap = /* @__PURE__ */ new Map();
+  const componentTagMap = /* @__PURE__ */ new Map();
+  const componentIdMap = /* @__PURE__ */ new Map();
   let appNavigationDefaults = {};
+  let appComponentTags = {};
   let scanResult = {
     app: void 0,
     pages: [],
@@ -795,10 +1090,10 @@ function weappWebPlugin(options = {}) {
       root = config.root;
       srcRoot = resolve(root, options.srcDir ?? "src");
       enableHmr = config.command === "serve";
-      await scanProject();
+      await scanProject(this.warn?.bind(this));
     },
     async buildStart() {
-      await scanProject();
+      await scanProject(this.warn?.bind(this));
     },
     resolveId(id) {
       if (id === "/@weapp-vite/web/entry" || id === "@weapp-vite/web/entry") {
@@ -815,19 +1110,22 @@ function weappWebPlugin(options = {}) {
     async handleHotUpdate(ctx) {
       const clean = cleanUrl(ctx.file);
       if (clean.endsWith(".json") || isTemplateFile(clean) || isWxsFile(clean) || clean.endsWith(".wxss") || SCRIPT_EXTS.includes(extname(clean))) {
-        await scanProject();
+        await scanProject(this.warn?.bind(this));
       }
     },
     transform(code, id) {
       const clean = cleanUrl(id);
       if (isTemplateFile(clean)) {
-        const navigationConfig = pageNavigationMap.get(normalizePath2(clean));
+        const normalizedId = normalizePath2(clean);
+        const navigationConfig = pageNavigationMap.get(normalizedId);
+        const componentTags = templateComponentMap.get(normalizedId);
         const { code: compiled, dependencies, warnings } = compileWxml({
           id: clean,
           source: code,
           resolveTemplatePath,
           resolveWxsPath,
-          navigationBar: navigationConfig ? { config: navigationConfig } : void 0
+          navigationBar: navigationConfig ? { config: navigationConfig } : void 0,
+          componentTags
         });
         if (dependencies.length > 0 && "addWatchFile" in this) {
           for (const dep of dependencies) {
@@ -841,8 +1139,8 @@ function weappWebPlugin(options = {}) {
         }
         return { code: compiled, map: null };
       }
-      if (isWxsFile(clean)) {
-        const { code: compiled, dependencies } = transformWxsToEsm(code, clean, {
+      if (isWxsFile(clean) || hasWxsQuery(id)) {
+        const { code: compiled, dependencies, warnings } = transformWxsToEsm(code, clean, {
           resolvePath: resolveWxsPath,
           toImportPath: (resolved, importer) => normalizePath2(toRelativeImport2(importer, resolved))
         });
@@ -851,6 +1149,11 @@ function weappWebPlugin(options = {}) {
             this.addWatchFile(dep);
           }
         }
+        if (warnings?.length && "warn" in this) {
+          for (const warning of warnings) {
+            this.warn(warning);
+          }
+        }
         return { code: compiled, map: null };
       }
       if (TRANSFORM_STYLE_EXTS.some((ext) => clean.endsWith(ext))) {
@@ -981,12 +1284,25 @@ if (import.meta.hot) { import.meta.hot.accept() }
       };
     }
   };
-  async function scanProject() {
+  async function scanProject(warn) {
     moduleMeta.clear();
     pageNavigationMap.clear();
+    templateComponentMap.clear();
+    componentTagMap.clear();
+    componentIdMap.clear();
     appNavigationDefaults = {};
+    appComponentTags = {};
     const pages = /* @__PURE__ */ new Map();
     const components = /* @__PURE__ */ new Map();
+    const reportWarning = (message) => {
+      if (warn) {
+        warn(message);
+        return;
+      }
+      if (typeof process !== "undefined" && typeof process.emitWarning === "function") {
+        process.emitWarning(message);
+      }
+    };
     const appScript = await resolveScriptFile(join(srcRoot, "app"));
     if (appScript) {
       moduleMeta.set(
@@ -1002,6 +1318,11 @@ if (import.meta.hot) { import.meta.hot.accept() }
     const appJsonPath = join(srcRoot, "app.json");
     if (await fs.pathExists(appJsonPath)) {
       const appJson = await readJsonFile(appJsonPath);
+      if (appJson) {
+        appComponentTags = await collectComponentTagsFromConfig(appJson, srcRoot, appJsonPath, reportWarning, (tags) => {
+          appComponentTags = tags;
+        });
+      }
       if (appJson?.pages && Array.isArray(appJson.pages)) {
         for (const page of appJson.pages) {
           if (typeof page === "string") {
@@ -1059,17 +1380,22 @@ if (import.meta.hot) { import.meta.hot.accept() }
         script,
         id: toPosixId(pageId)
       });
+      const pageComponentTags = pageJson ? await collectComponentTagsFromConfig(pageJson, dirname2(script), pageJsonPath, reportWarning) : await collectComponentTagsFromJson(pageJsonPath, dirname2(script), reportWarning);
+      if (template) {
+        const mergedTags = mergeComponentTags(appComponentTags, pageComponentTags);
+        if (Object.keys(mergedTags).length > 0) {
+          templateComponentMap.set(normalizePath2(template), mergedTags);
+        } else {
+          templateComponentMap.delete(normalizePath2(template));
+        }
+      }
       if (pageJson) {
-        await collectComponentsFromConfig(pageJson, dirname2(script));
         if (template) {
           const config = mergeNavigationConfig(appNavigationDefaults, pickNavigationConfig(pageJson));
           pageNavigationMap.set(normalizePath2(template), config);
         }
-      } else {
-        await collectComponentsFromJson(pageJsonPath, dirname2(script));
-        if (template) {
-          pageNavigationMap.set(normalizePath2(template), { ...appNavigationDefaults });
-        }
+      } else if (template) {
+        pageNavigationMap.set(normalizePath2(template), { ...appNavigationDefaults });
       }
     }
     async function collectComponent(componentId, importerDir) {
@@ -1099,26 +1425,94 @@ if (import.meta.hot) { import.meta.hot.accept() }
         script,
         id: componentIdPosix
       });
-      await collectComponentsFromJson(`${script.replace(new RegExp(`${extname(script)}$`), "")}.json`, dirname2(script));
+      const componentJsonPath = `${script.replace(new RegExp(`${extname(script)}$`), "")}.json`;
+      const componentTags = await collectComponentTagsFromJson(componentJsonPath, dirname2(script), reportWarning);
+      if (template) {
+        const mergedTags = mergeComponentTags(appComponentTags, componentTags);
+        if (Object.keys(mergedTags).length > 0) {
+          templateComponentMap.set(normalizePath2(template), mergedTags);
+        } else {
+          templateComponentMap.delete(normalizePath2(template));
+        }
+      }
     }
-    async function collectComponentsFromConfig(json, importerDir) {
+    async function collectComponentTagsFromConfig(json, importerDir, jsonPath, warn2, onResolved) {
       const usingComponents = json.usingComponents;
       if (!usingComponents || typeof usingComponents !== "object") {
-        return;
+        return {};
       }
-      for (const value of Object.values(usingComponents)) {
-        if (typeof value !== "string") {
+      const tags = {};
+      const resolved = [];
+      for (const [rawKey, rawValue] of Object.entries(usingComponents)) {
+        if (typeof rawValue !== "string") {
+          continue;
+        }
+        const key = normalizeComponentKey(rawKey);
+        if (!key) {
           continue;
         }
-        await collectComponent(value, importerDir);
+        const script = await resolveComponentScript(rawValue, importerDir);
+        if (!script) {
+          warn2(`[@weapp-vite/web] usingComponents entry "${rawKey}" not found: ${rawValue} (${jsonPath})`);
+          continue;
+        }
+        const tag = getComponentTag(script);
+        if (tag) {
+          tags[key] = tag;
+          resolved.push({ rawValue });
+        }
+      }
+      onResolved?.(tags);
+      for (const entry of resolved) {
+        await collectComponent(entry.rawValue, importerDir);
       }
+      return tags;
     }
-    async function collectComponentsFromJson(jsonPath, importerDir) {
+    async function collectComponentTagsFromJson(jsonPath, importerDir, warn2) {
       const json = await readJsonFile(jsonPath);
       if (!json) {
-        return;
+        return {};
+      }
+      return collectComponentTagsFromConfig(json, importerDir, jsonPath, warn2);
+    }
+    function mergeComponentTags(base, overrides) {
+      if (!Object.keys(base).length && !Object.keys(overrides).length) {
+        return {};
       }
-      await collectComponentsFromConfig(json, importerDir);
+      return {
+        ...base,
+        ...overrides
+      };
+    }
+    function normalizeComponentKey(raw) {
+      return raw.trim().toLowerCase();
+    }
+    function getComponentId(script) {
+      const cached = componentIdMap.get(script);
+      if (cached) {
+        return cached;
+      }
+      const idRelative = relative2(srcRoot, script).replace(new RegExp(`${extname(script)}$`), "");
+      const componentIdPosix = toPosixId(idRelative);
+      componentIdMap.set(script, componentIdPosix);
+      return componentIdPosix;
+    }
+    function getComponentTag(script) {
+      const cached = componentTagMap.get(script);
+      if (cached) {
+        return cached;
+      }
+      const id = getComponentId(script);
+      const tag = slugify(id, "wv-component");
+      componentTagMap.set(script, tag);
+      return tag;
+    }
+    async function resolveComponentScript(raw, importerDir) {
+      const base = resolveComponentBase(raw, importerDir);
+      if (!base) {
+        return void 0;
+      }
+      return resolveScriptFile(base);
     }
     function resolveComponentBase(raw, importerDir) {
       if (!raw) {
@@ -1214,11 +1608,18 @@ function resolveTemplatePathSync(raw, importer, srcRoot) {
   return resolveFileWithExtensionsSync(base, TEMPLATE_EXTS);
 }
 function resolveWxsPathSync(raw, importer, srcRoot) {
-  const base = resolveImportBase(raw, importer, srcRoot);
-  if (!base) {
+  if (!raw) {
+    return void 0;
+  }
+  let base;
+  if (raw.startsWith(".")) {
+    base = resolve(dirname2(importer), raw);
+  } else if (raw.startsWith("/")) {
+    base = resolve(srcRoot, raw.slice(1));
+  } else {
     return void 0;
   }
-  return resolveFileWithExtensionsSync(base, WXS_EXTS);
+  return resolveFileWithExtensionsSync(base, WXS_RESOLVE_EXTS);
 }
 async function resolveScriptFile(basePath) {
   const ext = extname(basePath);
@@ -1397,7 +1798,23 @@ var NAV_BUTTON_TAG = "weapp-button";
 var BaseElement = globalThis.HTMLElement ?? class {
 };
 var formConfig = { ...DEFAULT_FORM_CONFIG };
-var styleInjected = false;
+var styleTargets = /* @__PURE__ */ new WeakSet();
+var sharedSheet;
+function resolveAdoptedStyleSheets(root) {
+  const doc = root.ownerDocument ?? document;
+  if (!doc || typeof doc.createElement !== "function") {
+    return void 0;
+  }
+  if (!("adoptedStyleSheets" in doc)) {
+    return void 0;
+  }
+  if (!sharedSheet && "replaceSync" in CSSStyleSheet.prototype) {
+    const sheet = new CSSStyleSheet();
+    sheet.replaceSync(BUTTON_STYLE);
+    sharedSheet = sheet;
+  }
+  return sharedSheet;
+}
 var BUTTON_STYLE = `
 weapp-button {
   display: block;
@@ -1415,8 +1832,8 @@ weapp-button .weapp-btn {
   -webkit-appearance: none;
   box-sizing: border-box;
   width: 100%;
-  border-radius: 6px;
-  border: 1px solid #d7d7d7;
+  border-radius: 5px;
+  border: 1px solid #d9d9d9;
   padding: 0 16px;
   height: 44px;
   line-height: 44px;
@@ -1447,7 +1864,7 @@ weapp-button.weapp-btn--plain .weapp-btn {
 }
 
 weapp-button.weapp-btn--plain.weapp-btn--default .weapp-btn {
-  border-color: #353535;
+  border-color: #b2b2b2;
   color: #353535;
 }
 
@@ -1463,21 +1880,34 @@ weapp-button.weapp-btn--plain.weapp-btn--warn .weapp-btn {
 
 weapp-button.weapp-btn--loading .weapp-btn,
 weapp-button.weapp-btn--disabled .weapp-btn {
-  opacity: 0.6;
+  background-color: #f7f7f7;
+  border-color: #d9d9d9;
+  color: #9b9b9b;
   cursor: not-allowed;
 }
 
 weapp-button.button-hover .weapp-btn {
-  opacity: 0.7;
+  background-color: #ededed;
+  border-color: #d2d2d2;
+}
+
+weapp-button.button-hover.weapp-btn--primary .weapp-btn {
+  background-color: #06ad56;
+  border-color: #06ad56;
+}
+
+weapp-button.button-hover.weapp-btn--warn .weapp-btn {
+  background-color: #d93c37;
+  border-color: #d93c37;
 }
 
 weapp-button.button-hover.weapp-btn--plain .weapp-btn {
-  background-color: rgba(0, 0, 0, 0.1);
+  background-color: rgba(0, 0, 0, 0.06);
 }
 
 weapp-button.weapp-btn--mini .weapp-btn {
-  height: 28px;
-  line-height: 28px;
+  height: 32px;
+  line-height: 32px;
   font-size: 13px;
   padding: 0 12px;
   border-radius: 4px;
@@ -1509,12 +1939,36 @@ weapp-button .weapp-btn__loading[hidden] {
   to { transform: rotate(360deg); }
 }
 `;
-function ensureButtonStyle() {
-  if (styleInjected) {
+function ensureButtonStyle(root) {
+  if (typeof document === "undefined") {
+    return;
+  }
+  if (root && styleTargets.has(root)) {
+    return;
+  }
+  if (!root) {
+    const target = document.head;
+    if (!target || styleTargets.has(target)) {
+      return;
+    }
+    injectStyle(BUTTON_STYLE, BUTTON_STYLE_ID);
+    styleTargets.add(target);
+    return;
+  }
+  const sheet = resolveAdoptedStyleSheets(root);
+  if (sheet) {
+    const existing = root.adoptedStyleSheets ?? [];
+    if (!existing.includes(sheet)) {
+      root.adoptedStyleSheets = [...existing, sheet];
+    }
+    styleTargets.add(root);
     return;
   }
-  injectStyle(BUTTON_STYLE, BUTTON_STYLE_ID);
-  styleInjected = true;
+  const style = document.createElement("style");
+  style.id = BUTTON_STYLE_ID;
+  style.textContent = BUTTON_STYLE;
+  root.appendChild(style);
+  styleTargets.add(root);
 }
 function toBoolean(value) {
   if (value === null) {
@@ -1665,7 +2119,12 @@ var WeappButton = class extends BaseElement {
   #lastTouchTime = 0;
   #observer;
   connectedCallback() {
-    ensureButtonStyle();
+    const root = this.getRootNode();
+    if (root instanceof ShadowRoot) {
+      ensureButtonStyle(root);
+    } else {
+      ensureButtonStyle();
+    }
     this.#ensureStructure();
     this.#applyState();
     this.#bindEvents();
@@ -1952,7 +2411,7 @@ function normalizeKey(rawKey, item, index, scope) {
     const expr = key.replace(/^\{\{\s*/, "").replace(/\s*\}\}$/, "");
     return evaluateExpression(expr, scope);
   }
-  if (!/[\.\[\(\)]/.test(key) && item && typeof item === "object" && key in item) {
+  if (!/[.[()]/.test(key) && item && typeof item === "object" && key in item) {
     return item[key];
   }
   return evaluateExpression(key, scope);
@@ -2001,6 +2460,16 @@ function createWxsModule(code, id, requireMap) {
   return module.exports;
 }
 function createRenderContext(instance, methods) {
+  const warnedTemplates = /* @__PURE__ */ new Set();
+  const warnMissingTemplate = (name) => {
+    if (warnedTemplates.has(name)) {
+      return;
+    }
+    warnedTemplates.add(name);
+    if (typeof console !== "undefined" && typeof console.warn === "function") {
+      console.warn(`[@weapp-vite/web] \u672A\u627E\u5230\u6A21\u677F: ${name}`);
+    }
+  };
   return {
     instance,
     eval: (expression, scope, wxs) => {
@@ -2023,11 +2492,10 @@ function createRenderContext(instance, methods) {
       return normalizeKey(rawKey, item, index, renderScope);
     },
     renderTemplate: (templates, name, scope, ctx) => {
-      if (!name) {
-        return "";
-      }
-      const template = templates?.[name];
+      const resolvedName = typeof name === "string" ? name : String(name);
+      const template = templates?.[resolvedName];
       if (typeof template !== "function") {
+        warnMissingTemplate(resolvedName);
         return "";
       }
       return template(scope, ctx);
@@ -2136,6 +2604,78 @@ function coerceValue(value, type) {
   }
   return value;
 }
+function isPlainObject(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function mergeLifetimes(target, source) {
+  if (!source) {
+    return;
+  }
+  const keys = ["created", "attached", "ready", "detached"];
+  for (const key of keys) {
+    const next = source[key];
+    if (!next) {
+      continue;
+    }
+    const current = target[key];
+    target[key] = current ? function merged() {
+      current.call(this);
+      next.call(this);
+    } : next;
+  }
+}
+function normalizeBehaviors(component) {
+  if (!component) {
+    return { component: void 0, warnings: [] };
+  }
+  const warnings = [];
+  const visited = /* @__PURE__ */ new Set();
+  const merged = {};
+  const mergeComponent = (source) => {
+    if (source.properties) {
+      merged.properties = { ...merged.properties ?? {}, ...source.properties };
+    }
+    if (source.data) {
+      const nextData = typeof source.data === "function" ? source.data() : source.data;
+      if (isPlainObject(nextData)) {
+        merged.data = { ...merged.data ?? {}, ...nextData };
+      }
+    }
+    if (source.methods) {
+      merged.methods = { ...merged.methods ?? {}, ...source.methods };
+    }
+    if (source.lifetimes) {
+      merged.lifetimes = merged.lifetimes ?? {};
+      mergeLifetimes(merged.lifetimes, source.lifetimes);
+    }
+  };
+  const walk = (source) => {
+    if (visited.has(source)) {
+      warnings.push("[@weapp-vite/web] behaviors \u5B58\u5728\u5FAA\u73AF\u5F15\u7528\uFF0C\u5DF2\u8DF3\u8FC7\u3002");
+      return;
+    }
+    visited.add(source);
+    const behaviors = source.behaviors ?? [];
+    if (Array.isArray(behaviors)) {
+      for (const behavior of behaviors) {
+        if (!behavior || !isPlainObject(behavior)) {
+          warnings.push("[@weapp-vite/web] behaviors \u4EC5\u652F\u6301\u5BF9\u8C61\uFF0C\u5DF2\u5FFD\u7565\u975E\u5BF9\u8C61\u6761\u76EE\u3002");
+          continue;
+        }
+        walk(behavior);
+        mergeComponent(behavior);
+      }
+    } else if (behaviors) {
+      warnings.push("[@weapp-vite/web] behaviors \u4EC5\u652F\u6301\u6570\u7EC4\uFF0C\u5DF2\u5FFD\u7565\u3002");
+    }
+  };
+  walk(component);
+  mergeComponent(component);
+  return {
+    component: merged,
+    warnings
+  };
+}
 function defineComponent(tagName, options) {
   if (!options || typeof options !== "object") {
     throw new TypeError("[@weapp-vite/web] defineComponent \u9700\u8981\u63D0\u4F9B\u914D\u7F6E\u5BF9\u8C61\u3002");
@@ -2146,13 +2686,20 @@ function defineComponent(tagName, options) {
     return existing;
   }
   const BaseElement3 = supportsLit ? LitElement : globalThis.HTMLElement ?? FallbackElement;
-  const { template, style = "", component = {} } = options;
+  const { template, style = "", component = {}, observerInit = false } = options;
   if (!template) {
     throw new Error("[@weapp-vite/web] defineComponent \u9700\u8981\u63D0\u4F9B\u6A21\u677F\u6E32\u67D3\u51FD\u6570\u3002");
   }
+  const normalized = normalizeBehaviors(component);
+  for (const warning of normalized.warnings) {
+    if (typeof console !== "undefined" && typeof console.warn === "function") {
+      console.warn(warning);
+    }
+  }
   let templateRef = template;
   let styleRef = style;
-  let componentRef = component;
+  let componentRef = normalized.component ?? component;
+  let observerInitEnabled = Boolean(observerInit);
   let propertyEntries = Object.entries(componentRef.properties ?? {});
   let observedAttributes = propertyEntries.map(([name]) => hyphenate(name));
   let defaultPropertyValues = propertyEntries.reduce((acc, [name, prop]) => {
@@ -2176,6 +2723,8 @@ function defineComponent(tagName, options) {
     #renderContext = createRenderContext(this, {});
     #usesLegacyTemplate = false;
     #readyFired = false;
+    #observerInitDone = false;
+    #observedKeys = /* @__PURE__ */ new Set();
     constructor() {
       super();
       const dataOption = typeof componentRef.data === "function" ? componentRef.data() : componentRef.data ?? {};
@@ -2226,6 +2775,9 @@ function defineComponent(tagName, options) {
         superConnected.call(this);
       }
       this.#applyAttributes();
+      if (observerInitEnabled) {
+        this.#runInitialObservers();
+      }
       lifetimes.attached?.call(this);
       this.#isMounted = true;
       if (!supportsLit) {
@@ -2306,7 +2858,11 @@ function defineComponent(tagName, options) {
           this.#state[key] = value;
           if (Object.prototype.hasOwnProperty.call(this.#properties, key)) {
             this.#properties[key] = value;
-            componentRef.properties?.[key]?.observer?.call(this, value, oldValue);
+            const propOption = componentRef.properties?.[key];
+            if (propOption?.observer) {
+              propOption.observer.call(this, value, oldValue);
+              this.#observedKeys.add(key);
+            }
           }
           changed = true;
         }
@@ -2327,7 +2883,24 @@ function defineComponent(tagName, options) {
       if (this.#isMounted) {
         this.requestUpdate();
       }
-      propOption?.observer?.call(this, coerced, oldValue);
+      if (propOption?.observer) {
+        propOption.observer.call(this, coerced, oldValue);
+        this.#observedKeys.add(name);
+      }
+    }
+    #runInitialObservers() {
+      if (this.#observerInitDone) {
+        return;
+      }
+      this.#observerInitDone = true;
+      for (const [propName, propOption] of propertyEntries) {
+        if (!propOption.observer || this.#observedKeys.has(propName)) {
+          continue;
+        }
+        const value = this.#state[propName];
+        propOption.observer.call(this, value, void 0);
+        this.#observedKeys.add(propName);
+      }
     }
     #syncMethods(nextMethods) {
       const resolved = nextMethods ?? {};
@@ -2375,7 +2948,14 @@ function defineComponent(tagName, options) {
     }
     templateRef = nextOptions.template;
     styleRef = nextOptions.style ?? "";
-    componentRef = nextOptions.component ?? {};
+    const nextNormalized = normalizeBehaviors(nextOptions.component ?? {});
+    for (const warning of nextNormalized.warnings) {
+      if (typeof console !== "undefined" && typeof console.warn === "function") {
+        console.warn(warning);
+      }
+    }
+    componentRef = nextNormalized.component ?? nextOptions.component ?? {};
+    observerInitEnabled = Boolean(nextOptions.observerInit);
     lifetimes = componentRef.lifetimes ?? {};
     propertyEntries = Object.entries(componentRef.properties ?? {});
     observedAttributes = propertyEntries.map(([name]) => hyphenate(name));
@@ -2728,10 +3308,6 @@ var RESERVED_COMPONENT_METHOD_KEYS = /* @__PURE__ */ new Set([
   "observers",
   "mixins"
 ]);
-function slugify(id, prefix) {
-  const normalized = id.replace(/[^a-z0-9]+/gi, "-").replace(/^-+|-+$/g, "").toLowerCase();
-  return `${prefix}-${normalized || "index"}`;
-}
 function ensureDocumentReady(callback) {
   if (typeof document === "undefined") {
     return;
@@ -3309,6 +3885,8 @@ function normalizeTagName2(name) {
       return "select";
     case "block":
       return "#fragment";
+    case "slot":
+      return "slot";
     default:
       return name || "div";
   }