@almadar/ui 5.76.7 → 5.77.0

package/dist/providers/index.cjs

@@ -12153,318 +12153,14 @@ var init_useCanvasEffects = __esm({
     "use client";
   }
 });
-function pickPath(entry) {
-  if (Array.isArray(entry.path)) {
-    return entry.path[Math.floor(Math.random() * entry.path.length)];
-  }
-  return entry.path;
-}
-function useGameAudio({
-  manifest,
-  baseUrl = "",
-  initialMuted = false,
-  initialVolume = 1
-}) {
-  const [muted, setMutedState] = React107.useState(initialMuted);
-  const [masterVolume, setMasterVolumeState] = React107.useState(initialVolume);
-  const mutedRef = React107.useRef(muted);
-  const volumeRef = React107.useRef(masterVolume);
-  const manifestRef = React107.useRef(manifest);
-  mutedRef.current = muted;
-  volumeRef.current = masterVolume;
-  manifestRef.current = manifest;
-  const poolsRef = React107.useRef(/* @__PURE__ */ new Map());
-  const getOrCreateElement = React107.useCallback((key) => {
-    const entry = manifestRef.current[key];
-    if (!entry) return null;
-    let pool = poolsRef.current.get(key);
-    if (!pool) {
-      pool = [];
-      poolsRef.current.set(key, pool);
-    }
-    const maxSize = entry.poolSize ?? 1;
-    for (const audio of pool) {
-      if (audio.paused && (audio.ended || audio.currentTime === 0)) {
-        return audio;
-      }
-    }
-    if (pool.length < maxSize) {
-      const src = baseUrl + pickPath(entry);
-      const audio = new Audio(src);
-      audio.loop = entry.loop ?? false;
-      pool.push(audio);
-      return audio;
-    }
-    if (!entry.loop) {
-      let oldest = pool[0];
-      for (const audio of pool) {
-        if (audio.currentTime > oldest.currentTime) {
-          oldest = audio;
-        }
-      }
-      oldest.pause();
-      oldest.currentTime = 0;
-      return oldest;
-    }
-    return null;
-  }, [baseUrl]);
-  const play = React107.useCallback((key) => {
-    if (mutedRef.current) return;
-    const entry = manifestRef.current[key];
-    if (!entry) return;
-    const audio = getOrCreateElement(key);
-    if (!audio) return;
-    audio.volume = Math.min(1, (entry.volume ?? 1) * volumeRef.current);
-    if (!entry.loop) {
-      audio.currentTime = 0;
-    }
-    const promise = audio.play();
-    if (promise) {
-      promise.catch(() => {
-      });
-    }
-  }, [getOrCreateElement]);
-  const stop = React107.useCallback((key) => {
-    const pool = poolsRef.current.get(key);
-    if (!pool) return;
-    for (const audio of pool) {
-      audio.pause();
-      audio.currentTime = 0;
-    }
-  }, []);
-  const currentMusicKeyRef = React107.useRef(null);
-  const currentMusicElRef = React107.useRef(null);
-  const musicFadeRef = React107.useRef(null);
-  const pendingMusicKeyRef = React107.useRef(null);
-  const clearMusicFade = React107.useCallback(() => {
-    if (musicFadeRef.current) {
-      clearInterval(musicFadeRef.current);
-      musicFadeRef.current = null;
-    }
-  }, []);
-  const playMusic = React107.useCallback((key) => {
-    if (key === currentMusicKeyRef.current) return;
-    pendingMusicKeyRef.current = key;
-    const entry = manifestRef.current[key];
-    if (!entry) return;
-    const fadeDurationMs = entry.crossfadeDurationMs ?? 1500;
-    const stepMs = 50;
-    const totalSteps = Math.max(1, fadeDurationMs / stepMs);
-    const targetVolume = Math.min(1, (entry.volume ?? 1) * volumeRef.current);
-    clearMusicFade();
-    const src = baseUrl + (Array.isArray(entry.path) ? entry.path[0] : entry.path);
-    const incoming = new Audio(src);
-    incoming.loop = true;
-    incoming.volume = 0;
-    const outgoing = currentMusicElRef.current;
-    const outgoingStartVol = outgoing?.volume ?? 0;
-    currentMusicKeyRef.current = key;
-    currentMusicElRef.current = incoming;
-    if (!mutedRef.current) {
-      incoming.play().catch(() => {
-        currentMusicKeyRef.current = null;
-        currentMusicElRef.current = outgoing;
-      });
-    }
-    let step = 0;
-    musicFadeRef.current = setInterval(() => {
-      step++;
-      const progress = Math.min(step / totalSteps, 1);
-      incoming.volume = Math.min(1, targetVolume * progress);
-      if (outgoing) {
-        outgoing.volume = Math.max(0, outgoingStartVol * (1 - progress));
-      }
-      if (progress >= 1) {
-        clearMusicFade();
-        if (outgoing) {
-          outgoing.pause();
-          outgoing.src = "";
-        }
-      }
-    }, stepMs);
-  }, [baseUrl, clearMusicFade]);
-  const stopMusic = React107.useCallback((fadeDurationMs = 1e3) => {
-    const outgoing = currentMusicElRef.current;
-    if (!outgoing) return;
-    currentMusicKeyRef.current = null;
-    currentMusicElRef.current = null;
-    pendingMusicKeyRef.current = null;
-    clearMusicFade();
-    const startVolume = outgoing.volume;
-    const stepMs = 50;
-    const totalSteps = Math.max(1, fadeDurationMs / stepMs);
-    let step = 0;
-    musicFadeRef.current = setInterval(() => {
-      step++;
-      const progress = step / totalSteps;
-      outgoing.volume = Math.max(0, startVolume * (1 - progress));
-      if (progress >= 1) {
-        clearMusicFade();
-        outgoing.pause();
-        outgoing.src = "";
-      }
-    }, stepMs);
-  }, [clearMusicFade]);
-  const stopAll = React107.useCallback(() => {
-    for (const pool of poolsRef.current.values()) {
-      for (const audio of pool) {
-        audio.pause();
-        audio.currentTime = 0;
-      }
-    }
-    stopMusic(0);
-  }, [stopMusic]);
-  const setMuted = React107.useCallback((value) => {
-    setMutedState(value);
-    if (value) {
-      for (const [key, pool] of poolsRef.current.entries()) {
-        if (manifestRef.current[key]?.loop) {
-          for (const audio of pool) {
-            if (!audio.paused) audio.pause();
-          }
-        }
-      }
-      currentMusicElRef.current?.pause();
-    } else {
-      for (const [key, pool] of poolsRef.current.entries()) {
-        const entry = manifestRef.current[key];
-        if (entry?.loop && entry?.autostart) {
-          for (const audio of pool) {
-            if (audio.paused) audio.play().catch(() => {
-            });
-          }
-        }
-      }
-      const musicEl = currentMusicElRef.current;
-      if (musicEl) {
-        musicEl.play().catch(() => {
-        });
-      }
-    }
-  }, []);
-  const setMasterVolume = React107.useCallback((volume) => {
-    const clamped = Math.max(0, Math.min(1, volume));
-    setMasterVolumeState(clamped);
-    for (const [key, pool] of poolsRef.current.entries()) {
-      const entryVol = manifestRef.current[key]?.volume ?? 1;
-      for (const audio of pool) {
-        audio.volume = Math.min(1, entryVol * clamped);
-      }
-    }
-    if (!musicFadeRef.current && currentMusicElRef.current) {
-      const key = currentMusicKeyRef.current;
-      const entryVol = key ? manifestRef.current[key]?.volume ?? 1 : 1;
-      currentMusicElRef.current.volume = Math.min(1, entryVol * clamped);
-    }
-  }, []);
-  const unlockedRef = React107.useRef(false);
-  React107.useEffect(() => {
-    const autoKeys = Object.keys(manifest).filter((k) => manifest[k].autostart);
-    const hasPendingMusic = () => pendingMusicKeyRef.current !== null;
-    const hasAutoStart = autoKeys.length > 0;
-    if (!hasAutoStart && !hasPendingMusic()) return;
-    const unlock = () => {
-      if (unlockedRef.current) return;
-      unlockedRef.current = true;
-      if (!mutedRef.current) {
-        for (const key of autoKeys) {
-          play(key);
-        }
-        const pending = pendingMusicKeyRef.current;
-        if (pending && pending !== currentMusicKeyRef.current) {
-          playMusic(pending);
-        }
-      }
-    };
-    document.addEventListener("click", unlock, { once: true });
-    document.addEventListener("keydown", unlock, { once: true });
-    document.addEventListener("touchstart", unlock, { once: true });
-    return () => {
-      document.removeEventListener("click", unlock);
-      document.removeEventListener("keydown", unlock);
-      document.removeEventListener("touchstart", unlock);
-    };
-  }, [manifest, play, playMusic]);
-  React107.useEffect(() => {
-    return () => {
-      clearMusicFade();
-      for (const pool of poolsRef.current.values()) {
-        for (const audio of pool) {
-          audio.pause();
-          audio.src = "";
-        }
-      }
-      poolsRef.current.clear();
-      if (currentMusicElRef.current) {
-        currentMusicElRef.current.pause();
-        currentMusicElRef.current.src = "";
-        currentMusicElRef.current = null;
-      }
-    };
-  }, [clearMusicFade]);
-  return {
-    play,
-    stop,
-    stopAll,
-    playMusic,
-    stopMusic,
-    muted,
-    setMuted,
-    masterVolume,
-    setMasterVolume
-  };
-}
 var init_useGameAudio = __esm({
   "components/game/shared/hooks/useGameAudio.ts"() {
     "use client";
-    useGameAudio.displayName = "useGameAudio";
   }
 });
 function useGameAudioContextOptional() {
   return React107.useContext(GameAudioContext);
 }
