@almadar/ui 5.121.3 → 5.121.4

package/dist/components/index.js

@@ -3,7 +3,7 @@ import * as React73 from 'react';
 import React73__default, { createContext, useContext, useMemo, useRef, useEffect, useCallback, useState, Suspense, lazy, useSyncExternalStore, useLayoutEffect, useId } from 'react';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
-import { EventBusContext, useTraitScope, useCurrentPagePath, useGameAudioContextOptional, useEntitySchemaOptional, TraitScopeProvider } from '@almadar/ui/providers';
+import { EventBusContext, useTraitScopeChain, useCurrentPagePath, useGameAudioContextOptional, useEntitySchemaOptional, TraitScopeProvider } from '@almadar/ui/providers';
 export { GameAudioContext, GameAudioProvider, useGameAudioContext } from '@almadar/ui/providers';
 import { createLogger, isLogLevelEnabled } from '@almadar/logger';
 import * as LucideIcons2 from 'lucide-react';
@@ -1043,9 +1043,9 @@ function getGlobalEventBus() {
 function useEventBus() {
   const context = useContext(EventBusContext);
   const baseBus = context ?? getGlobalEventBus() ?? fallbackEventBus;
-  const scope = useTraitScope();
+  const chain = useTraitScopeChain();
   return useMemo(() => {
-    if (!scope) {
+    if (chain.length === 0) {
       return {
         ...baseBus,
         emit: (type, payload, source) => {
@@ -1061,22 +1061,31 @@ function useEventBus() {
       emit: (type, payload, source) => {
         if (typeof type === "string" && type.startsWith("UI:")) {
           const tail = type.slice(3);
-          const qualified = tail.includes(".") ? type : `UI:${scope.orbital}.${scope.trait}.${tail}`;
-          if (qualified !== type) {
-            scopeLog.info("emit:qualified", {
+          const isQualified = tail.includes(".");
+          const event = isQualified ? tail.split(".").slice(2).join(".") : tail;
+          if (!event) {
+            baseBus.emit(type, payload, source);
+            return;
+          }
+          const keys = /* @__PURE__ */ new Set();
+          if (isQualified) keys.add(type);
+          for (const sc of chain) {
+            keys.add(`UI:${sc.orbital}.${sc.trait}.${event}`);
+          }
+          if (keys.size > 1) {
+            scopeLog.info("emit:fan-out", {
               from: type,
-              to: qualified,
-              scopeOrbital: scope.orbital,
-              scopeTrait: scope.trait
+              keys: Array.from(keys),
+              chainDepth: chain.length
             });
           }
-          baseBus.emit(qualified, payload, source);
+          for (const key of keys) baseBus.emit(key, payload, source);
           return;
         }
         baseBus.emit(type, payload, source);
       }
     };
-  }, [baseBus, scope]);
+  }, [baseBus, chain]);
 }
 function useEventListener(event, handler) {
   const eventBus = useEventBus();
@@ -1353,13 +1362,13 @@ var init_Icon = __esm({
       style
     }) => {
       const directIcon = typeof icon === "string" ? void 0 : icon;
-      const effectiveName = typeof icon === "string" ? icon : name;
+      const effectiveName = typeof icon === "string" && icon !== "" ? icon : name;
+      const effectiveStrokeWidth = strokeWidth != null && strokeWidth > 0 ? strokeWidth : void 0;
       const family = useIconFamily();
       const RenderedComponent = React73__default.useMemo(() => {
         if (directIcon) return null;
         return effectiveName ? resolveIconForFamily(effectiveName) : null;
       }, [directIcon, effectiveName, family]);
-      const effectiveStrokeWidth = strokeWidth ?? void 0;
       const inlineStyle = {
         ...effectiveStrokeWidth === void 0 ? { strokeWidth: "var(--icon-stroke-width, 2)" } : {},
         ...style
@@ -1836,7 +1845,7 @@ var init_Input = __esm({
             eventBus.emit(`UI:${action}`, { value: e.currentTarget.value });
           }
         };
-        const wrapField = (field) => /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+        const wrapField = (field, fullWidth = true) => /* @__PURE__ */ jsxs("div", { className: fullWidth ? "w-full" : "w-fit", children: [
           label && /* @__PURE__ */ jsx("label", { className: "block text-sm font-medium text-foreground mb-1", children: label }),
           field,
           (helperText || error) && /* @__PURE__ */ jsx("p", { className: cn("mt-1 text-xs", error ? "text-error" : "text-muted-foreground"), children: error ?? helperText })
@@ -1896,7 +1905,8 @@ var init_Input = __esm({
                 ),
                 ...props
               }
-            )
+            ),
+            false
           );
         }
         return wrapField(
@@ -4065,6 +4075,7 @@ var init_Overlay = __esm({
           className: cn(
             "fixed inset-0 z-40",
             blur && "backdrop-blur-sm",
+            "animate-overlay-in",
             className
           ),
           style: { backgroundColor: "rgba(0, 0, 0, 0.6)" },
@@ -4756,6 +4767,18 @@ var init_RangeSlider = __esm({
 function easeOut(t) {
   return t * (2 - t);
 }
+function formatDisplay(value, format, decimals) {
+  switch (format) {
+    case "currency":
+      return `$${value.toFixed(2)}`;
+    case "percent":
+      return `${Math.round(value)}%`;
+    case "number":
+      return value.toLocaleString();
+    default:
+      return value.toFixed(decimals);
+  }
+}
 var AnimatedCounter;
 var init_AnimatedCounter = __esm({
   "components/marketing/atoms/AnimatedCounter.tsx"() {
@@ -4767,6 +4790,7 @@ var init_AnimatedCounter = __esm({
       duration = 600,
       prefix,
       suffix,
+      format,
       className
     }) => {
       const numericRaw = typeof rawValue === "number" ? rawValue : Number.parseFloat(String(rawValue ?? ""));
@@ -4782,6 +4806,10 @@ var init_AnimatedCounter = __esm({
           setDisplayValue(to);
           return;
         }
+        if (window.matchMedia?.("(prefers-reduced-motion: reduce)").matches) {
+          setDisplayValue(to);
+          return;
+        }
         const startTime = performance.now();
         const diff = to - from;
         function animate(currentTime) {
@@ -4803,7 +4831,7 @@ var init_AnimatedCounter = __esm({
         };
       }, [value, duration]);
       const decimalPlaces = Number.isInteger(value) ? 0 : String(value).split(".")[1]?.length ?? 0;
-      const formattedValue = displayValue.toFixed(decimalPlaces);
+      const formattedValue = formatDisplay(displayValue, format, decimalPlaces);
       return /* @__PURE__ */ jsxs(Typography, { variant: "h3", className: cn("tabular-nums", className), children: [
         prefix,
         formattedValue,
@@ -6016,6 +6044,15 @@ var init_Modal = __esm({
       const [dragY, setDragY] = useState(0);
       const dragStartY = useRef(0);
       const isDragging = useRef(false);
+      const [closing, setClosing] = useState(false);
+      const wasOpenRef = useRef(isOpen);
+      useEffect(() => {
+        if (wasOpenRef.current && !isOpen) setClosing(true);
+        wasOpenRef.current = isOpen;
+      }, [isOpen]);
+      const handleAnimEnd = (e) => {
+        if (closing && e.target === e.currentTarget) setClosing(false);
+      };
       useEffect(() => {
         if (isOpen) {
           previousActiveElement.current = document.activeElement;
@@ -6049,7 +6086,11 @@ var init_Modal = __esm({
           document.body.style.overflow = "";
         };
       }, [isOpen]);
-      if (!isOpen || typeof document === "undefined") return null;
+      if (typeof document === "undefined") return null;
+      const renderOpen = isOpen || closing;
+      if (!renderOpen) return null;
+      const dialogAnim = closing ? "animate-modal-out" : "animate-modal-in";
+      const overlayAnim = closing ? "animate-overlay-out" : "animate-overlay-in";
       const handleClose = () => {
         if (closeEvent) eventBus.emit(`UI:${closeEvent}`, {});
         onClose();
@@ -6066,7 +6107,8 @@ var init_Modal = __esm({
             className: cn(
               "fixed inset-0 z-[1000]",
               "flex items-start justify-center px-4 pb-4 pt-[10vh]",
-              "max-sm:items-stretch max-sm:p-0 max-sm:pt-0"
+              "max-sm:items-stretch max-sm:p-0 max-sm:pt-0",
+              overlayAnim
             ),
             style: { backgroundColor: "rgba(0, 0, 0, 0.6)" },
             onClick: handleOverlayClick,
@@ -6094,8 +6136,10 @@ var init_Modal = __esm({
                   // full height, no rounded corners, no min-width.
                   "max-sm:max-w-none max-sm:max-h-none max-sm:w-full max-sm:h-full max-sm:rounded-none",
                   lookStyles2[look],
-                  className
+                  className,
+                  dialogAnim
                 ),
+                onAnimationEnd: handleAnimEnd,
                 style: dragY > 0 ? {
                   transform: `translateY(${dragY}px)`,
                   transition: isDragging.current ? "none" : "transform 200ms ease-out"
@@ -9732,7 +9776,8 @@ var init_LoadingState = __esm({
     LoadingState = ({
       title,
       message,
-      className
+      className,
+      fullPage = false
     }) => {
       const { t } = useTranslate();
       const displayMessage = message ?? t("common.loading");
@@ -9741,7 +9786,8 @@ var init_LoadingState = __esm({
         {
           align: "center",
           className: cn(
-            "justify-center py-12",
+            "justify-center",
+            fullPage ? "fixed inset-0 z-[1000] py-12 bg-background/80 backdrop-blur-sm animate-overlay-in" : "py-12",
             className
           ),
           children: [
@@ -12943,7 +12989,7 @@ var init_BookCoverPage = __esm({
                 size: "lg",
                 action: "BOOK_START",
                 className: "mt-8",
-                children: /* @__PURE__ */ jsx(Typography, { variant: "body", children: t("book.startReading") })
+                children: /* @__PURE__ */ jsx(Typography, { variant: "body", color: "inherit", children: t("book.startReading") })
               }
             )
           ]
@@ -15726,6 +15772,10 @@ function Canvas2D({
       window.removeEventListener("keyup", onUp);
     };
   }, [keyMap, keyUpMap, eventBus]);
+  useEffect(() => {
+    if (!keyMap && !keyUpMap) return;
+    canvasRef.current?.focus();
+  }, [keyMap, keyUpMap]);
   if (error) {
     return /* @__PURE__ */ jsx(Box, { className: cn("flex items-center justify-center w-full h-full bg-[var(--color-card)] rounded-container", className), children: /* @__PURE__ */ jsxs(Stack, { direction: "vertical", gap: "md", align: "center", children: [
       /* @__PURE__ */ jsx(Icon, { name: "alert-circle", size: "xl" }),
@@ -15774,7 +15824,7 @@ function Canvas2D({
             onWheel: gestureHandlers.onWheel,
             onContextMenu: (e) => e.preventDefault(),
             className: "cursor-pointer touch-none",
-            tabIndex: isFree ? 0 : void 0,
+            tabIndex: isFree || keyMap || keyUpMap ? 0 : void 0,
             style: {
               width: viewportSize.width,
               height: viewportSize.height
@@ -16840,8 +16890,9 @@ var init_Chart = __esm({
                   align: "center",
                   flex: true,
                   className: "min-w-0",
+                  style: { height: "100%" },
                   children: [
-                    /* @__PURE__ */ jsx(HStack, { gap: histogram ? "none" : "xs", align: "end", className: "w-full", style: { height: "100%" }, children: series.map((s, sIdx) => {
+                    /* @__PURE__ */ jsx(HStack, { gap: histogram ? "none" : "xs", align: "end", justify: histogram ? void 0 : "center", className: "w-full flex-1 min-h-0", children: series.map((s, sIdx) => {
                       const value = valueAt(s, label);
                       const barHeight = value / maxValue * 100;
                       const color = seriesColor(s, sIdx);
@@ -16854,6 +16905,8 @@ var init_Chart = __esm({
                           ),
                           style: {
                             height: `${barHeight}%`,
+                            // Cap width so a lone category doesn't paint the whole plot as one solid block; narrow columns are unaffected (flex-1 binds first).
+                            ...!histogram && { maxWidth: 72 },
                             backgroundColor: color
                           },
                           onClick: () => onPointClick?.(
@@ -16888,8 +16941,9 @@ var init_Chart = __esm({
                 align: "center",
                 flex: true,
                 className: "min-w-0",
+                style: { height: "100%" },
                 children: [
-                  /* @__PURE__ */ jsx(VStack, { gap: "none", className: "w-full", style: { height: "100%" }, justify: "end", children: series.map((s, sIdx) => {
+                  /* @__PURE__ */ jsx(VStack, { gap: "none", className: "w-full flex-1 min-h-0", justify: "end", children: series.map((s, sIdx) => {
                     const value = valueAt(s, label);
                     const ratio = stack === "normalize" ? total === 0 ? 0 : value / total * 100 : value / maxValue * 100;
                     const color = seriesColor(s, sIdx);
@@ -16934,6 +16988,7 @@ var init_Chart = __esm({
       const innerRadius = donut ? radius * 0.6 : 0;
       const center = size / 2;
       const segments = useMemo(() => {
+        if (!Number.isFinite(total) || total <= 0) return [];
         let currentAngle = -Math.PI / 2;
         return data.map((point, idx) => {
           const angle = point.value / total * 2 * Math.PI;
@@ -16945,13 +17000,25 @@ var init_Chart = __esm({
           const y1 = center + radius * Math.sin(startAngle);
           const x2 = center + radius * Math.cos(endAngle);
           const y2 = center + radius * Math.sin(endAngle);
+          const fullCircle = angle >= 2 * Math.PI - 1e-9;
+          const midAngle = startAngle + angle / 2;
+          const xm = center + radius * Math.cos(midAngle);
+          const ym = center + radius * Math.sin(midAngle);
           let d;
           if (innerRadius > 0) {
             const ix1 = center + innerRadius * Math.cos(startAngle);
             const iy1 = center + innerRadius * Math.sin(startAngle);
             const ix2 = center + innerRadius * Math.cos(endAngle);
             const iy2 = center + innerRadius * Math.sin(endAngle);
-            d = `M ${ix1} ${iy1} L ${x1} ${y1} A ${radius} ${radius} 0 ${largeArc} 1 ${x2} ${y2} L ${ix2} ${iy2} A ${innerRadius} ${innerRadius} 0 ${largeArc} 0 ${ix1} ${iy1} Z`;
+            if (fullCircle) {
+              const ixm = center + innerRadius * Math.cos(midAngle);
+              const iym = center + innerRadius * Math.sin(midAngle);
+              d = `M ${ix1} ${iy1} L ${x1} ${y1} A ${radius} ${radius} 0 1 1 ${xm} ${ym} A ${radius} ${radius} 0 1 1 ${x2} ${y2} L ${ix2} ${iy2} A ${innerRadius} ${innerRadius} 0 1 0 ${ixm} ${iym} A ${innerRadius} ${innerRadius} 0 1 0 ${ix1} ${iy1} Z`;
+            } else {
+              d = `M ${ix1} ${iy1} L ${x1} ${y1} A ${radius} ${radius} 0 ${largeArc} 1 ${x2} ${y2} L ${ix2} ${iy2} A ${innerRadius} ${innerRadius} 0 ${largeArc} 0 ${ix1} ${iy1} Z`;
+            }
+          } else if (fullCircle) {
+            d = `M ${center} ${center} L ${x1} ${y1} A ${radius} ${radius} 0 1 1 ${xm} ${ym} A ${radius} ${radius} 0 1 1 ${x2} ${y2} Z`;
           } else {
             d = `M ${center} ${center} L ${x1} ${y1} A ${radius} ${radius} 0 ${largeArc} 1 ${x2} ${y2} Z`;
           }
@@ -20351,10 +20418,10 @@ function DataGrid({
                         ] }),
                         badgeFields.length > 0 && /* @__PURE__ */ jsx(HStack, { gap: "xs", className: "flex-wrap", children: badgeFields.map((field) => {
                           const val = getNestedValue(itemData, field.name);
-                          if (val === void 0 || val === null) return null;
+                          if (val === void 0 || val === null || val === "") return null;
                           return /* @__PURE__ */ jsxs(HStack, { gap: "xs", className: "items-center", children: [
                             field.icon && renderIconInput(field.icon, { size: "xs" }),
-                            /* @__PURE__ */ jsx(Badge, { variant: resolveBadgeVariant(field, String(val)), children: String(val) })
+                            /* @__PURE__ */ jsx(Badge, { variant: resolveBadgeVariant(field, String(val)), children: formatValue(val, field.format) })
                           ] }, field.name);
                         }) })
                       ] }),
@@ -25745,7 +25812,7 @@ function GameMenu({
   logo,
   className
 }) {
-  const resolvedOptions = options ?? menuItems ?? DEFAULT_MENU_OPTIONS;
+  const resolvedOptions = (options?.length ? options : void 0) ?? (menuItems?.length ? menuItems : void 0) ?? DEFAULT_MENU_OPTIONS;
   const eventBus = useEventBus();
   const handleOptionClick = React73.useCallback(
     (option) => {
@@ -31489,6 +31556,11 @@ var init_VoteStack = __esm({
         {
           className: cn(
             "inline-flex items-center justify-center",
+            // Shrink-wrap in stretch contexts (slot/sidecar wrappers are
+            // flex-column with stretch alignment): without this the root spans
+            // the full wrapper width and the count row's `w-full` turns the
+            // compact pill into a page-wide band.
+            "w-fit",
             variant === "vertical" ? "flex-col" : "flex-row",
             "rounded-sm",
             "border-[length:var(--border-width)] border-border",
@@ -35394,7 +35466,7 @@ var init_Sidebar = __esm({
             isActive ? [
               "bg-primary text-primary-foreground",
               "font-medium shadow-sm",
-              "border-primary translate-x-1 -translate-y-0.5"
+              "border-primary translate-x-1 rtl:-translate-x-1 -translate-y-0.5"
             ].join(" ") : [
               "text-foreground",
               "hover:bg-muted hover:border-border",
@@ -35404,10 +35476,10 @@ var init_Sidebar = __esm({
           title: collapsed ? item.label : void 0,
           children: [
             item.icon && (typeof item.icon === "string" ? /* @__PURE__ */ jsx(Icon, { name: item.icon, size: "sm", className: cn("min-w-[20px] flex-shrink-0", isActive && "text-primary-foreground") }) : /* @__PURE__ */ jsx(Icon, { icon: item.icon, size: "sm", className: cn("min-w-[20px] flex-shrink-0", isActive && "text-primary-foreground") })),
-            !collapsed && /* @__PURE__ */ jsx(Typography, { variant: "body", color: isActive ? "inherit" : "primary", className: "font-medium truncate flex-1 text-left", children: item.label }),
+            !collapsed && /* @__PURE__ */ jsx(Typography, { variant: "body", color: isActive ? "inherit" : "primary", className: "font-medium truncate flex-1 text-start", children: item.label }),
             !collapsed && item.badge !== void 0 && /* @__PURE__ */ jsx(Badge, { variant: "danger", size: "sm", children: item.badge }),
             collapsed && /* @__PURE__ */ jsx(Box, { className: cn(
-              "absolute left-full ml-2 px-2 py-1 text-xs opacity-0 group-hover:opacity-100",
+              "absolute start-full ms-2 px-2 py-1 text-xs opacity-0 group-hover:opacity-100",
               "pointer-events-none whitespace-nowrap z-50 transition-opacity",
               "bg-primary text-primary-foreground",
               "border-[length:var(--border-width-thin)] border-border",
@@ -35462,7 +35534,7 @@ var init_Sidebar = __esm({
           as: "aside",
           className: cn(
             "flex flex-col h-full",
-            "bg-card border-r border-border",
+            "bg-card border-e border-border",
             "transition-all duration-300 ease-in-out",
             collapsed ? "w-20" : "w-64",
             className
@@ -36623,7 +36695,7 @@ function resolveColor3(color, el) {
 function truncateLabel(label) {
   return label.length > MAX_LABEL_CHARS ? label.slice(0, MAX_LABEL_CHARS - 1) + "\u2026" : label;
 }
-var GROUP_COLORS2, GROUP_GRAVITY, UNGROUPED_GRAVITY, labelMeasureCtx, MAX_LABEL_CHARS, GraphCanvas;
+var GROUP_COLORS2, GROUP_GRAVITY, UNGROUPED_GRAVITY, labelMeasureCtx, MAX_LABEL_CHARS, NO_NODES, NO_EDGES, NO_SIM, GraphCanvas;
 var init_GraphCanvas = __esm({
   "components/core/molecules/GraphCanvas.tsx"() {
     "use client";
@@ -36647,11 +36719,14 @@ var init_GraphCanvas = __esm({
     UNGROUPED_GRAVITY = 0.02;
     labelMeasureCtx = null;
     MAX_LABEL_CHARS = 22;
+    NO_NODES = [];
+    NO_EDGES = [];
+    NO_SIM = [];
     GraphCanvas = ({
       title,
-      nodes: propNodes = [],
-      edges: propEdges = [],
-      similarity: propSimilarity = [],
+      nodes: propNodes = NO_NODES,
+      edges: propEdges = NO_EDGES,
+      similarity: propSimilarity = NO_SIM,
       height = 400,
       showLabels = true,
       interactive = true,
@@ -36701,6 +36776,7 @@ var init_GraphCanvas = __esm({
       const interactionRef = useRef({
         mode: "none",
         dragNodeId: null,
+        pressedNodeId: null,
         startMouse: { x: 0, y: 0 },
         startOffset: { x: 0, y: 0 },
         downPos: { x: 0, y: 0 }
@@ -36748,6 +36824,11 @@ var init_GraphCanvas = __esm({
         () => [...new Set(propNodes.map((n) => n.group).filter(Boolean))],
         [propNodes]
       );
+      const nodesKey = useMemo(() => propNodes.map((n) => n.id).join("
"), [propNodes]);
+      const edgesKey = useMemo(
+        () => propEdges.map((e) => `${e.source}
${e.target}`).join("
"),
+        [propEdges]
+      );
       useEffect(() => {
         const canvas = canvasRef.current;
         if (!canvas || propNodes.length === 0) return;
@@ -36928,7 +37009,7 @@ var init_GraphCanvas = __esm({
         return () => {
           cancelAnimationFrame(animRef.current);
         };
-      }, [propNodes, propEdges, propSimilarity, layout, repulsion, linkDistance, nodeSpacing, showLabels]);
+      }, [nodesKey, edgesKey, propSimilarity, layout, repulsion, linkDistance, nodeSpacing, showLabels]);
       useEffect(() => {
         const canvas = canvasRef.current;
         if (!canvas) return;
@@ -37058,6 +37139,7 @@ var init_GraphCanvas = __esm({
       const cancelSinglePointer = useCallback(() => {
         interactionRef.current.mode = "none";
         interactionRef.current.dragNodeId = null;
+        interactionRef.current.pressedNodeId = null;
       }, []);
       const handlePointerDown = useCallback(
         (e) => {
@@ -37068,6 +37150,7 @@ var init_GraphCanvas = __esm({
           state.downPos = { x: e.clientX, y: e.clientY };
           state.startMouse = { x: e.clientX, y: e.clientY };
           state.startOffset = { ...offset };
+          state.pressedNodeId = node?.id ?? null;
           if (draggable && node) {
             state.mode = "dragging";
             state.dragNodeId = node.id;
@@ -37119,7 +37202,8 @@ var init_GraphCanvas = __esm({
           if (moved < 4) {
             const coords = toCoords(e);
             if (!coords) return;
-            const node = nodeAt(coords.graphX, coords.graphY);
+            const node = (state.pressedNodeId ? nodesRef.current.find((n) => n.id === state.pressedNodeId) : void 0) ?? nodeAt(coords.graphX, coords.graphY);
+            state.pressedNodeId = null;
             if (node) {
               if (node.badge && node.badge > 1 && onBadgeClick) {
                 const r = (node.size || 8) + (selectedNodeId === node.id ? 4 : 0);
@@ -37139,6 +37223,7 @@ var init_GraphCanvas = __esm({
       );
       const handlePointerLeave = useCallback(() => {
         setHoveredNode(null);
+        interactionRef.current.pressedNodeId = null;
       }, []);
       const gestureHandlers = useCanvasGestures({
         canvasRef,
@@ -40307,8 +40392,17 @@ var init_MediaGallery = __esm({
       const eventBus = useEventBus();
       const { t } = useTranslate();
       const [lightboxItem, setLightboxItem] = useState(null);
+      const [failedIds, setFailedIds] = useState(/* @__PURE__ */ new Set());
       const closeLightbox = useCallback(() => setLightboxItem(null), []);
       useEventListener("UI:LIGHTBOX_CLOSE", closeLightbox);
+      const handleImageError = useCallback((id) => {
+        setFailedIds((prev) => {
+          if (prev.has(id)) return prev;
+          const next = new Set(prev);
+          next.add(id);
+          return next;
+        });
+      }, []);
       const handleItemClick = useCallback(
         (item) => {
           if (selectable) {
@@ -40324,7 +40418,7 @@ var init_MediaGallery = __esm({
       );
       const entityData = Array.isArray(entity) ? entity : [];
       const items = React73__default.useMemo(() => {
-        if (propItems) return propItems;
+        if (propItems && propItems.length > 0) return propItems;
         if (entityData.length === 0) return [];
         return entityData.map((record, idx) => {
           return {
@@ -40407,13 +40501,14 @@ var init_MediaGallery = __esm({
                     ),
                     onClick: () => handleItemClick(item),
                     children: [
-                      /* @__PURE__ */ jsx(
+                      failedIds.has(item.id) ? /* @__PURE__ */ jsx(Box, { className: "w-full h-full flex items-center justify-center bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx(Icon, { icon: Image$1, size: "lg" }) }) : /* @__PURE__ */ jsx(
                         "img",
                         {
                           src: item.thumbnail || item.src,
                           alt: item.alt || item.caption || "",
                           className: "w-full h-full object-cover",
-                          loading: "lazy"
+                          loading: "lazy",
+                          onError: () => handleImageError(item.id)
                         }
                       ),
                       /* @__PURE__ */ jsx(
@@ -43901,6 +43996,11 @@ var init_TeamOrganism = __esm({
     TeamOrganism.displayName = "TeamOrganism";
   }
 });
+function formatDate4(value) {
+  const d = new Date(value);
+  if (isNaN(d.getTime())) return value;
+  return d.toLocaleDateString(void 0, { year: "numeric", month: "short", day: "numeric" });
+}
 var lookStyles10, STATUS_STYLES2, Timeline;
 var init_Timeline = __esm({
   "components/core/organisms/Timeline.tsx"() {
@@ -44028,7 +44128,7 @@ var init_Timeline = __esm({
             /* @__PURE__ */ jsxs(VStack, { gap: "xs", className: cn("flex-1 min-w-0", !isLast && "pb-6"), children: [
               /* @__PURE__ */ jsxs(HStack, { justify: "between", align: "start", wrap: true, children: [
                 /* @__PURE__ */ jsx(Typography, { variant: "body", weight: "semibold", children: item.title }),
-                item.date && /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "secondary", className: "flex-shrink-0", children: item.date })
+                item.date && /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "secondary", className: "flex-shrink-0", children: formatDate4(item.date) })
               ] }),
               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)) }),
@@ -45240,7 +45340,7 @@ function substituteTraitRefsDeep(value, pathKey) {
   }
   return value;
 }
-function renderPatternProps(props, onDismiss) {
+function renderPatternProps(props, onDismiss, propsSchema) {
   const rendered = {};
   for (const [key, value] of Object.entries(props)) {
     if (key === "children") {
@@ -45258,9 +45358,10 @@ function renderPatternProps(props, onDismiss) {
       };
       rendered[key] = /* @__PURE__ */ jsx(SlotContentRenderer, { content: childContent, onDismiss });
     } else if (Array.isArray(value)) {
+      const isDataArray = propsSchema?.[key]?.items?.types?.includes("object") ?? false;
       rendered[key] = value.map((item, i) => {
         const el = item;
-        if (isPatternConfig(el)) {
+        if (!isDataArray && isPatternConfig(el)) {
           const nestedProps = {};
           for (const [k, v] of Object.entries(el)) {
             if (k !== "type") nestedProps[k] = v;
@@ -45348,14 +45449,15 @@ function SlotContentRenderer({
         );
       }
     }
-    const renderedProps = renderPatternProps(restProps, onDismiss);
     const patternDef = getPatternDefinition$1(content.pattern);
     const propsSchema = patternDef?.propsSchema;
+    const renderedProps = renderPatternProps(restProps, onDismiss, propsSchema);
     if (propsSchema) {
       for (const [propKey, propValue] of Object.entries(renderedProps)) {
         if (typeof propValue !== "string") continue;
         const propDef = propsSchema[propKey];
         if (!propDef || propDef.kind !== "callback") continue;
+        if (propValue === "") continue;
         renderedProps[propKey] = wrapCallbackForEvent(
           `UI:${propValue}`,
           propDef.callbackArgs,
@@ -47144,6 +47246,16 @@ function useSharedEntityStore() {
   }
   return storeRef.current;
 }
+var SharedEntityStoreContext = createContext(null);
+function useSharedEntityStoreContext() {
+  const store = useContext(SharedEntityStoreContext);
+  if (!store) {
+    throw new Error(
+      "useSharedEntityStoreContext: no SharedEntityStoreContext.Provider found in the component tree"
+    );
+  }
+  return store;
+}
 function useSharedEntitySnapshot(store, entityId) {
   return useSyncExternalStore(
     (onStoreChange) => store.subscribe(entityId, onStoreChange),
@@ -48023,4 +48135,4 @@ function useGitHubBranches(owner, repo, enabled = true) {
   });
 }
 
-export { ALL_PRESETS, ALMADAR_DND_MIME, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, Alert, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, ArticleSection, Aside, AssetPicker, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, CTABanner, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CaseStudyCard, CaseStudyOrganism, Center, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, Coachmark, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ContentSection, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTIONS, DEFAULT_MATRIX_COLUMNS, DEFAULT_SLOTS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmptyState, EntityDisplayEvents, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, HStack, Header, HealthBar, HeroOrganism, HeroSection, I18nProvider, IDENTITY_BOOK_FIELDS, Icon, IconPicker, InfiniteScrollSentinel, Input, InputGroup, InstallBox, JazariStateMachine, JsonTreeEditor, Label, LandingPageTemplate, LawReferenceTooltip, LearningCanvas, Lightbox, LikertScale, LineChart2 as LineChart, List3 as List, LoadingState, MapView, MarkdownContent, MarketingFooter, MarketingStatCard, MasterDetail, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NodeSlotEditor, NotifyListener, NumberStepper, OnboardingSpotlight, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PropertyInspector, PullQuote, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichBlockEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, ServiceCatalog, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, SplitSection, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StepFlow, StepFlowOrganism, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagCloud, TagInput, TeamCard, TeamOrganism, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitFrame, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UploadDropZone, VStack, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, boardEntity, bool, calculateAttackTargets, calculateValidMoves, cn, createInitialGameState, createSharedEntityStore, createTranslate, createUnitAnimationState, getCurrentFrame, getTileDimensions, inferDirection, isoToScreen, makeAsset, makeAssetMap, mapBookData, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, parseLessonSegments, parseMarkdownWithCodeBlocks, parseQueryBinding, pendulum, projectileMotion, resolveFieldMap, resolveFrame, resolveSheetDirection, rows, runTickFrame, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAgentChat, useAnchorRect, useAtlasSliceDataUrl, useAuthContext, useCamera, useCanvasGestures, useCompile, useConnectGitHub, useDeepAgentGeneration, useDisconnectGitHub, useDragReorder, useDraggable, useDropZone, useEmitEvent, useEventBus, useEventListener, useExtensions, useFileEditor, useFileSystem, useGameAudio, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useImageCache, useInfiniteScroll, useLongPress, useOrbitalHistory, usePreview, usePullToRefresh, useQuerySingleton, useRenderInterpolation, useSharedEntitySnapshot, useSharedEntityStore, useSwipeGesture, useTapReveal, useTraitListens, useTranslate115 as useTranslate, useUIEvents, useUISlotManager, useUnitSpriteAtlas, useValidation, vec2 };
+export { ALL_PRESETS, ALMADAR_DND_MIME, AR_BOOK_FIELDS, AboutPageTemplate, Accordion, Card2 as ActionCard, ActionPalette, ActionTile, ActivationBlock, Alert, AlgorithmCanvas, AnimatedCounter, AnimatedGraphic, AnimatedReveal, ArticleSection, Aside, AssetPicker, AtlasImage, AtlasPanel, AuthLayout, Avatar, Badge, BehaviorView, BiologyCanvas, BloomQuizBlock, BookChapterView, BookCoverPage, BookNavBar, BookTableOfContents, BookViewer, Box, BranchingLogicBuilder, Breadcrumb, Button, ButtonGroup, CTABanner, CalendarGrid, Canvas, Canvas2D, Card, CardBody, CardContent, CardFooter, CardGrid, CardHeader, CardTitle, Carousel, CaseStudyCard, CaseStudyOrganism, Center, Chart, ChartLegend, ChatBar, Checkbox, ChemistryCanvas, ChoiceButton, Coachmark, CodeBlock, CodeRunnerPanel, CollapsibleSection, CommunityLinks, ConditionalWrapper, ConfettiEffect, ConfirmDialog, ConnectionBlock, Container, ContentRenderer, ContentSection, ControlButton, ControlGrid, CounterTemplate, DEFAULT_LIKERT_OPTIONS, DEFAULT_MATRIX_COLUMNS, DEFAULT_SLOTS, DIAMOND_TOP_Y, DashboardGrid, DashboardLayout, DataGrid, DataList, DataTable, DateRangePicker, DateRangeSelector, DayCell, DetailPanel, Dialog, DialogueBubble, Divider, DocBreadcrumb, DocPagination, DocSearch, DocSidebar, DocTOC, DocumentViewer, StateMachineView as DomStateMachineVisualizer, Drawer, DrawerSlot, ELEMENT_SELECTED_EVENT, EdgeDecoration, EditorCheckbox, EditorSelect, EditorSlider, EditorTextInput, EditorToolbar, EmptyState, EntityDisplayEvents, ErrorBoundary, ErrorState, FEATURE_COLORS, FEATURE_TYPES, FLOOR_HEIGHT, FeatureCard, FeatureDetailPageTemplate, FeatureGrid, FeatureGridOrganism, FileTree, FilterGroup, FilterPill, Flex, FlipCard, FlipContainer, FloatingActionButton, Form, FormActions, FormField, FormLayout, FormSection, FormSectionHeader, GameAudioToggle, GameHud, GameIcon, GameMenu, GameShell, GenericAppTemplate, GeometricPattern, GradientDivider, GraphCanvas, GraphView, Grid, GridPicker, HStack, Header, HealthBar, HeroOrganism, HeroSection, I18nProvider, IDENTITY_BOOK_FIELDS, Icon, IconPicker, InfiniteScrollSentinel, Input, InputGroup, InstallBox, JazariStateMachine, JsonTreeEditor, Label, LandingPageTemplate, LawReferenceTooltip, LearningCanvas, Lightbox, LikertScale, LineChart2 as LineChart, List3 as List, LoadingState, MapView, MarkdownContent, MarketingFooter, MarketingStatCard, MasterDetail, MasterDetailLayout, MathCanvas, MatrixQuestion, MediaGallery, Menu, Meter, Modal, ModalSlot, ModuleCard, Navigation, NodeSlotEditor, NotifyListener, NumberStepper, OnboardingSpotlight, OptionConstraintGroup, StateMachineView as OrbitalStateMachineView, OrbitalVisualization, Overlay, PageHeader, Pagination, PatternTile, PhysicsCanvas, Popover, PositionedCanvas, PricingCard, PricingGrid, PricingOrganism, PricingPageTemplate, ProgressBar, ProgressDots, PropertyInspector, PullQuote, PullToRefresh, QrScanner, QuizBlock, Radio, RangeSlider, ReflectionBlock, RelationSelect, RepeatableFormSection, ReplyTree, RichBlockEditor, RuntimeDebugger, SHEET_COLUMNS, SPRITE_SHEET_LAYOUT, ScaledDiagram, ScoreDisplay, SearchInput, Section, SectionHeader, SegmentRenderer, Select, SequenceBar, ServiceCatalog, SharedEntityStoreContext, ShowcaseCard, ShowcaseOrganism, SidePanel, Sidebar, SignaturePad, SimpleGrid, Skeleton, SlotContentRenderer, SocialProof, SortableList, Spacer, Sparkline, Spinner, Split, SplitPane, SplitSection, Stack, StarRating, StatBadge, StatCard, StatDisplay, StateGraph, StateJsonView, StateMachineView, StateNode2 as StateNode, StatsGrid, StatsOrganism, StatusBar, StatusDot, StepFlow, StepFlowOrganism, SubagentTracePanel, SvgBranch, SvgConnection, SvgFlow, SvgGrid, SvgLobe, SvgMesh, SvgMorph, SvgNode, SvgPulse, SvgRing, SvgShield, SvgStack, SwipeableRow, Switch, TERRAIN_COLORS, TILE_HEIGHT, TILE_WIDTH, TabbedContainer, TableView, Tabs, TagCloud, TagInput, TeamCard, TeamOrganism, TerrainPalette, TextHighlight, Textarea, ThemeToggle, TimeSlotCell, Timeline, TimerDisplay, Toast, ToastSlot, Tooltip, TraitFrame, TraitSlot, TraitStateViewer, TransitionArrow, TrendIndicator, TypewriterText, Typography, UISlotComponent, UISlotRenderer, UploadDropZone, VStack, VersionDiff, ViolationAlert, VoteStack, WizardContainer, WizardNavigation, WizardProgress, boardEntity, bool, calculateAttackTargets, calculateValidMoves, cn, createInitialGameState, createSharedEntityStore, createTranslate, createUnitAnimationState, getCurrentFrame, getTileDimensions, inferDirection, isoToScreen, makeAsset, makeAssetMap, mapBookData, num, objAvailableActions, objAvailableEvents, objCurrentState, objIcon, objId, objMaxRules, objName, objRules, objStates, parseEditFocus, parseLessonSegments, parseMarkdownWithCodeBlocks, parseQueryBinding, pendulum, projectileMotion, resolveFieldMap, resolveFrame, resolveSheetDirection, rows, runTickFrame, screenToIso, springOscillator, str, tickAnimationState, toCodeLanguage, transitionAnimation, unitHealth, unitPosition, unitTeam, useAgentChat, useAnchorRect, useAtlasSliceDataUrl, useAuthContext, useCamera, useCanvasGestures, useCompile, useConnectGitHub, useDeepAgentGeneration, useDisconnectGitHub, useDragReorder, useDraggable, useDropZone, useEmitEvent, useEventBus, useEventListener, useExtensions, useFileEditor, useFileSystem, useGameAudio, useGitHubBranches, useGitHubRepo, useGitHubRepos, useGitHubStatus, useImageCache, useInfiniteScroll, useLongPress, useOrbitalHistory, usePreview, usePullToRefresh, useQuerySingleton, useRenderInterpolation, useSharedEntitySnapshot, useSharedEntityStore, useSharedEntityStoreContext, useSwipeGesture, useTapReveal, useTraitListens, useTranslate115 as useTranslate, useUIEvents, useUISlotManager, useUnitSpriteAtlas, useValidation, vec2 };