@almadar/ui 3.4.0 → 3.5.0

package/dist/components/index.cjs

@@ -227,9 +227,6 @@ var init_useEventBus = __esm({
       emit: (type, payload, source) => {
         const event = {
           type,
-          // Narrow at the bus boundary: public emit accepts an opaque object so
-          // generic UI emit sites don't require casts; the envelope stores the
-          // payload as EventPayload which listeners consume directly.
           payload,
           timestamp: Date.now(),
           source
@@ -14451,7 +14448,11 @@ var init_CardGrid = __esm({
           return;
         }
         if (action.event) {
-          eventBus.emit(`UI:${action.event}`, { id: itemData.id, row: itemData });
+          const payload = {
+            id: itemData.id,
+            row: itemData
+          };
+          eventBus.emit(`UI:${action.event}`, payload);
         }
         if (action.onClick) {
           action.onClick(itemData);
@@ -17366,7 +17367,8 @@ var init_DataGrid = __esm({
           if (next.has(id)) next.delete(id);
           else next.add(id);
           if (selectionEvent) {
-            eventBus.emit(`UI:${selectionEvent}`, { selectedIds: Array.from(next) });
+            const payload = { selectedIds: Array.from(next) };
+            eventBus.emit(`UI:${selectionEvent}`, payload);
           }
           return next;
         });
@@ -17377,7 +17379,8 @@ var init_DataGrid = __esm({
           const allSelected2 = allIds2.length > 0 && allIds2.every((id) => prev.has(id));
           const next = allSelected2 ? /* @__PURE__ */ new Set() : new Set(allIds2);
           if (selectionEvent) {
-            eventBus.emit(`UI:${selectionEvent}`, { selectedIds: Array.from(next) });
+            const payload = { selectedIds: Array.from(next) };
+            eventBus.emit(`UI:${selectionEvent}`, payload);
           }
           return next;
         });
@@ -17389,7 +17392,11 @@ var init_DataGrid = __esm({
       const dangerActions = itemActions?.filter((a) => a.variant === "danger") ?? [];
       const handleActionClick = (action, itemData) => (e) => {
         e.stopPropagation();
-        eventBus.emit(`UI:${action.event}`, { id: itemData.id, row: itemData });
+        const payload = {
+          id: itemData.id,
+          row: itemData
+        };
+        eventBus.emit(`UI:${action.event}`, payload);
       };
       const gridTemplateColumns = cols ? void 0 : `repeat(auto-fit, minmax(min(${minCardWidth}px, 100%), 1fr))`;
       const colsClass = cols ? {
@@ -17717,7 +17724,11 @@ var init_DataList = __esm({
       );
       const handleActionClick = (action, itemData) => (e) => {
         e.stopPropagation();
-        eventBus.emit(`UI:${action.event}`, { id: itemData.id, row: itemData });
+        const payload = {
+          id: itemData.id,
+          row: itemData
+        };
+        eventBus.emit(`UI:${action.event}`, payload);
       };
       if (isLoading) {
         return /* @__PURE__ */ jsxRuntime.jsx(exports.Box, { className: "text-center py-8", children: /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "body", color: "secondary", children: t("loading.items") || "Loading..." }) });
@@ -26371,7 +26382,8 @@ var init_DetailPanel = __esm({
             return;
           }
           if (action.event) {
-            eventBus.emit(`UI:${action.event}`, { id: data2?.id, row: data2 });
+            const payload = data2 ? { id: data2.id, row: data2 } : {};
+            eventBus.emit(`UI:${action.event}`, payload);
           }
           if (action.onClick) {
             action.onClick();
@@ -27908,9 +27920,10 @@ var init_Form = __esm({
       };
       const handleSubmit = (e) => {
         e.preventDefault();
-        eventBus.emit(`UI:${submitEvent}`, { data: formData });
+        const payload = { data: formData };
+        eventBus.emit(`UI:${submitEvent}`, payload);
         if (onSubmit) {
-          eventBus.emit(`UI:${onSubmit}`, { data: formData });
+          eventBus.emit(`UI:${onSubmit}`, payload);
         }
       };
       const handleCancel = () => {
@@ -29278,6 +29291,31 @@ function normalizeFields2(fields) {
   if (!fields) return [];
   return fields.map((f3) => typeof f3 === "string" ? f3 : f3.key ?? f3.name ?? "");
 }
+function entityFieldsFromListItem(item) {
+  const {
+    icon: _icon,
+    metadata: _metadata,
+    onClick: _onClick,
+    avatar: _avatar,
+    _fields,
+    ...rest
+  } = item;
+  const result = {};
+  for (const [key, value] of Object.entries(rest)) {
+    if (typeof value === "function" || value !== null && typeof value === "object" && "$$typeof" in value) {
+      continue;
+    }
+    result[key] = value;
+  }
+  if (_fields && typeof _fields === "object") {
+    for (const [k, v] of Object.entries(_fields)) {
+      if (typeof v !== "function") {
+        result[k] = v;
+      }
+    }
+  }
+  return result;
+}
 function getStatusStyle(fieldName, value) {
   const val = String(value).toLowerCase();
   if (val.includes("complete") || val.includes("done"))
@@ -29481,18 +29519,17 @@ var init_List = __esm({
             label: action.label,
             event: action.event,
             onClick: () => {
+              const row = entityFieldsFromListItem(item);
               if (action.navigatesTo) {
                 const url = action.navigatesTo.replace(
                   /\{\{(\w+)\}\}/g,
-                  (_, key) => String(item[key] || item.id || "")
+                  (_, key) => String(row[key] ?? item.id ?? "")
                 );
-                eventBus.emit("UI:NAVIGATE", { url, row: item });
+                eventBus.emit("UI:NAVIGATE", { url, row });
                 return;
               }
               if (action.event) {
-                eventBus.emit(`UI:${action.event}`, {
-                  row: item
-                });
+                eventBus.emit(`UI:${action.event}`, { row });
               }
             }
           }));
@@ -29572,7 +29609,7 @@ var init_List = __esm({
         );
         const hasExplicitClick = !!(viewAction?.event || item.onClick);
         const rowAction = viewAction?.event ?? "VIEW";
-        const rowActionPayload = { row: item };
+        const rowActionPayload = { row: entityFieldsFromListItem(item) };
         const primaryField = effectiveFieldNames?.[0];
         const statusField = effectiveFieldNames?.find(
           (f3) => f3.toLowerCase().includes("status")
@@ -35727,16 +35764,19 @@ var init_Timeline = __esm({
               ] }),
               item.description && /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", color: "secondary", children: item.description }),
               item.tags && item.tags.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(exports.HStack, { gap: "xs", wrap: true, children: item.tags.map((tag, tagIdx) => /* @__PURE__ */ jsxRuntime.jsx(exports.Badge, { variant: "default", children: tag }, tagIdx)) }),
-              itemActions && itemActions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(exports.HStack, { gap: "xs", className: "mt-1", children: itemActions.map((action, actionIdx) => /* @__PURE__ */ jsxRuntime.jsx(
-                exports.Box,
-                {
-                  action: action.event,
-                  actionPayload: { row: item },
-                  className: "cursor-pointer hover:opacity-80 transition-opacity",
-                  children: /* @__PURE__ */ jsxRuntime.jsx(exports.Badge, { variant: "default", children: action.label })
-                },
-                actionIdx
-              )) })
+              itemActions && itemActions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(exports.HStack, { gap: "xs", className: "mt-1", children: itemActions.map((action, actionIdx) => {
+                const { icon: _icon, ...rowSafe } = item;
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  exports.Box,
+                  {
+                    action: action.event,
+                    actionPayload: { row: rowSafe },
+                    className: "cursor-pointer hover:opacity-80 transition-opacity",
+                    children: /* @__PURE__ */ jsxRuntime.jsx(exports.Badge, { variant: "default", children: action.label })
+                  },
+                  actionIdx
+                );
+              }) })
             ] })
           ] }, item.id);
         }) })

package/dist/components/index.js

@@ -182,9 +182,6 @@ var init_useEventBus = __esm({
       emit: (type, payload, source) => {
         const event = {
           type,
-          // Narrow at the bus boundary: public emit accepts an opaque object so
-          // generic UI emit sites don't require casts; the envelope stores the
-          // payload as EventPayload which listeners consume directly.
           payload,
           timestamp: Date.now(),
           source
@@ -14406,7 +14403,11 @@ var init_CardGrid = __esm({
           return;
         }
         if (action.event) {
-          eventBus.emit(`UI:${action.event}`, { id: itemData.id, row: itemData });
+          const payload = {
+            id: itemData.id,
+            row: itemData
+          };
+          eventBus.emit(`UI:${action.event}`, payload);
         }
         if (action.onClick) {
           action.onClick(itemData);
@@ -17321,7 +17322,8 @@ var init_DataGrid = __esm({
           if (next.has(id)) next.delete(id);
           else next.add(id);
           if (selectionEvent) {
-            eventBus.emit(`UI:${selectionEvent}`, { selectedIds: Array.from(next) });
+            const payload = { selectedIds: Array.from(next) };
+            eventBus.emit(`UI:${selectionEvent}`, payload);
           }
           return next;
         });
@@ -17332,7 +17334,8 @@ var init_DataGrid = __esm({
           const allSelected2 = allIds2.length > 0 && allIds2.every((id) => prev.has(id));
           const next = allSelected2 ? /* @__PURE__ */ new Set() : new Set(allIds2);
           if (selectionEvent) {
-            eventBus.emit(`UI:${selectionEvent}`, { selectedIds: Array.from(next) });
+            const payload = { selectedIds: Array.from(next) };
+            eventBus.emit(`UI:${selectionEvent}`, payload);
           }
           return next;
         });
@@ -17344,7 +17347,11 @@ var init_DataGrid = __esm({
       const dangerActions = itemActions?.filter((a) => a.variant === "danger") ?? [];
       const handleActionClick = (action, itemData) => (e) => {
         e.stopPropagation();
-        eventBus.emit(`UI:${action.event}`, { id: itemData.id, row: itemData });
+        const payload = {
+          id: itemData.id,
+          row: itemData
+        };
+        eventBus.emit(`UI:${action.event}`, payload);
       };
       const gridTemplateColumns = cols ? void 0 : `repeat(auto-fit, minmax(min(${minCardWidth}px, 100%), 1fr))`;
       const colsClass = cols ? {
@@ -17672,7 +17679,11 @@ var init_DataList = __esm({
       );
       const handleActionClick = (action, itemData) => (e) => {
         e.stopPropagation();
-        eventBus.emit(`UI:${action.event}`, { id: itemData.id, row: itemData });
+        const payload = {
+          id: itemData.id,
+          row: itemData
+        };
+        eventBus.emit(`UI:${action.event}`, payload);
       };
       if (isLoading) {
         return /* @__PURE__ */ jsx(Box, { className: "text-center py-8", children: /* @__PURE__ */ jsx(Typography, { variant: "body", color: "secondary", children: t("loading.items") || "Loading..." }) });
@@ -26326,7 +26337,8 @@ var init_DetailPanel = __esm({
             return;
           }
           if (action.event) {
-            eventBus.emit(`UI:${action.event}`, { id: data2?.id, row: data2 });
+            const payload = data2 ? { id: data2.id, row: data2 } : {};
+            eventBus.emit(`UI:${action.event}`, payload);
           }
           if (action.onClick) {
             action.onClick();
@@ -27863,9 +27875,10 @@ var init_Form = __esm({
       };
       const handleSubmit = (e) => {
         e.preventDefault();
-        eventBus.emit(`UI:${submitEvent}`, { data: formData });
+        const payload = { data: formData };
+        eventBus.emit(`UI:${submitEvent}`, payload);
         if (onSubmit) {
-          eventBus.emit(`UI:${onSubmit}`, { data: formData });
+          eventBus.emit(`UI:${onSubmit}`, payload);
         }
       };
       const handleCancel = () => {
@@ -29233,6 +29246,31 @@ function normalizeFields2(fields) {
   if (!fields) return [];
   return fields.map((f3) => typeof f3 === "string" ? f3 : f3.key ?? f3.name ?? "");
 }
+function entityFieldsFromListItem(item) {
+  const {
+    icon: _icon,
+    metadata: _metadata,
+    onClick: _onClick,
+    avatar: _avatar,
+    _fields,
+    ...rest
+  } = item;
+  const result = {};
+  for (const [key, value] of Object.entries(rest)) {
+    if (typeof value === "function" || value !== null && typeof value === "object" && "$$typeof" in value) {
+      continue;
+    }
+    result[key] = value;
+  }
+  if (_fields && typeof _fields === "object") {
+    for (const [k, v] of Object.entries(_fields)) {
+      if (typeof v !== "function") {
+        result[k] = v;
+      }
+    }
+  }
+  return result;
+}
 function getStatusStyle(fieldName, value) {
   const val = String(value).toLowerCase();
   if (val.includes("complete") || val.includes("done"))
@@ -29436,18 +29474,17 @@ var init_List = __esm({
             label: action.label,
             event: action.event,
             onClick: () => {
+              const row = entityFieldsFromListItem(item);
               if (action.navigatesTo) {
                 const url = action.navigatesTo.replace(
                   /\{\{(\w+)\}\}/g,
-                  (_, key) => String(item[key] || item.id || "")
+                  (_, key) => String(row[key] ?? item.id ?? "")
                 );
-                eventBus.emit("UI:NAVIGATE", { url, row: item });
+                eventBus.emit("UI:NAVIGATE", { url, row });
                 return;
               }
               if (action.event) {
-                eventBus.emit(`UI:${action.event}`, {
-                  row: item
-                });
+                eventBus.emit(`UI:${action.event}`, { row });
               }
             }
           }));
@@ -29527,7 +29564,7 @@ var init_List = __esm({
         );
         const hasExplicitClick = !!(viewAction?.event || item.onClick);
         const rowAction = viewAction?.event ?? "VIEW";
-        const rowActionPayload = { row: item };
+        const rowActionPayload = { row: entityFieldsFromListItem(item) };
         const primaryField = effectiveFieldNames?.[0];
         const statusField = effectiveFieldNames?.find(
           (f3) => f3.toLowerCase().includes("status")
@@ -35682,16 +35719,19 @@ var init_Timeline = __esm({
               ] }),
               item.description && /* @__PURE__ */ jsx(Typography, { variant: "small", color: "secondary", children: item.description }),
               item.tags && item.tags.length > 0 && /* @__PURE__ */ jsx(HStack, { gap: "xs", wrap: true, children: item.tags.map((tag, tagIdx) => /* @__PURE__ */ jsx(Badge, { variant: "default", children: tag }, tagIdx)) }),
-              itemActions && itemActions.length > 0 && /* @__PURE__ */ jsx(HStack, { gap: "xs", className: "mt-1", children: itemActions.map((action, actionIdx) => /* @__PURE__ */ jsx(
-                Box,
-                {
-                  action: action.event,
-                  actionPayload: { row: item },
-                  className: "cursor-pointer hover:opacity-80 transition-opacity",
-                  children: /* @__PURE__ */ jsx(Badge, { variant: "default", children: action.label })
-                },
-                actionIdx
-              )) })
+              itemActions && itemActions.length > 0 && /* @__PURE__ */ jsx(HStack, { gap: "xs", className: "mt-1", children: itemActions.map((action, actionIdx) => {
+                const { icon: _icon, ...rowSafe } = item;
+                return /* @__PURE__ */ jsx(
+                  Box,
+                  {
+                    action: action.event,
+                    actionPayload: { row: rowSafe },
+                    className: "cursor-pointer hover:opacity-80 transition-opacity",
+                    children: /* @__PURE__ */ jsx(Badge, { variant: "default", children: action.label })
+                  },
+                  actionIdx
+                );
+              }) })
             ] })
           ] }, item.id);
         }) })

package/dist/components/molecules/Alert.d.ts

@@ -5,6 +5,7 @@
  * Uses theme-aware CSS variables for styling.
  */
 import React from "react";
+import type { EventKey } from "@almadar/core";
 export type AlertVariant = "info" | "success" | "warning" | "error";
 export interface AlertProps {
     /** Alert content (children or message) */
@@ -19,6 +20,6 @@ export interface AlertProps {
     actions?: React.ReactNode;
     className?: string;
     /** Declarative dismiss event — emits UI:{dismissEvent} via eventBus when alert is dismissed */
-    dismissEvent?: string;
+    dismissEvent?: EventKey;
 }
 export declare const Alert: React.FC<AlertProps>;

package/dist/components/molecules/CalendarGrid.d.ts

@@ -6,6 +6,7 @@
  * Composes DayCell and TimeSlotCell atoms into a 7-day grid.
  */
 import React from "react";
+import type { EventPayload } from "@almadar/core";
 export interface CalendarEvent {
     id: string;
     title: string;
@@ -31,7 +32,7 @@ export interface CalendarGridProps {
     /** Event emitted on long-press of a time slot: UI:{longPressEvent} with { date, time } */
     longPressEvent?: string;
     /** Additional payload for long-press events */
-    longPressPayload?: Record<string, unknown>;
+    longPressPayload?: EventPayload;
     /** Event emitted on swipe left (next week): UI:{swipeLeftEvent} */
     swipeLeftEvent?: string;
     /** Event emitted on swipe right (prev week): UI:{swipeRightEvent} */

package/dist/components/molecules/Card.d.ts

@@ -7,7 +7,7 @@
  * @generated by Orbital Compiler
  */
 import React from "react";
-import type { EventKey } from "@almadar/core";
+import type { EventKey, EventPayload } from "@almadar/core";
 export interface CardAction {
     label: string;
     onClick?: () => void;
@@ -45,7 +45,7 @@ export interface CardProps {
     /** Event emitted on long press: UI:{longPressEvent} */
     longPressEvent?: string;
     /** Additional payload for long-press events */
-    longPressPayload?: Record<string, unknown>;
+    longPressPayload?: EventPayload;
 }
 /**
  * Card component for displaying content in a contained box

package/dist/components/molecules/DataGrid.d.ts

@@ -61,11 +61,11 @@ export interface DataGridProps {
     /** Enable multi-select with checkboxes */
     selectable?: boolean;
     /** Selection change event name (emits UI:{selectionEvent} with { selectedIds: string[] }) */
-    selectionEvent?: string;
+    selectionEvent?: EventKey;
     /** Enable infinite scroll loading */
     infiniteScroll?: boolean;
     /** Event emitted when more items needed: UI:{loadMoreEvent} */
-    loadMoreEvent?: string;
+    loadMoreEvent?: EventKey;
     /** Whether more items are available for infinite scroll */
     hasMore?: boolean;
     /** Render prop for custom per-item content. When provided, `fields` and `itemActions` are ignored. */

package/dist/components/molecules/DataList.d.ts

@@ -63,9 +63,9 @@ export interface DataListProps {
     /** Enable drag-to-reorder with grip handles */
     reorderable?: boolean;
     /** Event emitted on reorder: UI:{reorderEvent} with { fromIndex, toIndex } */
-    reorderEvent?: string;
+    reorderEvent?: EventKey;
     /** Event emitted on left swipe: UI:{swipeLeftEvent} with { row } */
-    swipeLeftEvent?: string;
+    swipeLeftEvent?: EventKey;
     /** Actions revealed on left swipe */
     swipeLeftActions?: readonly {
         label: string;
@@ -73,7 +73,7 @@ export interface DataListProps {
         variant?: 'primary' | 'secondary' | 'danger' | 'ghost';
     }[];
     /** Event emitted on right swipe: UI:{swipeRightEvent} with { row } */
-    swipeRightEvent?: string;
+    swipeRightEvent?: EventKey;
     /** Actions revealed on right swipe */
     swipeRightActions?: readonly {
         label: string;
@@ -81,11 +81,11 @@ export interface DataListProps {
         variant?: 'primary' | 'secondary' | 'danger' | 'ghost';
     }[];
     /** Event emitted on long press: UI:{longPressEvent} with { row } */
-    longPressEvent?: string;
+    longPressEvent?: EventKey;
     /** Enable infinite scroll loading */
     infiniteScroll?: boolean;
     /** Event emitted when more items needed: UI:{loadMoreEvent} */
-    loadMoreEvent?: string;
+    loadMoreEvent?: EventKey;
     /** Whether more items are available for infinite scroll */
     hasMore?: boolean;
     /** Render prop for custom per-item content. When provided, `fields` and `itemActions` are ignored. */

package/dist/components/molecules/Drawer.d.ts

@@ -15,6 +15,7 @@
  * @packageDocumentation
  */
 import React from "react";
+import type { EventKey } from "@almadar/core";
 export type DrawerPosition = "left" | "right";
 export type DrawerSize = "sm" | "md" | "lg" | "xl" | "full";
 export interface DrawerProps {
@@ -41,6 +42,6 @@ export interface DrawerProps {
     /** Additional class name */
     className?: string;
     /** Declarative close event — emits UI:{closeEvent} via eventBus when drawer should close */
-    closeEvent?: string;
+    closeEvent?: EventKey;
 }
 export declare const Drawer: React.FC<DrawerProps>;

package/dist/components/molecules/NumberStepper.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { EventKey } from "@almadar/core";
+import type { EventKey, EventPayload } from "@almadar/core";
 export type NumberStepperSize = "sm" | "md" | "lg";
 export interface NumberStepperProps {
     /** Current value */
@@ -19,7 +19,7 @@ export interface NumberStepperProps {
     /** Declarative event name for value changes */
     action?: EventKey;
     /** Payload to include with the action event */
-    actionPayload?: Record<string, unknown>;
+    actionPayload?: EventPayload;
     /** Additional CSS classes */
     className?: string;
     /** Accessible label */

package/dist/components/molecules/PullToRefresh.d.ts

@@ -6,11 +6,12 @@
  * a refresh event via the event bus when the threshold is met.
  */
 import React from 'react';
+import type { EventKey, EventPayload } from "@almadar/core";
 export interface PullToRefreshProps {
     /** Event name to emit on refresh (emitted as UI:{refreshEvent}) */
-    refreshEvent: string;
+    refreshEvent: EventKey;
     /** Payload to include with the refresh event */
-    refreshPayload?: Record<string, unknown>;
+    refreshPayload?: EventPayload;
     /** Pull distance threshold to trigger refresh in px (default: 60) */
     threshold?: number;
     /** Content to wrap */

package/dist/components/molecules/SortableList.d.ts

@@ -6,12 +6,13 @@
  * Shows a drop indicator line at the target position during drag.
  */
 import React from 'react';
-export interface SortableListProps<T = Record<string, unknown>> {
+import type { EventKey, EventPayload, EventPayloadValue } from "@almadar/core";
+export interface SortableListProps<T extends EventPayloadValue = EventPayload> {
     items: T[];
     renderItem: (item: T, index: number) => React.ReactNode;
-    reorderEvent: string;
-    reorderPayload?: Record<string, unknown>;
+    reorderEvent: EventKey;
+    reorderPayload?: EventPayload;
     dragHandlePosition?: 'left' | 'right';
     className?: string;
 }
-export declare const SortableList: <T = Record<string, unknown>>(props: SortableListProps<T>) => React.ReactElement;
+export declare const SortableList: <T extends EventPayloadValue = EventPayload>(props: SortableListProps<T>) => React.ReactElement;

package/dist/components/molecules/StarRating.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { EventKey } from "@almadar/core";
+import type { EventKey, EventPayload } from "@almadar/core";
 export type StarRatingSize = "sm" | "md" | "lg";
 export type StarRatingPrecision = "full" | "half";
 export interface StarRatingProps {
@@ -16,7 +16,7 @@ export interface StarRatingProps {
     /** Declarative event name for rating changes */
     action?: EventKey;
     /** Payload to include with the action event */
-    actionPayload?: Record<string, unknown>;
+    actionPayload?: EventPayload;
     /** Direct onChange callback */
     onChange?: (value: number) => void;
     /** Additional CSS classes */

package/dist/components/molecules/SwipeableRow.d.ts

@@ -6,20 +6,20 @@
  * Uses useSwipeGesture for gesture detection and useEventBus for event emission.
  */
 import React from 'react';
-import type { EventKey } from "@almadar/core";
+import type { EventKey, EventPayload } from "@almadar/core";
 export interface SwipeAction {
     label: string;
     icon?: string;
     variant?: 'primary' | 'secondary' | 'danger' | 'ghost';
     event: EventKey;
-    eventPayload?: Record<string, unknown>;
+    eventPayload?: EventPayload;
 }
 export interface SwipeableRowProps {
     leftActions?: SwipeAction[];
     rightActions?: SwipeAction[];
     threshold?: number;
     children: React.ReactNode;
-    itemData?: Record<string, unknown>;
+    itemData?: EventPayload;
     className?: string;
 }
 export declare const SwipeableRow: React.FC<SwipeableRowProps>;

package/dist/components/molecules/UploadDropZone.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import type { EventKey } from "@almadar/core";
+import type { EventKey, EventPayload } from "@almadar/core";
 export interface UploadDropZoneProps {
     /** Accepted MIME types (e.g., "image/*", "application/pdf") */
     accept?: string;
@@ -18,7 +18,7 @@ export interface UploadDropZoneProps {
     /** Declarative event name for file selection */
     action?: EventKey;
     /** Payload to include with the action event */
-    actionPayload?: Record<string, unknown>;
+    actionPayload?: EventPayload;
     /** Direct onFiles callback */
     onFiles?: (files: File[]) => void;
     /** Additional CSS classes */

package/dist/components/molecules/game/DialogueBox.d.ts

@@ -12,12 +12,13 @@
  * concern analogous to Form's `formData`.
  */
 import React from 'react';
-export interface DialogueChoice {
+import type { EventPayload } from '@almadar/core';
+export type DialogueChoice = EventPayload & {
     text: string;
     action?: string;
     next?: string;
     disabled?: boolean;
-}
+};
 export interface DialogueNode {
     id?: string;
     speaker: string;

package/dist/components/molecules/game/GameMenu.d.ts

@@ -1,6 +1,6 @@
-import type { EventKey } from "@almadar/core";
+import type { EventKey, EventPayload } from "@almadar/core";
 import { type EventBusContextType } from "../../../hooks/useEventBus";
-export interface MenuOption {
+export type MenuOption = EventPayload & {
     /** Optional ID (generated from index if not provided) */
     id?: string;
     /** Display label */
@@ -17,7 +17,7 @@ export interface MenuOption {
     subLabel?: string;
     /** Action identifier (alternative to event) */
     action?: EventKey;
-}
+};
 export interface GameMenuProps {
     /** Menu title */
     title: string;

package/dist/components/molecules/game/GameOverScreen.d.ts

@@ -1,4 +1,5 @@
 import * as React from "react";
+import type { EventPayload } from "@almadar/core";
 import { type EventBusContextType } from "../../../hooks/useEventBus";
 export interface GameOverStat {
     /** Stat label */
@@ -16,7 +17,7 @@ export interface GameOverStat {
     /** Icon */
     icon?: React.ReactNode;
 }
-export interface GameOverAction {
+export type GameOverAction = EventPayload & {
     /** Display label */
     label: string;
     /** Event to emit on click */
@@ -25,7 +26,7 @@ export interface GameOverAction {
     navigatesTo?: string;
     /** Button variant */
     variant?: "primary" | "secondary" | "ghost";
-}
+};
 export interface GameOverScreenProps {
     /** Screen title (e.g., "Game Over", "Victory!") */
     title: string;