@almadar/ui 5.76.6 → 5.77.0

package/dist/components/index.cjs

@@ -4039,7 +4039,11 @@ var init_Switch = __esm({
               disabled,
               onClick: handleClick,
               className: cn(
-                "relative inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
+                // Fixed rem sizes instead of spacing tokens: themes like atelier
+                // redefine --space-11 to 68px, which makes w-11 enormous and leaves
+                // the thumb stuck near the left edge. The switch geometry must stay
+                // proportional regardless of a theme's density scale.
+                "relative inline-flex h-[1.5rem] w-[2.75rem] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
                 "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
                 isChecked ? "bg-primary" : "bg-muted",
                 disabled && "cursor-not-allowed opacity-50"
@@ -4048,8 +4052,8 @@ var init_Switch = __esm({
                 "span",
                 {
                   className: cn(
-                    "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform",
-                    isChecked ? "translate-x-5" : "translate-x-0"
+                    "pointer-events-none block h-[1.25rem] w-[1.25rem] rounded-full bg-background shadow-lg ring-0 transition-transform",
+                    isChecked ? "translate-x-[1.25rem]" : "translate-x-0"
                   )
                 }
               )
@@ -17041,129 +17045,6 @@ var init_BuilderBoard = __esm({
     BuilderBoard.displayName = "BuilderBoard";
   }
 });
-function useSafeEventBus2() {
-  try {
-    return useEventBus();
-  } catch {
-    return { emit: () => {
-    }, on: () => () => {
-    }, once: () => {
-    } };
-  }
-}
-var log6, lookStyles4; exports.ButtonGroup = void 0;
-var init_ButtonGroup = __esm({
-  "components/core/molecules/ButtonGroup.tsx"() {
-    "use client";
-    init_cn();
-    init_atoms();
-    init_useEventBus();
-    log6 = 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"
-    };
-    exports.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(
-                exports.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(
-              exports.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(
-          exports.Button,
-          {
-            variant: "ghost",
-            onClick: () => {
-              log6.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()
-        }
-      );
-    };
-    exports.ButtonGroup.displayName = "ButtonGroup";
-  }
-});
 function useSwipeGesture(callbacks, options = {}) {
   const { threshold = 50, velocityThreshold = 0.3, preventDefault = false } = options;
   const startX = React80.useRef(0);
@@ -19590,7 +19471,7 @@ var init_CardGrid = __esm({
     exports.CardGrid.displayName = "CardGrid";
   }
 });
-function useSafeEventBus3() {
+function useSafeEventBus2() {
   try {
     return useEventBus();
   } catch {
@@ -19626,7 +19507,7 @@ var init_Carousel = __esm({
       const [activeIndex, setActiveIndex] = React80.useState(0);
       const scrollRef = React80.useRef(null);
       const autoPlayRef = React80.useRef(null);
-      const eventBus = useSafeEventBus3();
+      const eventBus = useSafeEventBus2();
       const { t } = hooks.useTranslate();
       const safeItems = items ?? [];
       const totalSlides = safeItems.length;
@@ -24251,7 +24132,7 @@ function DataGrid({
       /* @__PURE__ */ jsxRuntime.jsx(
         exports.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;
@@ -24446,7 +24327,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";
@@ -24481,7 +24362,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",
@@ -26025,6 +25906,129 @@ var init_FormField = __esm({
     exports.FormField.displayName = "FormField";
   }
 });
+function useSafeEventBus3() {
+  try {
+    return useEventBus();
+  } catch {
+    return { emit: () => {
+    }, on: () => () => {
+    }, once: () => {
+    } };
+  }
+}
+var log6, lookStyles5; exports.ButtonGroup = void 0;
+var init_ButtonGroup = __esm({
+  "components/core/molecules/ButtonGroup.tsx"() {
+    "use client";
+    init_cn();
+    init_atoms();
+    init_useEventBus();
+    log6 = 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"
+    };
+    exports.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(
+                exports.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(
+              exports.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(
+          exports.Button,
+          {
+            variant: "ghost",
+            onClick: () => {
+              log6.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()
+        }
+      );
+    };
+    exports.ButtonGroup.displayName = "ButtonGroup";
+  }
+});
 function getOrCreateStore(query) {
   if (!queryStores.has(query)) {
     queryStores.set(query, {
@@ -52821,7 +52825,6 @@ var init_component_registry_generated = __esm({
     init_BranchingLogicBuilder();
     init_Breadcrumb();
     init_BuilderBoard();
-    init_ButtonGroup();
     init_CTABanner();
     init_CalendarGrid();
     init_Canvas2D();
@@ -52898,9 +52901,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();
@@ -53149,7 +53152,6 @@ var init_component_registry_generated = __esm({
       "Breadcrumb": exports.Breadcrumb,
       "BuilderBoard": BuilderBoard,
       "Button": ButtonPattern,
-      "ButtonGroup": exports.ButtonGroup,
       "ButtonPattern": ButtonPattern,
       "CTABanner": exports.CTABanner,
       "CalendarGrid": CalendarGrid,
@@ -53229,9 +53231,10 @@ var init_component_registry_generated = __esm({
       "FlipContainer": exports.FlipContainer,
       "FloatingActionButton": exports.FloatingActionButton,
       "Form": exports.Form,
+      "FormActions": exports.FormActions,
       "FormField": exports.FormField,
+      "FormLayout": exports.FormLayout,
       "FormSectionHeader": exports.FormSectionHeader,
-      "GameAudioProvider": GameAudioProvider,
       "GameAudioToggle": GameAudioToggle,
       "GameBoard3D": GameBoard3D,
       "GameCanvas3D": GameCanvas3D,