@hyperfixi/behaviors 2.5.1 → 2.7.0

package/dist/loaders.cjs

@@ -19,7 +19,7 @@ var init_draggable_schema = __esm({
       category: "ui",
       tier: "core",
       version: "1.0.0",
-      description: "Makes elements draggable with pointer events",
+      description: "Makes elements draggable with pointer events (EXPERIMENTAL \u2014 stateful async component, beyond the inline-scripting boundary; not part of the curated set)",
       parameters: [
         {
           name: "dragHandle",
@@ -73,7 +73,7 @@ var init_sortable_schema = __esm({
       category: "ui",
       tier: "common",
       version: "1.0.0",
-      description: "Makes child elements reorderable via drag-and-drop",
+      description: "Makes child elements reorderable via drag-and-drop (EXPERIMENTAL \u2014 stateful async component, beyond the inline-scripting boundary; not part of the curated set)",
       parameters: [
         {
           name: "dragClass",
@@ -100,7 +100,7 @@ behavior Sortable(dragClass)
     end
   end
   on pointerdown(clientY) from me
-    set item to the closest <li/> to the target
+    set item to the target.closest("li")
     if item is null
       exit
     end
@@ -108,7 +108,7 @@ behavior Sortable(dragClass)
     add .{dragClass} to item
     trigger sortable:start on me
     repeat until event pointerup from document
-      wait for pointermove(clientY) from document
+      wait for pointermove(clientY) or pointerup(clientY) from document
       trigger sortable:move on me
     end
     remove .{dragClass} from item
@@ -129,7 +129,7 @@ var init_resizable_schema = __esm({
       category: "ui",
       tier: "optional",
       version: "1.0.0",
-      description: "Makes elements resizable by dragging",
+      description: "Makes elements resizable by dragging (EXPERIMENTAL \u2014 stateful async component, beyond the inline-scripting boundary; not part of the curated set)",
       parameters: [
         {
           name: "minWidth",
@@ -177,15 +177,15 @@ behavior Resizable(minWidth, minHeight, maxWidth, maxHeight)
     set startX to clientX
     set startY to clientY
     repeat until event pointerup from document
-      wait for pointermove(clientX, clientY) from document
+      wait for pointermove(clientX, clientY) or pointerup(clientX, clientY) from document
       set newWidth to startWidth + clientX - startX
       set newHeight to startHeight + clientY - startY
       if newWidth < minWidth then set newWidth to minWidth end
       if newWidth > maxWidth then set newWidth to maxWidth end
       if newHeight < minHeight then set newHeight to minHeight end
       if newHeight > maxHeight then set newHeight to maxHeight end
-      set my style.width to newWidth + "px"
-      set my style.height to newHeight + "px"
+      set my *width to newWidth + "px"
+      set my *height to newHeight + "px"
       trigger resizable:resize
     end
     trigger resizable:end
@@ -381,29 +381,32 @@ behavior Clipboard(text, source, feedback, feedbackDuration)
       set copyText to source's textContent
     end
     js(me, copyText, feedback, feedbackDuration)
-      async function copyToClipboard(t) {
-        if (navigator.clipboard && navigator.clipboard.writeText) {
-          await navigator.clipboard.writeText(t);
-          return;
+      // Wrapped in an async IIFE: hyperscript's js() block has no top-level await.
+      (async function() {
+        async function copyToClipboard(t) {
+          if (navigator.clipboard && navigator.clipboard.writeText) {
+            await navigator.clipboard.writeText(t);
+            return;
+          }
+          var ta = document.createElement('textarea');
+          ta.value = t;
+          ta.style.position = 'fixed';
+          ta.style.opacity = '0';
+          document.body.appendChild(ta);
+          ta.select();
+          try { document.execCommand('copy'); } finally { document.body.removeChild(ta); }
         }
-        var ta = document.createElement('textarea');
-        ta.value = t;
-        ta.style.position = 'fixed';
-        ta.style.opacity = '0';
-        document.body.appendChild(ta);
-        ta.select();
-        try { document.execCommand('copy'); } finally { document.body.removeChild(ta); }
-      }
-      try {
-        await copyToClipboard(copyText);
-        var feedbackEl = feedback ? (typeof feedback === 'string' ? document.querySelector(feedback) : feedback) : me;
-        if (!feedbackEl) feedbackEl = me;
-        feedbackEl.classList.add('copied');
-        me.dispatchEvent(new CustomEvent('clipboard:copied', { bubbles: true, detail: { text: copyText } }));
-        setTimeout(function() { feedbackEl.classList.remove('copied'); }, feedbackDuration);
-      } catch(err) {
-        me.dispatchEvent(new CustomEvent('clipboard:error', { bubbles: true, detail: { error: err } }));
-      }
+        try {
+          await copyToClipboard(copyText);
+          var feedbackEl = feedback ? (typeof feedback === 'string' ? document.querySelector(feedback) : feedback) : me;
+          if (!feedbackEl) feedbackEl = me;
+          feedbackEl.classList.add('copied');
+          me.dispatchEvent(new CustomEvent('clipboard:copied', { bubbles: true, detail: { text: copyText } }));
+          setTimeout(function() { feedbackEl.classList.remove('copied'); }, feedbackDuration);
+        } catch(err) {
+          me.dispatchEvent(new CustomEvent('clipboard:error', { bubbles: true, detail: { error: err } }));
+        }
+      })();
     end
   end
 end`.trim()
@@ -553,7 +556,7 @@ behavior ClickOutside(active)
     end
   end
   on pointerdown from document
-    js(me, active)
+    js(me, active, event)
       if (!me.isConnected) return;
       if (active && !me.contains(event.target)) {
         me.dispatchEvent(new CustomEvent('clickoutside', { bubbles: true }));
@@ -896,38 +899,6 @@ __export(draggable_exports, {
   draggableSource: () => draggableSource,
   registerDraggable: () => registerDraggable
 });
-function installDraggable(element, params) {
-  let dragHandle = element;
-  if (params.dragHandle && params.dragHandle !== "me") {
-    if (typeof params.dragHandle === "string") {
-      const found = element.querySelector(params.dragHandle);
-      if (found instanceof HTMLElement) dragHandle = found;
-    } else if (params.dragHandle instanceof HTMLElement) {
-      dragHandle = params.dragHandle;
-    }
-  }
-  dragHandle.addEventListener("pointerdown", (e) => {
-    e.preventDefault();
-    e.stopPropagation();
-    element.dispatchEvent(new CustomEvent("draggable:start", { bubbles: true }));
-    const startX = element.offsetLeft;
-    const startY = element.offsetTop;
-    const xoff = e.clientX - startX;
-    const yoff = e.clientY - startY;
-    function onMove(ev) {
-      element.style.left = `${ev.clientX - xoff}px`;
-      element.style.top = `${ev.clientY - yoff}px`;
-      element.dispatchEvent(new CustomEvent("draggable:move", { bubbles: true }));
-    }
-    function onUp() {
-      document.removeEventListener("pointermove", onMove);
-      document.removeEventListener("pointerup", onUp);
-      element.dispatchEvent(new CustomEvent("draggable:end", { bubbles: true }));
-    }
-    document.addEventListener("pointermove", onMove);
-    document.addEventListener("pointerup", onUp);
-  });
-}
 async function registerDraggable(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -935,15 +906,12 @@ async function registerDraggable(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "Draggable",
-    parameters: ["dragHandle"],
-    eventHandlers: [],
-    imperativeInstaller: installDraggable
-  };
+  const result = hf.compileSync(draggableSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile Draggable behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var draggableSource, draggableMetadata, draggable_default;
 var init_draggable = __esm({
@@ -972,38 +940,6 @@ __export(sortable_exports, {
   sortableMetadata: () => sortableMetadata,
   sortableSource: () => sortableSource
 });
-function installSortable(element, params) {
-  const dragClass = params.dragClass || "sorting";
-  const handleSelector = params.handle || null;
-  element.addEventListener("pointerdown", (e) => {
-    const target = e.target;
-    const item = target.closest("li");
-    if (!item || !element.contains(item)) return;
-    if (handleSelector) {
-      const handleEl = target.closest(handleSelector);
-      if (!handleEl) return;
-    }
-    e.preventDefault();
-    item.classList.add(dragClass);
-    element.dispatchEvent(new CustomEvent("sortable:start", { bubbles: true, detail: { item } }));
-    function onMove(ev) {
-      element.dispatchEvent(
-        new CustomEvent("sortable:move", {
-          bubbles: true,
-          detail: { clientY: ev.clientY, item }
-        })
-      );
-    }
-    function onUp() {
-      document.removeEventListener("pointermove", onMove);
-      document.removeEventListener("pointerup", onUp);
-      item.classList.remove(dragClass);
-      element.dispatchEvent(new CustomEvent("sortable:end", { bubbles: true, detail: { item } }));
-    }
-    document.addEventListener("pointermove", onMove);
-    document.addEventListener("pointerup", onUp);
-  });
-}
 async function registerSortable(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1011,15 +947,12 @@ async function registerSortable(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "Sortable",
-    parameters: ["dragClass"],
-    eventHandlers: [],
-    imperativeInstaller: installSortable
-  };
+  const result = hf.compileSync(sortableSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile Sortable behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var sortableSource, sortableMetadata, sortable_default;
 var init_sortable = __esm({
@@ -1048,43 +981,6 @@ __export(resizable_exports, {
   resizableMetadata: () => resizableMetadata,
   resizableSource: () => resizableSource
 });
-function installResizable(element, params) {
-  let handleEl = element;
-  if (params.handle && params.handle !== "me") {
-    if (typeof params.handle === "string") {
-      const found = element.querySelector(params.handle);
-      if (found instanceof HTMLElement) handleEl = found;
-    } else if (params.handle instanceof HTMLElement) {
-      handleEl = params.handle;
-    }
-  }
-  const minW = params.minWidth ?? 50;
-  const minH = params.minHeight ?? 50;
-  const maxW = params.maxWidth ?? 9999;
-  const maxH = params.maxHeight ?? 9999;
-  handleEl.addEventListener("pointerdown", (e) => {
-    e.preventDefault();
-    element.dispatchEvent(new CustomEvent("resizable:start", { bubbles: true }));
-    const startWidth = element.offsetWidth;
-    const startHeight = element.offsetHeight;
-    const startX = e.clientX;
-    const startY = e.clientY;
-    function onMove(ev) {
-      const newWidth = Math.max(minW, Math.min(maxW, startWidth + (ev.clientX - startX)));
-      const newHeight = Math.max(minH, Math.min(maxH, startHeight + (ev.clientY - startY)));
-      element.style.width = `${newWidth}px`;
-      element.style.height = `${newHeight}px`;
-      element.dispatchEvent(new CustomEvent("resizable:resize", { bubbles: true }));
-    }
-    function onUp() {
-      document.removeEventListener("pointermove", onMove);
-      document.removeEventListener("pointerup", onUp);
-      element.dispatchEvent(new CustomEvent("resizable:end", { bubbles: true }));
-    }
-    document.addEventListener("pointermove", onMove);
-    document.addEventListener("pointerup", onUp);
-  });
-}
 async function registerResizable(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1092,15 +988,12 @@ async function registerResizable(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "Resizable",
-    parameters: [],
-    eventHandlers: [],
-    imperativeInstaller: installResizable
-  };
+  const result = hf.compileSync(resizableSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile Resizable behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var resizableSource, resizableMetadata, resizable_default;
 var init_resizable = __esm({
@@ -1170,25 +1063,6 @@ __export(toggleable_exports, {
   toggleableMetadata: () => toggleableMetadata,
   toggleableSource: () => toggleableSource
 });
-function installToggleable(element, params) {
-  const cls = params.cls || "active";
-  let targetEl = element;
-  if (params.target && params.target !== "me") {
-    if (typeof params.target === "string") {
-      const found = document.querySelector(params.target);
-      if (found instanceof HTMLElement) targetEl = found;
-    } else if (params.target instanceof HTMLElement) {
-      targetEl = params.target;
-    }
-  }
-  element.addEventListener("click", () => {
-    const wasOn = targetEl.classList.contains(cls);
-    targetEl.classList.toggle(cls);
-    targetEl.dispatchEvent(
-      new CustomEvent(wasOn ? "toggleable:off" : "toggleable:on", { bubbles: true })
-    );
-  });
-}
 async function registerToggleable(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1196,15 +1070,12 @@ async function registerToggleable(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "Toggleable",
-    parameters: ["cls", "target"],
-    eventHandlers: [],
-    imperativeInstaller: installToggleable
-  };
+  const result = hf.compileSync(toggleableSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile Toggleable behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var toggleableSource, toggleableMetadata, toggleable_default;
 var init_toggleable = __esm({
@@ -1233,62 +1104,6 @@ __export(clipboard_exports, {
   default: () => clipboard_default,
   registerClipboard: () => registerClipboard
 });
-async function copyToClipboard(text) {
-  if (navigator.clipboard?.writeText) {
-    await navigator.clipboard.writeText(text);
-    return;
-  }
-  const textarea = document.createElement("textarea");
-  textarea.value = text;
-  textarea.style.position = "fixed";
-  textarea.style.opacity = "0";
-  document.body.appendChild(textarea);
-  textarea.select();
-  try {
-    document.execCommand("copy");
-  } finally {
-    document.body.removeChild(textarea);
-  }
-}
-function resolveElement(element, param) {
-  if (!param || param === "me") return element;
-  if (param instanceof HTMLElement) return param;
-  if (typeof param === "string") {
-    return element.querySelector(param) || document.querySelector(param) || null;
-  }
-  return null;
-}
-function installClipboard(element, params) {
-  const feedbackDuration = typeof params.feedbackDuration === "number" ? params.feedbackDuration : 2e3;
-  element.addEventListener("click", async () => {
-    let copyText;
-    if (params.text != null) {
-      copyText = String(params.text);
-    } else {
-      const sourceEl = resolveElement(element, params.source) || element;
-      copyText = sourceEl.value ?? sourceEl.textContent ?? "";
-    }
-    try {
-      await copyToClipboard(copyText);
-      const feedbackEl = resolveElement(element, params.feedback) || element;
-      feedbackEl.classList.add("copied");
-      setTimeout(() => feedbackEl.classList.remove("copied"), feedbackDuration);
-      element.dispatchEvent(
-        new CustomEvent("clipboard:copied", {
-          bubbles: true,
-          detail: { text: copyText }
-        })
-      );
-    } catch (error) {
-      element.dispatchEvent(
-        new CustomEvent("clipboard:error", {
-          bubbles: true,
-          detail: { error }
-        })
-      );
-    }
-  });
-}
 async function registerClipboard(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1296,15 +1111,12 @@ async function registerClipboard(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "Clipboard",
-    parameters: ["text", "source", "feedback", "feedbackDuration"],
-    eventHandlers: [],
-    imperativeInstaller: installClipboard
-  };
+  const result = hf.compileSync(clipboardSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile Clipboard behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var clipboardSource, clipboardMetadata, clipboard_default;
 var init_clipboard = __esm({
@@ -1333,52 +1145,6 @@ __export(autodismiss_exports, {
   default: () => autodismiss_default,
   registerAutoDismiss: () => registerAutoDismiss
 });
-function installAutoDismiss(element, params) {
-  const delay = typeof params.delay === "number" ? params.delay : 5e3;
-  const pauseOnHover = params.pauseOnHover !== false;
-  const effect = params.effect === "fade" ? "fade" : "none";
-  let timerId = null;
-  let remaining = delay;
-  let startedAt = Date.now();
-  function dismiss() {
-    const event = new CustomEvent("autodismiss:dismissed", {
-      bubbles: true,
-      cancelable: true
-    });
-    element.dispatchEvent(event);
-    if (event.defaultPrevented) return;
-    if (effect === "fade") {
-      element.style.transition = "opacity 300ms";
-      element.style.opacity = "0";
-      setTimeout(() => element.remove(), 300);
-    } else {
-      element.remove();
-    }
-  }
-  function start() {
-    startedAt = Date.now();
-    timerId = setTimeout(dismiss, remaining);
-  }
-  element.dispatchEvent(new CustomEvent("autodismiss:start", { bubbles: true }));
-  start();
-  if (pauseOnHover) {
-    element.addEventListener("mouseenter", () => {
-      if (timerId != null) {
-        clearTimeout(timerId);
-        timerId = null;
-        remaining -= Date.now() - startedAt;
-        if (remaining < 0) remaining = 0;
-        element.dispatchEvent(new CustomEvent("autodismiss:paused", { bubbles: true }));
-      }
-    });
-    element.addEventListener("mouseleave", () => {
-      if (timerId == null && element.isConnected) {
-        element.dispatchEvent(new CustomEvent("autodismiss:resumed", { bubbles: true }));
-        start();
-      }
-    });
-  }
-}
 async function registerAutoDismiss(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1386,15 +1152,12 @@ async function registerAutoDismiss(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "AutoDismiss",
-    parameters: ["delay", "pauseOnHover", "effect"],
-    eventHandlers: [],
-    imperativeInstaller: installAutoDismiss
-  };
+  const result = hf.compileSync(autoDismissSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile AutoDismiss behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var autoDismissSource, autoDismissMetadata, autodismiss_default;
 var init_autodismiss = __esm({
@@ -1423,25 +1186,6 @@ __export(clickoutside_exports, {
   default: () => clickoutside_default,
   registerClickOutside: () => registerClickOutside
 });
-function installClickOutside(element, params) {
-  let active = params.active !== false;
-  function onPointerDown(e) {
-    if (!element.isConnected) {
-      document.removeEventListener("pointerdown", onPointerDown);
-      return;
-    }
-    if (active && !element.contains(e.target)) {
-      element.dispatchEvent(new CustomEvent("clickoutside", { bubbles: true }));
-    }
-  }
-  document.addEventListener("pointerdown", onPointerDown);
-  element.addEventListener("clickoutside:activate", () => {
-    active = true;
-  });
-  element.addEventListener("clickoutside:deactivate", () => {
-    active = false;
-  });
-}
 async function registerClickOutside(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1449,15 +1193,12 @@ async function registerClickOutside(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "ClickOutside",
-    parameters: ["active"],
-    eventHandlers: [],
-    imperativeInstaller: installClickOutside
-  };
+  const result = hf.compileSync(clickOutsideSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile ClickOutside behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var clickOutsideSource, clickOutsideMetadata, clickoutside_default;
 var init_clickoutside = __esm({
@@ -1486,71 +1227,6 @@ __export(focustrap_exports, {
   focusTrapSource: () => focusTrapSource,
   registerFocusTrap: () => registerFocusTrap
 });
-function resolveElement2(container, param) {
-  if (!param) return null;
-  if (param instanceof HTMLElement) return param;
-  if (typeof param === "string") {
-    return container.querySelector(param) || document.querySelector(param) || null;
-  }
-  return null;
-}
-function installFocusTrap(element, params) {
-  const returnFocus = params.returnFocus !== false;
-  let isActive = false;
-  let previouslyFocused = null;
-  function getFocusableElements() {
-    return Array.from(element.querySelectorAll(FOCUSABLE_SELECTOR));
-  }
-  function onKeyDown(e) {
-    if (!isActive || e.key !== "Tab") return;
-    const focusable = getFocusableElements();
-    if (focusable.length === 0) {
-      e.preventDefault();
-      return;
-    }
-    e.preventDefault();
-    const currentIndex = focusable.indexOf(document.activeElement);
-    if (e.shiftKey) {
-      const prevIndex = currentIndex <= 0 ? focusable.length - 1 : currentIndex - 1;
-      focusable[prevIndex].focus();
-    } else {
-      const nextIndex = currentIndex >= focusable.length - 1 ? 0 : currentIndex + 1;
-      focusable[nextIndex].focus();
-    }
-  }
-  function activate() {
-    if (isActive) return;
-    isActive = true;
-    previouslyFocused = document.activeElement;
-    element.setAttribute("aria-modal", "true");
-    const initialEl = resolveElement2(element, params.initialFocus);
-    if (initialEl) {
-      initialEl.focus();
-    } else {
-      const focusable = getFocusableElements();
-      if (focusable.length > 0) {
-        focusable[0].focus();
-      }
-    }
-    element.dispatchEvent(new CustomEvent("focustrap:activated", { bubbles: true }));
-  }
-  function deactivate() {
-    if (!isActive) return;
-    isActive = false;
-    element.removeAttribute("aria-modal");
-    if (returnFocus && previouslyFocused instanceof HTMLElement) {
-      previouslyFocused.focus();
-    }
-    previouslyFocused = null;
-    element.dispatchEvent(new CustomEvent("focustrap:deactivated", { bubbles: true }));
-  }
-  element.addEventListener("keydown", onKeyDown);
-  element.addEventListener("focustrap:activate", () => activate());
-  element.addEventListener("focustrap:deactivate", () => deactivate());
-  if (params.active !== false) {
-    activate();
-  }
-}
 async function registerFocusTrap(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1558,17 +1234,14 @@ async function registerFocusTrap(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "FocusTrap",
-    parameters: ["active", "initialFocus", "returnFocus"],
-    eventHandlers: [],
-    imperativeInstaller: installFocusTrap
-  };
+  const result = hf.compileSync(focusTrapSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile FocusTrap behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
-var focusTrapSource, focusTrapMetadata, FOCUSABLE_SELECTOR, focustrap_default;
+var focusTrapSource, focusTrapMetadata, focustrap_default;
 var init_focustrap = __esm({
   "src/behaviors/focustrap.ts"() {
     "use strict";
@@ -1576,14 +1249,6 @@ var init_focustrap = __esm({
     init_types();
     focusTrapSource = focusTrapSchema.source;
     focusTrapMetadata = focusTrapSchema;
-    FOCUSABLE_SELECTOR = [
-      "a[href]",
-      "button:not(:disabled)",
-      "input:not(:disabled)",
-      "select:not(:disabled)",
-      "textarea:not(:disabled)",
-      '[tabindex]:not([tabindex="-1"])'
-    ].join(", ");
     if (resolveRuntime()) {
       registerFocusTrap().catch(console.error);
     }
@@ -1603,30 +1268,6 @@ __export(scrollreveal_exports, {
   scrollRevealMetadata: () => scrollRevealMetadata,
   scrollRevealSource: () => scrollRevealSource
 });
-function installScrollReveal(element, params) {
-  const cls = typeof params.cls === "string" ? params.cls : "revealed";
-  const threshold = typeof params.threshold === "number" ? params.threshold : 0.1;
-  const once = params.once !== false;
-  const rootMargin = typeof params.rootMargin === "string" ? params.rootMargin : "0px";
-  const observer = new IntersectionObserver(
-    (entries) => {
-      for (const entry of entries) {
-        if (entry.isIntersecting) {
-          element.classList.add(cls);
-          element.dispatchEvent(new CustomEvent("scrollreveal:enter", { bubbles: true }));
-          if (once) {
-            observer.disconnect();
-          }
-        } else if (!once) {
-          element.classList.remove(cls);
-          element.dispatchEvent(new CustomEvent("scrollreveal:exit", { bubbles: true }));
-        }
-      }
-    },
-    { threshold, rootMargin }
-  );
-  observer.observe(element);
-}
 async function registerScrollReveal(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1634,15 +1275,12 @@ async function registerScrollReveal(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "ScrollReveal",
-    parameters: ["cls", "threshold", "once", "rootMargin"],
-    eventHandlers: [],
-    imperativeInstaller: installScrollReveal
-  };
+  const result = hf.compileSync(scrollRevealSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile ScrollReveal behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
 var scrollRevealSource, scrollRevealMetadata, scrollreveal_default;
 var init_scrollreveal = __esm({
@@ -1671,117 +1309,6 @@ __export(tabs_exports, {
   tabsMetadata: () => tabsMetadata,
   tabsSource: () => tabsSource
 });
-function ensureId(el, prefix) {
-  if (!el.id) {
-    el.id = `${prefix}-${++idCounter}`;
-  }
-  return el.id;
-}
-function installTabs(element, params) {
-  const orientation = params.orientation === "vertical" ? "vertical" : "horizontal";
-  const wrap = params.wrap !== false;
-  const activeClass = params.activeClass || "active";
-  const initialIndex = typeof params.activeTab === "number" ? params.activeTab : 0;
-  const tabs = Array.from(element.querySelectorAll('[role="tab"]'));
-  const panels = Array.from(element.querySelectorAll('[role="tabpanel"]'));
-  if (tabs.length === 0 || panels.length === 0) return;
-  const tablist = element.querySelector('[role="tablist"]') || tabs[0].parentElement;
-  if (tablist && !tablist.getAttribute("role")) {
-    tablist.setAttribute("role", "tablist");
-  }
-  if (tablist) {
-    tablist.setAttribute("aria-orientation", orientation);
-  }
-  const count = Math.min(tabs.length, panels.length);
-  for (let i = 0; i < count; i++) {
-    const tabId = ensureId(tabs[i], "tab");
-    const panelId = ensureId(panels[i], "tabpanel");
-    tabs[i].setAttribute("aria-controls", panelId);
-    panels[i].setAttribute("aria-labelledby", tabId);
-  }
-  let currentIndex = -1;
-  function selectTab(index, previousIndex) {
-    if (index === previousIndex || index < 0 || index >= count) return false;
-    const detail = {
-      tab: tabs[index],
-      panel: panels[index],
-      index,
-      previousIndex
-    };
-    const changeEvent = new CustomEvent("tabs:change", {
-      bubbles: true,
-      cancelable: true,
-      detail
-    });
-    element.dispatchEvent(changeEvent);
-    if (changeEvent.defaultPrevented) return false;
-    if (previousIndex >= 0 && previousIndex < count) {
-      tabs[previousIndex].setAttribute("aria-selected", "false");
-      tabs[previousIndex].setAttribute("tabindex", "-1");
-      tabs[previousIndex].classList.remove(activeClass);
-      panels[previousIndex].setAttribute("aria-hidden", "true");
-      panels[previousIndex].classList.remove(activeClass);
-    }
-    tabs[index].setAttribute("aria-selected", "true");
-    tabs[index].setAttribute("tabindex", "0");
-    tabs[index].classList.add(activeClass);
-    panels[index].setAttribute("aria-hidden", "false");
-    panels[index].classList.add(activeClass);
-    currentIndex = index;
-    element.dispatchEvent(new CustomEvent("tabs:changed", { bubbles: true, detail }));
-    return true;
-  }
-  for (let i = 0; i < count; i++) {
-    tabs[i].setAttribute("aria-selected", "false");
-    tabs[i].setAttribute("tabindex", "-1");
-    tabs[i].classList.remove(activeClass);
-    panels[i].setAttribute("aria-hidden", "true");
-    panels[i].classList.remove(activeClass);
-  }
-  const clamped = Math.max(0, Math.min(initialIndex, count - 1));
-  tabs[clamped].setAttribute("aria-selected", "true");
-  tabs[clamped].setAttribute("tabindex", "0");
-  tabs[clamped].classList.add(activeClass);
-  panels[clamped].setAttribute("aria-hidden", "false");
-  panels[clamped].classList.add(activeClass);
-  currentIndex = clamped;
-  for (let i = 0; i < count; i++) {
-    tabs[i].addEventListener("click", () => {
-      selectTab(i, currentIndex);
-      tabs[i].focus();
-    });
-  }
-  const keyTarget = tablist || element;
-  keyTarget.addEventListener("keydown", (e) => {
-    const isHorizontal = orientation === "horizontal";
-    const nextKey = isHorizontal ? "ArrowRight" : "ArrowDown";
-    const prevKey = isHorizontal ? "ArrowLeft" : "ArrowUp";
-    let nextIndex = null;
-    if (e.key === nextKey) {
-      nextIndex = currentIndex + 1;
-      if (nextIndex >= count) nextIndex = wrap ? 0 : null;
-    } else if (e.key === prevKey) {
-      nextIndex = currentIndex - 1;
-      if (nextIndex < 0) nextIndex = wrap ? count - 1 : null;
-    } else if (e.key === "Home") {
-      nextIndex = 0;
-    } else if (e.key === "End") {
-      nextIndex = count - 1;
-    }
-    if (nextIndex !== null) {
-      e.preventDefault();
-      if (selectTab(nextIndex, currentIndex)) {
-        tabs[nextIndex].focus();
-      }
-    }
-  });
-  element.addEventListener("tabs:select", ((e) => {
-    const index = e.detail?.index;
-    if (typeof index === "number") {
-      selectTab(index, currentIndex);
-    }
-  }));
-}
 async function registerTabs(hyperfixi) {
   const hf = hyperfixi || resolveRuntime();
   if (!hf) {
@@ -1789,17 +1316,14 @@ async function registerTabs(hyperfixi) {
       "LokaScript not found. Make sure @hyperfixi/core is loaded before registering behaviors."
     );
   }
-  const syntheticNode = {
-    type: "behavior",
-    name: "Tabs",
-    parameters: ["orientation", "activeTab", "wrap", "activeClass"],
-    eventHandlers: [],
-    imperativeInstaller: installTabs
-  };
+  const result = hf.compileSync(tabsSchema.source, { traditional: true });
+  if (!result.ok) {
+    throw new Error(`Failed to compile Tabs behavior: ${JSON.stringify(result.errors)}`);
+  }
   const ctx = hf.createContext ? hf.createContext() : { locals: /* @__PURE__ */ new Map(), globals: /* @__PURE__ */ new Map() };
-  await hf.execute(syntheticNode, ctx);
+  await hf.execute(result.ast, ctx);
 }
-var tabsSource, tabsMetadata, idCounter, tabs_default;
+var tabsSource, tabsMetadata, tabs_default;
 var init_tabs = __esm({
   "src/behaviors/tabs.ts"() {
     "use strict";
@@ -1807,7 +1331,6 @@ var init_tabs = __esm({
     init_types();
     tabsSource = tabsSchema.source;
     tabsMetadata = tabsSchema;
-    idCounter = 0;
     if (resolveRuntime()) {
       registerTabs().catch(console.error);
     }