@stacksjs/stx 0.2.155 → 0.2.157

package/dist/forms.js

@@ -20,6 +20,24 @@ function buildClassString(existingClass, defaultClass, hasError, errorClass) {
   const baseClass = existingClass || defaultClass;
   return hasError ? `${baseClass} ${errorClass}` : baseClass;
 }
+function fieldId(name) {
+  return String(name).replace(/\[\]$/, "").replace(/[^\w.:-]+/g, "-").replace(/^-+|-+$/g, "");
+}
+function idAttr(attrs, fallbackId) {
+  if (/\bid\s*=/i.test(attrs))
+    return "";
+  return ` id="${escapeAttr(fallbackId)}"`;
+}
+function errorAria(name, hasError, attrs) {
+  if (!hasError)
+    return "";
+  let out = "";
+  if (!/\baria-invalid\s*=/i.test(attrs))
+    out += ' aria-invalid="true"';
+  if (!/\baria-describedby\s*=/i.test(attrs))
+    out += ` aria-describedby="${escapeAttr(`${fieldId(name)}-error`)}"`;
+  return out;
+}
 function genId() {
   return crypto.randomUUID();
 }
@@ -70,11 +88,11 @@ export function processFormInputDirectives(template, context, classes = defaultF
     const name = singleQuoteName || doubleQuoteName || "", value = singleQuoteValue || doubleQuoteValue || "", attrs = parseAttributes(attributes), rawOldValue = getOldValue(name, context), oldValue = rawOldValue !== void 0 && rawOldValue !== null ? rawOldValue : value || "", typeMatch = attrs.match(/type=['"]([^'"]+)['"]/i), type = typeMatch ? typeMatch[1] : "text", hasError = hasFieldError(name, context), classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = buildClassString(classMatch ? classMatch[1] : "", classes.input, hasError, classes.inputError);
     let attrsWithoutClassAndType = attrs.replace(/class=['"][^'"]+['"]/i, "");
     attrsWithoutClassAndType = attrsWithoutClassAndType.replace(/type=['"][^'"]+['"]/i, "");
-    return `<input type="${escapeAttr(type)}" name="${escapeAttr(name)}" value="${escapeAttr(oldValue)}" class="${className}"${attrsWithoutClassAndType ? ` ${attrsWithoutClassAndType}` : ""}>`;
+    return `<input type="${escapeAttr(type)}" name="${escapeAttr(name)}"${idAttr(attrs, fieldId(name))} value="${escapeAttr(oldValue)}" class="${className}"${errorAria(name, hasError, attrs)}${attrsWithoutClassAndType ? ` ${attrsWithoutClassAndType}` : ""}>`;
   });
   result = result.replace(/@textarea\(\s*['"]([^'"]+)['"]\s*(?:,\s*\{([^}]+)\})?\)([\s\S]*?)@endtextarea/g, (_match, name, attributes = "", content = "") => {
     const attrs = parseAttributes(attributes), oldValue = getOldValue(name, context) || content.trim(), hasError = hasFieldError(name, context), classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = buildClassString(classMatch ? classMatch[1] : "", classes.input, hasError, classes.inputError), attrsWithoutClass = attrs.replace(/class=['"][^'"]+['"]/i, "");
-    return `<textarea name="${escapeAttr(name)}" class="${className}"${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>${escapeAttr(oldValue)}</textarea>`;
+    return `<textarea name="${escapeAttr(name)}"${idAttr(attrs, fieldId(name))} class="${className}"${errorAria(name, hasError, attrs)}${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>${escapeAttr(oldValue)}</textarea>`;
   });
   result = result.replace(/@select\(\s*['"]([^'"]+)['"]\s*(?:,\s*\{([^}]+)\})?\)([\s\S]*?)@endselect/g, (_match, name, attributes = "", content) => {
     const attrs = parseAttributes(attributes), oldValue = getOldValue(name, context), hasError = hasFieldError(name, context), classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = buildClassString(classMatch ? classMatch[1] : "", classes.input, hasError, classes.inputError), attrsWithoutClass = attrs.replace(/class=['"][^'"]+['"]/i, "");
@@ -85,19 +103,19 @@ export function processFormInputDirectives(template, context, classes = defaultF
           return optionTag.replace(/(<option)/, "$1 selected");
         return optionMatch;
       });
-    return `<select name="${escapeAttr(name)}" class="${className}"${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>${processedContent}</select>`;
+    return `<select name="${escapeAttr(name)}"${idAttr(attrs, fieldId(name))} class="${className}"${errorAria(name, hasError, attrs)}${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>${processedContent}</select>`;
   });
