@almadar/ui 4.20.0 → 4.22.0

package/dist/avl/index.cjs

@@ -20318,6 +20318,7 @@ var init_Tabs = __esm({
       defaultActiveTab,
       activeTab: controlledActiveTab,
       onTabChange,
+      tabChangeEvent,
       variant = "default",
       orientation = "horizontal",
       className
@@ -20340,6 +20341,9 @@ var init_Tabs = __esm({
           setInternalActiveTab(tabId);
         }
         onTabChange?.(tabId);
+        if (tabChangeEvent) {
+          eventBus.emit(`UI:${tabChangeEvent}`, { tabId });
+        }
         if (tabEvent) {
           eventBus.emit(`UI:${tabEvent}`, { tabId });
         }
@@ -20420,7 +20424,7 @@ var init_Tabs = __esm({
                     isActive ? variant === "pills" ? "text-primary-foreground font-bold" : "text-foreground font-bold" : "text-muted-foreground hover:text-foreground"
                   ),
                   children: [
-                    item.icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: item.icon, size: "sm" }),
+                    item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: item.icon, size: "sm" }) : /* @__PURE__ */ jsxRuntime.jsx(Icon, { icon: item.icon, size: "sm" })),
                     /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", weight: isActive ? "semibold" : "normal", className: "!text-inherit", children: item.label }),
                     item.badge !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "default", size: "sm", children: item.badge })
                   ]

package/dist/avl/index.js