-function GameAudioProvider({
-  manifest,
-  baseUrl = "",
-  children,
-  initialMuted = false
-}) {
-  const eventBus = useEventBus();
-  const { play, stop, stopAll, playMusic, stopMusic, muted, setMuted, masterVolume, setMasterVolume } = useGameAudio({ manifest, baseUrl, initialMuted });
-  React107.useEffect(() => {
-    const unsubPlay = eventBus.on("UI:PLAY_SOUND", (event) => {
-      const key = event.payload?.key;
-      if (key) play(key);
-    });
-    const unsubStop = eventBus.on("UI:STOP_SOUND", (event) => {
-      const key = event.payload?.key;
-      if (key) {
-        stop(key);
-      } else {
-        stopAll();
-      }
-    });
-    const unsubChangeMusic = eventBus.on("UI:CHANGE_MUSIC", (event) => {
-      const key = event.payload?.key;
-      if (key) {
-        playMusic(key);
-      } else {
-        stopMusic();
-      }
-    });
-    const unsubStopMusic = eventBus.on("UI:STOP_MUSIC", () => {
-      stopMusic();
-    });
-    return () => {
-      unsubPlay();
-      unsubStop();
-      unsubChangeMusic();
-      unsubStopMusic();
-    };
-  }, [eventBus, play, stop, stopAll, playMusic, stopMusic]);
-  const value = { muted, setMuted, masterVolume, setMasterVolume, play, playMusic, stopMusic };
-  return /* @__PURE__ */ jsxRuntime.jsx(GameAudioContext.Provider, { value, children });
-}
 var GameAudioContext;
 var init_GameAudioProvider = __esm({
   "components/game/shared/providers/GameAudioProvider.tsx"() {
@@ -12473,7 +12169,6 @@ var init_GameAudioProvider = __esm({
     init_useGameAudio();
     GameAudioContext = React107.createContext(null);
     GameAudioContext.displayName = "GameAudioContext";
-    GameAudioProvider.displayName = "GameAudioProvider";
   }
 });
 function GameAudioToggle({
@@ -23031,9 +22726,9 @@ var init_BehaviorView = __esm({
   }
 });
 
-// node_modules/.pnpm/katex@0.16.47/node_modules/katex/dist/katex.min.css
+// node_modules/katex/dist/katex.min.css
 var init_katex_min = __esm({
-  "node_modules/.pnpm/katex@0.16.47/node_modules/katex/dist/katex.min.css"() {
+  "node_modules/katex/dist/katex.min.css"() {
   }
 });
 var Tabs;
@@ -27426,129 +27121,6 @@ var init_Breadcrumb = __esm({
     Breadcrumb.displayName = "Breadcrumb";
   }
 });
-function useSafeEventBus2() {
-  try {
-    return useEventBus();
-  } catch {
-    return { emit: () => {
-    }, on: () => () => {
-    }, once: () => {
-    } };
-  }
-}
-var log8, lookStyles4, ButtonGroup;
-var init_ButtonGroup = __esm({
-  "components/core/molecules/ButtonGroup.tsx"() {
-    "use client";
-    init_cn();
-    init_atoms();
-    init_useEventBus();
-    log8 = logger.createLogger("almadar:ui:button-group");
-    lookStyles4 = {
-      "right-aligned-buttons": "",
-      "floating-bar": "fixed bottom-section left-1/2 -translate-x-1/2 shadow-elevation-toast bg-card p-card-sm rounded-container",
-      "inline-row": "gap-2 inline-flex",
-      "dropdown-menu": "[&>button:not(:first-child)]:hidden",
-      "command-palette-trigger": "[&>button:not(:first-child)]:hidden"
-    };
-    ButtonGroup = ({
-      children,
-      primary,
-      secondary,
-      variant = "default",
-      orientation = "horizontal",
-      className,
-      // Filter-group pattern props (entity and filters are used for schema-driven filtering)
-      entity: _entity,
-      filters,
-      look = "right-aligned-buttons"
-    }) => {
-      const eventBus = useSafeEventBus2();
-      const variantClasses2 = {
-        default: "gap-0",
-        segmented: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0",
-        toggle: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0"
-      };
-      const orientationClasses = {
-        horizontal: "flex-row",
-        vertical: "flex-col [&>button:first-child]:rounded-t-lg [&>button:last-child]:rounded-b-lg [&>button:not(:first-child)]:border-t-0 [&>button:not(:first-child)]:border-l"
-      };
-      const handleActionClick = (action) => {
-        if (action.event) {
-          eventBus.emit("UI:DISPATCH", { event: action.event });
-        }
-        if (action.navigatesTo) {
-          eventBus.emit("UI:NAVIGATE", { url: action.navigatesTo });
-        }
-      };
-      const renderFormActions = () => {
-        const buttons = [];
-        if (secondary) {
-          secondary.forEach((action, index) => {
-            buttons.push(
-              /* @__PURE__ */ jsxRuntime.jsx(
-                Button,
-                {
-                  type: action.actionType === "submit" ? "submit" : "button",
-                  variant: action.variant || "ghost",
-                  onClick: () => handleActionClick(action),
-                  children: action.label
-                },
-                `secondary-${index}`
-              )
-            );
-          });
-        }
-        if (primary) {
-          const isSubmit = primary.actionType === "submit";
-          buttons.push(
-            /* @__PURE__ */ jsxRuntime.jsx(
-              Button,
-              {
-                type: isSubmit ? "submit" : "button",
-                variant: primary.variant || "primary",
-                onClick: () => handleActionClick(primary),
-                "data-testid": isSubmit ? "form-submit" : void 0,
-                children: primary.label
-              },
-              "primary"
-            )
-          );
-        }
-        return buttons;
-      };
-      const renderFilters = () => {
-        if (!filters || filters.length === 0) return null;
-        return filters.map((filter, index) => /* @__PURE__ */ jsxRuntime.jsx(
-          Button,
-          {
-            variant: "ghost",
-            onClick: () => {
-              log8.debug("Filter clicked", { field: filter.field });
-            },
-            children: filter.label
-          },
-          `filter-${filter.field}-${index}`
-        ));
-      };
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          className: cn(
-            "inline-flex gap-2",
-            variantClasses2[variant],
-            orientationClasses[orientation],
-            lookStyles4[look],
-            className
-          ),
-          role: "group",
-          children: children || renderFilters() || renderFormActions()
-        }
-      );
-    };
-    ButtonGroup.displayName = "ButtonGroup";
-  }
-});
 function useSwipeGesture(callbacks, options = {}) {
   const { threshold = 50, velocityThreshold = 0.3, preventDefault = false } = options;
   const startX = React107.useRef(0);
@@ -28358,7 +27930,7 @@ var init_CardGrid = __esm({
     CardGrid.displayName = "CardGrid";
   }
 });
-function useSafeEventBus3() {
+function useSafeEventBus2() {
   try {
     return useEventBus();
   } catch {
@@ -28394,7 +27966,7 @@ var init_Carousel = __esm({
       const [activeIndex, setActiveIndex] = React107.useState(0);
       const scrollRef = React107.useRef(null);
       const autoPlayRef = React107.useRef(null);
-      const eventBus = useSafeEventBus3();
+      const eventBus = useSafeEventBus2();
       const { t } = hooks.useTranslate();
       const safeItems = items ?? [];
       const totalSlides = safeItems.length;
@@ -31730,7 +31302,7 @@ function DataGrid({
       /* @__PURE__ */ jsxRuntime.jsx(
         Box,
         {
-          className: cn("grid", gapStyles5[gap], scrollX ? "grid-flow-col overflow-x-auto" : colsClass, lookStyles5[look], className),
+          className: cn("grid", gapStyles5[gap], scrollX ? "grid-flow-col overflow-x-auto" : colsClass, lookStyles4[look], className),
           style: scrollX ? { gridAutoFlow: "column", gridAutoColumns: `minmax(${minCardWidth}px, 1fr)` } : gridTemplateColumns ? { gridTemplateColumns } : void 0,
           children: data.map((item, index) => {
             const itemData = item;
@@ -31925,7 +31497,7 @@ function DataGrid({
     ] })
   );
 }
-var dataGridLog, BADGE_VARIANTS, gapStyles5, lookStyles5;
+var dataGridLog, BADGE_VARIANTS, gapStyles5, lookStyles4;
 var init_DataGrid = __esm({
   "components/core/molecules/DataGrid.tsx"() {
     "use client";
@@ -31960,7 +31532,7 @@ var init_DataGrid = __esm({
       lg: "gap-6",
       xl: "gap-8"
     };
-    lookStyles5 = {
+    lookStyles4 = {
       dense: "gap-2 [&>*]:p-card-sm",
       spacious: "gap-8 [&>*]:p-card-lg",
       striped: "[&>*:nth-child(even)]:bg-muted/30",
@@ -32387,6 +31959,133 @@ var init_DataList = __esm({
     DataList.displayName = "DataList";
   }
 });
+var FormSection, FormLayout, FormActions;
+var init_FormSection = __esm({
+  "components/core/molecules/FormSection.tsx"() {
+    "use client";
+    init_cn();
+    init_atoms();
+    init_Box();
+    init_Typography();
+    init_Button();
+    init_Stack();
+    init_Icon();
+    init_useEventBus();
+    FormSection = ({
+      title,
+      description,
+      children,
+      collapsible = false,
+      defaultCollapsed = false,
+      card = false,
+      columns = 1,
+      className
+    }) => {
+      const [collapsed, setCollapsed] = React107__namespace.default.useState(defaultCollapsed);
+      const { t } = hooks.useTranslate();
+      const eventBus = useEventBus();
+      const gridClass = {
+        1: "grid-cols-1",
+        2: "grid-cols-1 md:grid-cols-2",
+        3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
+      }[columns];
+      React107__namespace.default.useCallback(() => {
+        if (collapsible) {
+          setCollapsed((prev) => !prev);
+          eventBus.emit("UI:TOGGLE_COLLAPSE", { collapsed: !collapsed });
+        }
+      }, [collapsible, collapsed, eventBus]);
+      const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        (title || description) && /* @__PURE__ */ jsxRuntime.jsxs(VStack, { gap: "xs", className: "mb-4", children: [
+          title && /* @__PURE__ */ jsxRuntime.jsxs(
+            HStack,
+            {
+              justify: "between",
+              align: "center",
+              className: cn(collapsible && "cursor-pointer"),
+              action: collapsible ? "TOGGLE_COLLAPSE" : void 0,
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h3", weight: "semibold", children: title }),
+                collapsible && /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    variant: "ghost",
+                    size: "sm",
+                    action: "TOGGLE_COLLAPSE",
+                    children: /* @__PURE__ */ jsxRuntime.jsx(
+                      Icon,
+                      {
+                        icon: LucideIcons2.ChevronDown,
+                        size: "sm",
+                        className: cn(
+                          "text-muted-foreground transition-transform",
+                          collapsed && "rotate-180"
+                        )
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          ),
+          description && /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", color: "secondary", children: description })
+        ] }),
+        (!collapsible || !collapsed) && /* @__PURE__ */ jsxRuntime.jsx(Box, { className: cn("grid gap-4", gridClass), children })
+      ] });
+      if (card) {
+        return /* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("p-6", className), children: content });
+      }
+      return /* @__PURE__ */ jsxRuntime.jsx(Box, { className, children: content });
+    };
+    FormSection.displayName = "FormSection";
+    FormLayout = ({
+      children,
+      dividers = true,
+      className
+    }) => {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        VStack,
+        {
+          gap: "lg",
+          className: cn(
+            dividers && "[&>*+*]:pt-8 [&>*+*]:border-t [&>*+*]:border-border",
+            className
+          ),
+          children
+        }
+      );
+    };
+    FormLayout.displayName = "FormLayout";
+    FormActions = ({
+      children,
+      sticky = false,
+      align = "right",
+      className
+    }) => {
+      const alignClass2 = {
+        left: "justify-start",
+        right: "justify-end",
+        between: "justify-between",
+        center: "justify-center"
+      }[align];
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        HStack,
+        {
+          gap: "sm",
+          align: "center",
+          className: cn(
+            "pt-6 border-t border-border",
+            alignClass2,
+            sticky && "sticky bottom-0 bg-card py-4 -mx-6 px-6 shadow-[0_-4px_6px_-1px_rgb(0,0,0,0.05)]",
+            className
+          ),
+          children
+        }
+      );
+    };
+    FormActions.displayName = "FormActions";
+  }
+});
 function fileIcon(name) {
   const ext = name.split(".").pop()?.toLowerCase() ?? "";
   switch (ext) {
@@ -32548,6 +32247,129 @@ var init_FormField = __esm({
     FormField.displayName = "FormField";
   }
 });
+function useSafeEventBus3() {
+  try {
+    return useEventBus();
+  } catch {
+    return { emit: () => {
+    }, on: () => () => {
+    }, once: () => {
+    } };
+  }
+}
+var log8, lookStyles5, ButtonGroup;
+var init_ButtonGroup = __esm({
+  "components/core/molecules/ButtonGroup.tsx"() {
+    "use client";
+    init_cn();
+    init_atoms();
+    init_useEventBus();
+    log8 = logger.createLogger("almadar:ui:button-group");
+    lookStyles5 = {
+      "right-aligned-buttons": "",
+      "floating-bar": "fixed bottom-section left-1/2 -translate-x-1/2 shadow-elevation-toast bg-card p-card-sm rounded-container",
+      "inline-row": "gap-2 inline-flex",
+      "dropdown-menu": "[&>button:not(:first-child)]:hidden",
+      "command-palette-trigger": "[&>button:not(:first-child)]:hidden"
+    };
+    ButtonGroup = ({
+      children,
+      primary,
+      secondary,
+      variant = "default",
+      orientation = "horizontal",
+      className,
+      // Filter-group pattern props (entity and filters are used for schema-driven filtering)
+      entity: _entity,
+      filters,
+      look = "right-aligned-buttons"
+    }) => {
+      const eventBus = useSafeEventBus3();
+      const variantClasses2 = {
+        default: "gap-0",
+        segmented: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0",
+        toggle: "gap-0 [&>button]:rounded-none [&>button:first-child]:rounded-l-lg [&>button:last-child]:rounded-r-lg [&>button:not(:first-child)]:border-l-0"
+      };
+      const orientationClasses = {
+        horizontal: "flex-row",
+        vertical: "flex-col [&>button:first-child]:rounded-t-lg [&>button:last-child]:rounded-b-lg [&>button:not(:first-child)]:border-t-0 [&>button:not(:first-child)]:border-l"
+      };
+      const handleActionClick = (action) => {
+        if (action.event) {
+          eventBus.emit("UI:DISPATCH", { event: action.event });
+        }
+        if (action.navigatesTo) {
+          eventBus.emit("UI:NAVIGATE", { url: action.navigatesTo });
+        }
+      };
+      const renderFormActions = () => {
+        const buttons = [];
+        if (secondary) {
+          secondary.forEach((action, index) => {
+            buttons.push(
+              /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  type: action.actionType === "submit" ? "submit" : "button",
+                  variant: action.variant || "ghost",
+                  onClick: () => handleActionClick(action),
+                  children: action.label
+                },
+                `secondary-${index}`
+              )
+            );
+          });
+        }
+        if (primary) {
+          const isSubmit = primary.actionType === "submit";
+          buttons.push(
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Button,
+              {
+                type: isSubmit ? "submit" : "button",
+                variant: primary.variant || "primary",
+                onClick: () => handleActionClick(primary),
+                "data-testid": isSubmit ? "form-submit" : void 0,
+                children: primary.label
+              },
+              "primary"
+            )
+          );
+        }
+        return buttons;
+      };
+      const renderFilters = () => {
+        if (!filters || filters.length === 0) return null;
+        return filters.map((filter, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            variant: "ghost",
+            onClick: () => {
+              log8.debug("Filter clicked", { field: filter.field });
+            },
+            children: filter.label
+          },
+          `filter-${filter.field}-${index}`
+        ));
+      };
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: cn(
+            "inline-flex gap-2",
+            variantClasses2[variant],
+            orientationClasses[orientation],
+            lookStyles5[look],
+            className
+          ),
+          role: "group",
+          children: children || renderFilters() || renderFormActions()
+        }
+      );
+    };
+    ButtonGroup.displayName = "ButtonGroup";
+  }
+});
 function getOrCreateStore(query) {
   if (!queryStores.has(query)) {
     queryStores.set(query, {
@@ -51108,7 +50930,6 @@ var init_component_registry_generated = __esm({
     init_BranchingLogicBuilder();
     init_Breadcrumb();
     init_BuilderBoard();
-    init_ButtonGroup();
     init_CTABanner();
     init_CalendarGrid();
     init_Canvas2D();
@@ -51185,9 +51006,9 @@ var init_component_registry_generated = __esm({
     init_FlipContainer();
     init_FloatingActionButton();
     init_Form();
+    init_FormSection();
     init_FormField();
     init_FormSectionHeader();
-    init_GameAudioProvider();
     init_GameAudioToggle();
     init_GameCard();
     init_GameHud();
@@ -51436,7 +51257,6 @@ var init_component_registry_generated = __esm({
       "Breadcrumb": Breadcrumb,
       "BuilderBoard": BuilderBoard,
       "Button": ButtonPattern,
-      "ButtonGroup": ButtonGroup,
       "ButtonPattern": ButtonPattern,
       "CTABanner": CTABanner,
       "CalendarGrid": CalendarGrid,
@@ -51516,9 +51336,10 @@ var init_component_registry_generated = __esm({
       "FlipContainer": FlipContainer,
       "FloatingActionButton": FloatingActionButton,
       "Form": Form,
+      "FormActions": FormActions,
       "FormField": FormField,
+      "FormLayout": FormLayout,
       "FormSectionHeader": FormSectionHeader,
-      "GameAudioProvider": GameAudioProvider,
       "GameAudioToggle": GameAudioToggle,
       "GameBoard3D": GameBoard3D,
       "GameCanvas3D": GameCanvas3D,