-  result = result.replace(/@checkbox\(\s*['"]([^'"]+)['"]\s*(?:,\s*['"]([^'"]+)['"]\s*)?(?:,\s*\{([^}]+)\})?\)/g, (_match, name, value = "1", attributes = "") => {
-    const attrs = parseAttributes(attributes), oldValues = getOldValue(name, context), isChecked = oldValues !== void 0 && (Array.isArray(oldValues) ? oldValues.some((v) => String(v) === value) : oldValues === !0 || String(oldValues) === value), classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = classMatch ? classMatch[1] : classes.checkInput, attrsWithoutClass = attrs.replace(/class=['"][^'"]+['"]/i, "");
-    return `<input type="checkbox" name="${escapeAttr(name)}" value="${escapeAttr(value)}" class="${className}"${isChecked ? " checked" : ""}${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>`;
+  result = result.replace(/@checkbox\(\s*['"]([^'"]+)['"]\s*(?:,\s*['"]([^'"]+)['"]\s*)?(?:,\s*\{([^}]+)\})?\)/g, (_match, name, rawValue, attributes = "") => {
+    const value = rawValue === void 0 ? "1" : rawValue, controlId = rawValue === void 0 ? fieldId(name) : `${fieldId(name)}-${fieldId(value)}`, attrs = parseAttributes(attributes), oldValues = getOldValue(name, context), isChecked = oldValues !== void 0 && (Array.isArray(oldValues) ? oldValues.some((v) => String(v) === value) : oldValues === !0 || String(oldValues) === value), classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = classMatch ? classMatch[1] : classes.checkInput, attrsWithoutClass = attrs.replace(/class=['"][^'"]+['"]/i, "");
+    return `<input type="checkbox" name="${escapeAttr(name)}"${idAttr(attrs, controlId)} value="${escapeAttr(value)}" class="${className}"${isChecked ? " checked" : ""}${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>`;
   });
   result = result.replace(/@radio\(\s*['"]([^'"]+)['"]\s*,\s*['"]([^'"]+)['"]\s*(?:,\s*\{([^}]+)\})?\)/g, (_match, name, value, attributes = "") => {
     const attrs = parseAttributes(attributes), oldValue = getOldValue(name, context), isChecked = oldValue !== void 0 && oldValue === value, classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = classMatch ? classMatch[1] : classes.checkInput, attrsWithoutClass = attrs.replace(/class=['"][^'"]+['"]/i, "");
-    return `<input type="radio" name="${escapeAttr(name)}" value="${escapeAttr(value)}" class="${className}"${isChecked ? " checked" : ""}${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>`;
+    return `<input type="radio" name="${escapeAttr(name)}"${idAttr(attrs, `${fieldId(name)}-${fieldId(value)}`)} value="${escapeAttr(value)}" class="${className}"${isChecked ? " checked" : ""}${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>`;
   });
   result = result.replace(/@file\(\s*['"]([^'"]+)['"]\s*(?:,\s*\{([^}]+)\})?\)/g, (_match, name, attributes = "") => {
     const attrs = parseAttributes(attributes), acceptMatch = attrs.match(/accept=['"]([^'"]+)['"]/i), accept = acceptMatch ? acceptMatch[1] : "", isMultiple = attrs.includes("multiple"), hasError = hasFieldError(name, context), classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = buildClassString(classMatch ? classMatch[1] : "", classes.input, hasError, classes.inputError), attrsWithoutHandled = attrs.replace(/class=['"][^'"]+['"]/gi, "").replace(/accept=['"][^'"]+['"]/gi, "").replace(/\bmultiple\b/gi, "").trim(), parts = [
-      `<input type="file" name="${escapeAttr(name)}"`,
+      `<input type="file" name="${escapeAttr(name)}"${idAttr(attrs, fieldId(name))}`,
       `class="${className}"`
     ];
     if (accept)
@@ -110,15 +128,15 @@ export function processFormInputDirectives(template, context, classes = defaultF
   });
   result = result.replace(/@label\(\s*['"]([^'"]+)['"]\s*(?:,\s*\{([^}]+)\})?\)([\s\S]*?)@endlabel/g, (_match, forAttr, attributes = "", content) => {
     const attrs = parseAttributes(attributes), classMatch = attrs.match(/class=['"]([^'"]+)['"]/i), className = classMatch ? classMatch[1] : classes.label, attrsWithoutClass = attrs.replace(/class=['"][^'"]+['"]/i, "");
-    return `<label for="${escapeAttr(forAttr)}" class="${className}"${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>${content}</label>`;
+    return `<label for="${escapeAttr(fieldId(forAttr))}" class="${className}"${attrsWithoutClass ? ` ${attrsWithoutClass}` : ""}>${content}</label>`;
   });
   return result;
 }
 export function processErrorDirective(template, context, _classes = defaultFormClasses) {
   return template.replace(/@error\(['"]([^'"]+)['"]\)([\s\S]*?)@enderror/g, (match, field, content) => {
     try {
-      if (hasFieldError(field, context))
-        return content.replace(/\{\{([^}]+)\}\}/g, (_, expr) => {
+      if (hasFieldError(field, context)) {
+        const rendered = content.replace(/\{\{([^}]+)\}\}/g, (_, expr) => {
           try {
             if (expr.trim() === "$message" || expr.trim() === "message")
               return getErrorMessage(field, context);
@@ -137,6 +155,8 @@ export function processErrorDirective(template, context, _classes = defaultFormC
             return expr;
           }
         });
+        return `<div id="${escapeAttr(`${fieldId(field)}-error`)}" role="alert">${rendered}</div>`;
+      }
       return "";
     } catch (error) {
       console.error("Error processing @error directive:", error);

package/dist/fragment-container.d.ts

@@ -0,0 +1,57 @@
+/**
+ * Parse the supported subset of CSS selector syntax.
+ *
+ * Returns null for anything unsupported (descendant combinators, `:has()`,
+ * comma lists) rather than guessing — a wrong container is worse than a
+ * reported one.
+ */
+export declare function parseContainerSelector(selector: string): ParsedSelector | null;
+/**
+ * Find the region of `html` occupied by the first element matching `selector`.
+ *
+ * The closing tag is found by depth counting over same-named tags, so a
+ * container that contains another element of the same name — or a page that has
+ * two of them — resolves to the container's OWN close rather than the last one
+ * in the document.
+ */
+export declare function findContainerRegion(html: string, selector?: string): ContainerRegion | null;
+/**
+ * Locating the SPA swap container in rendered HTML.
+ *
+ * The client resolves the container with a CSS selector (`router.container`,
+ * falling back to `[data-stx-content]` then `main`). The server used to ignore
+ * that entirely and string-slice from the first `<main …>` to the LAST
+ * `</main>`, which produced three separate failures:
+ *
+ *  - configuring `router: { container: '[data-stx-content]' }` still produced a
+ *    `<main>`-shaped fragment, which the client then injected into a different
+ *    element, duplicating the page chrome;
+ *  - a page with two `<main>` elements swapped everything between the first open
+ *    and the last close, i.e. the wrong span;
+ *  - a page with no `<main>` shipped its whole body as the "fragment", silently
+ *    disabling SPA navigation for every link on it, at HTTP 200.
+ *
+ * This module resolves the same selector the client uses and finds the container's
+ * OWN matching close tag by depth counting, so nesting and repetition behave.
+ *
+ * It is deliberately a small matcher, not a CSS engine: it covers the selector
+ * shapes a swap container realistically uses — a tag name, an attribute, an id,
+ * a class, and a tag qualified by one of those. Anything else returns null, and
+ * the caller is expected to say so rather than silently ship the whole body.
+ *
+ * @module fragment-container
+ */
+export declare interface ContainerRegion {
+  openTag: string
+  openIndex: number
+  start: number
+  end: number
+  tagName: string
+}
+declare interface ParsedSelector {
+  tag?: string
+  attr?: string
+  attrValue?: string
+  id?: string
+  className?: string
+}

package/dist/fragment-container.js

@@ -0,0 +1,109 @@
+const VOID_ELEMENTS = new Set([
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "link",
+  "meta",
+  "param",
+  "source",
+  "track",
+  "wbr"
+]);
+export function parseContainerSelector(selector) {
+  const trimmed = (selector || "").trim();
+  if (!trimmed)
+    return null;
+  if (/[\s>+~,:]/.test(trimmed))
+    return null;
+  const parsed = {};
+  let rest = trimmed;
+  const tagMatch = rest.match(/^[a-z][\w-]*/i);
+  if (tagMatch) {
+    parsed.tag = tagMatch[0].toLowerCase();
+    rest = rest.slice(tagMatch[0].length);
+  }
+  while (rest.length > 0) {
+    const attr = rest.match(/^\[([\w-]+)(?:=(["']?)([^\]"']*)\2)?\]/);
+    if (attr) {
+      parsed.attr = attr[1];
+      if (attr[3] !== void 0 && attr[3] !== "")
+        parsed.attrValue = attr[3];
+      rest = rest.slice(attr[0].length);
+      continue;
+    }
+    const id = rest.match(/^#([\w-]+)/);
+    if (id) {
+      parsed.id = id[1];
+      rest = rest.slice(id[0].length);
+      continue;
+    }
+    const cls = rest.match(/^\.([\w-]+)/);
+    if (cls) {
+      parsed.className = cls[1];
+      rest = rest.slice(cls[0].length);
+      continue;
+    }
+    return null;
+  }
+  if (!parsed.tag && !parsed.attr && !parsed.id && !parsed.className)
+    return null;
+  return parsed;
+}
+function attributesMatch(attrs, parsed) {
+  if (parsed.attr) {
+    if (!(parsed.attrValue === void 0 ? new RegExp(`\\b${parsed.attr}(?=[\\s=>/]|$)`, "i") : new RegExp(`\\b${parsed.attr}\\s*=\\s*(["'])\\s*${parsed.attrValue}\\s*\\1`, "i")).test(attrs))
+      return !1;
+  }
+  if (parsed.id) {
+    if (!new RegExp(`\\bid\\s*=\\s*(["'])\\s*${parsed.id}\\s*\\1`, "i").test(attrs))
+      return !1;
+  }
+  if (parsed.className) {
+    const classMatch = attrs.match(/\bclass\s*=\s*(["'])([\s\S]*?)\1/i);
+    if (!classMatch)
+      return !1;
+    if (!classMatch[2].split(/\s+/).includes(parsed.className))
+      return !1;
+  }
+  return !0;
+}
+export function findContainerRegion(html, selector = "main") {
+  const parsed = parseContainerSelector(selector);
+  if (!parsed)
+    return null;
+  const openRe = /<([a-z][\w-]*)\b([^>]*)>/gi;
+  let match;
+  while ((match = openRe.exec(html)) !== null) {
+    const tagName = match[1].toLowerCase(), attrs = match[2] || "";
+    if (attrs.trimEnd().endsWith("/") || VOID_ELEMENTS.has(tagName))
+      continue;
+    if (parsed.tag && parsed.tag !== tagName)
+      continue;
+    if (!attributesMatch(attrs, parsed))
+      continue;
+    const openTag = match[0], contentStart = match.index + openTag.length, pairRe = new RegExp(`<(/?)${tagName}\\b([^>]*)>`, "gi");
+    pairRe.lastIndex = contentStart;
+    let depth = 1, pair;
+    while ((pair = pairRe.exec(html)) !== null) {
+      const isClose = pair[1] === "/";
+      if (!isClose && (pair[2] || "").trimEnd().endsWith("/"))
+        continue;
+      depth += isClose ? -1 : 1;
+      if (depth === 0)
+        return {
+          openTag,
+          openIndex: match.index,
+          start: contentStart,
+          end: pair.index,
+          tagName
+        };
+    }
+    return null;
+  }
+  return null;
+}

package/dist/framework-composables.d.ts

@@ -1,3 +1,35 @@
+/**
+ * Ship the framework's own browser-only composables to the client
+ * (stacksjs/stx#1805).
+ *
+ * `src/composables/` exports 149 functions; 120 of them have no counterpart in
+ * the client runtime. They are exported from the package, they type-check, they
+ * autocomplete — and they are unreachable from the only environment where their
+ * underlying API exists. `useClipboard`, `useGeolocation`, `useFullscreen`,
+ * `useBattery` and the observer family all wrap browser APIs and all threw
+ * `ReferenceError` when called from a `<script client>` block.
+ *
+ * There are two ways to close that gap. Hand-porting each one into the runtime's
+ * template literal duplicates 120 implementations that already exist and would
+ * drift the same way the auto-import list did (#1804). Instead this bundles the
+ * real modules — one source of truth — and merges them onto `window.stx`.
+ *
+ * DEMAND-DRIVEN: only composables the page actually references are emitted, so
+ * a page calling `useClipboard` ships a couple of KB rather than the whole tree.
+ *
+ * SKIP, NEVER CLOBBER: a name the runtime already provides wins. The runtime
+ * versions are the signal-based ones that #1710/#1726/#1797 unified; replacing
+ * them with the module versions would be a regression, not a fix.
+ *
+ * KNOWN LIMITATION, and it is why this is a bridge rather than the end state:
+ * these are pre-unification shapes — a getter plus `subscribe()` plus a manual
+ * `stop()`, not signals. So `useClipboard().copy(text)` works, `subscribe()`
+ * works, and imperative use is correct; but reading `.copied` in a template does
+ * not re-render on its own. Converting them to the Signal contract is the real
+ * fix and is tracked separately.
+ *
+ * @module framework-composables
+ */
 /** Clear the cache. Dev HMR calls this when composables change on disk. */
 export declare function clearFrameworkComposableCache(): void;
 /**

package/dist/head.d.ts

@@ -1,3 +1,154 @@
+/**
+ * STX Head Management
+ *
+ * Manage document head (title, meta, links, scripts) with a simple API.
+ *
+ * @example
+ * ```typescript
+ * import { useHead, useSeoMeta, definePageMeta } from 'stx'
+ *
+ * // Full control
+ * useHead({
+ *   title: 'My Page',
+ *   meta: [{ name: 'description', content: '...' }]
+ * })
+ *
+ * // SEO shorthand
+ * useSeoMeta({
+ *   title: 'My Page',
+ *   description: 'Page description',
+ *   ogImage: '/og.png'
+ * })
+ *
+ * // Page configuration
+ * definePageMeta({
+ *   title: 'My Page',
+ *   layout: 'default'
+ * })
+ * ```
+ */
+export interface MetaTag {
+    name?: string;
+    property?: string;
+    content: string;
+    httpEquiv?: string;
+    charset?: string;
+}
+export interface LinkTag {
+    rel: string;
+    href: string;
+    type?: string;
+    sizes?: string;
+    crossorigin?: string;
+    as?: string;
+    media?: string;
+}
+export interface ScriptTag {
+    src?: string;
+    type?: string;
+    async?: boolean;
+    defer?: boolean;
+    content?: string;
+    id?: string;
+}
+export interface HeadConfig {
+    title?: string;
+    titleTemplate?: string | ((title: string) => string);
+    base?: {
+        href?: string;
+        target?: string;
+    };
+    meta?: MetaTag[];
+    link?: LinkTag[];
+    script?: ScriptTag[];
+    style?: {
+        content: string;
+        type?: string;
+    }[];
+    htmlAttrs?: Record<string, string>;
+    bodyAttrs?: Record<string, string>;
+}
+export interface SeoMeta {
+    title?: string;
+    titleTemplate?: string;
+    description?: string;
+    keywords?: string | string[];
+    author?: string;
+    robots?: string;
+    canonical?: string;
+    ogTitle?: string;
+    ogDescription?: string;
+    ogImage?: string;
+    ogUrl?: string;
+    ogType?: string;
+    ogSiteName?: string;
+    ogLocale?: string;
+    twitterCard?: 'summary' | 'summary_large_image' | 'app' | 'player';
+    twitterTitle?: string;
+    twitterDescription?: string;
+    twitterImage?: string;
+    twitterSite?: string;
+    twitterCreator?: string;
+    articleAuthor?: string;
+    articlePublishedTime?: string;
+    articleModifiedTime?: string;
+    articleSection?: string;
+    articleTags?: string[];
+}
+/**
+ * Layouts that exist on disk, augmented by the generated
+ * `<state-dir>/layout-types.d.ts` (stacksjs/stx#1879).
+ *
+ * Empty here on purpose. A project that has not generated the declaration —
+ * or has not added the state directory to its tsconfig — keeps `layout` typed
+ * as `string`, so nothing breaks; a project that has gets a type error for a
+ * name with no layout behind it.
+ */
+export interface KnownLayouts {
+}
+/**
+ * A layout name: the generated union when one is available, otherwise any
+ * string.
+ *
+ * `keyof KnownLayouts` is `never` while the interface is empty, which is what
+ * makes the fallback work.
+ */
+export type LayoutName = keyof KnownLayouts extends never ? string : keyof KnownLayouts;
+export interface PageMeta {
+    title?: string;
+    description?: string;
+    /** Static HTTP response status for this page. */
+    status?: number;
+    /**
+     * Layout for this page, by name (`'app'` → `<layoutsDir>/app.stx`), or
+     * `false` for none — the same as `@nolayout`.
+     *
+     * Precedence: `@extends`/`@layout` in the template wins, then this, then an
+     * auto-discovered `_layout.stx`, then `defaultLayout`.
+     *
+     * Do NOT hand-write `<meta name="stx-layout" content="…">` instead. That tag
+     * is stx *output*: the router reads it to decide between a fragment swap and
+     * a full-document swap, and a page asserting a group it does not belong to
+     * mis-routes rather than mis-styles. This field is the authoring surface; the
+     * meta tag is derived from the layout that actually resolved (#1879).
+     *
+     * Typed as the union of layouts on disk when the generated
+     * `<state-dir>/layout-types.d.ts` is in scope, so a typo is a type error
+     * rather than an unlayouted page.
+     */
+    layout?: LayoutName | false;
+    middleware?: string | string[];
+    transition?: string | {
+        name: string;
+        mode?: string;
+    };
+    keepAlive?: boolean;
+    key?: string | ((route: unknown) => string);
+    validate?: (route: {
+        params: Record<string, string>;
+    }) => boolean | Promise<boolean>;
+    [key: string]: unknown;
+}
 /**
  * Get the current accumulated head config.
  */
@@ -104,7 +255,10 @@ export declare function applyHead(config?: HeadConfig): void;
  * @endhead
  * ```
  */
-export declare function processHeadDirective(content: string): { content: string; headContent: string };
+export declare function processHeadDirective(content: string): {
+    content: string;
+    headContent: string;
+};
 /**
  * Process @title directive.
  *
@@ -125,116 +279,4 @@ export declare function processTitleDirective(content: string, context: Record<s
  * ```
  */
 export declare function processMetaDirective(content: string, context: Record<string, unknown>): string;
-/* eslint-disable prefer-const, style/max-statements-per-line, no-super-linear-backtracking, regexp/no-unused-capturing-group */
-/**
- * STX Head Management
- *
- * Manage document head (title, meta, links, scripts) with a simple API.
- *
- * @example
- * ```typescript
- * import { useHead, useSeoMeta, definePageMeta } from 'stx'
- *
- * // Full control
- * useHead({
- *   title: 'My Page',
- *   meta: [{ name: 'description', content: '...' }]
- * })
- *
- * // SEO shorthand
- * useSeoMeta({
- *   title: 'My Page',
- *   description: 'Page description',
- *   ogImage: '/og.png'
- * })
- *
- * // Page configuration
- * definePageMeta({
- *   title: 'My Page',
- *   layout: 'default'
- * })
- * ```
- */
-// =============================================================================
-// Types
-// =============================================================================
-export declare interface MetaTag {
-  name?: string
-  property?: string
-  content: string
-  httpEquiv?: string
-  charset?: string
-}
-export declare interface LinkTag {
-  rel: string
-  href: string
-  type?: string
-  sizes?: string
-  crossorigin?: string
-  as?: string
-  media?: string
-}
-export declare interface ScriptTag {
-  src?: string
-  type?: string
-  async?: boolean
-  defer?: boolean
-  content?: string
-  id?: string
-}
-export declare interface HeadConfig {
-  title?: string
-  titleTemplate?: string | ((title: string) => string)
-  base?: { href?: string; target?: string }
-  meta?: MetaTag[]
-  link?: LinkTag[]
-  script?: ScriptTag[]
-  style?: { content: string; type?: string }[]
-  htmlAttrs?: Record<string, string>
-  bodyAttrs?: Record<string, string>
-}
-export declare interface SeoMeta {
-  title?: string
-  titleTemplate?: string
-  description?: string
-  keywords?: string | string[]
-  author?: string
-  robots?: string
-  canonical?: string
-  ogTitle?: string
-  ogDescription?: string
-  ogImage?: string
-  ogUrl?: string
-  ogType?: string
-  ogSiteName?: string
-  ogLocale?: string
-  twitterCard?: 'summary' | 'summary_large_image' | 'app' | 'player'
-  twitterTitle?: string
-  twitterDescription?: string
-  twitterImage?: string
-  twitterSite?: string
-  twitterCreator?: string
-  articleAuthor?: string
-  articlePublishedTime?: string
-  articleModifiedTime?: string
-  articleSection?: string
-  articleTags?: string[]
-}
-export declare interface PageMeta {
-  title?: string
-  description?: string
-  status?: number
-  layout?: string | false
-  middleware?: string | string[]
-  transition?: string | { name: string; mode?: string }
-  keepAlive?: boolean
-  key?: string | ((route: unknown) => string)
-  validate?: (route: { params: Record<string, string> }) => boolean | Promise<boolean>
-  [key: string]: unknown
-}
-// =============================================================================
-// Exports
-// =============================================================================
-export {
-  usePageTitle as useTitle
-};
+export { usePageTitle as useTitle };