meno-core 1.0.54 → 1.1.0

package/dist/chunks/{chunk-7HWQUVTU.js → chunk-2IIQK7T3.js}

@@ -1,42 +1,71 @@
-import {
-  DEFAULT_BREAKPOINTS,
-  DEFAULT_FLUID_RANGE,
-  SCALABLE_CSS_PROPERTIES,
-  applyRemConversion,
-  buildFluidClampWithExplicitMin,
-  buildFluidPropertyValue,
-  convertPxToRem,
-  getBreakpointName,
-  getBreakpointValues,
-  getScaleMultiplier,
-  getSmallestBreakpointName,
-  parseValue,
-  scalePropertyValue,
-  shouldConvertProperty
-} from "./chunk-I2WEGYA7.js";
 import {
   DEFAULT_I18N_CONFIG,
   isI18nValue,
   resolveI18nInProps,
   resolveI18nValue
-} from "./chunk-3XER4E5W.js";
+} from "./chunk-4ZRU52J2.js";
 import {
   isTiptapDocument,
   tiptapToHtml
-} from "./chunk-NVRBTSQG.js";
+} from "./chunk-5X4HCN7J.js";
 import {
   NODE_TYPE,
   init_constants
-} from "./chunk-HIZMY3EP.js";
+} from "./chunk-AR7LHIFY.js";
 import {
   __esm,
   __export,
   __toCommonJS
 } from "./chunk-KSBZ2L7C.js";
 
+// lib/shared/errorLogger.ts
+function setErrorHandler(handler) {
+  errorHandler = handler;
+}
+function isDevelopment() {
+  if (typeof process !== "undefined" && process.env?.NODE_ENV) {
+    return process.env.NODE_ENV === "development";
+  }
+  return true;
+}
+function logRuntimeError(location, error, context) {
+  const entry = {
+    location,
+    category: "runtime",
+    error,
+    context,
+    timestamp: Date.now()
+  };
+  if (isDevelopment()) {
+    const errorMessage = error instanceof Error ? error.message : String(error);
+    console.error(`[${location}] ${errorMessage}`, context ?? "");
+  }
+  errorHandler?.(entry);
+}
+function logNetworkError(location, error, context) {
+  const entry = {
+    location,
+    category: "network",
+    error,
+    context,
+    timestamp: Date.now()
+  };
+  if (isDevelopment()) {
+    console.error(`[${location}] Network error:`, error, context ?? "");
+  }
+  errorHandler?.(entry);
+}
+var errorHandler;
+var init_errorLogger = __esm({
+  "lib/shared/errorLogger.ts"() {
+    "use strict";
+    errorHandler = null;
+  }
+});
+
 // lib/shared/validation/schemas.ts
 import { z } from "zod";