@@ -20272,6 +20272,7 @@ var init_Tabs = __esm({
       defaultActiveTab,
       activeTab: controlledActiveTab,
       onTabChange,
+      tabChangeEvent,
       variant = "default",
       orientation = "horizontal",
       className
@@ -20294,6 +20295,9 @@ var init_Tabs = __esm({
           setInternalActiveTab(tabId);
         }
         onTabChange?.(tabId);
+        if (tabChangeEvent) {
+          eventBus.emit(`UI:${tabChangeEvent}`, { tabId });
+        }
         if (tabEvent) {
           eventBus.emit(`UI:${tabEvent}`, { tabId });
         }
@@ -20374,7 +20378,7 @@ var init_Tabs = __esm({
                     isActive ? variant === "pills" ? "text-primary-foreground font-bold" : "text-foreground font-bold" : "text-muted-foreground hover:text-foreground"
                   ),
                   children: [
-                    item.icon && /* @__PURE__ */ jsx(Icon, { icon: item.icon, size: "sm" }),
+                    item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, size: "sm" }) : /* @__PURE__ */ jsx(Icon, { icon: item.icon, size: "sm" })),
                     /* @__PURE__ */ jsx(Typography, { variant: "small", weight: isActive ? "semibold" : "normal", className: "!text-inherit", children: item.label }),
                     item.badge !== void 0 && /* @__PURE__ */ jsx(Badge, { variant: "default", size: "sm", children: item.badge })
                   ]

package/dist/components/index.cjs

@@ -15561,6 +15561,7 @@ var init_Tabs = __esm({
       defaultActiveTab,
       activeTab: controlledActiveTab,
       onTabChange,
+      tabChangeEvent,
       variant = "default",
       orientation = "horizontal",
       className
@@ -15583,6 +15584,9 @@ var init_Tabs = __esm({
           setInternalActiveTab(tabId);
         }
         onTabChange?.(tabId);
+        if (tabChangeEvent) {
+          eventBus.emit(`UI:${tabChangeEvent}`, { tabId });
+        }
         if (tabEvent) {
           eventBus.emit(`UI:${tabEvent}`, { tabId });
         }
@@ -15663,7 +15667,7 @@ var init_Tabs = __esm({
                     isActive ? variant === "pills" ? "text-primary-foreground font-bold" : "text-foreground font-bold" : "text-muted-foreground hover:text-foreground"
                   ),
                   children: [
-                    item.icon && /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { icon: item.icon, size: "sm" }),
+                    item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { name: item.icon, size: "sm" }) : /* @__PURE__ */ jsxRuntime.jsx(exports.Icon, { icon: item.icon, size: "sm" })),
                     /* @__PURE__ */ jsxRuntime.jsx(exports.Typography, { variant: "small", weight: isActive ? "semibold" : "normal", className: "!text-inherit", children: item.label }),
                     item.badge !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(exports.Badge, { variant: "default", size: "sm", children: item.badge })
                   ]

package/dist/components/index.js

@@ -15516,6 +15516,7 @@ var init_Tabs = __esm({
       defaultActiveTab,
       activeTab: controlledActiveTab,
       onTabChange,
+      tabChangeEvent,
       variant = "default",
       orientation = "horizontal",
       className
@@ -15538,6 +15539,9 @@ var init_Tabs = __esm({
           setInternalActiveTab(tabId);
         }
         onTabChange?.(tabId);
+        if (tabChangeEvent) {
+          eventBus.emit(`UI:${tabChangeEvent}`, { tabId });
+        }
         if (tabEvent) {
           eventBus.emit(`UI:${tabEvent}`, { tabId });
         }
@@ -15618,7 +15622,7 @@ var init_Tabs = __esm({
                     isActive ? variant === "pills" ? "text-primary-foreground font-bold" : "text-foreground font-bold" : "text-muted-foreground hover:text-foreground"
                   ),
                   children: [
-                    item.icon && /* @__PURE__ */ jsx(Icon, { icon: item.icon, size: "sm" }),
+                    item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, size: "sm" }) : /* @__PURE__ */ jsx(Icon, { icon: item.icon, size: "sm" })),
                     /* @__PURE__ */ jsx(Typography, { variant: "small", weight: isActive ? "semibold" : "normal", className: "!text-inherit", children: item.label }),
                     item.badge !== void 0 && /* @__PURE__ */ jsx(Badge, { variant: "default", size: "sm", children: item.badge })
                   ]

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

@@ -5,6 +5,7 @@
  * Uses Button, Icon, Typography, and Divider atoms.
  */
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 export interface AccordionItem {
     /**
      * Item ID (auto-generated from header/title if not provided)
@@ -62,6 +63,9 @@ export interface AccordionProps {
      */
     className?: string;
     /** Declarative toggle event — emits UI:{toggleEvent} with { itemId, isOpen } */
-    toggleEvent?: string;
+    toggleEvent?: EventEmit<{
+        itemId: string;
+        isOpen: boolean;
+    }>;
 }
 export declare const Accordion: React.FC<AccordionProps>;

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

@@ -6,7 +6,7 @@
  * Composes DayCell and TimeSlotCell atoms into a 7-day grid.
  */
 import React from "react";
-import type { EventPayload } from "@almadar/core";
+import type { EventEmit, EventPayload } from "@almadar/core";
 export interface CalendarEvent {
     id: string;
     title: string;
@@ -29,14 +29,17 @@ export interface CalendarGridProps {
     onEventClick?: (event: CalendarEvent) => void;
     /** Additional CSS classes */
     className?: string;
-    /** Event emitted on long-press of a time slot: UI:{longPressEvent} with { date, time } */
-    longPressEvent?: string;
+    /** Event emitted on long-press of a time slot: UI:{longPressEvent} with { date, time, ...longPressPayload } */
+    longPressEvent?: EventEmit<{
+        date: string;
+        time?: string;
+    }>;
     /** Additional payload for long-press events */
     longPressPayload?: EventPayload;
     /** Event emitted on swipe left (next week): UI:{swipeLeftEvent} */
-    swipeLeftEvent?: string;
+    swipeLeftEvent?: EventEmit<Record<string, never>>;
     /** Event emitted on swipe right (prev week): UI:{swipeRightEvent} */
-    swipeRightEvent?: string;
+    swipeRightEvent?: EventEmit<Record<string, never>>;
 }
 export declare function CalendarGrid({ weekStart, timeSlots, events, onSlotClick, onDayClick, onEventClick, className, longPressEvent, longPressPayload, swipeLeftEvent, swipeRightEvent, }: CalendarGridProps): React.JSX.Element;
 export declare namespace CalendarGrid {

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

@@ -7,7 +7,7 @@
  * @generated by Orbital Compiler
  */
 import React from "react";
-import type { EventKey, EventPayload } from "@almadar/core";
+import type { EventEmit, EventKey, EventPayload } from "@almadar/core";
 export interface CardAction {
     label: string;
     onClick?: () => void;
@@ -42,8 +42,8 @@ export interface CardProps {
     level?: number;
     /** Maximum level */
     maxLevel?: number;
-    /** Event emitted on long press: UI:{longPressEvent} */
-    longPressEvent?: string;
+    /** Event emitted on long press: UI:{longPressEvent} (payload: longPressPayload spread — variable) */
+    longPressEvent?: EventEmit<EventPayload>;
     /** Additional payload for long-press events */
     longPressPayload?: EventPayload;
 }

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

@@ -6,6 +6,7 @@
  * Pure UI molecule with no entity binding.
  */
 import React from 'react';
+import type { EventEmit } from '@almadar/core';
 export interface CarouselProps<T = Record<string, unknown>> {
     /** Array of items to display as slides */
     items: T[];
@@ -24,7 +25,9 @@ export interface CarouselProps<T = Record<string, unknown>> {
     /** Enable infinite loop */
     loop?: boolean;
     /** Declarative event name for slide change */
-    slideChangeEvent?: string;
+    slideChangeEvent?: EventEmit<{
+        index: number;
+    }>;
     /** Payload to include with the slide change event */
     slideChangePayload?: Record<string, unknown>;
     /** Additional CSS classes */

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

@@ -1,4 +1,5 @@
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 import { LucideIcon } from "lucide-react";
 export interface EmptyStateProps {
     /**
@@ -20,6 +21,6 @@ export interface EmptyStateProps {
     /** Variant for color styling */
     variant?: "default" | "success" | "error" | "warning" | "info";
     /** Declarative action event — emits UI:{actionEvent} via eventBus when action button is clicked */
-    actionEvent?: string;
+    actionEvent?: EventEmit<Record<string, never>>;
 }
 export declare const EmptyState: React.FC<EmptyStateProps>;

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

@@ -1,4 +1,5 @@
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 export interface ErrorStateProps {
     title?: string;
     /** Error message to display */
@@ -8,6 +9,6 @@ export interface ErrorStateProps {
     onRetry?: () => void;
     className?: string;
     /** Declarative retry event — emits UI:{retryEvent} via eventBus when retry button is clicked */
-    retryEvent?: string;
+    retryEvent?: EventEmit<Record<string, never>>;
 }
 export declare const ErrorState: React.FC<ErrorStateProps>;

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

@@ -1,3 +1,4 @@
+import type { EventEmit } from '@almadar/core';
 export interface MapMarkerData {
     /** Unique marker identifier */
     id: string | number;
@@ -26,9 +27,12 @@ export interface MapViewProps {
     /** Callback when the map is clicked (programmatic use) */
     onMapClick?: (lat: number, lng: number) => void;
     /** Event name dispatched via event bus when the map is clicked. Payload: { latitude, longitude } */
-    mapClickEvent?: string;
-    /** Event name dispatched via event bus when a marker is clicked. Payload: marker data */
-    markerClickEvent?: string;
+    mapClickEvent?: EventEmit<{
+        latitude: number;
+        longitude: number;
+    }>;
+    /** Event name dispatched via event bus when a marker is clicked. Payload: full MapMarkerData spread. */
+    markerClickEvent?: EventEmit<MapMarkerData>;
     /** Whether to show a pin at the clicked location */
     showClickedPin?: boolean;
     /** Additional CSS classes */

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

@@ -5,6 +5,7 @@
  * Uses theme-aware CSS variables for styling.
  */
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 export type ModalSize = "sm" | "md" | "lg" | "xl" | "full";
 export interface ModalProps {
     /** Whether the modal is open (defaults to true when rendered by slot wrapper) */
@@ -21,7 +22,7 @@ export interface ModalProps {
     closeOnEscape?: boolean;
     className?: string;
     /** Declarative close event — emits UI:{closeEvent} via eventBus when modal should close */
-    closeEvent?: string;
+    closeEvent?: EventEmit<Record<string, never>>;
     /** Enable swipe-down-to-close on mobile bottom sheet (default: true) */
     swipeDownToClose?: boolean;
 }

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

@@ -5,6 +5,7 @@
  * Uses Button, Icon, Typography, and Input atoms.
  */
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 export interface PaginationProps {
     /**
      * Current page (1-indexed)
@@ -59,8 +60,12 @@ export interface PaginationProps {
      */
     className?: string;
     /** Declarative page change event — emits UI:{pageChangeEvent} with { page } */
-    pageChangeEvent?: string;
+    pageChangeEvent?: EventEmit<{
+        page: number;
+    }>;
     /** Declarative page size change event — emits UI:{pageSizeChangeEvent} with { pageSize } */
-    pageSizeChangeEvent?: string;
+    pageSizeChangeEvent?: EventEmit<{
+        pageSize: number;
+    }>;
 }
 export declare const Pagination: React.FC<PaginationProps>;

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

@@ -5,6 +5,7 @@
  * Uses Button, Typography atoms.
  */
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 export interface SidePanelProps {
     /**
      * Panel title
@@ -42,6 +43,6 @@ export interface SidePanelProps {
      */
     className?: string;
     /** Declarative close event — emits UI:{closeEvent} via eventBus when panel should close */
-    closeEvent?: string;
+    closeEvent?: EventEmit<Record<string, never>>;
 }
 export declare const SidePanel: React.FC<SidePanelProps>;

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

@@ -6,6 +6,7 @@
  */
 import React from 'react';
 import type { LucideIcon } from 'lucide-react';
+import type { EventEmit } from '@almadar/core';
 export interface TabItem {
     /** Tab ID */
     id: string;
@@ -13,8 +14,8 @@ export interface TabItem {
     label: string;
     /** Tab content - optional for event-driven tabs */
     content?: React.ReactNode;
-    /** Tab icon */
-    icon?: LucideIcon;
+    /** Tab icon — pass either a Lucide component or its registry name (e.g. "file-text") */
+    icon?: LucideIcon | string;
     /** Tab badge */
     badge?: string | number;
     /** Disable tab */
@@ -35,6 +36,10 @@ export interface TabsProps {
     activeTab?: string;
     /** Callback when tab changes */
     onTabChange?: (tabId: string) => void;
+    /** Declarative tab change event — emits UI:{tabChangeEvent} with { tabId } */
+    tabChangeEvent?: EventEmit<{
+        tabId: string;
+    }>;
     /** Tab variant */
     variant?: 'default' | 'pills' | 'underline';
     /** Tab orientation */

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

@@ -5,6 +5,7 @@
  * Uses theme-aware CSS variables for styling.
  */
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 export type ToastVariant = "success" | "error" | "info" | "warning";
 export interface ToastProps {
     /** Toast variant */
@@ -28,8 +29,8 @@ export interface ToastProps {
     /** Additional CSS classes */
     className?: string;
     /** Declarative dismiss event — emits UI:{dismissEvent} via eventBus when toast is dismissed */
-    dismissEvent?: string;
+    dismissEvent?: EventEmit<Record<string, never>>;
     /** Declarative action event — emits UI:{actionEvent} via eventBus when action button is clicked */
-    actionEvent?: string;
+    actionEvent?: EventEmit<Record<string, never>>;
 }
 export declare const Toast: React.FC<ToastProps>;

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

@@ -7,6 +7,7 @@
  * Uses wireframe theme styling (high contrast, sharp edges).
  */
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 /**
  * Step info needed by WizardProgress.
  * Compatible with WizardContainer's WizardStep (subset of fields).
@@ -33,7 +34,9 @@ export interface WizardProgressProps {
     /** Additional CSS classes */
     className?: string;
     /** Declarative step click event — emits UI:{stepClickEvent} with { stepIndex } */
-    stepClickEvent?: string;
+    stepClickEvent?: EventEmit<{
+        stepIndex: number;
+    }>;
 }
 /**
  * WizardProgress - Step progress indicator

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

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { EventEmit } from '@almadar/core';
 export interface ActionButtonConfig {
     /** Unique identifier */
     id: string;
@@ -18,7 +19,10 @@ export interface ActionButtonsProps {
     /** Called when a button is pressed/released */
     onAction?: (id: string, pressed: boolean) => void;
     /** Declarative event name emitted on action via useEventBus */
-    actionEvent?: string;
+    actionEvent?: EventEmit<{
+        id: string;
+        pressed: boolean;
+    }>;
     /** Layout variant */
     layout?: 'horizontal' | 'vertical' | 'diamond';
     /** Size variant */

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

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { EventEmit } from '@almadar/core';
 export interface CraftingIngredient {
     /** Icon component or emoji */
     icon?: React.ReactNode;
@@ -23,7 +24,9 @@ export interface CraftingRecipeProps {
     /** Callback when the craft button is clicked */
     onCraft?: () => void;
     /** Event bus event name for crafting */
-    craftEvent?: string;
+    craftEvent?: EventEmit<{
+        output: string;
+    }>;
     /** Additional CSS classes */
     className?: string;
 }

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

@@ -1,3 +1,4 @@
+import type { EventEmit } from '@almadar/core';
 export type DPadDirection = 'up' | 'down' | 'left' | 'right';
 /** Event Contract:
  *  Emits: UI:DIRECTION
@@ -6,7 +7,10 @@ export interface DPadProps {
     /** Called when a direction is pressed/released */
     onDirection?: (direction: DPadDirection, pressed: boolean) => void;
     /** Declarative event name emitted on direction press/release via useEventBus */
-    directionEvent?: string;
+    directionEvent?: EventEmit<{
+        direction: DPadDirection;
+        pressed: boolean;
+    }>;
     /** Size variant */
     size?: 'sm' | 'md' | 'lg';
     /** Whether to include diagonal buttons */

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

@@ -12,7 +12,7 @@
  * concern analogous to Form's `formData`.
  */
 import React from 'react';
-import type { EventPayload } from '@almadar/core';
+import type { EventEmit, EventPayload } from '@almadar/core';
 export type DialogueChoice = EventPayload & {
     text: string;
     action?: string;
@@ -46,11 +46,13 @@ export interface DialogueBoxProps {
     /** Called when dialogue is advanced (no choices) */
     onAdvance?: () => void;
     /** Declarative event: emits UI:{completeEvent} when text animation completes */
-    completeEvent?: string;
-    /** Declarative event: emits UI:{choiceEvent} with { choice } when a choice is selected */
-    choiceEvent?: string;
+    completeEvent?: EventEmit<Record<string, never>>;
+    /** Declarative event: emits UI:{choiceEvent} with { choice: DialogueChoice } when a choice is selected */
+    choiceEvent?: EventEmit<{
+        choice: DialogueChoice;
+    }>;
     /** Declarative event: emits UI:{advanceEvent} when dialogue is advanced */
-    advanceEvent?: string;
+    advanceEvent?: EventEmit<Record<string, never>>;
     /** Optional className */
     className?: string;
 }

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

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { EventEmit } from '@almadar/core';
 export interface InventoryGridItem {
     id: string;
     icon?: React.ReactNode;
@@ -18,7 +19,9 @@ export interface InventoryGridProps {
     /** Callback when an item is selected */
     onSelect?: (id: string) => void;
     /** Event bus event name for selection */
-    selectEvent?: string;
+    selectEvent?: EventEmit<{
+        id: string;
+    }>;
     /** Size variant for all item slots */
     size?: 'sm' | 'md' | 'lg';
     /** Additional CSS classes */

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

@@ -11,7 +11,7 @@
  * Local state is hover/tooltip only — rendering-only concerns.
  */
 import React from 'react';
-import type { EventPayload } from "@almadar/core";
+import type { EventEmit, EventPayload } from "@almadar/core";
 export type InventoryItem = EventPayload & {
     id: string;
     type: string;
@@ -36,11 +36,17 @@ export interface InventoryPanelProps {
     /** Called when an item is dropped */
     onDropItem?: (item: InventoryItem) => void;
     /** Declarative event: emits UI:{selectSlotEvent} with { index } when a slot is selected */
-    selectSlotEvent?: string;
-    /** Declarative event: emits UI:{useItemEvent} with { item } when an item is used */
-    useItemEvent?: string;
-    /** Declarative event: emits UI:{dropItemEvent} with { item } when an item is dropped */
-    dropItemEvent?: string;
+    selectSlotEvent?: EventEmit<{
+        index: number;
+    }>;
+    /** Declarative event: emits UI:{useItemEvent} with { item: InventoryItem } when an item is used */
+    useItemEvent?: EventEmit<{
+        item: InventoryItem;
+    }>;
+    /** Declarative event: emits UI:{dropItemEvent} with { item: InventoryItem } when an item is dropped */
+    dropItemEvent?: EventEmit<{
+        item: InventoryItem;
+    }>;
     /** Show item tooltips on hover */
     showTooltips?: boolean;
     /** Optional className */

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

@@ -24,6 +24,7 @@
  * @packageDocumentation
  */
 import * as React from 'react';
+import type { EventEmit } from '@almadar/core';
 import type { IsometricTile, IsometricUnit, IsometricFeature } from '../../organisms/game/types/isometric';
 import type { ResolvedFrame } from '../../organisms/game/types/spriteAnimation';
 /** Event Contract:
@@ -67,13 +68,21 @@ export interface IsometricCanvasProps {
     onTileHover?: (x: number, y: number) => void;
     onTileLeave?: () => void;
     /** Declarative event: emits UI:{tileClickEvent} with { x, y } on tile click */
-    tileClickEvent?: string;
+    tileClickEvent?: EventEmit<{
+        x: number;
+        y: number;
+    }>;
     /** Declarative event: emits UI:{unitClickEvent} with { unitId } on unit click */
-    unitClickEvent?: string;
+    unitClickEvent?: EventEmit<{
+        unitId: string;
+    }>;
     /** Declarative event: emits UI:{tileHoverEvent} with { x, y } on tile hover */
-    tileHoverEvent?: string;
+    tileHoverEvent?: EventEmit<{
+        x: number;
+        y: number;
+    }>;
     /** Declarative event: emits UI:{tileLeaveEvent} with {} on tile leave */
-    tileLeaveEvent?: string;
+    tileLeaveEvent?: EventEmit<Record<string, never>>;
     /** Render scale (0.4 = 40% zoom) */
     scale?: number;
     /** Show debug grid lines and coordinates */

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

@@ -1,3 +1,4 @@
+import type { EventEmit } from '@almadar/core';
 export interface PlatformerPlatform {
     x: number;
     y: number;
@@ -39,10 +40,14 @@ export interface PlatformerCanvasProps {
     /** Base URL prefix for asset URLs */
     assetBaseUrl?: string;
     /** Event names for keyboard controls */
-    leftEvent?: string;
-    rightEvent?: string;
-    jumpEvent?: string;
-    stopEvent?: string;
+    leftEvent?: EventEmit<{
+        direction: number;
+    }>;
+    rightEvent?: EventEmit<{
+        direction: number;
+    }>;
+    jumpEvent?: EventEmit<Record<string, never>>;
+    stopEvent?: EventEmit<Record<string, never>>;
     /** Additional CSS classes */
     className?: string;
 }

package/dist/components/organisms/GraphCanvas.d.ts

@@ -11,7 +11,7 @@
  * - className for external styling
  */
 import React from "react";
-import type { EventPayload } from "@almadar/core";
+import type { EventEmit, EventPayload } from "@almadar/core";
 export type GraphNode = EventPayload & {
     id: string;
     label?: string;
@@ -55,7 +55,9 @@ export interface GraphCanvasProps {
     /** On node click */
     onNodeClick?: (node: GraphNode) => void;
     /** Node click event */
-    nodeClickEvent?: string;
+    nodeClickEvent?: EventEmit<{
+        id: string;
+    }>;
     /** Layout algorithm */
     layout?: "force" | "circular" | "grid";
     /** Entity name for schema-driven auto-fetch */

package/dist/components/organisms/MediaGallery.d.ts

@@ -11,6 +11,7 @@
  * - className for external styling
  */
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 import type { EntityDisplayProps } from "./types";
 import type { EntityRow } from "@almadar/core";
 export type MediaItem = EntityRow & {
@@ -47,7 +48,9 @@ export interface MediaGalleryProps extends EntityDisplayProps<MediaItem> {
     /** Selected item IDs */
     selectedItems?: readonly string[];
     /** Event name emitted when selection changes (emitted as UI:{selectionEvent}) */
-    selectionEvent?: string;
+    selectionEvent?: EventEmit<{
+        selection: string[];
+    }>;
     /** Show upload button */
     showUpload?: boolean;
     /** Actions */

package/dist/components/organisms/PageHeader.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import type { EventEmit } from "@almadar/core";
 import { LucideIcon } from "lucide-react";
 export interface PageBreadcrumb {
     label: string;
@@ -28,7 +29,7 @@ export interface PageHeaderProps {
     /** Show back button */
     showBack?: boolean;
     /** Event to emit when back is clicked (default: BACK) */
-    backEvent?: string;
+    backEvent?: EventEmit<Record<string, never>>;
     /** Breadcrumbs */
     breadcrumbs?: readonly PageBreadcrumb[];
     /** Status badge */