-var BasePropTypeSchema, PropTypeSchema, I18nValueObjectSchema, BasePropDefinitionSchema, EnumsConfigSchema, ListItemSchemaSchema, ListPropDefinitionSchema, PropDefinitionSchema, StyleMappingSchema, BooleanMappingSchema, IfConditionSchema, LinkMappingSchema, HtmlMappingSchema, StyleObjectSchema, ResponsiveStyleObjectSchema, StyleValueSchema, InteractiveStyleRuleSchema, InteractiveStylesSchema, SlotMarkerSchema, ComponentNodeSchema, HtmlNodeSchema, ComponentInstanceNodeSchema, EmbedNodeSchema, LinkNodeSchema, LocaleListNodeSchema, ListNodeSchemaBasic, ScriptLoadModeSchema, LibraryPositionSchema, ScriptTypeSchema, JSLibraryConfigSchema, CSSLibraryConfigSchema, LibrariesConfigSchema, StructuredComponentDefinitionSchema, ComponentDefinitionSchema, I18nOrStringSchema, LibraryMergeModeSchema, PageLibrariesConfigSchema, CustomCodeConfigSchema, PageMetaDataBaseSchema, PageMetaDataSchema, LineRangeSchema, JSONPageSchema, PageDataWithComponentSchema, PageDataSchema, CMSFieldTypeSchema, CMSFieldDefinitionSchema, CMSClientDataStrategySchema, CMSClientDataConfigSchema, CMSSchemaSchema, CMSItemSchema, CMSDraftItemSchema, CMSFilterConditionSchema, CMSSortConfigSchema, CMSListQuerySchema, CMSListNodeSchema, PageCmsConfigSchema, PageMetaDataWithCMSSchema;
+var BasePropTypeSchema, PropTypeSchema, I18nValueObjectSchema, BasePropDefinitionSchema, EnumsConfigSchema, ListItemSchemaSchema, ListPropDefinitionSchema, PropDefinitionSchema, StyleMappingSchema, BooleanMappingSchema, VerbatimCodeSchema, IfConditionSchema, LinkMappingSchema, HtmlMappingSchema, StyleObjectSchema, ResponsiveStyleObjectSchema, StyleValueSchema, InteractiveStyleRuleSchema, InteractiveStylesSchema, SlotMarkerSchema, ComponentNodeSchema, HtmlNodeSchema, ComponentInstanceNodeSchema, EmbedNodeSchema, LinkNodeSchema, LocaleListNodeSchema, ListNodeSchemaBasic, IslandNodeSchema, MarkdownNodeSchema, CustomNodeSchema, ScriptLoadModeSchema, LibraryPositionSchema, ScriptTypeSchema, JSLibraryConfigSchema, CSSLibraryConfigSchema, LibrariesConfigSchema, StructuredComponentDefinitionSchema, ComponentDefinitionSchema, I18nOrStringSchema, LibraryMergeModeSchema, PageLibrariesConfigSchema, CustomCodeConfigSchema, SitemapPageConfigSchema, PageMetaDataBaseSchema, PageMetaDataSchema, LineRangeSchema, JSONPageSchema, PageDataWithComponentSchema, PageDataSchema, CMSFieldTypeSchema, CMSFieldDefinitionSchema, CMSClientDataStrategySchema, CMSClientDataConfigSchema, CMSSchemaSchema, CMSItemSchema, CMSDraftItemSchema, CMSFilterConditionSchema, CMSSortConfigSchema, CMSListQuerySchema, CMSListNodeSchema, PageCmsConfigSchema, PageDataSourceSchema, PageDataConfigSchema, PageMetaDataWithCMSSchema;
 var init_schemas = __esm({
   "lib/shared/validation/schemas.ts"() {
     "use strict";
@@ -114,7 +143,8 @@ var init_schemas = __esm({
       prop: z.string(),
       values: z.record(z.string(), z.boolean())
     }).passthrough();
-    IfConditionSchema = z.union([z.boolean(), z.string(), BooleanMappingSchema]);
+    VerbatimCodeSchema = z.object({ _code: z.literal(true), expr: z.string() }).passthrough();
+    IfConditionSchema = z.union([z.boolean(), z.string(), BooleanMappingSchema, VerbatimCodeSchema]);
     LinkMappingSchema = z.object({
       _mapping: z.literal(true),
       prop: z.string(),
@@ -168,7 +198,7 @@ var init_schemas = __esm({
         style: StyleValueSchema.optional(),
         interactiveStyles: InteractiveStylesSchema.optional(),
         generateElementClass: z.boolean().optional(),
-        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema])).optional(),
+        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema, VerbatimCodeSchema])).optional(),
         props: z.record(z.string(), z.any()).optional(),
         // Allow props for backward compatibility
         children: z.union([
@@ -188,7 +218,7 @@ var init_schemas = __esm({
         style: StyleValueSchema.optional(),
         interactiveStyles: InteractiveStylesSchema.optional(),
         generateElementClass: z.boolean().optional(),
-        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema])).optional(),
+        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema, VerbatimCodeSchema])).optional(),
         children: z.union([
           z.array(z.union([ComponentNodeSchema, z.string(), I18nValueObjectSchema])),
           z.string(),
@@ -205,7 +235,7 @@ var init_schemas = __esm({
         style: StyleValueSchema.optional(),
         interactiveStyles: InteractiveStylesSchema.optional(),
         generateElementClass: z.boolean().optional(),
-        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema])).optional()
+        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema, VerbatimCodeSchema])).optional()
       }).passthrough()
     );
     LinkNodeSchema = z.lazy(
@@ -217,7 +247,7 @@ var init_schemas = __esm({
         style: StyleValueSchema.optional(),
         interactiveStyles: InteractiveStylesSchema.optional(),
         generateElementClass: z.boolean().optional(),
-        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema])).optional(),
+        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema, VerbatimCodeSchema])).optional(),
         children: z.union([
           z.array(z.union([ComponentNodeSchema, z.string(), I18nValueObjectSchema])),
           z.string(),
@@ -240,19 +270,29 @@ var init_schemas = __esm({
         showSeparator: z.boolean().optional(),
         showFlag: z.boolean().optional(),
         flagStyle: StyleValueSchema.optional(),
-        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema])).optional()
+        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema, VerbatimCodeSchema])).optional()
       }).passthrough()
     );
     ListNodeSchemaBasic = z.lazy(
       () => z.object({
         type: z.union([z.literal(NODE_TYPE.LIST), z.literal("cms-list")]),
         // Support both for migration
-        sourceType: z.enum(["prop", "collection"]).optional(),
+        sourceType: z.enum(["prop", "collection", "remote", "sanity", "expression"]).optional(),
         // defaults to 'prop'
         source: z.string().optional(),
         // Source prop name or collection name
         collection: z.string().optional(),
         // Legacy field for cms-list migration
+        // Remote-source options (sourceType: 'remote')
+        url: z.string().optional(),
+        // HTTP/JSON endpoint
+        path: z.string().optional(),
+        // dot-path into the response to the items array
+        // Sanity-source options (sourceType: 'sanity')
+        documentType: z.string().optional(),
+        // Sanity document `_type`
+        slugField: z.string().optional(),
+        // field used as the URL slug
         label: z.string().optional(),
         if: IfConditionSchema.optional(),
         itemAs: z.string().optional(),
@@ -267,6 +307,48 @@ var init_schemas = __esm({
         children: z.array(z.union([ComponentNodeSchema, z.string(), I18nValueObjectSchema])).optional()
       }).passthrough()
     );
+    IslandNodeSchema = z.lazy(
+      () => z.object({
+        type: z.literal(NODE_TYPE.ISLAND),
+        src: z.string(),
+        client: z.object({
+          directive: z.enum(["load", "idle", "visible", "media", "only"]),
+          value: z.string().optional()
+        }).passthrough().optional(),
+        props: z.record(z.string(), z.any()).optional(),
+        if: IfConditionSchema.optional(),
+        children: z.union([
+          z.array(z.union([ComponentNodeSchema, z.string(), I18nValueObjectSchema])),
+          z.string(),
+          I18nValueObjectSchema
+        ]).optional()
+      }).passthrough()
+    );
+    MarkdownNodeSchema = z.lazy(
+      () => z.object({
+        type: z.literal(NODE_TYPE.MARKDOWN),
+        source: z.string(),
+        label: z.string().optional(),
+        if: IfConditionSchema.optional(),
+        style: StyleValueSchema.optional(),
+        interactiveStyles: InteractiveStylesSchema.optional(),
+        generateElementClass: z.boolean().optional(),
+        attributes: z.record(z.string(), z.union([z.string(), z.number(), z.boolean(), I18nValueObjectSchema, VerbatimCodeSchema])).optional()
+      }).passthrough()
+    );
+    CustomNodeSchema = z.lazy(
+      () => z.object({
+        type: z.literal(NODE_TYPE.CUSTOM),
+        src: z.string(),
+        props: z.record(z.string(), z.any()).optional(),
+        if: IfConditionSchema.optional(),
+        children: z.union([
+          z.array(z.union([ComponentNodeSchema, z.string(), I18nValueObjectSchema])),
+          z.string(),
+          I18nValueObjectSchema
+        ]).optional()
+      }).passthrough()
+    );
     ComponentNodeSchema = z.union([
       HtmlNodeSchema,
       ComponentInstanceNodeSchema,
@@ -274,7 +356,13 @@ var init_schemas = __esm({
       EmbedNodeSchema,
       LinkNodeSchema,
       LocaleListNodeSchema,
-      ListNodeSchemaBasic
+      ListNodeSchemaBasic,
+      IslandNodeSchema,
+      MarkdownNodeSchema,
+      CustomNodeSchema,
+      // A verbatim-code marker is a valid child node (renders natively at build; nothing in the
+      // editor preview) — a meno-astro component with any `{_code}` child must validate to open.
+      VerbatimCodeSchema
     ]);
     ScriptLoadModeSchema = z.enum(["async", "defer"]);
     LibraryPositionSchema = z.enum(["head", "body-end"]);
@@ -333,6 +421,11 @@ var init_schemas = __esm({
       bodyStart: z.string().optional(),
       bodyEnd: z.string().optional()
     }).passthrough();
+    SitemapPageConfigSchema = z.object({
+      priority: z.number().optional(),
+      changefreq: z.enum(["always", "hourly", "daily", "weekly", "monthly", "yearly", "never"]).optional(),
+      exclude: z.boolean().optional()
+    }).passthrough();
     PageMetaDataBaseSchema = z.object({
       title: I18nOrStringSchema.optional(),
       description: I18nOrStringSchema.optional(),
@@ -344,7 +437,11 @@ var init_schemas = __esm({
       slugs: z.record(z.string(), z.string()).optional(),
       draft: z.boolean().optional(),
       libraries: PageLibrariesConfigSchema.optional(),
-      customCode: CustomCodeConfigSchema.optional()
+      customCode: CustomCodeConfigSchema.optional(),
+      viewTransitions: z.boolean().optional(),
+      noindex: z.boolean().optional(),
+      prerender: z.boolean().optional(),
+      sitemap: SitemapPageConfigSchema.optional()
     }).passthrough();
     PageMetaDataSchema = PageMetaDataBaseSchema;
     LineRangeSchema = z.object({
@@ -355,7 +452,10 @@ var init_schemas = __esm({
       components: z.record(z.string(), ComponentDefinitionSchema).optional(),
       root: ComponentNodeSchema.optional(),
       meta: PageMetaDataSchema.optional(),
-      _lineMap: z.record(z.string(), LineRangeSchema).optional()
+      _lineMap: z.record(z.string(), LineRangeSchema).optional(),
+      // Marks a page whose source is outside the meno-astro dialect (read-only in the editor).
+      // Explicit (not just .passthrough()) so it survives a future tightening of this schema.
+      _unsupported: z.object({ reason: z.string() }).passthrough().optional()
     }).passthrough().refine(
       (data) => {
         return data.meta !== void 0 || data.components !== void 0 || data.root !== void 0;
@@ -407,10 +507,12 @@ var init_schemas = __esm({
     CMSSchemaSchema = z.object({
       id: z.string(),
       name: z.string(),
-      slugField: z.string(),
-      urlPattern: z.string(),
+      // Optional: a data-only collection (no per-item route) omits both.
+      slugField: z.string().optional(),
+      urlPattern: z.string().optional(),
       fields: z.record(CMSFieldDefinitionSchema),
-      clientData: CMSClientDataConfigSchema.optional()
+      clientData: CMSClientDataConfigSchema.optional(),
+      rss: z.boolean().optional()
     }).passthrough();
     CMSItemSchema = z.object({
       _id: z.string(),
@@ -456,9 +558,23 @@ var init_schemas = __esm({
     PageCmsConfigSchema = z.object({
       id: z.string(),
       name: z.string(),
-      slugField: z.string(),
-      urlPattern: z.string(),
-      fields: z.record(CMSFieldDefinitionSchema)
+      // Optional: a data-only collection (no per-item route) omits both.
+      slugField: z.string().optional(),
+      urlPattern: z.string().optional(),
+      fields: z.record(CMSFieldDefinitionSchema),
+      rss: z.boolean().optional()
+    }).passthrough();
+    PageDataSourceSchema = z.object({
+      type: z.literal("fetch"),
+      url: z.string(),
+      method: z.literal("GET").optional(),
+      headers: z.record(z.string(), z.string()).optional(),
+      path: z.string().optional(),
+      fields: z.record(z.enum(["string", "number", "boolean", "date", "image", "object"])).optional(),
+      cardinality: z.enum(["object", "list"]).optional()
+    }).passthrough();
+    PageDataConfigSchema = z.object({
+      sources: z.record(z.string(), PageDataSourceSchema)
     }).passthrough();
     PageMetaDataWithCMSSchema = z.object({
       title: z.union([z.string(), z.object({ _i18n: z.literal(true) }).passthrough()]).optional(),
@@ -469,11 +585,18 @@ var init_schemas = __esm({
       ogImage: z.string().optional(),
       ogType: z.string().optional(),
       slugs: z.record(z.string(), z.string()).optional(),
-      source: z.enum(["static", "cms"]).optional(),
+      source: z.enum(["static", "cms", "ssr"]).optional(),
       cms: PageCmsConfigSchema.optional(),
+      data: PageDataConfigSchema.optional(),
+      routeParams: z.array(z.string()).optional(),
+      routePreview: z.record(z.string(), z.string()).optional(),
       draft: z.boolean().optional(),
       libraries: PageLibrariesConfigSchema.optional(),
-      customCode: CustomCodeConfigSchema.optional()
+      customCode: CustomCodeConfigSchema.optional(),
+      viewTransitions: z.boolean().optional(),
+      noindex: z.boolean().optional(),
+      prerender: z.boolean().optional(),
+      sitemap: SitemapPageConfigSchema.optional()
     }).passthrough();
   }
 });
@@ -483,6 +606,7 @@ var BaseComponentRegistry;
 var init_ComponentRegistry = __esm({
   "lib/shared/registry/ComponentRegistry.ts"() {
     "use strict";
+    init_errorLogger();
     BaseComponentRegistry = class {
       registry = {};
       listeners = /* @__PURE__ */ new Set();
@@ -557,6 +681,7 @@ var init_ComponentRegistry = __esm({
           try {
             listener();
           } catch (err) {
+            logRuntimeError("ComponentRegistry.notify", err);
           }
         }
       }
@@ -1312,7 +1437,12 @@ var init_SlotMarkerType = __esm({
       defaultValues: {},
       treeDisplay: {
         icon: "SLOT_MARKER",
-        getLabel: () => "slot"
+        // Show the slot's name so multiple named slots in a component are distinguishable
+        // (e.g. `slot: header`). Unnamed (default) slots stay just `slot`.
+        getLabel: (node) => {
+          const name = node.name;
+          return typeof name === "string" && name ? `slot: ${name}` : "slot";
+        }
       },
       clientRenderer: (_node, _context) => {
         return null;
@@ -1553,14 +1683,36 @@ var init_ListNodeType = __esm({
        * Data source type:
        * - 'prop': Read items from component props (default)
        * - 'collection': Query items from CMS collection
+       * - 'remote': Fetch items from a public HTTP/JSON endpoint at build/SSR time
+       * - 'sanity': Fetch a Sanity document type via GROQ at build/SSR time (read-only, public dataset)
+       * - 'expression': Iterate a verbatim JS expression (`source`) that yields an array — a
+       *   `.map()` over arbitrary frontmatter data (e.g. an Astro Action / supabase query) the
+       *   dialect can't model as a prop/collection. The item template (`children` + `itemAs`) IS
+       *   editable; the source itself is a read-only black box (edit it in the .astro frontmatter).
+       *   The editor has no data for it, so it renders empty in the design canvas (real Astro play
+       *   renders it for real at build/SSR).
        */
-      sourceType: z8.enum(["prop", "collection"]).default("prop"),
+      sourceType: z8.enum(["prop", "collection", "remote", "sanity", "expression"]).default("prop"),
       /**
-       * Source identifier:
+       * Source identifier (sourceType 'prop'/'collection'/'expression'; 'remote' uses `url`):
        * - For sourceType 'prop': Prop name (e.g., "items") or template expression (e.g., "{{category.items}}")
        * - For sourceType 'collection': Collection name (e.g., "posts", "authors")
+       * - For sourceType 'expression': the verbatim JS expression iterated by `.map()` (e.g. "notes?")
+       */
+      source: z8.string().optional(),
+      // Remote-only options (sourceType: 'remote')
+      /** HTTP(S) endpoint returning JSON, fetched at build/SSR time (e.g. a public REST API). */
+      url: z8.string().optional(),
+      /**
+       * Dot-path into the JSON response to reach the items array (e.g. "data.items").
+       * Empty/absent = the response body is itself the array.
        */
-      source: z8.string(),
+      path: z8.string().optional(),
+      // Sanity-only options (sourceType: 'sanity')
+      /** Sanity document `_type` to fetch (`*[_type == "<documentType>"]`). projectId/dataset come from project config. */
+      documentType: z8.string().optional(),
+      /** Field used as the URL slug (for synthesizing item links); defaults to 'slug'. */
+      slugField: z8.string().optional(),
       label: z8.string().optional(),
       // Custom label displayed in structure tree
       if: IfConditionSchema.optional(),
@@ -1613,8 +1765,9 @@ var init_ListNodeType = __esm({
         getLabel: (node) => {
           const listNode = node;
           const sourceType = listNode.sourceType || "prop";
-          const prefix = sourceType === "collection" ? "CMS List" : "List";
-          return listNode.source ? `${prefix}: ${listNode.source}` : prefix;
+          const prefix = sourceType === "collection" ? "CMS List" : sourceType === "remote" ? "Remote List" : sourceType === "sanity" ? "Sanity List" : sourceType === "expression" ? "Loop" : "List";
+          const src = sourceType === "remote" ? listNode.url : sourceType === "sanity" ? listNode.documentType : listNode.source;
+          return src ? `${prefix}: ${src}` : prefix;
         }
       },
       clientRenderer: (node, context) => {
@@ -1631,7 +1784,7 @@ var init_ListNodeType = __esm({
             key: context.key,
             "data-list": "true",
             "data-source-type": sourceType,
-            "data-source": listNode.source,
+            "data-source": sourceType === "remote" ? listNode.url : sourceType === "sanity" ? listNode.documentType : listNode.source,
             style: {
               padding: "8px 12px",
               background: bgColor,
@@ -1657,7 +1810,7 @@ var init_ListNodeType = __esm({
           label: "Source Type",
           type: "select",
           required: false,
-          options: ["prop", "collection"]
+          options: ["prop", "collection", "remote", "sanity"]
         },
         {
           name: "source",
@@ -1678,6 +1831,240 @@ var init_ListNodeType = __esm({
   }
 });
 
+// lib/shared/registry/nodeTypes/IslandNodeType.ts
+import { z as z9 } from "zod";
+import { createElement as h7 } from "react";
+function islandName(src) {
+  const base = src.split("/").pop() ?? src;
+  return base.replace(/\.(tsx|jsx|vue|svelte)$/i, "") || base;
+}
+function islandChildren(node) {
+  const { children } = node;
+  if (Array.isArray(children)) return children.length > 0 ? children : void 0;
+  if (typeof children === "string") return children.length > 0 ? children : void 0;
+  return void 0;
+}
+function escapeHtml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+var IslandClientDirectiveSchema, IslandNodeSchemaInternal, IslandNodeType;
+var init_IslandNodeType = __esm({
+  "lib/shared/registry/nodeTypes/IslandNodeType.ts"() {
+    "use strict";
+    init_schemas();
+    init_createNodeType();
+    init_fieldPresets();
+    IslandClientDirectiveSchema = z9.object({
+      directive: z9.enum(["load", "idle", "visible", "media", "only"]),
+      value: z9.string().optional()
+    }).passthrough();
+    IslandNodeSchemaInternal = z9.object({
+      type: z9.literal("island"),
+      // Path to the framework component file relative to `src/islands/`
+      // (e.g. "Counter.tsx", "widgets/Chart.vue"). The extension derives the
+      // framework, which drives the Astro integration that gets provisioned.
+      src: z9.string(),
+      client: IslandClientDirectiveSchema.optional(),
+      props: z9.record(z9.string(), z9.any()).optional(),
+      if: IfConditionSchema.optional(),
+      // Conditional rendering - skip node when false
+      // Slotted children (rendered server-side into the island's <slot/>).
+      children: z9.union([z9.array(z9.any()), z9.string()]).optional()
+    }).passthrough();
+    IslandNodeType = createNodeType({
+      type: "island",
+      displayName: "Island",
+      category: "special",
+      schema: IslandNodeSchemaInternal,
+      defaultValues: {
+        src: "",
+        client: { directive: "load" }
+      },
+      treeDisplay: {
+        icon: "COMPONENT",
+        getLabel: (node) => `Island: ${islandName(node.src) || "?"}`
+      },
+      editableFields: [
+        textField({ name: "src", label: "Island file", required: true, placeholder: "Counter.tsx" }),
+        selectField({
+          name: "client.directive",
+          label: "Hydration",
+          // The empty-value entry clears `client` entirely → a server-rendered island
+          // with zero JS (a valid Astro pattern); the rest map to `client:<directive>`.
+          options: [{ value: "", label: "None (server-only, no JS)" }, "load", "idle", "visible", "media", "only"]
+        })
+      ],
+      // meno-core can't run a framework component. Instead of a loud highlight box
+      // (which made island-heavy pages unreadable), render the island's slotted
+      // children as normal content and fall back to a quiet inline marker when there
+      // are none. The wrapper keeps `data-island` for selection/identification only.
+      // Real hydration is play/build only.
+      clientRenderer: (node, context) => {
+        const children = islandChildren(node);
+        const inner = children ? context.buildChildren(children, context.elementPath) : h7("span", { style: { color: "#9ca3af", fontSize: "13px" } }, islandName(node.src) || "?");
+        return h7("div", { key: context.key, "data-island": node.src, style: { display: "contents" } }, inner);
+      },
+      ssrRenderer: (node, context) => {
+        const children = islandChildren(node);
+        const inner = children ? context.renderChildren(children, context) : `<span style="color:#9ca3af;font-size:13px">${escapeHtml(islandName(node.src) || "?")}</span>`;
+        return `<div data-island="${escapeHtml(node.src)}" style="display:contents">${inner}</div>`;
+      },
+      capabilities: {
+        canHaveChildren: true,
+        canHaveStyle: false,
+        canHaveAttributes: false,
+        requiresProps: ["src"]
+      }
+    });
+  }
+});
+
+// lib/shared/markdown.ts
+import MarkdownIt from "markdown-it";
+function renderMarkdown(source) {
+  if (typeof source !== "string" || source.trim() === "") return "";
+  return md.render(source);
+}
+var md;
+var init_markdown = __esm({
+  "lib/shared/markdown.ts"() {
+    "use strict";
+    md = new MarkdownIt({ html: true, linkify: true, breaks: false });
+  }
+});
+
+// lib/shared/registry/nodeTypes/MarkdownNodeType.ts
+import { z as z10 } from "zod";
+import { createElement as h8 } from "react";
+var MarkdownNodeSchemaInternal, MarkdownNodeType;
+var init_MarkdownNodeType = __esm({
+  "lib/shared/registry/nodeTypes/MarkdownNodeType.ts"() {
+    "use strict";
+    init_markdown();
+    init_schemas();
+    init_createNodeType();
+    init_fieldPresets();
+    MarkdownNodeSchemaInternal = z10.object({
+      type: z10.literal("markdown"),
+      source: z10.string(),
+      // verbatim Markdown source (whitespace-significant)
+      label: z10.string().optional(),
+      // Custom label displayed in structure tree
+      if: IfConditionSchema.optional(),
+      // Conditional rendering - skip node when false
+      style: StyleValueSchema.optional(),
+      interactiveStyles: InteractiveStylesSchema.optional(),
+      generateElementClass: z10.boolean().optional(),
+      attributes: z10.record(z10.string(), z10.union([z10.string(), z10.number(), z10.boolean()])).optional()
+    }).passthrough();
+    MarkdownNodeType = createNodeType({
+      type: "markdown",
+      displayName: "Markdown",
+      category: "content",
+      schema: MarkdownNodeSchemaInternal,
+      defaultValues: {
+        source: "",
+        style: { base: {} }
+      },
+      treeDisplay: {
+        icon: "HTML_ELEMENT",
+        getLabel: () => "Markdown"
+      },
+      editableFields: [
+        textareaField({
+          name: "source",
+          label: "Markdown",
+          required: true,
+          placeholder: "# Heading\n\nWrite **markdown** here\u2026"
+        })
+      ],
+      clientRenderer: (node, context) => {
+        return h8("div", {
+          key: context.key,
+          dangerouslySetInnerHTML: { __html: renderMarkdown(node.source) }
+        });
+      },
+      ssrRenderer: (node, _context) => {
+        return `<div>${renderMarkdown(node.source)}</div>`;
+      },
+      capabilities: {
+        canHaveChildren: false,
+        requiresProps: ["source"]
+      }
+    });
+  }
+});
+
+// lib/shared/registry/nodeTypes/CustomNodeType.ts
+import { z as z11 } from "zod";
+import { createElement as h9 } from "react";
+function customName(src) {
+  const base = src.split("/").pop() ?? src;
+  return base.replace(/\.astro$/i, "") || base;
+}
+function customChildren(node) {
+  const { children } = node;
+  if (Array.isArray(children)) return children.length > 0 ? children : void 0;
+  if (typeof children === "string") return children.length > 0 ? children : void 0;
+  return void 0;
+}
+function escapeHtml2(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+var CustomNodeSchemaInternal, CustomNodeType;
+var init_CustomNodeType = __esm({
+  "lib/shared/registry/nodeTypes/CustomNodeType.ts"() {
+    "use strict";
+    init_schemas();
+    init_createNodeType();
+    init_fieldPresets();
+    CustomNodeSchemaInternal = z11.object({
+      type: z11.literal("custom"),
+      // Path to the hand-authored .astro component relative to `src/custom/`
+      // (e.g. "Fancy.astro", "widgets/Banner.astro").
+      src: z11.string(),
+      props: z11.record(z11.string(), z11.any()).optional(),
+      if: IfConditionSchema.optional(),
+      // Conditional rendering - skip node when false
+      // Slotted children (rendered server-side into the component's default <slot/>).
+      children: z11.union([z11.array(z11.any()), z11.string()]).optional()
+    }).passthrough();
+    CustomNodeType = createNodeType({
+      type: "custom",
+      displayName: "Custom Component",
+      category: "special",
+      schema: CustomNodeSchemaInternal,
+      defaultValues: {
+        src: ""
+      },
+      treeDisplay: {
+        icon: "COMPONENT",
+        getLabel: (node) => `Custom: ${customName(node.src) || "?"}`
+      },
+      editableFields: [textField({ name: "src", label: "Custom .astro file", required: true, placeholder: "Fancy.astro" })],
+      // meno-core can't run a foreign `.astro` file. Render the slotted children as normal
+      // content and fall back to a quiet inline marker when there are none. The wrapper keeps
+      // `data-custom` for selection/identification only. Real rendering is play/build only.
+      clientRenderer: (node, context) => {
+        const children = customChildren(node);
+        const inner = children ? context.buildChildren(children, context.elementPath) : h9("span", { style: { color: "#9ca3af", fontSize: "13px" } }, customName(node.src) || "?");
+        return h9("div", { key: context.key, "data-custom": node.src, style: { display: "contents" } }, inner);
+      },
+      ssrRenderer: (node, context) => {
+        const children = customChildren(node);
+        const inner = children ? context.renderChildren(children, context) : `<span style="color:#9ca3af;font-size:13px">${escapeHtml2(customName(node.src) || "?")}</span>`;
+        return `<div data-custom="${escapeHtml2(node.src)}" style="display:contents">${inner}</div>`;
+      },
+      capabilities: {
+        canHaveChildren: true,
+        canHaveStyle: false,
+        canHaveAttributes: false,
+        requiresProps: ["src"]
+      }
+    });
+  }
+});
+
 // lib/shared/registry/nodeTypes/index.ts
 function registerBuiltInNodeTypes() {
   globalNodeTypeManager.registerAll(builtInNodeTypes);
@@ -1694,6 +2081,9 @@ var init_nodeTypes = __esm({
     init_LinkNodeType();
     init_LocaleListNodeType();
     init_ListNodeType();
+    init_IslandNodeType();
+    init_MarkdownNodeType();
+    init_CustomNodeType();
     init_HtmlNodeType();
     init_ComponentInstanceNodeType();
     init_SlotMarkerType();
@@ -1701,6 +2091,9 @@ var init_nodeTypes = __esm({
     init_LinkNodeType();
     init_LocaleListNodeType();
     init_ListNodeType();
+    init_IslandNodeType();
+    init_MarkdownNodeType();
+    init_CustomNodeType();
     builtInNodeTypes = [
       HtmlNodeType,
       ComponentInstanceNodeType,
@@ -1708,7 +2101,10 @@ var init_nodeTypes = __esm({
       EmbedNodeType,
       LinkNodeType,
       LocaleListNodeType,
-      ListNodeType
+      ListNodeType,
+      IslandNodeType,
+      MarkdownNodeType,
+      CustomNodeType
     ];
   }
 });
@@ -1761,6 +2157,312 @@ var init_registry = __esm({
   }
 });
 
+// lib/shared/breakpoints.ts
+var DEFAULT_BREAKPOINTS = {
+  tablet: { breakpoint: 1024, previewPoint: 768 },
+  mobile: { breakpoint: 540, previewPoint: 375 }
+};
+function normalizeBreakpointConfig(input) {
+  const result = {};
+  for (const [name, value] of Object.entries(input)) {
+    if (typeof value === "number") {
+      result[name] = { breakpoint: value, previewPoint: value };
+    } else if (typeof value === "object" && value !== null) {
+      result[name] = {
+        breakpoint: value.breakpoint,
+        previewPoint: value.previewPoint ?? value.breakpoint,
+        ...value.label !== void 0 && { label: value.label }
+      };
+    }
+  }
+  return result;
+}
+function getBreakpointValues(config) {
+  const result = {};
+  for (const [name, entry] of Object.entries(config)) {
+    result[name] = entry.breakpoint;
+  }
+  return result;
+}
+function getPreviewPointValues(config) {
+  const result = {};
+  for (const [name, entry] of Object.entries(config)) {
+    result[name] = entry.previewPoint;
+  }
+  return result;
+}
+function getAllBreakpointNames(breakpoints = DEFAULT_BREAKPOINTS) {
+  const names = ["base"];
+  const breakpointEntries = Object.entries(breakpoints);
+  breakpointEntries.sort((a, b) => b[1].breakpoint - a[1].breakpoint);
+  for (const [name] of breakpointEntries) {
+    names.push(name);
+  }
+  return names;
+}
+function getBreakpointName(viewportWidth, breakpoints = DEFAULT_BREAKPOINTS) {
+  const breakpointEntries = Object.entries(breakpoints);
+  breakpointEntries.sort((a, b) => a[1].breakpoint - b[1].breakpoint);
+  for (const [name, entry] of breakpointEntries) {
+    if (viewportWidth <= entry.breakpoint) {
+      return name;
+    }
+  }
+  return "base";
+}
+function getBreakpointLabel(name, breakpoints = DEFAULT_BREAKPOINTS) {
+  if (name === "base") {
+    return "Desktop";
+  }
+  const entry = breakpoints[name];
+  if (entry?.label) {
+    return entry.label;
+  }
+  return name.replace(/([A-Z])/g, " $1").replace(/^./, (str) => str.toUpperCase()).trim();
+}
+
+// lib/shared/responsiveScaling.ts
+var DEFAULT_FLUID_RANGE = { min: 320, max: 1440 };
+var DEFAULT_SITE_MARGIN = { min: 16, max: 32 };
+function getScaleCategory(property) {
+  const propertyStr = property;
+  if (property === "fontSize") return "fontSize";
+  if (propertyStr.startsWith("padding")) return "padding";
+  if (propertyStr.startsWith("margin")) return "margin";
+  if (property === "gap" || property === "rowGap" || property === "columnGap") return "gap";
+  if (propertyStr === "borderRadius" || propertyStr.startsWith("border") && propertyStr.includes("Radius"))
+    return "borderRadius";
+  if (property === "width" || property === "height" || property === "maxWidth" || property === "maxHeight" || property === "minWidth" || property === "minHeight")
+    return "size";
+  return null;
+}
+function parseValue(valueStr) {
+  const match = valueStr.trim().match(/^(-?[\d.]+)(px|rem|em|%|pt)$/);
+  if (!match) return null;
+  return {
+    value: parseFloat(match[1] ?? ""),
+    unit: match[2] ?? ""
+  };
+}
+var SCALABLE_CSS_PROPERTIES = /* @__PURE__ */ new Set([
+  "padding",
+  "padding-left",
+  "padding-right",
+  "padding-top",
+  "padding-bottom",
+  "paddingLeft",
+  "paddingRight",
+  "paddingTop",
+  "paddingBottom",
+  "margin",
+  "margin-left",
+  "margin-right",
+  "margin-top",
+  "margin-bottom",
+  "marginLeft",
+  "marginRight",
+  "marginTop",
+  "marginBottom",
+  "font-size",
+  "fontSize",
+  "gap",
+  "row-gap",
+  "column-gap",
+  "rowGap",
+  "columnGap",
+  "border-radius",
+  "borderRadius",
+  "border-top-left-radius",
+  "border-top-right-radius",
+  "border-bottom-left-radius",
+  "border-bottom-right-radius",
+  "borderTopLeftRadius",
+  "borderTopRightRadius",
+  "borderBottomLeftRadius",
+  "borderBottomRightRadius",
+  "width",
+  "height",
+  "max-width",
+  "max-height",
+  "min-width",
+  "min-height",
+  "maxWidth",
+  "maxHeight",
+  "minWidth",
+  "minHeight"
+]);
+function calculateResponsiveValue(baseValue, baseReference, scale) {
+  if (Math.abs(baseValue) <= baseReference) {
+    return Math.round(baseValue);
+  }
+  const scaled = baseValue + (baseValue - baseReference) * (scale - 1);
+  return Math.round(scaled);
+}
+function getScaleMultiplier(scales, property, breakpoint) {
+  const category = getScaleCategory(property);
+  if (!category || !scales[category]) return null;
+  const scaleConfig = scales[category];
+  return scaleConfig?.[breakpoint] ?? null;
+}
+function parseMultiValue(valueStr) {
+  const normalized = valueStr.replace(/(?<=\w)-(?=\d|auto|inherit|initial|unset)/g, " ");
+  return normalized.trim().split(/\s+/).filter((v) => v.length > 0);
+}
+function scaleValue(valueStr, baseReference, scale) {
+  const parsed = parseValue(valueStr);
+  if (!parsed) return null;
+  if (parsed.unit === "%" || parsed.unit === "em") {
+    return valueStr.trim();
+  }
+  const scaledValue = calculateResponsiveValue(parsed.value, baseReference, scale);
+  return `${scaledValue}${parsed.unit}`;
+}
+function scalePropertyValue(valueStr, baseReference, scale) {
+  const parts = parseMultiValue(valueStr);
+  if (parts.length === 0) return null;
+  const scaledParts = parts.map((part) => {
+    const scaled = scaleValue(part, baseReference, scale);
+    if (scaled !== null) {
+      return scaled;
+    }
+    return part;
+  });
+  return scaledParts.join(" ");
+}
+function getResponsiveValues(baseValue, property, scales, breakpointNames) {
+  if (!scales.enabled) {
+    return { base: baseValue };
+  }
+  const result = {
+    base: baseValue
+  };
+  const baseRef = scales.baseReference || 16;
+  const breakpoints = breakpointNames ?? ["tablet", "mobile"];
+  for (const breakpointName of breakpoints) {
+    const scale = getScaleMultiplier(scales, property, breakpointName);
+    if (scale !== null) {
+      result[breakpointName] = scalePropertyValue(baseValue, baseRef, scale);
+    }
+  }
+  return result;
+}
+function resolveVariableValueAtBreakpoint(variable, breakpoint, responsiveScales) {
+  if (breakpoint === "base") return variable.value;
+  const override = variable.scales?.[breakpoint];
+  if (override !== void 0) return override;
+  if (responsiveScales?.enabled && variable.type !== "none") {
+    const scale = getScaleMultiplier(responsiveScales, variable.type, breakpoint);
+    if (scale !== null) {
+      const baseRef = responsiveScales.baseReference || 16;
+      const scaled = scalePropertyValue(variable.value, baseRef, scale);
+      if (scaled !== null) return scaled;
+    }
+  }
+  return variable.value;
+}
+function getSmallestBreakpointName(breakpoints) {
+  if (!breakpoints) return null;
+  const entries = Object.entries(breakpoints);
+  const firstEntry = entries[0];
+  if (entries.length === 0 || firstEntry === void 0) return null;
+  let smallestName = firstEntry[0];
+  let smallestWidth = firstEntry[1].breakpoint;
+  for (const [name, cfg] of entries) {
+    if (cfg.breakpoint < smallestWidth) {
+      smallestWidth = cfg.breakpoint;
+      smallestName = name;
+    }
+  }
+  return smallestName;
+}
+function buildFluidClamp(baseValue, unit, scale, vpMin, vpMax, baseReference = 16) {
+  const max = baseValue;
+  const min = calculateResponsiveValue(baseValue, baseReference, scale);
+  if (min === max || vpMax === vpMin) {
+    return `${formatNumber(max)}${unit}`;
+  }
+  const unitToPx = unit === "rem" ? 16 : 1;
+  const minPx = min * unitToPx;
+  const maxPx = max * unitToPx;
+  const slopePx = (maxPx - minPx) / (vpMax - vpMin);
+  const interceptPx = minPx - slopePx * vpMin;
+  const interceptInUnit = interceptPx / unitToPx;
+  const slopeVw = slopePx * 100;
+  return `clamp(${formatNumber(min)}${unit}, ${formatNumber(interceptInUnit)}${unit} + ${formatNumber(slopeVw)}vw, ${formatNumber(max)}${unit})`;
+}
+function buildFluidClampWithExplicitMin(minValue, maxValue, unit, vpMin, vpMax) {
+  if (minValue === maxValue || vpMax === vpMin) {
+    return `${formatNumber(maxValue)}${unit}`;
+  }
+  const unitToPx = unit === "rem" ? 16 : 1;
+  const minPx = minValue * unitToPx;
+  const maxPx = maxValue * unitToPx;
+  const slopePx = (maxPx - minPx) / (vpMax - vpMin);
+  const interceptPx = minPx - slopePx * vpMin;
+  const interceptInUnit = interceptPx / unitToPx;
+  const slopeVw = slopePx * 100;
+  return `clamp(${formatNumber(minValue)}${unit}, ${formatNumber(interceptInUnit)}${unit} + ${formatNumber(slopeVw)}vw, ${formatNumber(maxValue)}${unit})`;
+}
+function formatNumber(n) {
+  if (Number.isInteger(n)) return String(n);
+  return Number(n.toFixed(4)).toString();
+}
+function buildSiteMarginClamp(siteMargin, fluidRange) {
+  const { min, max } = siteMargin;
+  const { min: vpMin, max: vpMax } = fluidRange;
+  if (min === max || vpMax === vpMin) {
+    return `${formatNumber(max)}px`;
+  }
+  const slopePx = (max - min) / (vpMax - vpMin);
+  const interceptPx = min - slopePx * vpMin;
+  const slopeVw = slopePx * 100;
+  return `clamp(${formatNumber(min)}px, ${formatNumber(interceptPx)}px + ${formatNumber(slopeVw)}vw, ${formatNumber(max)}px)`;
+}
+function buildFluidPropertyValue(valueStr, scale, vpMin, vpMax, baseReference = 16) {
+  const parts = parseMultiValue(valueStr);
+  if (parts.length === 0) return null;
+  let anyScaled = false;
+  const out = parts.map((part) => {
+    const parsed = parseValue(part);
+    if (!parsed) return part;
+    if (parsed.unit === "%" || parsed.unit === "em") return part;
+    anyScaled = true;
+    return buildFluidClamp(parsed.value, parsed.unit, scale, vpMin, vpMax, baseReference);
+  });
+  return anyScaled ? out.join(" ") : null;
+}
+var DEFAULT_RESPONSIVE_SCALES = {
+  enabled: false,
+  mode: "breakpoints",
+  baseReference: 16,
+  fluidRange: { ...DEFAULT_FLUID_RANGE },
+  siteMargin: { ...DEFAULT_SITE_MARGIN },
+  fontSize: {
+    tablet: 0.88,
+    mobile: 0.75
+  },
+  padding: {
+    tablet: 0.75,
+    mobile: 0.5
+  },
+  margin: {
+    tablet: 0.7,
+    mobile: 0.45
+  },
+  gap: {
+    tablet: 0.65,
+    mobile: 0.4
+  },
+  borderRadius: {
+    tablet: 0.85,
+    mobile: 0.7
+  },
+  size: {
+    tablet: 0.9,
+    mobile: 0.75
+  }
+};
+
 // lib/shared/types/prefetch.ts
 var DEFAULT_PREFETCH_CONFIG = {
   enabled: false,
@@ -1998,18 +2700,29 @@ var IRREGULAR_PLURALS = {
   vertices: "vertex",
   matrices: "matrix"
 };
-function singularize(collection) {
+function toIdentifier(name) {
+  if (/^[A-Za-z_$][A-Za-z0-9_$]*$/.test(name)) return name;
+  const parts = name.split(/[^A-Za-z0-9]+/).filter(Boolean);
+  if (parts.length === 0) return "item";
+  const camel = parts[0] + parts.slice(1).map((p) => p[0].toUpperCase() + p.slice(1)).join("");
+  return /^[0-9]/.test(camel) ? `_${camel}` : camel;
+}
+function singularizeRaw(collection) {
   if (IRREGULAR_PLURALS[collection]) {
     return IRREGULAR_PLURALS[collection];
   }
   if (collection.endsWith("ies")) {
-    return collection.slice(0, -3) + "y";
+    return `${collection.slice(0, -3)}y`;
   }
   if (collection.endsWith("ses") || collection.endsWith("xes") || collection.endsWith("zes") || collection.endsWith("ches") || collection.endsWith("shes")) {
     return collection.slice(0, -2);
   }
   return collection.endsWith("s") ? collection.slice(0, -1) : collection;
 }
+function singularize(collection) {
+  if (typeof collection !== "string" || collection === "") return "item";
+  return toIdentifier(singularizeRaw(collection));
+}
 function isItemDraftForLocale(item, locale) {
   return item._draftLocales?.includes(locale) === true;
 }
@@ -2053,6 +2766,10 @@ function evaluateNode(node, context) {
         const left2 = evaluateNode(binaryNode.left, context);
         return left2 ? left2 : evaluateNode(binaryNode.right, context);
       }
+      if (binaryNode.operator === "??") {
+        const left2 = evaluateNode(binaryNode.left, context);
+        return left2 === null || left2 === void 0 ? evaluateNode(binaryNode.right, context) : left2;
+      }
       const left = evaluateNode(binaryNode.left, context);
       const right = evaluateNode(binaryNode.right, context);
       switch (binaryNode.operator) {
@@ -2266,7 +2983,8 @@ function processItemTemplate(text, ctx, resolveValue) {
 function resolveCompleteTemplateRaw(template, ctx, resolveValue) {
   const match = template.match(/^\{\{(\w+)\.([^}]+)\}\}$/);
   if (!match) return void 0;
-  const [, varName, fieldPath] = match;
+  const varName = match[1] ?? "";
+  const fieldPath = match[2] ?? "";
   const trimmedField = fieldPath.trim();
   if (/[?:<>=!&|+\-*/%]/.test(trimmedField)) return void 0;
   const item = ctx[varName];
@@ -2312,7 +3030,8 @@ function resolveItemsTemplate(template, ctx) {
   if (!match) {
     return template;
   }
-  const [, varName, fieldPath] = match;
+  const varName = match[1] ?? "";
+  const fieldPath = match[2] ?? "";
   const item = ctx[varName];
   if (!item || typeof item !== "object") {
     return void 0;
@@ -2329,7 +3048,8 @@ function resolveItemsTemplate(template, ctx) {
 function resolveTemplateRawValue(template, ctx) {
   const match = template.match(/^\{\{(\w+)\.([^}]+)\}\}$/);
   if (!match) return void 0;
-  const [, varName, fieldPath] = match;
+  const varName = match[1] ?? "";
+  const fieldPath = match[2] ?? "";
   const item = ctx[varName];
   if (!item || typeof item !== "object") return void 0;
   return getNestedValue(item, fieldPath.trim());
@@ -2367,6 +3087,7 @@ function buildItemUrl(urlPattern, item, slugField, locale, i18nConfig) {
   return urlPattern.replace("{{slug}}", String(slug));
 }
 function addItemUrl(item, schema, locale, i18nConfig) {
+  if (!schema.urlPattern || !schema.slugField) return item;
   return {
     ...item,
     _url: buildItemUrl(schema.urlPattern, item, schema.slugField, locale, i18nConfig)
@@ -2542,7 +3263,8 @@ function extractNodeProperties(node) {
 }
 function isLikelyComponentTag(tag) {
   if (!tag) return false;
-  return tag.length > 0 && tag[0] === tag[0].toUpperCase() && tag[0] !== tag[0].toLowerCase();
+  const first = tag[0];
+  return first !== void 0 && first === first.toUpperCase() && first !== first.toLowerCase();
 }
 function isSlotMarker(node) {
   return node?.type === NODE_TYPE.SLOT;
@@ -2575,6 +3297,12 @@ function isLinkNode(node) {
 function isLocaleListNode(node) {
   return node?.type === NODE_TYPE.LOCALE_LIST;
 }
+function isIslandNode(node) {
+  return node?.type === NODE_TYPE.ISLAND;
+}
+function isCustomNode(node) {
+  return node?.type === NODE_TYPE.CUSTOM;
+}
 function isCMSListNode(node) {
   if (node === null || typeof node !== "object") return false;
   const n = node;
@@ -2586,10 +3314,10 @@ function isListNode(node) {
   return n.type === NODE_TYPE.LIST || n.type === "cms-list";
 }
 function isValidNodeType(type) {
-  return type === NODE_TYPE.NODE || type === NODE_TYPE.COMPONENT || type === NODE_TYPE.SLOT || type === NODE_TYPE.EMBED || type === NODE_TYPE.LINK || type === NODE_TYPE.LOCALE_LIST || type === NODE_TYPE.LIST || type === "cms-list";
+  return type === NODE_TYPE.NODE || type === NODE_TYPE.COMPONENT || type === NODE_TYPE.SLOT || type === NODE_TYPE.EMBED || type === NODE_TYPE.LINK || type === NODE_TYPE.LOCALE_LIST || type === NODE_TYPE.LIST || type === NODE_TYPE.ISLAND || type === NODE_TYPE.CUSTOM || type === NODE_TYPE.MARKDOWN || type === "cms-list";
 }
 function canHaveChildren(node) {
-  return node !== null && node !== void 0 && !isSlotMarker(node);
+  return node !== null && node !== void 0 && !isSlotMarker(node) && node._code !== true;
 }
 function canHaveStyle(node) {
   return node !== null && node !== void 0 && !isSlotMarker(node);
@@ -2685,7 +3413,7 @@ function coerceValue(value, expectedType) {
       }
       if (typeof value === "string") {
         const num = Number(value);
-        if (!isNaN(num) && isFinite(num)) {
+        if (!Number.isNaN(num) && Number.isFinite(num)) {
           return num;
         }
       }
@@ -2891,7 +3619,7 @@ function resolveComponentProps(options) {
       result = resolveI18nInProps(result, locale, i18nConfig);
     }
     return wrapRichTextProps(result, propDefs);
-  } catch (error) {
+  } catch (_error) {
     const resolvedProps = {};
     for (const [propName, propDef] of Object.entries(propDefs)) {
       if (propDef && typeof propDef === "object" && "default" in propDef) {
@@ -2922,221 +3650,6 @@ function resolvePropsFromDefinition(componentDef, passedProps = {}, children = [
   });
 }
 
-// lib/shared/cssNamedColors.ts
-var CSS_NAMED_COLORS = /* @__PURE__ */ new Set([
-  // CSS Level 4 named colors
-  "aliceblue",
-  "antiquewhite",
-  "aqua",
-  "aquamarine",
-  "azure",
-  "beige",
-  "bisque",
-  "black",
-  "blanchedalmond",
-  "blue",
-  "blueviolet",
-  "brown",
-  "burlywood",
-  "cadetblue",
-  "chartreuse",
-  "chocolate",
-  "coral",
-  "cornflowerblue",
-  "cornsilk",
-  "crimson",
-  "cyan",
-  "darkblue",
-  "darkcyan",
-  "darkgoldenrod",
-  "darkgray",
-  "darkgreen",
-  "darkgrey",
-  "darkkhaki",
-  "darkmagenta",
-  "darkolivegreen",
-  "darkorange",
-  "darkorchid",
-  "darkred",
-  "darksalmon",
-  "darkseagreen",
-  "darkslateblue",
-  "darkslategray",
-  "darkslategrey",
-  "darkturquoise",
-  "darkviolet",
-  "deeppink",
-  "deepskyblue",
-  "dimgray",
-  "dimgrey",
-  "dodgerblue",
-  "firebrick",
-  "floralwhite",
-  "forestgreen",
-  "fuchsia",
-  "gainsboro",
-  "ghostwhite",
-  "gold",
-  "goldenrod",
-  "gray",
-  "green",
-  "greenyellow",
-  "grey",
-  "honeydew",
-  "hotpink",
-  "indianred",
-  "indigo",
-  "ivory",
-  "khaki",
-  "lavender",
-  "lavenderblush",
-  "lawngreen",
-  "lemonchiffon",
-  "lightblue",
-  "lightcoral",
-  "lightcyan",
-  "lightgoldenrodyellow",
-  "lightgray",
-  "lightgreen",
-  "lightgrey",
-  "lightpink",
-  "lightsalmon",
-  "lightseagreen",
-  "lightskyblue",
-  "lightslategray",
-  "lightslategrey",
-  "lightsteelblue",
-  "lightyellow",
-  "lime",
-  "limegreen",
-  "linen",
-  "magenta",
-  "maroon",
-  "mediumaquamarine",
-  "mediumblue",
-  "mediumorchid",
-  "mediumpurple",
-  "mediumseagreen",
-  "mediumslateblue",
-  "mediumspringgreen",
-  "mediumturquoise",
-  "mediumvioletred",
-  "midnightblue",
-  "mintcream",
-  "mistyrose",
-  "moccasin",
-  "navajowhite",
-  "navy",
-  "oldlace",
-  "olive",
-  "olivedrab",
-  "orange",
-  "orangered",
-  "orchid",
-  "palegoldenrod",
-  "palegreen",
-  "paleturquoise",
-  "palevioletred",
-  "papayawhip",
-  "peachpuff",
-  "peru",
-  "pink",
-  "plum",
-  "powderblue",
-  "purple",
-  "rebeccapurple",
-  "red",
-  "rosybrown",
-  "royalblue",
-  "saddlebrown",
-  "salmon",
-  "sandybrown",
-  "seagreen",
-  "seashell",
-  "sienna",
-  "silver",
-  "skyblue",
-  "slateblue",
-  "slategray",
-  "slategrey",
-  "snow",
-  "springgreen",
-  "steelblue",
-  "tan",
-  "teal",
-  "thistle",
-  "tomato",
-  "turquoise",
-  "violet",
-  "wheat",
-  "white",
-  "whitesmoke",
-  "yellow",
-  "yellowgreen",
-  // CSS color keywords
-  "transparent",
-  "currentcolor",
-  // CSS-wide keywords (should never be wrapped in var())
-  "inherit",
-  "initial",
-  "unset",
-  "revert"
-]);
-function isCssNamedColor(value) {
-  return CSS_NAMED_COLORS.has(value.toLowerCase());
-}
-
-// lib/shared/styleValueRegistry.ts
-var registry = /* @__PURE__ */ new Map();
-var dynamicRegistry = /* @__PURE__ */ new Map();
-function registerStyleValue(className, value) {
-  registry.set(className, value);
-}
-function registerDynamicStyle(className, property, value) {
-  dynamicRegistry.set(className, { property, value });
-}
-function getStyleValue(className) {
-  return registry.get(className);
-}
-function getDynamicStyle(className) {
-  return dynamicRegistry.get(className);
-}
-function isDynamicClass(className) {
-  return dynamicRegistry.has(className);
-}
-function getAllDynamicClasses() {
-  return Array.from(dynamicRegistry.keys());
-}
-function clearRegistry() {
-  registry.clear();
-  dynamicRegistry.clear();
-}
-function serializeRegistry() {
-  return JSON.stringify({
-    standard: Array.from(registry.entries()),
-    dynamic: Array.from(dynamicRegistry.entries())
-  });
-}
-function hydrateRegistry(data) {
-  const parsed = JSON.parse(data);
-  if (Array.isArray(parsed)) {
-    for (const [key, value] of parsed) {
-      registry.set(key, value);
-    }
-  } else {
-    if (parsed.standard) {
-      for (const [key, value] of parsed.standard) {
-        registry.set(key, value);
-      }
-    }
-    if (parsed.dynamic) {
-      for (const [key, value] of parsed.dynamic) {
-        dynamicRegistry.set(key, value);
-      }
-    }
-  }
-}
-
 // lib/shared/utilityClassConfig.ts
 var propertyOrder = [
   // Padding
@@ -3735,6 +4248,82 @@ var staticUtilities = {
     none: "outline-none"
   }
 };
+var SPACING_SCALE = {
+  "0": "0px",
+  px: "1px",
+  "0.5": "2px",
+  "1": "4px",
+  "1.5": "6px",
+  "2": "8px",
+  "2.5": "10px",
+  "3": "12px",
+  "3.5": "14px",
+  "4": "16px",
+  "5": "20px",
+  "6": "24px",
+  "7": "28px",
+  "8": "32px",
+  "9": "36px",
+  "10": "40px",
+  "11": "44px",
+  "12": "48px",
+  "14": "56px",
+  "16": "64px",
+  "20": "80px",
+  "24": "96px",
+  "28": "112px",
+  "32": "128px",
+  "36": "144px",
+  "40": "160px",
+  "44": "176px",
+  "48": "192px",
+  "52": "208px",
+  "56": "224px",
+  "60": "240px",
+  "64": "256px",
+  "72": "288px",
+  "80": "320px",
+  "96": "384px"
+};
+var SPACING_SCALE_REVERSE = (() => {
+  const reverse = {};
+  for (const [step, length] of Object.entries(SPACING_SCALE)) {
+    reverse[length] = step;
+  }
+  return reverse;
+})();
+var SPACING_SCALE_ROOTS = /* @__PURE__ */ new Set([
+  "p",
+  "pt",
+  "pr",
+  "pb",
+  "pl",
+  "px",
+  "py",
+  "m",
+  "mt",
+  "mr",
+  "mb",
+  "ml",
+  "mx",
+  "my",
+  "gap",
+  "gap-x",
+  "gap-y",
+  "top",
+  "right",
+  "bottom",
+  "left",
+  "inset",
+  "w",
+  "h",
+  "min-w",
+  "min-h",
+  "max-w",
+  "max-h",
+  "basis"
+]);
+var COLOR_TOKEN_ROOTS = /* @__PURE__ */ new Set(["text", "bg", "border", "accent", "outline"]);
 var staticUtilityReverse = (() => {
   const reverse = {};
   for (const [prop, values] of Object.entries(staticUtilities)) {
@@ -3813,6 +4402,170 @@ var presetClassReverse = (() => {
   return reverse;
 })();
 
+// lib/shared/cssNamedColors.ts
+var CSS_NAMED_COLORS = /* @__PURE__ */ new Set([
+  // CSS Level 4 named colors
+  "aliceblue",
+  "antiquewhite",
+  "aqua",
+  "aquamarine",
+  "azure",
+  "beige",
+  "bisque",
+  "black",
+  "blanchedalmond",
+  "blue",
+  "blueviolet",
+  "brown",
+  "burlywood",
+  "cadetblue",
+  "chartreuse",
+  "chocolate",
+  "coral",
+  "cornflowerblue",
+  "cornsilk",
+  "crimson",
+  "cyan",
+  "darkblue",
+  "darkcyan",
+  "darkgoldenrod",
+  "darkgray",
+  "darkgreen",
+  "darkgrey",
+  "darkkhaki",
+  "darkmagenta",
+  "darkolivegreen",
+  "darkorange",
+  "darkorchid",
+  "darkred",
+  "darksalmon",
+  "darkseagreen",
+  "darkslateblue",
+  "darkslategray",
+  "darkslategrey",
+  "darkturquoise",
+  "darkviolet",
+  "deeppink",
+  "deepskyblue",
+  "dimgray",
+  "dimgrey",
+  "dodgerblue",
+  "firebrick",
+  "floralwhite",
+  "forestgreen",
+  "fuchsia",
+  "gainsboro",
+  "ghostwhite",
+  "gold",
+  "goldenrod",
+  "gray",
+  "green",
+  "greenyellow",
+  "grey",
+  "honeydew",
+  "hotpink",
+  "indianred",
+  "indigo",
+  "ivory",
+  "khaki",
+  "lavender",
+  "lavenderblush",
+  "lawngreen",
+  "lemonchiffon",
+  "lightblue",
+  "lightcoral",
+  "lightcyan",
+  "lightgoldenrodyellow",
+  "lightgray",
+  "lightgreen",
+  "lightgrey",
+  "lightpink",
+  "lightsalmon",
+  "lightseagreen",
+  "lightskyblue",
+  "lightslategray",
+  "lightslategrey",
+  "lightsteelblue",
+  "lightyellow",
+  "lime",
+  "limegreen",
+  "linen",
+  "magenta",
+  "maroon",
+  "mediumaquamarine",
+  "mediumblue",
+  "mediumorchid",
+  "mediumpurple",
+  "mediumseagreen",
+  "mediumslateblue",
+  "mediumspringgreen",
+  "mediumturquoise",
+  "mediumvioletred",
+  "midnightblue",
+  "mintcream",
+  "mistyrose",
+  "moccasin",
+  "navajowhite",
+  "navy",
+  "oldlace",
+  "olive",
+  "olivedrab",
+  "orange",
+  "orangered",
+  "orchid",
+  "palegoldenrod",
+  "palegreen",
+  "paleturquoise",
+  "palevioletred",
+  "papayawhip",
+  "peachpuff",
+  "peru",
+  "pink",
+  "plum",
+  "powderblue",
+  "purple",
+  "rebeccapurple",
+  "red",
+  "rosybrown",
+  "royalblue",
+  "saddlebrown",
+  "salmon",
+  "sandybrown",
+  "seagreen",
+  "seashell",
+  "sienna",
+  "silver",
+  "skyblue",
+  "slateblue",
+  "slategray",
+  "slategrey",
+  "snow",
+  "springgreen",
+  "steelblue",
+  "tan",
+  "teal",
+  "thistle",
+  "tomato",
+  "turquoise",
+  "violet",
+  "wheat",
+  "white",
+  "whitesmoke",
+  "yellow",
+  "yellowgreen",
+  // CSS color keywords
+  "transparent",
+  "currentcolor",
+  // CSS-wide keywords (should never be wrapped in var())
+  "inherit",
+  "initial",
+  "unset",
+  "revert"
+]);
+function isCssNamedColor(value) {
+  return CSS_NAMED_COLORS.has(value.toLowerCase());
+}
+
 // lib/shared/utilityClassNames.ts
 var SORTED_ROOTS = Object.keys(prefixToCSSProperty).sort((a, b) => b.length - a.length);
 function camelToKebab(prop) {
@@ -3865,15 +4618,16 @@ function transformOutsideUrl(input, transform) {
 function encodeArbitraryValue(value) {
   let ok = true;
   const encoded = transformOutsideUrl(value, (segment) => {
-    if (/[_"'\\[\]]/.test(segment)) ok = false;
-    return segment.replace(/\s+/g, "_");
+    if (/["'\\[\]]/.test(segment)) ok = false;
+    return segment.replace(/_/g, "\\_").replace(/\s+/g, "_");
   });
   if (!ok) return null;
-  if (/[\s"'\\[\]]/.test(encoded.replace(/^\[|\]$/g, ""))) return null;
+  const guardTarget = encoded.replace(/^\[|\]$/g, "").replace(/\\_/g, "");
+  if (/[\s"'\\[\]]/.test(guardTarget)) return null;
   return encoded;
 }
 function decodeArbitraryValue(encoded) {
-  return transformOutsideUrl(encoded, (segment) => segment.replace(/_/g, " "));
+  return transformOutsideUrl(encoded, (segment) => segment.replace(/\\_|_/g, (m) => m === "\\_" ? "_" : " "));
 }
 var FONT_SIZE_KEYWORDS = /* @__PURE__ */ new Set([
   "xx-small",
@@ -3893,6 +4647,12 @@ function isColorValue(value) {
   if (value === "transparent" || value === "currentColor" || value === "currentcolor") return true;
   return isCssNamedColor(value);
 }
+function isBareColorTokenName(value) {
+  if (!/^[a-zA-Z][\w-]*$/.test(value)) return false;
+  if (isColorValue(value)) return false;
+  if (/^[a-z]+-\d/i.test(value)) return false;
+  return true;
+}
 function isFontSizeValue(value) {
   if (/^[\d.+-]/.test(value)) return true;
   if (/^(calc|clamp|min|max)\(/i.test(value)) return true;
@@ -3909,6 +4669,16 @@ function isImageValue(value) {
 function isLengthValue(value) {
   return /^-?[\d.]+[a-z%]*$/i.test(value);
 }
+function hasTopLevelWhitespace(value) {
+  let depth = 0;
+  for (let i = 0; i < value.length; i++) {
+    const ch = value[i] ?? "";
+    if (ch === "(") depth++;
+    else if (ch === ")") depth = Math.max(0, depth - 1);
+    else if (depth === 0 && /\s/.test(ch)) return true;
+  }
+  return false;
+}
 function resolveRootProperty(root, value) {
   switch (root) {
     case "text":
@@ -3918,9 +4688,9 @@ function resolveRootProperty(root, value) {
     case "bg":
       return isImageValue(value) ? "background-image" : "background-color";
     case "border":
-      return !value.includes(" ") && isColorValue(value) ? "border-color" : "border";
+      return isColorValue(value) && !hasTopLevelWhitespace(value) ? "border-color" : "border";
     case "outline": {
-      if (value.includes(" ") || value === "none") return "outline";
+      if (hasTopLevelWhitespace(value) || value === "none") return "outline";
       if (isColorValue(value)) return "outline-color";
       if (isLengthValue(value)) return "outline-width";
       return "outline";
@@ -3932,15 +4702,34 @@ function resolveRootProperty(root, value) {
 function splitVariantPrefix(className) {
   const match = className.match(/^([a-z][a-z0-9_-]*):(.+)$/);
   if (match) {
-    return { breakpoint: match[1], base: match[2] };
+    return { breakpoint: match[1] ?? null, base: match[2] ?? className };
   }
   return { breakpoint: null, base: className };
 }
+var DESKTOP_FIRST_VARIANT_PREFIX = "max-";
+var BREAKPOINT_NAME_TO_CLASS = { tablet: "lg", mobile: "sm" };
+var CLASS_NAME_TO_BREAKPOINT = { lg: "tablet", sm: "mobile" };
 function breakpointClassPrefix(breakpointName) {
-  return `${breakpointName.toLowerCase()}:`;
+  const lower = breakpointName.toLowerCase();
+  const aliased = BREAKPOINT_NAME_TO_CLASS[lower] ?? lower;
+  return `${DESKTOP_FIRST_VARIANT_PREFIX}${aliased}:`;
+}
+function breakpointClassPrefixes(breakpointName) {
+  const lower = breakpointName.toLowerCase();
+  const aliased = BREAKPOINT_NAME_TO_CLASS[lower];
+  const prefixes = [`${DESKTOP_FIRST_VARIANT_PREFIX}${lower}:`, `${lower}:`];
+  if (aliased) prefixes.unshift(`${DESKTOP_FIRST_VARIANT_PREFIX}${aliased}:`);
+  return prefixes;
+}
+function normalizeBreakpointVariant(variant) {
+  if (variant?.startsWith(DESKTOP_FIRST_VARIANT_PREFIX)) {
+    const bare = variant.slice(DESKTOP_FIRST_VARIANT_PREFIX.length);
+    return CLASS_NAME_TO_BREAKPOINT[bare] ?? bare;
+  }
+  return variant;
 }
 var HASH_VALUE_RE = /^h[0-9a-z]+$/;
-function parseUtilityClass(className) {
+function parseUtilityClass(className, knownTokens) {
   const stat = staticUtilityReverse[className];
   if (stat) {
     return { property: camelToKebab(stat.prop), value: stat.value, root: null, kind: "static" };
@@ -3952,8 +4741,8 @@ function parseUtilityClass(className) {
   const arbProp = className.match(/^\[([a-z-]+):(.+)\]$/);
   if (arbProp) {
     return {
-      property: arbProp[1],
-      value: decodeArbitraryValue(arbProp[2]),
+      property: arbProp[1] ?? "",
+      value: decodeArbitraryValue(arbProp[2] ?? ""),
       root: null,
       kind: "arbitrary-property"
     };
@@ -3962,12 +4751,12 @@ function parseUtilityClass(className) {
     if (!className.startsWith(`${root}-`)) continue;
     const rest = className.slice(root.length + 1);
     if (!rest) continue;
-    const parsed = parseRootValue(root, rest);
+    const parsed = parseRootValue(root, rest, knownTokens);
     if (parsed) return parsed;
   }
   return null;
 }
-function parseRootValue(root, rest) {
+function parseRootValue(root, rest, knownTokens) {
   if (rest.startsWith("[") && rest.endsWith("]") && rest.length > 2) {
     const value = decodeArbitraryValue(rest.slice(1, -1));
     return { property: resolveRootProperty(root, value), value, root, kind: "arbitrary" };
@@ -3993,18 +4782,79 @@ function parseRootValue(root, rest) {
   if (genericKeywordRoots.has(root) && /^[a-z][a-z-]*$/.test(rest)) {
     return { property: resolveRootProperty(root, rest), value: rest, root, kind: "keyword" };
   }
+  if (SPACING_SCALE_ROOTS.has(root)) {
+    const scaleVal = SPACING_SCALE[rest];
+    if (scaleVal !== void 0) {
+      return { property: resolveRootProperty(root, scaleVal), value: scaleVal, root, kind: "keyword" };
+    }
+  }
   if (integerValueRoots.has(root) && /^-?\d+$/.test(rest)) {
-    return { property: prefixToCSSProperty[root], value: rest, root, kind: "numeric" };
+    return { property: prefixToCSSProperty[root] ?? root, value: rest, root, kind: "numeric" };
   }
   if (root === "opacity" && /^\d{1,3}$/.test(rest)) {
     return { property: "opacity", value: String(Number(rest) / 100), root, kind: "numeric" };
   }
+  if (COLOR_TOKEN_ROOTS.has(root) && knownTokens?.has(rest)) {
+    const value = `var(--${rest})`;
+    return { property: resolveRootProperty(root, value), value, root, kind: "var" };
+  }
   if (HASH_VALUE_RE.test(rest)) {
-    return { property: prefixToCSSProperty[root], value: null, root, kind: "hash" };
+    return { property: prefixToCSSProperty[root] ?? root, value: null, root, kind: "hash" };
   }
   return null;
 }
 
+// lib/shared/styleValueRegistry.ts
+var registry = /* @__PURE__ */ new Map();
+var dynamicRegistry = /* @__PURE__ */ new Map();
+function registerStyleValue(className, value) {
+  registry.set(className, value);
+}
+function registerDynamicStyle(className, property, value) {
+  dynamicRegistry.set(className, { property, value });
+}
+function getStyleValue(className) {
+  return registry.get(className);
+}
+function getDynamicStyle(className) {
+  return dynamicRegistry.get(className);
+}
+function isDynamicClass(className) {
+  return dynamicRegistry.has(className);
+}
+function getAllDynamicClasses() {
+  return Array.from(dynamicRegistry.keys());
+}
+function clearRegistry() {
+  registry.clear();
+  dynamicRegistry.clear();
+}
+function serializeRegistry() {
+  return JSON.stringify({
+    standard: Array.from(registry.entries()),
+    dynamic: Array.from(dynamicRegistry.entries())
+  });
+}
+function hydrateRegistry(data) {
+  const parsed = JSON.parse(data);
+  if (Array.isArray(parsed)) {
+    for (const [key, value] of parsed) {
+      registry.set(key, value);
+    }
+  } else {
+    if (parsed.standard) {
+      for (const [key, value] of parsed.standard) {
+        registry.set(key, value);
+      }
+    }
+    if (parsed.dynamic) {
+      for (const [key, value] of parsed.dynamic) {
+        dynamicRegistry.set(key, value);
+      }
+    }
+  }
+}
+
 // lib/shared/utilityClassMapper.ts
 function isStyleMapping(value) {
   return typeof value === "object" && value !== null && "_mapping" in value && value._mapping === true;
@@ -4017,10 +4867,9 @@ function shortHash(input) {
   }
   return (hash >>> 0).toString(36);
 }
-function isBareColorToken(value) {
-  if (!/^[a-zA-Z][\w-]*$/.test(value)) return false;
-  if (isColorValue(value)) return false;
-  return true;
+function rootFormMisresolves(root, prop, value) {
+  const parsedProp = ROOT_CAMEL_OVERRIDES[root] ?? cssPropertyToCamel(resolveRootProperty(root, value));
+  return parsedProp !== prop;
 }
 function propertyValueToClass(prop, value) {
   let stringValue = String(value);
@@ -4038,19 +4887,22 @@ function propertyValueToClass(prop, value) {
     registerStyleValue(staticClass, stringValue);
     return staticClass;
   }
-  if (prop === "boxShadow" && shadowPresets[stringValue]) {
+  const shadowPreset = shadowPresets[stringValue];
+  if (prop === "boxShadow" && shadowPreset) {
     const className2 = `shadow-${stringValue}`;
-    registerStyleValue(className2, shadowPresets[stringValue]);
+    registerStyleValue(className2, shadowPreset);
     return className2;
   }
-  if ((prop === "background" || prop === "backgroundImage") && gradientPresets[stringValue]) {
+  const gradientPreset = gradientPresets[stringValue];
+  if ((prop === "background" || prop === "backgroundImage") && gradientPreset) {
     const className2 = `bg-gradient-${stringValue}`;
-    registerStyleValue(className2, gradientPresets[stringValue]);
+    registerStyleValue(className2, gradientPreset);
     return className2;
   }
-  if (prop === "border" && borderPresets[stringValue]) {
+  const borderPreset = borderPresets[stringValue];
+  if (prop === "border" && borderPreset) {
     const className2 = `border-preset-${stringValue}`;
-    registerStyleValue(className2, borderPresets[stringValue]);
+    registerStyleValue(className2, borderPreset);
     return className2;
   }
   const root = propertyMap[prop];
@@ -4086,21 +4938,32 @@ function propertyValueToClass(prop, value) {
       }
     }
   }
+  if (!className && SPACING_SCALE_ROOTS.has(root)) {
+    const step = SPACING_SCALE_REVERSE[stringValue];
+    if (step !== void 0) {
+      className = `${root}-${step}`;
+    }
+  }
   if (!className) {
     const varMatch = stringValue.match(/^var\((--[\w-]+)\)$/);
     if (varMatch) {
+      const varName = (varMatch[1] ?? "").slice(2);
       if (prop === "fontSize") className = `text-(length:${varMatch[1]})`;
       else if (prop === "fontWeight") className = `font-(number:${varMatch[1]})`;
-      else className = `${root}-(${varMatch[1]})`;
+      else if (rootFormMisresolves(root, prop, stringValue)) {
+        className = `[${camelToKebab(prop)}:${stringValue}]`;
+      } else if (colorTokenProps.has(prop) && isBareColorTokenName(varName)) {
+        className = `${root}-${varName}`;
+      } else className = `${root}-(${varMatch[1]})`;
     }
   }
-  if (!className && colorTokenProps.has(prop) && isBareColorToken(stringValue)) {
-    className = `${root}-(--${stringValue})`;
+  if (!className && colorTokenProps.has(prop) && isBareColorTokenName(stringValue)) {
+    className = `${root}-${stringValue}`;
   }
   if (!className) {
     const encoded = encodeArbitraryValue(stringValue);
     if (encoded != null) {
-      className = `${root}-[${encoded}]`;
+      className = rootFormMisresolves(root, prop, stringValue) ? `[${camelToKebab(prop)}:${encoded}]` : `${root}-[${encoded}]`;
     }
   }
   if (!className) {
@@ -4121,6 +4984,7 @@ function stylesToClasses(styles) {
   const classes = [];
   for (const prop of sortedProps) {
     const value = styles[prop];
+    if (value === void 0) continue;
     if (isStyleMapping(value)) continue;
     const className = propertyValueToClass(prop, value);
     if (className) {
@@ -4209,7 +5073,7 @@ function responsiveStylesToClasses(styles, options) {
   }
   return classes;
 }
-function classToStyle(className) {
+function classToStyle(className, knownTokens) {
   const { base: cleanClass } = splitVariantPrefix(className);
   if (staticUtilityReverse[cleanClass]) {
     return staticUtilityReverse[cleanClass];
@@ -4217,7 +5081,7 @@ function classToStyle(className) {
   if (presetClassReverse[cleanClass]) {
     return presetClassReverse[cleanClass];
   }
-  const parsed = parseUtilityClass(cleanClass);
+  const parsed = parseUtilityClass(cleanClass, knownTokens);
   if (!parsed) {
     const dynamic = getDynamicStyle(cleanClass);
     if (dynamic) {
@@ -4244,12 +5108,13 @@ function classToStyle(className) {
   }
   return { prop, value };
 }
-function classesToStyles(classes) {
+function classesToStyles(classes, knownTokens) {
   const styles = { base: {}, tablet: {}, mobile: {} };
   for (const className of classes) {
     const { breakpoint: variant, base: cleanClass } = splitVariantPrefix(className);
-    const breakpoint = variant === "tablet" ? "tablet" : variant === "mobile" ? "mobile" : "base";
-    const styleEntry = classToStyle(cleanClass);
+    const bp = normalizeBreakpointVariant(variant);
+    const breakpoint = bp === "tablet" ? "tablet" : bp === "mobile" ? "mobile" : "base";
+    const styleEntry = classToStyle(cleanClass, knownTokens);
     if (styleEntry) {
       if (!styles[breakpoint]) {
         styles[breakpoint] = {};
@@ -4259,7 +5124,53 @@ function classesToStyles(classes) {
   }
   if (Object.keys(styles.tablet || {}).length === 0) delete styles.tablet;
   if (Object.keys(styles.mobile || {}).length === 0) delete styles.mobile;
-  return Object.keys(styles.base || {}).length > 0 ? styles : null;
+  const hasAny = Object.keys(styles.base || {}).length > 0 || Object.keys(styles.tablet || {}).length > 0 || Object.keys(styles.mobile || {}).length > 0;
+  return hasAny ? styles : null;
+}
+function isClassableStyleValue(value) {
+  if (typeof value === "number") return true;
+  if (typeof value === "string") return !value.includes("{{");
+  return false;
+}
+function splitStyleBucket(bucket) {
+  const classable = {};
+  const residual = {};
+  for (const [k, v] of Object.entries(bucket)) {
+    if (isClassableStyleValue(v)) classable[k] = v;
+    else residual[k] = v;
+  }
+  return { classable, residual };
+}
+function splitStyleByClassability(style) {
+  if (!style || typeof style !== "object") return { classable: null, residual: null };
+  if (isResponsiveStyle(style)) {
+    const classable = {};
+    const residual = {};
+    for (const [bp, bucket] of Object.entries(style)) {
+      if (!bucket || typeof bucket !== "object") continue;
+      const split2 = splitStyleBucket(bucket);
+      if (Object.keys(split2.classable).length > 0) classable[bp] = split2.classable;
+      if (Object.keys(split2.residual).length > 0) residual[bp] = split2.residual;
+    }
+    return {
+      classable: Object.keys(classable).length > 0 ? classable : null,
+      residual: Object.keys(residual).length > 0 ? residual : null
+    };
+  }
+  const split = splitStyleBucket(style);
+  return {
+    classable: Object.keys(split.classable).length > 0 ? { base: split.classable } : null,
+    residual: Object.keys(split.residual).length > 0 ? { base: split.residual } : null
+  };
+}
+function styleHasMapping(style) {
+  if (!style || typeof style !== "object") return false;
+  const buckets = isResponsiveStyle(style) ? Object.values(style) : [style];
+  for (const bucket of buckets) {
+    if (!bucket || typeof bucket !== "object") continue;
+    for (const v of Object.values(bucket)) if (isStyleMapping(v)) return true;
+  }
+  return false;
 }
 
 // lib/shared/paths/Path.ts
@@ -4292,7 +5203,7 @@ function validatePath(path) {
   }
   for (let i = 0; i < path.length; i++) {
     const value = path[i];
-    if (typeof value !== "number" || isNaN(value) || !isFinite(value)) {
+    if (typeof value !== "number" || Number.isNaN(value) || !Number.isFinite(value)) {
       throw new InvalidPathError(`Invalid path value at index ${i}: expected number, got ${typeof value}`, path, i);
     }
   }
@@ -4320,7 +5231,7 @@ function stringToPath(str) {
   }
   return str.split(",").map((s) => {
     const num = parseInt(s, 10);
-    if (isNaN(num)) {
+    if (Number.isNaN(num)) {
       throw new PathConversionError(`Invalid numeric index: ${s}`, str);
     }
     return num;
@@ -4345,9 +5256,9 @@ function domPathStringToTreePath(domPath) {
   const path = [0];
   for (let i = 0; i < parts.length; i++) {
     if (parts[i] === CHILDREN_TOKEN && i + 1 < parts.length) {
-      const indexStr = parts[i + 1];
+      const indexStr = parts[i + 1] ?? "";
       const index = parseInt(indexStr, 10);
-      if (!isNaN(index) && indexStr === String(index)) {
+      if (!Number.isNaN(index) && indexStr === String(index)) {
         path.push(index);
         i++;
       }
@@ -4381,6 +5292,7 @@ function calculateChildrenExpansionOffset(componentPath, componentStructure, ins
   let currentNode = componentStructure;
   for (let i = 1; i < componentPath.length; i++) {
     const index = componentPath[i];
+    if (index === void 0) break;
     if (!currentNode || !Array.isArray(currentNode.children)) {
       break;
     }
@@ -4446,12 +5358,12 @@ function convertPagePathToComponentPath(pagePath, componentInstancePath, compone
   if (suffix.length > 0 && componentStructure && Array.isArray(instanceChildren)) {
     const childrenCount = instanceChildren.length;
     if (Array.isArray(componentStructure.children) && componentStructure.children.length > 0 && isSlotMarker(componentStructure.children[0])) {
-      const pageFirstIndex = suffix[0];
+      const pageFirstIndex = suffix[0] ?? 0;
       if (pageFirstIndex < childrenCount) {
         adjustedSuffix = suffix;
       } else {
         const offset = childrenCount - 1;
-        adjustedSuffix = [suffix[0] - offset, ...suffix.slice(1)];
+        adjustedSuffix = [pageFirstIndex - offset, ...suffix.slice(1)];
       }
     }
   }
@@ -4465,7 +5377,7 @@ function convertComponentPathToPagePath(componentPath, componentInstancePath, co
   const offset = calculateChildrenExpansionOffset(componentPath, componentStructure, instanceChildren);
   let adjustedSuffix = suffix;
   if (offset > 0 && suffix.length > 0) {
-    adjustedSuffix = [suffix[0] + offset, ...suffix.slice(1)];
+    adjustedSuffix = [(suffix[0] ?? 0) + offset, ...suffix.slice(1)];
   }
   return [...componentInstancePath, ...adjustedSuffix];
 }
@@ -4499,8 +5411,8 @@ function parseElementClassName(className) {
   if (!match) return null;
   return {
     fileType: match[1] === "c" ? "component" : "page",
-    fileName: match[2],
-    elementName: match[3]
+    fileName: match[2] ?? "",
+    elementName: match[3] ?? ""
   };
 }
 
@@ -4627,7 +5539,7 @@ function createStyleMappingFromProps(componentPropDefs, currentValue) {
       mappingValues[opt] = "";
     });
   } else {
-    mappingValues["default"] = currentValue;
+    mappingValues.default = currentValue;
   }
   return {
     _mapping: true,
@@ -4638,7 +5550,7 @@ function createStyleMappingFromProps(componentPropDefs, currentValue) {
 
 // lib/shared/linkUtils.ts
 function normalizePath(path) {
-  let normalized = path.split("?")[0].split("#")[0];
+  let normalized = (path.split("?")[0] ?? "").split("#")[0] ?? "";
   if (normalized.length > 1 && normalized.endsWith("/")) {
     normalized = normalized.slice(0, -1);
   }
@@ -4650,7 +5562,7 @@ function isCurrentLink(href, currentPagePath) {
 }
 
 // lib/shared/viewportUnits.ts
-var VIEWPORT_UNIT_RE = /(?<![\w-])(-?\d*\.?\d+)(s|l|d)?(vh|vw)\b/g;
+var VIEWPORT_UNIT_RE = /(?<![\w\-[])(-?\d*\.?\d+)(s|l|d)?(vh|vw)\b/g;
 function rewriteViewportUnits(input) {
   if (!input) return input;
   return input.replace(VIEWPORT_UNIT_RE, (_match, num, sizeKw, axis) => {
@@ -4750,11 +5662,59 @@ function toFriendlyError(input) {
   };
 }
 
+// lib/shared/pxToRem.ts
+var DEFAULT_REM_CONFIG = {
+  enabled: false,
+  baseFontSize: 16
+};
+var PX_REGEX = /(-?\d*\.?\d+)px/g;
+function convertPxToRem(cssValue, baseFontSize) {
+  return cssValue.replace(PX_REGEX, (_, num) => {
+    const px = parseFloat(num);
+    if (px === 0) return "0";
+    const rem = px / baseFontSize;
+    const rounded = parseFloat(rem.toFixed(4));
+    return `${rounded}rem`;
+  });
+}
+var PX_KEEP_PROPERTIES = /* @__PURE__ */ new Set([
+  "border-width",
+  "border-top-width",
+  "border-right-width",
+  "border-bottom-width",
+  "border-left-width",
+  "outline-width",
+  "outline-offset",
+  "border",
+  "box-shadow",
+  "text-shadow"
+]);
+function shouldConvertProperty(cssProperty) {
+  return !PX_KEEP_PROPERTIES.has(cssProperty);
+}
+function applyRemConversion(declarations, remConfig) {
+  if (!remConfig?.enabled) return declarations;
+  return declarations.split(";").map((decl) => {
+    const trimmed = decl.trim();
+    if (!trimmed) return "";
+    const colonIndex = trimmed.indexOf(":");
+    if (colonIndex === -1) return trimmed;
+    const property = trimmed.substring(0, colonIndex).trim();
+    const value = trimmed.substring(colonIndex + 1).trim();
+    if (shouldConvertProperty(property)) {
+      return `${property}: ${convertPxToRem(value, remConfig.baseFontSize)}`;
+    }
+    return trimmed;
+  }).filter(Boolean).join("; ");
+}
+
 // lib/shared/cssGeneration.ts
 var cssPropertyOrderMap = (() => {
   const map = /* @__PURE__ */ new Map();
   for (let i = 0; i < propertyOrder.length; i++) {
-    const kebab = camelToKebab(propertyOrder[i]);
+    const prop = propertyOrder[i];
+    if (prop === void 0) continue;
+    const kebab = camelToKebab(prop);
     if (!map.has(kebab)) map.set(kebab, i);
   }
   return map;
@@ -4829,11 +5789,11 @@ var borderSideMap = {
   "border-b": "border-bottom",
   "border-l": "border-left"
 };
-function generateRuleForClass(className) {
+function generateRuleForClass(className, knownTokens) {
   if (utilityClassRules[className]) {
     return utilityClassRules[className];
   }
-  const parsed = parseUtilityClass(className);
+  const parsed = parseUtilityClass(className, knownTokens);
   if (!parsed) {
     const dynamicStyle = getDynamicStyle(className);
     if (dynamicStyle) {
@@ -4944,28 +5904,30 @@ function applyContainerPattern(style, fluidActive) {
     marginRight: "auto"
   };
 }
-function generateUtilityCSS(usedClasses, breakpoints = DEFAULT_BREAKPOINTS, responsiveScales, remConfig) {
+function generateUtilityCSS(usedClasses, breakpoints = DEFAULT_BREAKPOINTS, responsiveScales, remConfig, knownTokens) {
   const css = [];
   const baseClasses = /* @__PURE__ */ new Set();
   const autoResponsiveClasses = /* @__PURE__ */ new Set();
   const breakpointValues = getBreakpointValues(breakpoints);
   const responsiveClasses = {};
   for (const [breakpointName, breakpointValue] of Object.entries(breakpointValues)) {
-    const prefix = breakpointClassPrefix(breakpointName);
-    responsiveClasses[prefix] = {
-      classes: /* @__PURE__ */ new Set(),
-      breakpointName,
-      value: breakpointValue
-    };
+    for (const prefix of breakpointClassPrefixes(breakpointName)) {
+      responsiveClasses[prefix] = {
+        classes: /* @__PURE__ */ new Set(),
+        breakpointName,
+        value: breakpointValue
+      };
+    }
   }
   for (const className of usedClasses) {
     let matched = false;
     for (const prefix of Object.keys(responsiveClasses)) {
       if (className.startsWith(prefix) && className.length > prefix.length) {
         const potentialClass = className.substring(prefix.length);
-        const rule = generateRuleForClass(potentialClass);
-        if (rule) {
-          responsiveClasses[prefix].classes.add(potentialClass);
+        const rule = generateRuleForClass(potentialClass, knownTokens);
+        const bucket = responsiveClasses[prefix];
+        if (rule && bucket) {
+          bucket.classes.add(potentialClass);
           matched = true;
           break;
         }
@@ -4987,7 +5949,7 @@ function generateUtilityCSS(usedClasses, breakpoints = DEFAULT_BREAKPOINTS, resp
   const mode = getResponsiveMode(responsiveScales);
   const fluidActive = responsiveScales?.enabled === true && mode === "fluid";
   for (const className of sortClassesByPropertyOrder(baseClasses)) {
-    let rule = generateRuleForClass(className);
+    let rule = generateRuleForClass(className, knownTokens);
     if (rule) {
       if (fluidActive && autoResponsiveClasses.has(className)) {
         rule = applyFluidToUtilityRule(rule, className, responsiveScales, breakpoints);
@@ -5040,7 +6002,7 @@ function generateUtilityCSS(usedClasses, breakpoints = DEFAULT_BREAKPOINTS, resp
   for (const [prefix, breakpointInfo] of sortedManualResponsive) {
     const rules = [];
     for (const className of sortClassesByPropertyOrder(breakpointInfo.classes)) {
-      const rule = generateRuleForClass(className);
+      const rule = generateRuleForClass(className, knownTokens);
       if (rule) {
         const escapedClassName = escapeCSSClassName(`${prefix}${className}`);
         const finalRule = applyRemConversion(rule, remConfig);
@@ -5055,21 +6017,24 @@ function generateUtilityCSS(usedClasses, breakpoints = DEFAULT_BREAKPOINTS, resp
   }
   return css.join("\n");
 }
-function generateSingleClassCSS(className, breakpoints = DEFAULT_BREAKPOINTS, responsiveScales, remConfig) {
+function generateSingleClassCSS(className, breakpoints = DEFAULT_BREAKPOINTS, responsiveScales, remConfig, knownTokens) {
   const breakpointValues = getBreakpointValues(breakpoints);
   const css = [];
   const responsivePrefixes = {};
   for (const [breakpointName, breakpointValue] of Object.entries(breakpointValues)) {
-    responsivePrefixes[breakpointClassPrefix(breakpointName)] = { breakpointName, value: breakpointValue };
+    for (const prefix of breakpointClassPrefixes(breakpointName)) {
+      responsivePrefixes[prefix] = { breakpointName, value: breakpointValue };
+    }
   }
   let matched = false;
   for (const prefix of Object.keys(responsivePrefixes)) {
     if (className.startsWith(prefix) && className.length > prefix.length) {
       const potentialClass = className.substring(prefix.length);
-      const rule = generateRuleForClass(potentialClass);
-      if (rule) {
+      const rule = generateRuleForClass(potentialClass, knownTokens);
+      const responsivePrefix = responsivePrefixes[prefix];
+      if (rule && responsivePrefix) {
         const escapedClassName = escapeCSSClassName(className);
-        const bpValue = responsivePrefixes[prefix].value;
+        const bpValue = responsivePrefix.value;
         const finalRule = applyRemConversion(rule, remConfig);
         css.push(`@media (max-width: ${bpValue}px) {
   .${escapedClassName} { ${finalRule} }
@@ -5080,7 +6045,7 @@ function generateSingleClassCSS(className, breakpoints = DEFAULT_BREAKPOINTS, re
     }
   }
   if (!matched) {
-    let rule = generateRuleForClass(className);
+    let rule = generateRuleForClass(className, knownTokens);
     if (!rule) return "";
     const mode = getResponsiveMode(responsiveScales);
     const fluidActive = responsiveScales?.enabled === true && mode === "fluid";
@@ -5121,16 +6086,17 @@ function generateSingleClassCSS(className, breakpoints = DEFAULT_BREAKPOINTS, re
   }
   return css.join("\n");
 }
-function extractUtilityClassesFromHTML(html) {
+function extractUtilityClassesFromHTML(html, knownTokens) {
   const classes = /* @__PURE__ */ new Set();
   const classRegex = /class="([^"]*)"/g;
-  let match;
-  while ((match = classRegex.exec(html)) !== null) {
-    const classList = match[1].split(/\s+/);
+  let match = classRegex.exec(html);
+  while (match !== null) {
+    const classList = (match[1] ?? "").split(/\s+/);
+    match = classRegex.exec(html);
     for (const className of classList) {
       if (!className) continue;
       const { base } = splitVariantPrefix(className);
-      if (parseUtilityClass(base)) {
+      if (parseUtilityClass(base, knownTokens)) {
         classes.add(className);
         continue;
       }
@@ -5261,6 +6227,35 @@ function generateAllInteractiveCSS(interactiveStylesMap, breakpoints = DEFAULT_B
 }
 
 export {
+  DEFAULT_BREAKPOINTS,
+  normalizeBreakpointConfig,
+  getBreakpointValues,
+  getPreviewPointValues,
+  getAllBreakpointNames,
+  getBreakpointName,
+  getBreakpointLabel,
+  DEFAULT_FLUID_RANGE,
+  DEFAULT_SITE_MARGIN,
+  parseValue,
+  SCALABLE_CSS_PROPERTIES,
+  calculateResponsiveValue,
+  getScaleMultiplier,
+  parseMultiValue,
+  scaleValue,
+  scalePropertyValue,
+  getResponsiveValues,
+  resolveVariableValueAtBreakpoint,
+  getSmallestBreakpointName,
+  buildFluidClamp,
+  buildFluidClampWithExplicitMin,
+  buildSiteMarginClamp,
+  buildFluidPropertyValue,
+  DEFAULT_RESPONSIVE_SCALES,
+  DEFAULT_REM_CONFIG,
+  setErrorHandler,
+  logRuntimeError,
+  logNetworkError,
+  init_errorLogger,
   DEFAULT_PREFETCH_CONFIG,
   PropDefinitionSchema,
   StyleMappingSchema,
@@ -5361,6 +6356,8 @@ export {
   isEmbedNode,
   isLinkNode,
   isLocaleListNode,
+  isIslandNode,
+  isCustomNode,
   isCMSListNode,
   isListNode,
   isValidNodeType,
@@ -5381,9 +6378,15 @@ export {
   isRichTextMarker,
   richTextMarkerToHtml,
   resolvePropsFromDefinition,
+  propertyMap,
+  staticUtilityReverse,
+  keywordValues,
+  presetClassReverse,
   CSS_NAMED_COLORS,
   isCssNamedColor,
-  breakpointClassPrefix,
+  splitVariantPrefix,
+  breakpointClassPrefixes,
+  normalizeBreakpointVariant,
   registerStyleValue,
   registerDynamicStyle,
   getStyleValue,
@@ -5397,6 +6400,9 @@ export {
   responsiveStylesToClasses,
   classToStyle,
   classesToStyles,
+  isClassableStyleValue,
+  splitStyleByClassability,
+  styleHasMapping,
   ROOT_STRING,
   ROOT_0_STRING,
   CHILDREN_SEPARATOR,
@@ -5443,4 +6449,4 @@ export {
   generateInteractiveCSS,
   generateAllInteractiveCSS
 };
-//# sourceMappingURL=chunk-7HWQUVTU.js.map
+//# sourceMappingURL=chunk-2IIQK7T3.js.map