@almadar/ui 2.15.7 → 2.15.10

package/dist/runtime/index.cjs

@@ -0,0 +1,4400 @@
+'use strict';
+
+var React113 = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+require('@tanstack/react-query');
+require('react-dom');
+require('@almadar/ui/context');
+var LucideIcons = require('lucide-react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+require('@almadar/evaluator');
+var patterns = require('@almadar/patterns');
+require('react-leaflet');
+var L = require('leaflet');
+require('leaflet/dist/leaflet.css');
+require('react-router-dom');
+var ReactMarkdown = require('react-markdown');
+var remarkGfm = require('remark-gfm');
+var remarkMath = require('remark-math');
+var rehypeKatex = require('rehype-katex');
+var SyntaxHighlighter = require('react-syntax-highlighter/dist/esm/prism');
+var dark = require('react-syntax-highlighter/dist/esm/styles/prism/vsc-dark-plus');
+var fiber = require('@react-three/fiber');
+var drei = require('@react-three/drei');
+var THREE = require('three');
+var GLTFLoader = require('three/examples/jsm/loaders/GLTFLoader');
+var GLTFLoader_js = require('three/examples/jsm/loaders/GLTFLoader.js');
+var OBJLoader_js = require('three/examples/jsm/loaders/OBJLoader.js');
+var core = require('@almadar/core');
+var runtime = require('@almadar/runtime');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React113__namespace = /*#__PURE__*/_interopNamespace(React113);
+var LucideIcons__namespace = /*#__PURE__*/_interopNamespace(LucideIcons);
+var L__default = /*#__PURE__*/_interopDefault(L);
+var ReactMarkdown__default = /*#__PURE__*/_interopDefault(ReactMarkdown);
+var remarkGfm__default = /*#__PURE__*/_interopDefault(remarkGfm);
+var remarkMath__default = /*#__PURE__*/_interopDefault(remarkMath);
+var rehypeKatex__default = /*#__PURE__*/_interopDefault(rehypeKatex);
+var SyntaxHighlighter__default = /*#__PURE__*/_interopDefault(SyntaxHighlighter);
+var dark__default = /*#__PURE__*/_interopDefault(dark);
+var THREE__namespace = /*#__PURE__*/_interopNamespace(THREE);
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var EventBusContext = React113.createContext(null);
+function getGlobalEventBus() {
+  if (typeof window !== "undefined") {
+    return window.__kflowEventBus ?? null;
+  }
+  return null;
+}
+var fallbackListeners = /* @__PURE__ */ new Map();
+var fallbackAnyListeners = /* @__PURE__ */ new Set();
+var fallbackEventBus = {
+  emit: (type, payload) => {
+    const event = {
+      type,
+      payload,
+      timestamp: Date.now()
+    };
+    const handlers = fallbackListeners.get(type);
+    if (handlers) {
+      handlers.forEach((handler) => {
+        try {
+          handler(event);
+        } catch (error) {
+          console.error(`[EventBus] Error in listener for '${type}':`, error);
+        }
+      });
+    }
+    fallbackAnyListeners.forEach((handler) => {
+      try {
+        handler(event);
+      } catch (error) {
+        console.error(`[EventBus] Error in onAny listener for '${type}':`, error);
+      }
+    });
+  },
+  on: (type, listener) => {
+    if (!fallbackListeners.has(type)) {
+      fallbackListeners.set(type, /* @__PURE__ */ new Set());
+    }
+    fallbackListeners.get(type).add(listener);
+    return () => {
+      const handlers = fallbackListeners.get(type);
+      if (handlers) {
+        handlers.delete(listener);
+        if (handlers.size === 0) {
+          fallbackListeners.delete(type);
+        }
+      }
+    };
+  },
+  once: (type, listener) => {
+    const wrappedListener = (event) => {
+      fallbackListeners.get(type)?.delete(wrappedListener);
+      listener(event);
+    };
+    return fallbackEventBus.on(type, wrappedListener);
+  },
+  hasListeners: (type) => {
+    const handlers = fallbackListeners.get(type);
+    return handlers !== void 0 && handlers.size > 0;
+  },
+  onAny: (listener) => {
+    fallbackAnyListeners.add(listener);
+    return () => {
+      fallbackAnyListeners.delete(listener);
+    };
+  }
+};
+function useEventBus() {
+  const context = React113.useContext(EventBusContext);
+  return context ?? getGlobalEventBus() ?? fallbackEventBus;
+}
+function useEmitEvent() {
+  const eventBus = useEventBus();
+  return React113.useCallback(
+    (type, payload) => {
+      eventBus.emit(type, payload);
+    },
+    [eventBus]
+  );
+}
+React113.createContext(null);
+React113.createContext(null);
+
+// lib/api-client.ts
+typeof process !== "undefined" && process.env?.VITE_API_URL ? process.env.VITE_API_URL : "/api";
+
+// locales/en.json
+var en_default = {
+  $meta: { locale: "en", direction: "ltr" },
+  "common.save": "Save",
+  "common.cancel": "Cancel",
+  "common.delete": "Delete",
+  "common.close": "Close",
+  "common.confirm": "Are you sure?",
+  "common.create": "Create",
+  "common.edit": "Edit",
+  "common.view": "View",
+  "common.add": "Add",
+  "common.remove": "Remove",
+  "common.search": "Search...",
+  "common.filter": "Filter",
+  "common.actions": "Actions",
+  "common.yes": "Yes",
+  "common.no": "No",
+  "common.selected": "selected",
+  "common.ok": "OK",
+  "common.done": "Done",
+  "common.apply": "Apply",
+  "common.reset": "Reset",
+  "common.refresh": "Refresh",
+  "common.export": "Export",
+  "common.import": "Import",
+  "common.copy": "Copy",
+  "common.settings": "Settings",
+  "nav.previous": "Previous",
+  "nav.next": "Next",
+  "nav.back": "Back",
+  "nav.home": "Home",
+  "form.submit": "Submit",
+  "form.saving": "Saving...",
+  "form.required": "This field is required",
+  "form.invalidEmail": "Enter a valid email address",
+  "form.selectPlaceholder": "Select {{label}}...",
+  "form.searchPlaceholder": "Search {{entity}}...",
+  "table.empty.title": "No items found",
+  "table.empty.description": "No items to display.",
+  "table.search.placeholder": "Search...",
+  "table.pagination.showing": "Showing {{start}} to {{end}} of {{total}} results",
+  "table.pagination.page": "Page {{page}} of {{totalPages}}",
+  "table.bulk.selected": "{{count}} selected",
+  "table.loading": "Loading...",
+  "status.loading": "Loading...",
+  "status.scheduled": "Scheduled",
+  "status.inProgress": "In Progress",
+  "status.completed": "Completed",
+  "status.cancelled": "Cancelled",
+  "status.pending": "Pending",
+  "status.active": "Active",
+  "status.inactive": "Inactive",
+  "status.draft": "Draft",
+  "status.archived": "Archived",
+  "error.generic": "Something went wrong",
+  "error.retry": "Try again",
+  "error.notFound": "Not found",
+  "error.loadFailed": "Failed to load: {{message}}",
+  "error.configMissing": "Configuration not found for: {{id}}",
+  "common.loading": "Loading...",
+  "common.showMore": "Show More",
+  "common.showLess": "Show Less",
+  "common.noResults": "No results found",
+  "common.saveChanges": "Save Changes",
+  "common.retry": "Retry",
+  "common.open": "Open",
+  "common.back": "Back",
+  "empty.noItems": "No items",
+  "empty.noData": "No data available",
+  "empty.noItemsYet": "No items yet",
+  "empty.noItemsAdded": "No items added yet",
+  "empty.noOptionsFound": "No options found",
+  "list.addItemPlaceholder": "Add new item...",
+  "error.occurred": "An error occurred",
+  "error.failedToLoad": "Failed to load data",
+  "wizard.back": "Back",
+  "wizard.next": "Next",
+  "wizard.complete": "Complete",
+  "wizard.stepOf": "Step {{current}} of {{total}}",
+  "pagination.previous": "Previous",
+  "pagination.next": "Next",
+  "pagination.total": "Total:",
+  "pagination.show": "Show:",
+  "pagination.goTo": "Go to:",
+  "pagination.go": "Go",
+  "auth.signIn": "Sign in",
+  "auth.signOut": "Sign out",
+  "dialog.confirm": "Confirm",
+  "dialog.cancel": "Cancel",
+  "dialog.loading": "Loading...",
+  "dialog.delete.title": "Delete {{item}}?",
+  "dialog.delete.message": "This action cannot be undone.",
+  "trait.availableActions": "Available Actions",
+  "trait.transitions": "Transitions",
+  "trait.availableNow": "Available now",
+  "book.startReading": "Start Reading",
+  "book.tableOfContents": "Table of Contents",
+  "book.partNumber": "Part {{number}}",
+  "book.print": "Print",
+  "book.previousPage": "Previous page",
+  "book.nextPage": "Next page",
+  "quiz.showAnswer": "Show answer",
+  "quiz.hideAnswer": "Hide answer"
+};
+
+// hooks/useTranslate.ts
+var { $meta: _meta, ...coreMessages } = en_default;
+var coreLocale = coreMessages;
+var I18nContext = React113.createContext({
+  locale: "en",
+  direction: "ltr",
+  t: (key) => coreLocale[key] ?? key
+  // core locale fallback
+});
+I18nContext.displayName = "I18nContext";
+I18nContext.Provider;
+function useTranslate() {
+  return React113.useContext(I18nContext);
+}
+typeof process !== "undefined" && process.env?.VITE_API_URL ? process.env.VITE_API_URL : "http://localhost:3000";
+React113.createContext(void 0);
+var FetchedDataContext = React113.createContext(null);
+function useFetchedDataContext() {
+  return React113.useContext(FetchedDataContext);
+}
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var iconAliases = {
+  "close": LucideIcons__namespace.X,
+  "trash": LucideIcons__namespace.Trash2,
+  "loader": LucideIcons__namespace.Loader2,
+  "stop": LucideIcons__namespace.Square,
+  "volume": LucideIcons__namespace.Volume2,
+  "volume-off": LucideIcons__namespace.VolumeX,
+  "refresh": LucideIcons__namespace.RefreshCw,
+  "share": LucideIcons__namespace.Share2,
+  "sort-asc": LucideIcons__namespace.ArrowUpNarrowWide,
+  "sort-desc": LucideIcons__namespace.ArrowDownNarrowWide
+};
+function kebabToPascal(name) {
+  return name.split("-").map((part) => {
+    if (/^\d+$/.test(part)) return part;
+    return part.charAt(0).toUpperCase() + part.slice(1);
+  }).join("");
+}
+var resolvedCache = /* @__PURE__ */ new Map();
+function resolveIcon(name) {
+  const cached = resolvedCache.get(name);
+  if (cached) return cached;
+  const resolved = doResolve(name);
+  resolvedCache.set(name, resolved);
+  return resolved;
+}
+function doResolve(name) {
+  if (iconAliases[name]) return iconAliases[name];
+  const pascalName = kebabToPascal(name);
+  const directLookup = LucideIcons__namespace[pascalName];
+  if (directLookup && typeof directLookup === "object") return directLookup;
+  const asIs = LucideIcons__namespace[name];
+  if (asIs && typeof asIs === "object") return asIs;
+  return LucideIcons__namespace.HelpCircle;
+}
+var paddingStyles = {
+  none: "p-0",
+  xs: "p-1",
+  sm: "p-2",
+  md: "p-4",
+  lg: "p-6",
+  xl: "p-8",
+  "2xl": "p-12"
+};
+var paddingXStyles = {
+  none: "px-0",
+  xs: "px-1",
+  sm: "px-2",
+  md: "px-4",
+  lg: "px-6",
+  xl: "px-8",
+  "2xl": "px-12"
+};
+var paddingYStyles = {
+  none: "py-0",
+  xs: "py-1",
+  sm: "py-2",
+  md: "py-4",
+  lg: "py-6",
+  xl: "py-8",
+  "2xl": "py-12"
+};
+var marginStyles = {
+  none: "m-0",
+  xs: "m-1",
+  sm: "m-2",
+  md: "m-4",
+  lg: "m-6",
+  xl: "m-8",
+  "2xl": "m-12",
+  auto: "m-auto"
+};
+var marginXStyles = {
+  none: "mx-0",
+  xs: "mx-1",
+  sm: "mx-2",
+  md: "mx-4",
+  lg: "mx-6",
+  xl: "mx-8",
+  "2xl": "mx-12",
+  auto: "mx-auto"
+};
+var marginYStyles = {
+  none: "my-0",
+  xs: "my-1",
+  sm: "my-2",
+  md: "my-4",
+  lg: "my-6",
+  xl: "my-8",
+  "2xl": "my-12",
+  auto: "my-auto"
+};
+var bgStyles = {
+  transparent: "bg-transparent",
+  primary: "bg-[var(--color-primary)] text-[var(--color-primary-foreground)]",
+  secondary: "bg-[var(--color-secondary)] text-[var(--color-secondary-foreground)]",
+  muted: "bg-[var(--color-muted)] text-[var(--color-foreground)]",
+  accent: "bg-[var(--color-accent)] text-[var(--color-accent-foreground)]",
+  surface: "bg-[var(--color-card)]",
+  overlay: "bg-[var(--color-card)]/80 backdrop-blur-sm"
+};
+var roundedStyles = {
+  none: "rounded-none",
+  sm: "rounded-[var(--radius-sm)]",
+  md: "rounded-[var(--radius-md)]",
+  lg: "rounded-[var(--radius-lg)]",
+  xl: "rounded-[var(--radius-xl)]",
+  "2xl": "rounded-[var(--radius-xl)]",
+  full: "rounded-[var(--radius-full)]"
+};
+var shadowStyles = {
+  none: "shadow-none",
+  sm: "shadow-[var(--shadow-sm)]",
+  md: "shadow-[var(--shadow-main)]",
+  lg: "shadow-[var(--shadow-lg)]",
+  xl: "shadow-[var(--shadow-lg)]"
+};
+var displayStyles = {
+  block: "block",
+  inline: "inline",
+  "inline-block": "inline-block",
+  flex: "flex",
+  "inline-flex": "inline-flex",
+  grid: "grid"
+};
+var overflowStyles = {
+  auto: "overflow-auto",
+  hidden: "overflow-hidden",
+  visible: "overflow-visible",
+  scroll: "overflow-scroll"
+};
+var positionStyles = {
+  relative: "relative",
+  absolute: "absolute",
+  fixed: "fixed",
+  sticky: "sticky"
+};
+var Box = React113__namespace.default.forwardRef(
+  ({
+    padding,
+    paddingX,
+    paddingY,
+    margin,
+    marginX,
+    marginY,
+    bg = "transparent",
+    border = false,
+    rounded = "none",
+    shadow = "none",
+    display,
+    fullWidth = false,
+    fullHeight = false,
+    overflow,
+    position,
+    className,
+    children,
+    as: Component2 = "div",
+    action,
+    actionPayload,
+    hoverEvent,
+    onClick,
+    onMouseEnter,
+    onMouseLeave,
+    ...rest
+  }, ref) => {
+    const eventBus = useEventBus();
+    const handleClick = React113.useCallback((e) => {
+      if (action) {
+        e.stopPropagation();
+        eventBus.emit(`UI:${action}`, actionPayload ?? {});
+      }
+      onClick?.(e);
+    }, [action, actionPayload, eventBus, onClick]);
+    const handleMouseEnter = React113.useCallback((e) => {
+      if (hoverEvent) {
+        eventBus.emit(`UI:${hoverEvent}`, { hovered: true });
+      }
+      onMouseEnter?.(e);
+    }, [hoverEvent, eventBus, onMouseEnter]);
+    const handleMouseLeave = React113.useCallback((e) => {
+      if (hoverEvent) {
+        eventBus.emit(`UI:${hoverEvent}`, { hovered: false });
+      }
+      onMouseLeave?.(e);
+    }, [hoverEvent, eventBus, onMouseLeave]);
+    const isClickable = action || onClick;
+    const Comp = Component2;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        ref,
+        className: cn(
+          // Padding
+          padding && paddingStyles[padding],
+          paddingX && paddingXStyles[paddingX],
+          paddingY && paddingYStyles[paddingY],
+          // Margin
+          margin && marginStyles[margin],
+          marginX && marginXStyles[marginX],
+          marginY && marginYStyles[marginY],
+          // Background
+          bgStyles[bg],
+          // Border - uses theme variables
+          border && "border-[length:var(--border-width)] border-[var(--color-border)]",
+          // Rounded
+          roundedStyles[rounded],
+          // Shadow
+          shadowStyles[shadow],
+          // Display
+          display && displayStyles[display],
+          // Dimensions
+          fullWidth && "w-full",
+          fullHeight && "h-full",
+          // Overflow
+          overflow && overflowStyles[overflow],
+          // Position
+          position && positionStyles[position],
+          // Cursor for clickable
+          isClickable && "cursor-pointer",
+          className
+        ),
+        onClick: isClickable ? handleClick : void 0,
+        onMouseEnter: hoverEvent || onMouseEnter ? handleMouseEnter : void 0,
+        onMouseLeave: hoverEvent || onMouseLeave ? handleMouseLeave : void 0,
+        ...rest,
+        children
+      }
+    );
+  }
+);
+Box.displayName = "Box";
+var variantStyles = {
+  h1: "text-4xl font-bold tracking-tight text-[var(--color-foreground)]",
+  h2: "text-3xl font-bold tracking-tight text-[var(--color-foreground)]",
+  h3: "text-2xl font-bold text-[var(--color-foreground)]",
+  h4: "text-xl font-bold text-[var(--color-foreground)]",
+  h5: "text-lg font-bold text-[var(--color-foreground)]",
+  h6: "text-base font-bold text-[var(--color-foreground)]",
+  heading: "text-2xl font-bold text-[var(--color-foreground)]",
+  subheading: "text-lg font-semibold text-[var(--color-foreground)]",
+  body1: "text-base font-normal text-[var(--color-foreground)]",
+  body2: "text-sm font-normal text-[var(--color-foreground)]",
+  body: "text-base font-normal text-[var(--color-foreground)]",
+  caption: "text-xs font-normal text-[var(--color-muted-foreground)]",
+  overline: "text-xs uppercase tracking-wide font-bold text-[var(--color-muted-foreground)]",
+  small: "text-sm font-normal text-[var(--color-foreground)]",
+  large: "text-lg font-medium text-[var(--color-foreground)]",
+  label: "text-sm font-medium text-[var(--color-foreground)]"
+};
+var colorStyles = {
+  primary: "text-[var(--color-foreground)]",
+  secondary: "text-[var(--color-muted-foreground)]",
+  muted: "text-[var(--color-muted-foreground)]",
+  error: "text-[var(--color-error)]",
+  success: "text-[var(--color-success)]",
+  warning: "text-[var(--color-warning)]",
+  inherit: "text-inherit"
+};
+var weightStyles = {
+  light: "font-light",
+  normal: "font-normal",
+  medium: "font-medium",
+  semibold: "font-semibold",
+  bold: "font-bold"
+};
+var defaultElements = {
+  h1: "h1",
+  h2: "h2",
+  h3: "h3",
+  h4: "h4",
+  h5: "h5",
+  h6: "h6",
+  heading: "h2",
+  subheading: "h3",
+  body1: "p",
+  body2: "p",
+  body: "p",
+  caption: "span",
+  overline: "span",
+  small: "span",
+  large: "p",
+  label: "span"
+};
+var typographySizeStyles = {
+  xs: "text-xs",
+  sm: "text-sm",
+  md: "text-base",
+  lg: "text-lg",
+  xl: "text-xl",
+  "2xl": "text-2xl",
+  "3xl": "text-3xl"
+};
+var overflowStyles2 = {
+  visible: "overflow-visible",
+  hidden: "overflow-hidden",
+  wrap: "break-words overflow-hidden",
+  "clamp-2": "overflow-hidden line-clamp-2",
+  "clamp-3": "overflow-hidden line-clamp-3"
+};
+var Typography = ({
+  variant: variantProp,
+  level,
+  color = "primary",
+  align,
+  weight,
+  size,
+  truncate = false,
+  overflow,
+  as,
+  id,
+  className,
+  style,
+  content,
+  children
+}) => {
+  const variant = variantProp ?? (level ? `h${level}` : "body1");
+  const Component2 = as || defaultElements[variant];
+  const Comp = Component2;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      id,
+      className: cn(
+        variantStyles[variant],
+        colorStyles[color],
+        weight && weightStyles[weight],
+        size && typographySizeStyles[size],
+        align && `text-${align}`,
+        truncate && "truncate overflow-hidden text-ellipsis",
+        overflow && overflowStyles2[overflow],
+        className
+      ),
+      style,
+      children: children ?? content
+    }
+  );
+};
+Typography.displayName = "Typography";
+var variantStyles2 = {
+  primary: [
+    "bg-[var(--color-primary)] text-[var(--color-primary-foreground)]",
+    "border-[length:var(--border-width)] border-[var(--color-border)]",
+    "shadow-[var(--shadow-sm)]",
+    "hover:bg-[var(--color-primary-hover)] hover:shadow-[var(--shadow-hover)]",
+    "active:scale-[var(--active-scale)] active:shadow-[var(--shadow-active)]"
+  ].join(" "),
+  secondary: [
+    "bg-[var(--color-secondary)] text-[var(--color-secondary-foreground)]",
+    "border-[length:var(--border-width-thin)] border-[var(--color-border)]",
+    "hover:bg-[var(--color-secondary-hover)]",
+    "active:scale-[var(--active-scale)]"
+  ].join(" "),
+  ghost: [
+    "bg-transparent text-[var(--color-muted-foreground)]",
+    "hover:text-[var(--color-foreground)] hover:bg-[var(--color-muted)]",
+    "active:scale-[var(--active-scale)]"
+  ].join(" "),
+  danger: [
+    "bg-[var(--color-surface)] text-[var(--color-error)]",
+    "border-[length:var(--border-width)] border-[var(--color-error)]",
+    "shadow-[var(--shadow-sm)]",
+    "hover:bg-[var(--color-error)] hover:text-[var(--color-error-foreground)] hover:shadow-[var(--shadow-hover)]",
+    "active:scale-[var(--active-scale)] active:shadow-[var(--shadow-active)]"
+  ].join(" "),
+  success: [
+    "bg-[var(--color-surface)] text-[var(--color-success)]",
+    "border-[length:var(--border-width)] border-[var(--color-success)]",
+    "shadow-[var(--shadow-sm)]",
+    "hover:bg-[var(--color-success)] hover:text-[var(--color-success-foreground)] hover:shadow-[var(--shadow-hover)]",
+    "active:scale-[var(--active-scale)] active:shadow-[var(--shadow-active)]"
+  ].join(" "),
+  warning: [
+    "bg-[var(--color-surface)] text-[var(--color-warning)]",
+    "border-[length:var(--border-width)] border-[var(--color-warning)]",
+    "shadow-[var(--shadow-sm)]",
+    "hover:bg-[var(--color-warning)] hover:text-[var(--color-warning-foreground)] hover:shadow-[var(--shadow-hover)]",
+    "active:scale-[var(--active-scale)] active:shadow-[var(--shadow-active)]"
+  ].join(" "),
+  // "default" is an alias for secondary
+  default: [
+    "bg-[var(--color-secondary)] text-[var(--color-secondary-foreground)]",
+    "border-[length:var(--border-width-thin)] border-[var(--color-border)]",
+    "hover:bg-[var(--color-secondary-hover)]",
+    "active:scale-[var(--active-scale)]"
+  ].join(" ")
+};
+variantStyles2.destructive = variantStyles2.danger;
+var sizeStyles2 = {
+  sm: "px-3 py-1.5 text-sm",
+  md: "px-4 py-2 text-sm",
+  lg: "px-6 py-3 text-base"
+};
+var iconSizeStyles = {
+  sm: "h-3.5 w-3.5",
+  md: "h-4 w-4",
+  lg: "h-5 w-5"
+};
+function resolveIconProp(value, sizeClass) {
+  if (!value) return null;
+  if (typeof value === "string") {
+    const Resolved = resolveIcon(value);
+    return Resolved ? /* @__PURE__ */ jsxRuntime.jsx(Resolved, { className: sizeClass }) : null;
+  }
+  if (typeof value === "function") {
+    const IconComp = value;
+    return /* @__PURE__ */ jsxRuntime.jsx(IconComp, { className: sizeClass });
+  }
+  if (React113__namespace.default.isValidElement(value)) {
+    return value;
+  }
+  if (typeof value === "object" && value !== null && "render" in value) {
+    const IconComp = value;
+    return /* @__PURE__ */ jsxRuntime.jsx(IconComp, { className: sizeClass });
+  }
+  return value;
+}
+var Button = React113__namespace.default.forwardRef(
+  ({
+    className,
+    variant = "primary",
+    size = "md",
+    isLoading = false,
+    disabled,
+    leftIcon,
+    rightIcon,
+    icon: iconProp,
+    iconRight: iconRightProp,
+    action,
+    actionPayload,
+    label,
+    children,
+    onClick,
+    ...props
+  }, ref) => {
+    const eventBus = useEventBus();
+    const leftIconValue = leftIcon || iconProp;
+    const rightIconValue = rightIcon || iconRightProp;
+    const resolvedLeftIcon = resolveIconProp(leftIconValue, iconSizeStyles[size]);
+    const resolvedRightIcon = resolveIconProp(rightIconValue, iconSizeStyles[size]);
+    const handleClick = (e) => {
+      if (action) {
+        eventBus.emit(`UI:${action}`, actionPayload ?? {});
+      }
+      onClick?.(e);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        ref,
+        disabled: disabled || isLoading,
+        className: cn(
+          "inline-flex items-center justify-center gap-2",
+          "font-[var(--font-weight-medium)]",
+          "rounded-[var(--radius-sm)]",
+          "transition-all duration-[var(--transition-normal)]",
+          "focus:outline-none focus:ring-[length:var(--focus-ring-width)] focus:ring-[var(--color-ring)] focus:ring-offset-[length:var(--focus-ring-offset)]",
+          "disabled:opacity-50 disabled:cursor-not-allowed",
+          variantStyles2[variant],
+          sizeStyles2[size],
+          className
+        ),
+        onClick: handleClick,
+        ...props,
+        "data-testid": props["data-testid"] ?? (action ? `action-${action}` : void 0),
+        children: [
+          isLoading ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Loader2, { className: "h-4 w-4 animate-spin" }) : resolvedLeftIcon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedLeftIcon }),
+          children || label,
+          resolvedRightIcon && !isLoading && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-shrink-0", children: resolvedRightIcon })
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+var variantStyles3 = {
+  default: [
+    "bg-[var(--color-muted)] text-[var(--color-foreground)]",
+    "border-[length:var(--border-width-thin)] border-[var(--color-border)]"
+  ].join(" "),
+  primary: "bg-[var(--color-primary)] text-[var(--color-primary-foreground)]",
+  secondary: "bg-[var(--color-secondary)] text-[var(--color-secondary-foreground)]",
+  success: [
+    "bg-[var(--color-surface)] text-[var(--color-success)]",
+    "border-[length:var(--border-width)] border-[var(--color-success)]"
+  ].join(" "),
+  warning: [
+    "bg-[var(--color-surface)] text-[var(--color-warning)]",
+    "border-[length:var(--border-width)] border-[var(--color-warning)]"
+  ].join(" "),
+  danger: [
+    "bg-[var(--color-surface)] text-[var(--color-error)]",
+    "border-[length:var(--border-width)] border-[var(--color-error)]"
+  ].join(" "),
+  error: [
+    "bg-[var(--color-surface)] text-[var(--color-error)]",
+    "border-[length:var(--border-width)] border-[var(--color-error)]"
+  ].join(" "),
+  info: [
+    "bg-[var(--color-surface)] text-[var(--color-info)]",
+    "border-[length:var(--border-width)] border-[var(--color-info)]"
+  ].join(" "),
+  neutral: [
+    "bg-[var(--color-muted)] text-[var(--color-muted-foreground)]",
+    "border-[length:var(--border-width-thin)] border-[var(--color-border)]"
+  ].join(" ")
+};
+var sizeStyles3 = {
+  sm: "px-2 py-0.5 text-xs",
+  md: "px-2.5 py-1 text-sm",
+  lg: "px-3 py-1.5 text-base"
+};
+var Badge = React113__namespace.default.forwardRef(
+  ({ className, variant = "default", size = "sm", amount, label, icon, children, ...props }, ref) => {
+    const iconSizes2 = { sm: "w-3 h-3", md: "w-3.5 h-3.5", lg: "w-4 h-4" };
+    const resolvedIcon = typeof icon === "string" ? (() => {
+      const I = resolveIcon(icon);
+      return I ? /* @__PURE__ */ jsxRuntime.jsx(I, { className: iconSizes2[size] }) : null;
+    })() : icon;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "span",
+      {
+        ref,
+        className: cn(
+          "inline-flex items-center gap-1 font-bold rounded-[var(--radius-sm)]",
+          variantStyles3[variant],
+          sizeStyles3[size],
+          className
+        ),
+        ...props,
+        children: [
+          resolvedIcon,
+          children || (amount != null ? `${label ? `${label} ` : ""}${amount}` : label)
+        ]
+      }
+    );
+  }
+);
+Badge.displayName = "Badge";
+var Input = React113__namespace.default.forwardRef(
+  ({
+    className,
+    inputType,
+    type: htmlType,
+    error,
+    leftIcon,
+    rightIcon,
+    icon: IconComponent,
+    clearable,
+    onClear,
+    value,
+    options,
+    rows = 3,
+    onChange,
+    ...props
+  }, ref) => {
+    const type = inputType || htmlType || "text";
+    const resolvedLeftIcon = leftIcon || IconComponent && /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { className: "h-4 w-4" });
+    const showClearButton = clearable && value && String(value).length > 0;
+    const baseClassName = cn(
+      "block w-full rounded-[var(--radius-sm)] transition-all duration-[var(--transition-fast)]",
+      "border-[length:var(--border-width-thin)] border-[var(--color-border)]",
+      "px-3 py-2 text-sm",
+      "bg-[var(--color-card)] hover:bg-[var(--color-muted)] focus:bg-[var(--color-card)]",
+      "text-[var(--color-foreground)] placeholder:text-[var(--color-muted-foreground)]",
+      "focus:outline-none focus:ring-1 focus:ring-[var(--color-ring)] focus:border-[var(--color-ring)]",
+      "disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-[var(--color-muted)]",
+      error ? "border-[var(--color-error)] focus:border-[var(--color-error)] focus:ring-[var(--color-error)]" : "",
+      resolvedLeftIcon && "pl-10",
+      (rightIcon || showClearButton) && "pr-10",
+      className
+    );
+    if (type === "select") {
+      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+        resolvedLeftIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none text-[var(--color-muted-foreground)]", children: resolvedLeftIcon }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "select",
+          {
+            ref,
+            value,
+            onChange,
+            className: cn(baseClassName, "appearance-none pr-10", className),
+            ...props,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: "Select..." }),
+              options?.map((opt) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: opt.value, children: opt.label }, opt.value))
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none text-[var(--color-muted-foreground)]", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronDown, { className: "h-4 w-4" }) })
+      ] });
+    }
+    if (type === "textarea") {
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          ref,
+          value,
+          onChange,
+          rows,
+          className: baseClassName,
+          ...props
+        }
+      ) });
+    }
+    if (type === "checkbox") {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref,
+          type: "checkbox",
+          checked: props.checked,
+          onChange,
+          className: cn(
+            "h-4 w-4 rounded-[var(--radius-sm)]",
+            "border-[var(--color-border)]",
+            "text-[var(--color-primary)] focus:ring-[var(--color-ring)]",
+            "disabled:opacity-50 disabled:cursor-not-allowed",
+            className
+          ),
+          ...props
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      resolvedLeftIcon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none text-[var(--color-muted-foreground)]", children: resolvedLeftIcon }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref,
+          type,
+          value,
+          onChange,
+          className: baseClassName,
+          ...props
+        }
+      ),
+      showClearButton && /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onClear,
+          className: "absolute inset-y-0 right-0 pr-3 flex items-center text-[var(--color-muted-foreground)] hover:text-[var(--color-foreground)]",
+          children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.X, { className: "h-4 w-4" })
+        }
+      ),
+      rightIcon && !showClearButton && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center text-[var(--color-muted-foreground)]", children: rightIcon })
+    ] });
+  }
+);
+Input.displayName = "Input";
+var Label = React113__namespace.default.forwardRef(
+  ({ className, required, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "label",
+      {
+        ref,
+        className: cn(
+          "block text-sm font-bold text-[var(--color-foreground)]",
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[var(--color-error)] ml-1", children: "*" })
+        ]
+      }
+    );
+  }
+);
+Label.displayName = "Label";
+var Textarea = React113__namespace.default.forwardRef(
+  ({ className, error, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        ref,
+        className: cn(
+          "block w-full border-[length:var(--border-width)] shadow-[var(--shadow-sm)]",
+          "px-3 py-2 text-sm text-[var(--color-foreground)]",
+          "bg-[var(--color-card)]",
+          "placeholder:text-[var(--color-placeholder)]",
+          "focus:outline-none focus:ring-2 focus:ring-offset-0 focus:ring-[var(--color-ring)]",
+          "disabled:bg-[var(--color-muted)] disabled:text-[var(--color-muted-foreground)] disabled:cursor-not-allowed",
+          "resize-y min-h-[80px]",
+          error ? "border-[var(--color-error)] focus:border-[var(--color-error)]" : "border-[var(--color-border)] focus:border-[var(--color-primary)]",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+Textarea.displayName = "Textarea";
+var Select = React113__namespace.default.forwardRef(
+  ({ className, options, placeholder, error, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        "select",
+        {
+          ref,
+          className: cn(
+            "block w-full border-[length:var(--border-width)] shadow-[var(--shadow-sm)] appearance-none",
+            "px-3 py-2 pr-10 text-sm text-[var(--color-foreground)] font-medium",
+            "bg-[var(--color-card)]",
+            "focus:outline-none focus:ring-2 focus:ring-offset-0 focus:ring-[var(--color-ring)]",
+            "disabled:bg-[var(--color-muted)] disabled:text-[var(--color-muted-foreground)] disabled:cursor-not-allowed",
+            error ? "border-[var(--color-error)] focus:border-[var(--color-error)]" : "border-[var(--color-border)] focus:border-[var(--color-primary)]",
+            className
+          ),
+          ...props,
+          children: [
+            placeholder && /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: placeholder }),
+            options.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
+              "option",
+              {
+                value: option.value,
+                disabled: option.disabled,
+                children: option.label
+              },
+              option.value
+            ))
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.ChevronDown, { className: "h-4 w-4 text-[var(--color-foreground)]" }) })
+    ] });
+  }
+);
+Select.displayName = "Select";
+var Checkbox = React113__namespace.default.forwardRef(
+  ({ className, label, id, ...props }, ref) => {
+    const inputId = id || `checkbox-${Math.random().toString(36).substr(2, 9)}`;
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex items-center", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref,
+          type: "checkbox",
+          id: inputId,
+          className: cn(
+            "peer h-4 w-4 border-[length:var(--border-width)] border-[var(--color-border)]",
+            "accent-[var(--color-primary)] focus:ring-[var(--color-ring)] focus:ring-offset-0",
+            "bg-[var(--color-card)] checked:bg-[var(--color-primary)]",
+            "disabled:opacity-50 disabled:cursor-not-allowed",
+            className
+          ),
+          ...props
+        }
+      ) }),
+      label && /* @__PURE__ */ jsxRuntime.jsx(
+        "label",
+        {
+          htmlFor: inputId,
+          className: "ml-2 text-sm text-[var(--color-foreground)] font-medium cursor-pointer select-none",
+          children: label
+        }
+      )
+    ] });
+  }
+);
+Checkbox.displayName = "Checkbox";
+var variantStyles4 = {
+  default: [
+    "bg-[var(--color-card)] border-none",
+    "transition-all duration-[var(--transition-normal)]",
+    "hover:shadow-[var(--shadow-hover)] hover:-translate-y-0.5"
+  ].join(" "),
+  bordered: [
+    "bg-[var(--color-card)]",
+    "border-[length:var(--border-width)] border-[var(--color-border)]",
+    "shadow-none",
+    "transition-all duration-[var(--transition-normal)]",
+    "hover:shadow-[var(--shadow-hover)] hover:-translate-y-0.5"
+  ].join(" "),
+  elevated: [
+    "bg-[var(--color-card)]",
+    "border-[length:var(--border-width)] border-[var(--color-border)]",
+    "shadow-[var(--shadow-main)]",
+    "transition-all duration-[var(--transition-normal)]",
+    "hover:shadow-[var(--shadow-hover)] hover:-translate-y-0.5"
+  ].join(" "),
+  // Interactive variant with theme-specific hover effects
+  interactive: [
+    "bg-[var(--color-card)]",
+    "border-[length:var(--border-width)] border-[var(--color-border)]",
+    "shadow-[var(--shadow-main)]",
+    "cursor-pointer",
+    "transition-all duration-[var(--transition-normal)]",
+    "hover:shadow-[var(--shadow-hover)]"
+  ].join(" ")
+};
+var paddingStyles2 = {
+  none: "",
+  sm: "p-3",
+  md: "p-4",
+  lg: "p-6"
+};
+var shadowStyles2 = {
+  none: "shadow-none",
+  sm: "shadow-[var(--shadow-sm)]",
+  md: "shadow-[var(--shadow-main)]",
+  lg: "shadow-[var(--shadow-lg)]"
+};
+var Card = React113__namespace.default.forwardRef(
+  ({
+    className,
+    variant = "bordered",
+    padding = "md",
+    title,
+    subtitle,
+    shadow,
+    children,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "rounded-[var(--radius-md)]",
+          "transition-all duration-[var(--transition-normal)]",
+          variantStyles4[variant],
+          paddingStyles2[padding],
+          shadow && shadowStyles2[shadow],
+          className
+        ),
+        ...props,
+        children: [
+          (title || subtitle) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
+            title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg text-[var(--color-card-foreground)] font-[var(--font-weight-bold)]", children: title }),
+            subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-[var(--color-muted-foreground)] mt-1", children: subtitle })
+          ] }),
+          children
+        ]
+      }
+    );
+  }
+);
+Card.displayName = "Card";
+var CardHeader = React113__namespace.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("mb-4", className), ...props }));
+CardHeader.displayName = "CardHeader";
+var CardTitle = React113__namespace.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "h3",
+  {
+    ref,
+    className: cn(
+      "text-lg text-[var(--color-card-foreground)]",
+      "font-[var(--font-weight-bold)]",
+      className
+    ),
+    ...props
+  }
+));
+CardTitle.displayName = "CardTitle";
+var CardContent = React113__namespace.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("", className), ...props }));
+CardContent.displayName = "CardContent";
+var CardBody = CardContent;
+CardBody.displayName = "CardBody";
+var CardFooter = React113__namespace.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    className: cn("mt-4 flex items-center", className),
+    ...props
+  }
+));
+CardFooter.displayName = "CardFooter";
+var sizeStyles4 = {
+  xs: "h-3 w-3",
+  sm: "h-4 w-4",
+  md: "h-6 w-6",
+  lg: "h-8 w-8"
+};
+var Spinner = React113__namespace.default.forwardRef(
+  ({ className, size = "md", ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: cn("text-[var(--color-foreground)]", className),
+        ...props,
+        children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Loader2, { className: cn("animate-spin", sizeStyles4[size]) })
+      }
+    );
+  }
+);
+Spinner.displayName = "Spinner";
+var Radio = React113__namespace.default.forwardRef(
+  ({
+    label,
+    helperText,
+    error,
+    size = "md",
+    className,
+    id,
+    checked,
+    disabled,
+    ...props
+  }, ref) => {
+    const radioId = id || `radio-${Math.random().toString(36).substr(2, 9)}`;
+    const hasError = !!error;
+    const sizeClasses6 = {
+      sm: "w-4 h-4",
+      md: "w-5 h-5",
+      lg: "w-6 h-6"
+    };
+    const dotSizeClasses = {
+      sm: "w-2 h-2",
+      md: "w-2.5 h-2.5",
+      lg: "w-3 h-3"
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-shrink-0 mt-0.5", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              ref,
+              type: "radio",
+              id: radioId,
+              checked,
+              disabled,
+              className: cn("sr-only peer", className),
+              "aria-invalid": hasError,
+              "aria-describedby": error ? `${radioId}-error` : helperText ? `${radioId}-helper` : void 0,
+              ...props
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "label",
+            {
+              htmlFor: radioId,
+              className: cn(
+                "flex items-center justify-center",
+                "border-[length:var(--border-width)] transition-all cursor-pointer",
+                sizeClasses6[size],
+                hasError ? "border-[var(--color-error)] peer-focus:ring-[var(--color-error)]/20" : "border-[var(--color-border)] peer-focus:ring-[var(--color-ring)]/20",
+                checked ? hasError ? "border-[var(--color-error)]" : "border-[var(--color-primary)] bg-[var(--color-primary)]" : "",
+                "peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-offset-2",
+                disabled && "opacity-50 cursor-not-allowed",
+                !disabled && "hover:border-[var(--color-border-hover)]"
+              ),
+              children: checked && /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "transition-all",
+                    dotSizeClasses[size],
+                    hasError ? "bg-[var(--color-error)]" : "bg-[var(--color-primary-foreground)]"
+                  )
+                }
+              )
+            }
+          )
+        ] }),
+        label && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "label",
+          {
+            htmlFor: radioId,
+            className: cn(
+              "block text-sm font-medium cursor-pointer select-none",
+              hasError ? "text-[var(--color-error)]" : "text-[var(--color-foreground)]",
+              disabled && "opacity-50 cursor-not-allowed"
+            ),
+            children: label
+          }
+        ) })
+      ] }),
+      (helperText || error) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1.5 ml-8", children: [
+        error && /* @__PURE__ */ jsxRuntime.jsx(
+          "p",
+          {
+            id: `${radioId}-error`,
+            className: "text-sm text-[var(--color-error)] font-medium",
+            role: "alert",
+            children: error
+          }
+        ),
+        !error && helperText && /* @__PURE__ */ jsxRuntime.jsx(
+          "p",
+          {
+            id: `${radioId}-helper`,
+            className: "text-sm text-[var(--color-muted-foreground)]",
+            children: helperText
+          }
+        )
+      ] })
+    ] });
+  }
+);
+Radio.displayName = "Radio";
+var Switch = React113__namespace.forwardRef(
+  ({
+    checked,
+    defaultChecked = false,
+    onChange,
+    disabled = false,
+    label,
+    id,
+    name,
+    className
+  }, ref) => {
+    const [isChecked, setIsChecked] = React113__namespace.useState(
+      checked !== void 0 ? checked : defaultChecked
+    );
+    React113__namespace.useEffect(() => {
+      if (checked !== void 0) {
+        setIsChecked(checked);
+      }
+    }, [checked]);
+    const handleClick = () => {
+      if (disabled) return;
+      const newValue = !isChecked;
+      if (checked === void 0) {
+        setIsChecked(newValue);
+      }
+      onChange?.(newValue);
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("inline-flex items-center gap-2", className), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          ref,
+          type: "button",
+          role: "switch",
+          "aria-checked": isChecked,
+          "aria-label": label,
+          id,
+          name,
+          disabled,
+          onClick: handleClick,
+          className: cn(
+            "relative inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+            isChecked ? "bg-primary" : "bg-muted",
+            disabled && "cursor-not-allowed opacity-50"
+          ),
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: cn(
+                "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform",
+                isChecked ? "translate-x-5" : "translate-x-0"
+              )
+            }
+          )
+        }
+      ),
+      label && /* @__PURE__ */ jsxRuntime.jsx(
+        "label",
+        {
+          htmlFor: id,
+          className: cn(
+            "text-sm font-medium leading-none cursor-pointer",
+            disabled && "cursor-not-allowed opacity-70"
+          ),
+          onClick: handleClick,
+          children: label
+        }
+      )
+    ] });
+  }
+);
+Switch.displayName = "Switch";
+var gapStyles = {
+  none: "gap-0",
+  xs: "gap-1",
+  sm: "gap-2",
+  md: "gap-4",
+  lg: "gap-6",
+  xl: "gap-8",
+  "2xl": "gap-12"
+};
+var alignStyles = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch",
+  baseline: "items-baseline"
+};
+var justifyStyles = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between",
+  around: "justify-around",
+  evenly: "justify-evenly"
+};
+var Stack = ({
+  direction = "vertical",
+  gap = "md",
+  align = "stretch",
+  justify = "start",
+  wrap = false,
+  reverse = false,
+  flex = false,
+  className,
+  style,
+  children,
+  as: Component2 = "div",
+  onClick,
+  onKeyDown,
+  role,
+  tabIndex,
+  action,
+  actionPayload,
+  responsive = false
+}) => {
+  const eventBus = useEventBus();
+  const handleClick = (e) => {
+    if (action) {
+      eventBus.emit(`UI:${action}`, actionPayload ?? {});
+    }
+    onClick?.(e);
+  };
+  const isHorizontal = direction === "horizontal";
+  const directionClass = responsive && isHorizontal ? reverse ? "flex-col-reverse md:flex-row-reverse" : "flex-col md:flex-row" : isHorizontal ? reverse ? "flex-row-reverse" : "flex-row" : reverse ? "flex-col-reverse" : "flex-col";
+  const Comp = Component2;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      className: cn(
+        "flex",
+        directionClass,
+        gapStyles[gap],
+        alignStyles[align],
+        justifyStyles[justify],
+        wrap && "flex-wrap",
+        flex && "flex-1",
+        className
+      ),
+      style,
+      onClick: action || onClick ? handleClick : void 0,
+      onKeyDown,
+      role,
+      tabIndex,
+      children
+    }
+  );
+};
+var VStack = (props) => /* @__PURE__ */ jsxRuntime.jsx(Stack, { direction: "vertical", ...props });
+var HStack = (props) => /* @__PURE__ */ jsxRuntime.jsx(Stack, { direction: "horizontal", ...props });
+var statusColors = {
+  online: "bg-[var(--color-success)]",
+  offline: "bg-[var(--color-muted-foreground)]",
+  away: "bg-[var(--color-warning)]",
+  busy: "bg-[var(--color-error)]",
+  warning: "bg-[var(--color-warning)]",
+  critical: "bg-[var(--color-error)]"
+};
+var pulseRingColors = {
+  online: "ring-[var(--color-success)]",
+  offline: "ring-[var(--color-muted-foreground)]",
+  away: "ring-[var(--color-warning)]",
+  busy: "ring-[var(--color-error)]",
+  warning: "ring-[var(--color-warning)]",
+  critical: "ring-[var(--color-error)]"
+};
+var sizeStyles5 = {
+  sm: "w-2 h-2",
+  md: "w-2.5 h-2.5",
+  lg: "w-3 h-3"
+};
+var StatusDot = React113__namespace.default.forwardRef(
+  ({ className, status = "offline", pulse = false, size = "md", label, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        ref,
+        className: cn(
+          "inline-block rounded-full flex-shrink-0",
+          statusColors[status],
+          sizeStyles5[size],
+          pulse && [
+            "animate-pulse",
+            "ring-2 ring-offset-1",
+            pulseRingColors[status],
+            "ring-opacity-40"
+          ],
+          className
+        ),
+        role: "status",
+        "aria-label": label ?? status,
+        ...props
+      }
+    );
+  }
+);
+StatusDot.displayName = "StatusDot";
+var sizeStyles6 = {
+  sm: { icon: "w-3 h-3", text: "text-xs" },
+  md: { icon: "w-4 h-4", text: "text-sm" },
+  lg: { icon: "w-5 h-5", text: "text-base" }
+};
+function resolveDirection(value, direction) {
+  if (direction) return direction;
+  if (value === void 0 || value === 0) return "flat";
+  return value > 0 ? "up" : "down";
+}
+function resolveColor(dir, invert) {
+  if (dir === "flat") return "text-[var(--color-muted-foreground)]";
+  const isPositive = dir === "up";
+  const isGood = invert ? !isPositive : isPositive;
+  return isGood ? "text-[var(--color-success)]" : "text-[var(--color-error)]";
+}
+var iconMap2 = {
+  up: LucideIcons.TrendingUp,
+  down: LucideIcons.TrendingDown,
+  flat: LucideIcons.ArrowRight
+};
+var TrendIndicator = React113__namespace.default.forwardRef(
+  ({
+    className,
+    value,
+    direction,
+    showValue = true,
+    invert = false,
+    label,
+    size = "md",
+    ...props
+  }, ref) => {
+    const dir = resolveDirection(value, direction);
+    const colorClass = resolveColor(dir, invert);
+    const IconComponent = iconMap2[dir];
+    const styles = sizeStyles6[size];
+    const formattedValue = value !== void 0 ? `${value > 0 ? "+" : ""}${value}%` : void 0;
+    const ariaLabel = label ?? (formattedValue ? `${dir} ${formattedValue}` : dir);
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "span",
+      {
+        ref,
+        className: cn(
+          "inline-flex items-center gap-1 font-medium",
+          colorClass,
+          styles.text,
+          className
+        ),
+        role: "status",
+        "aria-label": ariaLabel,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { className: styles.icon }),
+          showValue && formattedValue && /* @__PURE__ */ jsxRuntime.jsx("span", { children: formattedValue })
+        ]
+      }
+    );
+  }
+);
+TrendIndicator.displayName = "TrendIndicator";
+function useSafeEventBus() {
+  try {
+    return useEventBus();
+  } catch {
+    return { emit: () => {
+    }, on: () => () => {
+    }, once: () => {
+    } };
+  }
+}
+var trackSizes = {
+  sm: "h-1",
+  md: "h-1.5",
+  lg: "h-2"
+};
+var thumbSizes = {
+  sm: "w-3 h-3",
+  md: "w-4 h-4",
+  lg: "w-5 h-5"
+};
+var RangeSlider = React113__namespace.default.forwardRef(
+  ({
+    className,
+    min = 0,
+    max = 100,
+    value = 0,
+    step = 1,
+    showTooltip = false,
+    showTicks = false,
+    buffered,
+    size = "md",
+    disabled = false,
+    action,
+    actionPayload,
+    onChange,
+    formatValue: formatValue5,
+    ...props
+  }, ref) => {
+    const [isDragging, setIsDragging] = React113.useState(false);
+    const [showTip, setShowTip] = React113.useState(false);
+    const inputRef = React113.useRef(null);
+    const eventBus = useSafeEventBus();
+    const percentage = max !== min ? (value - min) / (max - min) * 100 : 0;
+    const bufferedPercentage = buffered !== void 0 ? Math.min(buffered, 100) : void 0;
+    const displayValue = formatValue5 ? formatValue5(value) : String(value);
+    const handleChange = React113.useCallback(
+      (e) => {
+        const newValue = Number(e.target.value);
+        onChange?.(newValue);
+        if (action) {
+          eventBus.emit(`UI:${action}`, { ...actionPayload, value: newValue });
+        }
+      },
+      [onChange, action, actionPayload, eventBus]
+    );
+    const tickCount = showTicks ? Math.min(Math.floor((max - min) / step), 20) : 0;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "relative w-full",
+          disabled && "opacity-50 cursor-not-allowed",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative w-full py-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: cn(
+                  "absolute inset-x-0 rounded-full bg-[var(--color-muted)]",
+                  trackSizes[size]
+                ),
+                style: { top: "50%", transform: "translateY(-50%)" }
+              }
+            ),
+            bufferedPercentage !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: cn(
+                  "absolute rounded-full bg-[var(--color-muted-foreground)] opacity-30",
+                  trackSizes[size]
+                ),
+                style: {
+                  top: "50%",
+                  transform: "translateY(-50%)",
+                  left: 0,
+                  width: `${bufferedPercentage}%`
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: cn(
+                  "absolute rounded-full bg-[var(--color-primary)]",
+                  trackSizes[size]
+                ),
+                style: {
+                  top: "50%",
+                  transform: "translateY(-50%)",
+                  left: 0,
+                  width: `${percentage}%`
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "input",
+              {
+                ref: inputRef,
+                type: "range",
+                min,
+                max,
+                step,
+                value,
+                disabled,
+                onChange: handleChange,
+                onMouseDown: () => {
+                  setIsDragging(true);
+                  setShowTip(true);
+                },
+                onMouseUp: () => {
+                  setIsDragging(false);
+                  setShowTip(false);
+                },
+                onTouchStart: () => {
+                  setIsDragging(true);
+                  setShowTip(true);
+                },
+                onTouchEnd: () => {
+                  setIsDragging(false);
+                  setShowTip(false);
+                },
+                onFocus: () => setShowTip(true),
+                onBlur: () => {
+                  if (!isDragging) setShowTip(false);
+                },
+                className: cn(
+                  "absolute inset-0 w-full opacity-0 cursor-pointer",
+                  disabled && "cursor-not-allowed",
+                  // Thumb sizing via pseudo-element
+                  "[&::-webkit-slider-thumb]:appearance-none",
+                  "[&::-webkit-slider-thumb]:w-5 [&::-webkit-slider-thumb]:h-5",
+                  "[&::-moz-range-thumb]:w-5 [&::-moz-range-thumb]:h-5"
+                ),
+                style: { height: "100%", margin: 0 },
+                "aria-label": props["aria-label"] ?? "Range slider",
+                "aria-valuemin": min,
+                "aria-valuemax": max,
+                "aria-valuenow": value,
+                "aria-valuetext": displayValue
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: cn(
+                  "absolute rounded-full bg-[var(--color-primary-foreground)]",
+                  "border-2 border-[var(--color-primary)]",
+                  "shadow-[var(--shadow-sm)]",
+                  "pointer-events-none",
+                  "transition-transform duration-100",
+                  isDragging && "scale-110",
+                  thumbSizes[size]
+                ),
+                style: {
+                  top: "50%",
+                  transform: `translateY(-50%) translateX(-50%)${isDragging ? " scale(1.1)" : ""}`,
+                  left: `${percentage}%`
+                }
+              }
+            ),
+            showTooltip && showTip && /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: cn(
+                  "absolute -top-8 px-2 py-0.5 rounded",
+                  "bg-[var(--color-foreground)] text-[var(--color-background)]",
+                  "text-xs font-medium whitespace-nowrap",
+                  "pointer-events-none"
+                ),
+                style: {
+                  left: `${percentage}%`,
+                  transform: "translateX(-50%)"
+                },
+                children: displayValue
+              }
+            )
+          ] }),
+          showTicks && tickCount > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative w-full h-2 mt-1", children: Array.from({ length: tickCount + 1 }, (_, i) => {
+            const tickPercent = i / tickCount * 100;
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              "div",
+              {
+                className: "absolute w-px h-1.5 bg-[var(--color-muted-foreground)]",
+                style: { left: `${tickPercent}%` }
+              },
+              i
+            );
+          }) })
+        ]
+      }
+    );
+  }
+);
+RangeSlider.displayName = "RangeSlider";
+var backgroundClasses = {
+  default: "",
+  alt: "bg-[var(--color-surface)]",
+  dark: "bg-[var(--color-foreground)] text-[var(--color-background)]",
+  gradient: [
+    "bg-gradient-to-b",
+    "from-[var(--color-primary)]/5",
+    "to-[var(--color-secondary)]/5"
+  ].join(" ")
+};
+var paddingClasses = {
+  sm: "py-12",
+  md: "py-16",
+  lg: "py-24"
+};
+var ContentSection = React113__namespace.default.forwardRef(
+  ({ children, background = "default", padding = "lg", id, className }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Box,
+      {
+        ref,
+        as: "section",
+        id,
+        className: cn(
+          backgroundClasses[background],
+          paddingClasses[padding],
+          className
+        ),
+        children: /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "mx-auto max-w-7xl px-4 sm:px-6 lg:px-8", children })
+      }
+    );
+  }
+);
+ContentSection.displayName = "ContentSection";
+var ErrorState = ({
+  title,
+  message,
+  description,
+  onRetry,
+  className,
+  retryEvent
+}) => {
+  const eventBus = useEventBus();
+  const { t } = useTranslate();
+  const handleRetry = () => {
+    if (retryEvent) eventBus.emit(`UI:${retryEvent}`, {});
+    onRetry?.();
+  };
+  const resolvedTitle = title ?? t("error.generic");
+  const resolvedMessage = message ?? description ?? t("error.occurred");
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    VStack,
+    {
+      align: "center",
+      className: cn(
+        "justify-center py-12 text-center",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "mb-4 rounded-[var(--radius-full)] bg-[var(--color-error)]/10 p-3", children: /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.AlertCircle, { className: "h-8 w-8 text-[var(--color-error)]" }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "h3", className: "text-lg font-medium text-[var(--color-foreground)]", children: resolvedTitle }),
+        /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "small", className: "mt-1 text-[var(--color-muted-foreground)] max-w-sm", children: resolvedMessage }),
+        (onRetry || retryEvent) && /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "secondary", className: "mt-4", onClick: handleRetry, children: t("error.retry") })
+      ]
+    }
+  );
+};
+ErrorState.displayName = "ErrorState";
+var ErrorBoundary = class extends React113__namespace.default.Component {
+  constructor(props) {
+    super(props);
+    __publicField(this, "reset", () => {
+      this.setState({ error: null });
+    });
+    this.state = { error: null };
+  }
+  static getDerivedStateFromError(error) {
+    return { error };
+  }
+  componentDidCatch(error, errorInfo) {
+    this.props.onError?.(error, errorInfo);
+  }
+  render() {
+    const { error } = this.state;
+    const { children, fallback, className } = this.props;
+    if (error) {
+      const wrapper = className ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(className), children: this.renderFallback(error, fallback) }) : this.renderFallback(error, fallback);
+      return wrapper;
+    }
+    return children;
+  }
+  renderFallback(error, fallback) {
+    if (typeof fallback === "function") {
+      return fallback(error, this.reset);
+    }
+    if (fallback) {
+      return fallback;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      ErrorState,
+      {
+        title: "Something went wrong",
+        message: error.message,
+        onRetry: this.reset
+      }
+    );
+  }
+};
+__publicField(ErrorBoundary, "displayName", "ErrorBoundary");
+var ClientEffectConfigContext = React113.createContext(null);
+ClientEffectConfigContext.Provider;
+React113.createContext(null);
+var defaultIcon = L__default.default.icon({
+  iconUrl: "https://unpkg.com/leaflet@1.9.4/dist/images/marker-icon.png",
+  iconRetinaUrl: "https://unpkg.com/leaflet@1.9.4/dist/images/marker-icon-2x.png",
+  shadowUrl: "https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png",
+  iconSize: [25, 41],
+  iconAnchor: [12, 41],
+  popupAnchor: [1, -34],
+  shadowSize: [41, 41]
+});
+L__default.default.Marker.prototype.options.icon = defaultIcon;
+
+// lib/verificationRegistry.ts
+var checks = /* @__PURE__ */ new Map();
+var transitions = [];
+var MAX_TRANSITIONS = 500;
+var listeners = /* @__PURE__ */ new Set();
+function notifyListeners() {
+  listeners.forEach((l) => l());
+  exposeOnWindow();
+}
+function registerCheck(id, label, status = "pending", details) {
+  checks.set(id, { id, label, status, details, updatedAt: Date.now() });
+  notifyListeners();
+}
+function getAllChecks() {
+  return Array.from(checks.values());
+}
+function recordTransition(trace) {
+  const entry = {
+    ...trace,
+    id: `t-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`
+  };
+  transitions.push(entry);
+  if (transitions.length > MAX_TRANSITIONS) {
+    transitions.shift();
+  }
+  if (entry.event === "INIT") {
+    const hasFetch = entry.effects.some((e) => e.type === "fetch");
+    const checkId = `init-fetch-${entry.traitName}`;
+    if (hasFetch) {
+      registerCheck(
+        checkId,
+        `INIT transition for "${entry.traitName}" has fetch effect`,
+        "pass"
+      );
+    } else {
+      const hasRenderUI = entry.effects.some((e) => e.type === "render-ui");
+      if (hasRenderUI) {
+        registerCheck(
+          checkId,
+          `INIT transition for "${entry.traitName}" missing fetch effect`,
+          "fail",
+          "Entity-bound render-ui without a fetch effect will show empty data"
+        );
+      }
+    }
+  }
+  const failedEffects = entry.effects.filter((e) => e.status === "failed");
+  if (failedEffects.length > 0) {
+    registerCheck(
+      `effects-${entry.id}`,
+      `Effects failed in ${entry.traitName}: ${entry.from} -> ${entry.to}`,
+      "fail",
+      failedEffects.map((e) => `${e.type}: ${e.error}`).join("; ")
+    );
+  }
+  notifyListeners();
+}
+function getTransitions() {
+  return [...transitions];
+}
+function getBridgeHealth() {
+  return null;
+}
+function getSummary() {
+  const allChecks = getAllChecks();
+  return {
+    totalChecks: allChecks.length,
+    passed: allChecks.filter((c) => c.status === "pass").length,
+    failed: allChecks.filter((c) => c.status === "fail").length,
+    warnings: allChecks.filter((c) => c.status === "warn").length,
+    pending: allChecks.filter((c) => c.status === "pending").length
+  };
+}
+function getSnapshot2() {
+  return {
+    checks: getAllChecks(),
+    transitions: getTransitions(),
+    bridge: getBridgeHealth(),
+    summary: getSummary()
+  };
+}
+function subscribeToVerification(listener) {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+function exposeOnWindow() {
+  if (typeof window === "undefined") return;
+  if (!window.__orbitalVerification) {
+    window.__orbitalVerification = {
+      getSnapshot: getSnapshot2,
+      getChecks: getAllChecks,
+      getTransitions,
+      getBridge: getBridgeHealth,
+      getSummary,
+      waitForTransition
+    };
+  }
+}
+function waitForTransition(event, timeoutMs = 1e4) {
+  return new Promise((resolve) => {
+    const existing = transitions.find((t) => t.event === event);
+    if (existing) {
+      resolve(existing);
+      return;
+    }
+    const timeout = setTimeout(() => {
+      unsub();
+      resolve(null);
+    }, timeoutMs);
+    const unsub = subscribeToVerification(() => {
+      const found = transitions.find((t) => t.event === event);
+      if (found) {
+        clearTimeout(timeout);
+        unsub();
+        resolve(found);
+      }
+    });
+  });
+}
+exposeOnWindow();
+var MarkdownContent = React113__namespace.default.memo(
+  ({ content, direction, className }) => {
+    const { t: _t } = useTranslate();
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Box,
+      {
+        className: cn("prose prose-slate dark:prose-invert max-w-none", className),
+        style: { direction },
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          ReactMarkdown__default.default,
+          {
+            remarkPlugins: [remarkMath__default.default, remarkGfm__default.default],
+            rehypePlugins: [
+              [rehypeKatex__default.default, { strict: false, throwOnError: false }]
+            ],
+            components: {
+              // Handle inline code only — fenced code blocks are parsed out separately
+              code({ className: codeClassName, children, ...props }) {
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "code",
+                  {
+                    ...props,
+                    className: codeClassName,
+                    style: {
+                      backgroundColor: "#1f2937",
+                      color: "#e5e7eb",
+                      padding: "0.125rem 0.375rem",
+                      borderRadius: "0.25rem",
+                      fontSize: "0.875em",
+                      fontFamily: "ui-monospace, monospace"
+                    },
+                    children
+                  }
+                );
+              },
+              // Style links
+              a({ href, children, ...props }) {
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "a",
+                  {
+                    href,
+                    ...props,
+                    className: "text-blue-600 dark:text-blue-400 hover:underline",
+                    target: href?.startsWith("http") ? "_blank" : void 0,
+                    rel: href?.startsWith("http") ? "noopener noreferrer" : void 0,
+                    children
+                  }
+                );
+              },
+              // Style tables
+              table({ children, ...props }) {
+                return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-x-auto my-4", children: /* @__PURE__ */ jsxRuntime.jsx(
+                  "table",
+                  {
+                    ...props,
+                    className: "min-w-full border-collapse border border-gray-300 dark:border-gray-600",
+                    children
+                  }
+                ) });
+              },
+              th({ children, ...props }) {
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "th",
+                  {
+                    ...props,
+                    className: "border border-gray-300 dark:border-gray-600 bg-gray-100 dark:bg-gray-800 px-4 py-2 text-left font-semibold",
+                    children
+                  }
+                );
+              },
+              td({ children, ...props }) {
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "td",
+                  {
+                    ...props,
+                    className: "border border-gray-300 dark:border-gray-600 px-4 py-2",
+                    children
+                  }
+                );
+              },
+              // Style blockquotes
+              blockquote({ children, ...props }) {
+                return /* @__PURE__ */ jsxRuntime.jsx(
+                  "blockquote",
+                  {
+                    ...props,
+                    className: "border-l-4 border-blue-500 pl-4 italic text-[var(--color-foreground)] my-4",
+                    children
+                  }
+                );
+              }
+            },
+            children: content
+          }
+        )
+      }
+    );
+  },
+  (prev, next) => prev.content === next.content && prev.className === next.className && prev.direction === next.direction
+);
+MarkdownContent.displayName = "MarkdownContent";
+var CodeBlock = React113__namespace.default.memo(
+  ({
+    code,
+    language = "text",
+    showCopyButton = true,
+    showLanguageBadge = true,
+    maxHeight = "60vh",
+    className
+  }) => {
+    const eventBus = useEventBus();
+    const { t: _t } = useTranslate();
+    const scrollRef = React113.useRef(null);
+    const savedScrollLeftRef = React113.useRef(0);
+    const [copied, setCopied] = React113.useState(false);
+    React113.useLayoutEffect(() => {
+      const el = scrollRef.current;
+      return () => {
+        if (el) savedScrollLeftRef.current = el.scrollLeft;
+      };
+    }, [language, code]);
+    React113.useLayoutEffect(() => {
+      const el = scrollRef.current;
+      if (el) el.scrollLeft = savedScrollLeftRef.current;
+    }, [language, code]);
+    React113.useEffect(() => {
+      const el = scrollRef.current;
+      if (!el) return;
+      const handle = () => {
+        savedScrollLeftRef.current = el.scrollLeft;
+      };
+      el.addEventListener("scroll", handle, { passive: true });
+      return () => el.removeEventListener("scroll", handle);
+    }, [language, code]);
+    const handleCopy = async () => {
+      try {
+        await navigator.clipboard.writeText(code);
+        setCopied(true);
+        eventBus.emit("UI:COPY_CODE", { language, success: true });
+        setTimeout(() => setCopied(false), 2e3);
+      } catch (err) {
+        console.error("Failed to copy code:", err);
+        eventBus.emit("UI:COPY_CODE", { language, success: false });
+      }
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: `relative group ${className || ""}`, children: [
+      (showLanguageBadge || showCopyButton) && /* @__PURE__ */ jsxRuntime.jsxs(
+        HStack,
+        {
+          justify: "between",
+          align: "center",
+          className: "px-3 py-2 bg-gray-800 rounded-t-lg border-b border-gray-700",
+          children: [
+            showLanguageBadge && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "default", size: "sm", children: language }),
+            showCopyButton && /* @__PURE__ */ jsxRuntime.jsx(
+              Button,
+              {
+                variant: "ghost",
+                size: "sm",
+                onClick: handleCopy,
+                className: "opacity-0 group-hover:opacity-100 focus:opacity-100 transition-opacity text-[var(--color-muted-foreground)] hover:text-white",
+                "aria-label": "Copy code",
+                children: copied ? /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Check, { size: 16, className: "text-green-400" }) : /* @__PURE__ */ jsxRuntime.jsx(LucideIcons.Copy, { size: 16 })
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          ref: scrollRef,
+          style: {
+            overflowX: "auto",
+            overflowY: "auto",
+            WebkitOverflowScrolling: "touch",
+            maxHeight,
+            overscrollBehavior: "auto",
+            touchAction: "pan-x pan-y",
+            contain: "paint",
+            backgroundColor: "#1e1e1e",
+            borderRadius: showLanguageBadge || showCopyButton ? "0 0 0.5rem 0.5rem" : "0.5rem",
+            padding: "1rem"
+          },
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            SyntaxHighlighter__default.default,
+            {
+              PreTag: "div",
+              language,
+              style: dark__default.default,
+              customStyle: {
+                backgroundColor: "transparent",
+                borderRadius: 0,
+                padding: 0,
+                margin: 0,
+                whiteSpace: "pre",
+                minWidth: "100%"
+              },
+              children: code
+            }
+          )
+        }
+      )
+    ] });
+  },
+  (prev, next) => prev.language === next.language && prev.code === next.code && prev.showCopyButton === next.showCopyButton && prev.maxHeight === next.maxHeight
+);
+CodeBlock.displayName = "CodeBlock";
+var Camera3D = React113.forwardRef(
+  ({
+    mode = "isometric",
+    position = [10, 10, 10],
+    target = [0, 0, 0],
+    zoom = 1,
+    fov = 45,
+    enableOrbit = true,
+    minDistance = 2,
+    maxDistance = 100,
+    onChange
+  }, ref) => {
+    const { camera, set, viewport } = fiber.useThree();
+    const controlsRef = React113.useRef(null);
+    const initialPosition = React113.useRef(new THREE__namespace.Vector3(...position));
+    const initialTarget = React113.useRef(new THREE__namespace.Vector3(...target));
+    React113.useEffect(() => {
+      let newCamera;
+      if (mode === "isometric") {
+        const aspect = viewport.aspect;
+        const size = 10 / zoom;
+        newCamera = new THREE__namespace.OrthographicCamera(
+          -size * aspect,
+          size * aspect,
+          size,
+          -size,
+          0.1,
+          1e3
+        );
+      } else {
+        newCamera = new THREE__namespace.PerspectiveCamera(fov, viewport.aspect, 0.1, 1e3);
+      }
+      newCamera.position.copy(initialPosition.current);
+      newCamera.lookAt(initialTarget.current);
+      set({ camera: newCamera });
+      if (mode === "top-down") {
+        newCamera.position.set(0, 20 / zoom, 0);
+        newCamera.lookAt(0, 0, 0);
+      }
+      return () => {
+      };
+    }, [mode, fov, zoom, viewport.aspect, set]);
+    fiber.useFrame(() => {
+      if (onChange) {
+        onChange(camera);
+      }
+    });
+    React113.useImperativeHandle(ref, () => ({
+      getCamera: () => camera,
+      setPosition: (x, y, z) => {
+        camera.position.set(x, y, z);
+        if (controlsRef.current) {
+          controlsRef.current.update();
+        }
+      },
+      lookAt: (x, y, z) => {
+        camera.lookAt(x, y, z);
+        if (controlsRef.current) {
+          controlsRef.current.target.set(x, y, z);
+          controlsRef.current.update();
+        }
+      },
+      reset: () => {
+        camera.position.copy(initialPosition.current);
+        camera.lookAt(initialTarget.current);
+        if (controlsRef.current) {
+          controlsRef.current.target.copy(initialTarget.current);
+          controlsRef.current.update();
+        }
+      },
+      getViewBounds: () => {
+        const min = new THREE__namespace.Vector3(-10, -10, -10);
+        const max = new THREE__namespace.Vector3(10, 10, 10);
+        return { min, max };
+      }
+    }));
+    const maxPolarAngle = mode === "top-down" ? 0.1 : Math.PI / 2 - 0.1;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      drei.OrbitControls,
+      {
+        ref: controlsRef,
+        camera,
+        enabled: enableOrbit,
+        target: initialTarget.current,
+        minDistance,
+        maxDistance,
+        maxPolarAngle,
+        enableDamping: true,
+        dampingFactor: 0.05
+      }
+    );
+  }
+);
+Camera3D.displayName = "Camera3D";
+var Canvas3DErrorBoundary = class extends React113.Component {
+  constructor(props) {
+    super(props);
+    __publicField(this, "handleReset", () => {
+      this.setState({
+        hasError: false,
+        error: null,
+        errorInfo: null
+      });
+      this.props.onReset?.();
+    });
+    this.state = {
+      hasError: false,
+      error: null,
+      errorInfo: null
+    };
+  }
+  static getDerivedStateFromError(error) {
+    return {
+      hasError: true,
+      error,
+      errorInfo: null
+    };
+  }
+  componentDidCatch(error, errorInfo) {
+    this.setState({ errorInfo });
+    this.props.onError?.(error, errorInfo);
+    console.error("[Canvas3DErrorBoundary] Error caught:", error);
+    console.error("[Canvas3DErrorBoundary] Component stack:", errorInfo.componentStack);
+  }
+  render() {
+    if (this.state.hasError) {
+      if (this.props.fallback) {
+        return this.props.fallback;
+      }
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "canvas-3d-error", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "canvas-3d-error__content", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "canvas-3d-error__icon", children: "\u26A0\uFE0F" }),
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "canvas-3d-error__title", children: "3D Scene Error" }),
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "canvas-3d-error__message", children: "Something went wrong while rendering the 3D scene." }),
+        this.state.error && /* @__PURE__ */ jsxRuntime.jsxs("details", { className: "canvas-3d-error__details", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("summary", { children: "Error Details" }),
+          /* @__PURE__ */ jsxRuntime.jsxs("pre", { className: "error__stack", children: [
+            this.state.error.message,
+            "\n",
+            this.state.error.stack
+          ] }),
+          this.state.errorInfo && /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "error__component-stack", children: this.state.errorInfo.componentStack })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "canvas-3d-error__actions", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              className: "error__button error__button--primary",
+              onClick: this.handleReset,
+              children: "Try Again"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              className: "error__button error__button--secondary",
+              onClick: () => window.location.reload(),
+              children: "Reload Page"
+            }
+          )
+        ] })
+      ] }) });
+    }
+    return this.props.children;
+  }
+};
+function Canvas3DLoadingState({
+  progress = 0,
+  loaded = 0,
+  total = 0,
+  message = "Loading 3D Scene...",
+  details,
+  showSpinner = true,
+  className
+}) {
+  const clampedProgress = Math.max(0, Math.min(100, progress));
+  const hasProgress = total > 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `canvas-3d-loading ${className || ""}`, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "canvas-3d-loading__content", children: [
+      showSpinner && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "canvas-3d-loading__spinner", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "spinner__ring" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "spinner__ring spinner__ring--secondary" })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "canvas-3d-loading__message", children: message }),
+      details && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "canvas-3d-loading__details", children: details }),
+      hasProgress && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "canvas-3d-loading__progress", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "progress__bar", children: /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "progress__fill",
+            style: { width: `${clampedProgress}%` }
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "progress__text", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "progress__percentage", children: [
+            clampedProgress,
+            "%"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "progress__count", children: [
+            "(",
+            loaded,
+            "/",
+            total,
+            ")"
+          ] })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "canvas-3d-loading__background", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg__grid" }) })
+  ] });
+}
+
+// lib/debug.ts
+typeof window !== "undefined" && (localStorage.getItem("debug") === "true" || process.env.NODE_ENV === "development");
+React113.lazy(() => import('react-markdown'));
+var GameAudioContext = React113.createContext(null);
+GameAudioContext.displayName = "GameAudioContext";
+function detectAssetRoot2(modelUrl) {
+  const idx = modelUrl.indexOf("/3d/");
+  if (idx !== -1) {
+    return modelUrl.substring(0, idx + 4);
+  }
+  return modelUrl.substring(0, modelUrl.lastIndexOf("/") + 1);
+}
+function createGLTFLoaderForUrl(url) {
+  const loader = new GLTFLoader_js.GLTFLoader();
+  loader.setResourcePath(detectAssetRoot2(url));
+  return loader;
+}
+var AssetLoader = class {
+  constructor() {
+    __publicField(this, "objLoader");
+    __publicField(this, "textureLoader");
+    __publicField(this, "modelCache");
+    __publicField(this, "textureCache");
+    __publicField(this, "loadingPromises");
+    this.objLoader = new OBJLoader_js.OBJLoader();
+    this.textureLoader = new THREE__namespace.TextureLoader();
+    this.modelCache = /* @__PURE__ */ new Map();
+    this.textureCache = /* @__PURE__ */ new Map();
+    this.loadingPromises = /* @__PURE__ */ new Map();
+  }
+  /**
+   * Load a GLB/GLTF model
+   * @param url - URL to the .glb or .gltf file
+   * @returns Promise with loaded model scene and animations
+   */
+  async loadModel(url) {
+    if (this.modelCache.has(url)) {
+      return this.modelCache.get(url);
+    }
+    if (this.loadingPromises.has(url)) {
+      return this.loadingPromises.get(url);
+    }
+    const loader = createGLTFLoaderForUrl(url);
+    const loadPromise = loader.loadAsync(url).then((gltf) => {
+      const result = {
+        scene: gltf.scene,
+        animations: gltf.animations || []
+      };
+      this.modelCache.set(url, result);
+      this.loadingPromises.delete(url);
+      return result;
+    }).catch((error) => {
+      this.loadingPromises.delete(url);
+      throw new Error(`Failed to load model ${url}: ${error.message}`);
+    });
+    this.loadingPromises.set(url, loadPromise);
+    return loadPromise;
+  }
+  /**
+   * Load an OBJ model (fallback for non-GLB assets)
+   * @param url - URL to the .obj file
+   * @returns Promise with loaded object group
+   */
+  async loadOBJ(url) {
+    if (this.modelCache.has(url)) {
+      return this.modelCache.get(url).scene;
+    }
+    if (this.loadingPromises.has(url)) {
+      const result = await this.loadingPromises.get(url);
+      return result.scene;
+    }
+    const loadPromise = this.objLoader.loadAsync(url).then((group) => {
+      const result = {
+        scene: group,
+        animations: []
+      };
+      this.modelCache.set(url, result);
+      this.loadingPromises.delete(url);
+      return result;
+    }).catch((error) => {
+      this.loadingPromises.delete(url);
+      throw new Error(`Failed to load OBJ ${url}: ${error.message}`);
+    });
+    this.loadingPromises.set(url, loadPromise);
+    return (await loadPromise).scene;
+  }
+  /**
+   * Load a texture
+   * @param url - URL to the texture image
+   * @returns Promise with loaded texture
+   */
+  async loadTexture(url) {
+    if (this.textureCache.has(url)) {
+      return this.textureCache.get(url);
+    }
+    if (this.loadingPromises.has(`texture:${url}`)) {
+      return this.loadingPromises.get(`texture:${url}`);
+    }
+    const loadPromise = this.textureLoader.loadAsync(url).then((texture) => {
+      texture.colorSpace = THREE__namespace.SRGBColorSpace;
+      this.textureCache.set(url, texture);
+      this.loadingPromises.delete(`texture:${url}`);
+      return texture;
+    }).catch((error) => {
+      this.loadingPromises.delete(`texture:${url}`);
+      throw new Error(`Failed to load texture ${url}: ${error.message}`);
+    });
+    this.loadingPromises.set(`texture:${url}`, loadPromise);
+    return loadPromise;
+  }
+  /**
+   * Preload multiple assets
+   * @param urls - Array of asset URLs to preload
+   * @returns Promise that resolves when all assets are loaded
+   */
+  async preload(urls) {
+    const promises = urls.map((url) => {
+      if (url.endsWith(".glb") || url.endsWith(".gltf")) {
+        return this.loadModel(url).catch(() => null);
+      } else if (url.endsWith(".obj")) {
+        return this.loadOBJ(url).catch(() => null);
+      } else if (/\.(png|jpg|jpeg|webp)$/i.test(url)) {
+        return this.loadTexture(url).catch(() => null);
+      }
+      return Promise.resolve(null);
+    });
+    await Promise.all(promises);
+  }
+  /**
+   * Check if a model is cached
+   * @param url - Model URL
+   */
+  hasModel(url) {
+    return this.modelCache.has(url);
+  }
+  /**
+   * Check if a texture is cached
+   * @param url - Texture URL
+   */
+  hasTexture(url) {
+    return this.textureCache.has(url);
+  }
+  /**
+   * Get cached model (throws if not cached)
+   * @param url - Model URL
+   */
+  getModel(url) {
+    const model = this.modelCache.get(url);
+    if (!model) {
+      throw new Error(`Model ${url} not in cache`);
+    }
+    return model;
+  }
+  /**
+   * Get cached texture (throws if not cached)
+   * @param url - Texture URL
+   */
+  getTexture(url) {
+    const texture = this.textureCache.get(url);
+    if (!texture) {
+      throw new Error(`Texture ${url} not in cache`);
+    }
+    return texture;
+  }
+  /**
+   * Clear all caches
+   */
+  clearCache() {
+    this.textureCache.forEach((texture) => {
+      texture.dispose();
+    });
+    this.modelCache.forEach((model) => {
+      model.scene.traverse((child) => {
+        if (child instanceof THREE__namespace.Mesh) {
+          child.geometry.dispose();
+          if (Array.isArray(child.material)) {
+            child.material.forEach((m) => m.dispose());
+          } else {
+            child.material.dispose();
+          }
+        }
+      });
+    });
+    this.modelCache.clear();
+    this.textureCache.clear();
+    this.loadingPromises.clear();
+  }
+  /**
+   * Get cache statistics
+   */
+  getStats() {
+    return {
+      models: this.modelCache.size,
+      textures: this.textureCache.size,
+      loading: this.loadingPromises.size
+    };
+  }
+};
+new AssetLoader();
+function useAssetLoader(options = {}) {
+  const { preloadUrls = [], loader: customLoader } = options;
+  const loaderRef = React113.useRef(customLoader || new AssetLoader());
+  const [state, setState] = React113.useState({
+    isLoading: false,
+    progress: 0,
+    loaded: 0,
+    total: 0,
+    errors: []
+  });
+  React113.useEffect(() => {
+    if (preloadUrls.length > 0) {
+      preload(preloadUrls);
+    }
+  }, []);
+  const updateProgress = React113.useCallback((loaded, total) => {
+    setState((prev) => ({
+      ...prev,
+      loaded,
+      total,
+      progress: total > 0 ? Math.round(loaded / total * 100) : 0
+    }));
+  }, []);
+  const loadModel = React113.useCallback(
+    async (url) => {
+      setState((prev) => ({ ...prev, isLoading: true }));
+      try {
+        const model = await loaderRef.current.loadModel(url);
+        setState((prev) => ({
+          ...prev,
+          isLoading: false,
+          loaded: prev.loaded + 1
+        }));
+        return model;
+      } catch (error) {
+        const errorMsg = error instanceof Error ? error.message : String(error);
+        setState((prev) => ({
+          ...prev,
+          isLoading: false,
+          errors: [...prev.errors, errorMsg]
+        }));
+        throw error;
+      }
+    },
+    []
+  );
+  const loadOBJ = React113.useCallback(
+    async (url) => {
+      setState((prev) => ({ ...prev, isLoading: true }));
+      try {
+        const model = await loaderRef.current.loadOBJ(url);
+        setState((prev) => ({
+          ...prev,
+          isLoading: false,
+          loaded: prev.loaded + 1
+        }));
+        return model;
+      } catch (error) {
+        const errorMsg = error instanceof Error ? error.message : String(error);
+        setState((prev) => ({
+          ...prev,
+          isLoading: false,
+          errors: [...prev.errors, errorMsg]
+        }));
+        throw error;
+      }
+    },
+    []
+  );
+  const loadTexture = React113.useCallback(
+    async (url) => {
+      setState((prev) => ({ ...prev, isLoading: true }));
+      try {
+        const texture = await loaderRef.current.loadTexture(url);
+        setState((prev) => ({
+          ...prev,
+          isLoading: false,
+          loaded: prev.loaded + 1
+        }));
+        return texture;
+      } catch (error) {
+        const errorMsg = error instanceof Error ? error.message : String(error);
+        setState((prev) => ({
+          ...prev,
+          isLoading: false,
+          errors: [...prev.errors, errorMsg]
+        }));
+        throw error;
+      }
+    },
+    []
+  );
+  const preload = React113.useCallback(
+    async (urls) => {
+      setState((prev) => ({
+        ...prev,
+        isLoading: true,
+        total: urls.length,
+        loaded: 0,
+        errors: []
+      }));
+      let completed = 0;
+      const errors = [];
+      await Promise.all(
+        urls.map(async (url) => {
+          try {
+            if (url.endsWith(".glb") || url.endsWith(".gltf")) {
+              await loaderRef.current.loadModel(url);
+            } else if (url.endsWith(".obj")) {
+              await loaderRef.current.loadOBJ(url);
+            } else if (/\.(png|jpg|jpeg|webp)$/i.test(url)) {
+              await loaderRef.current.loadTexture(url);
+            }
+            completed++;
+            updateProgress(completed, urls.length);
+          } catch (error) {
+            const errorMsg = error instanceof Error ? error.message : String(error);
+            errors.push(`${url}: ${errorMsg}`);
+            completed++;
+            updateProgress(completed, urls.length);
+          }
+        })
+      );
+      setState((prev) => ({
+        ...prev,
+        isLoading: false,
+        errors
+      }));
+    },
+    [updateProgress]
+  );
+  const hasModel = React113.useCallback((url) => {
+    return loaderRef.current.hasModel(url);
+  }, []);
+  const hasTexture = React113.useCallback((url) => {
+    return loaderRef.current.hasTexture(url);
+  }, []);
+  const getModel = React113.useCallback((url) => {
+    try {
+      return loaderRef.current.getModel(url);
+    } catch {
+      return void 0;
+    }
+  }, []);
+  const getTexture = React113.useCallback((url) => {
+    try {
+      return loaderRef.current.getTexture(url);
+    } catch {
+      return void 0;
+    }
+  }, []);
+  const clearCache = React113.useCallback(() => {
+    loaderRef.current.clearCache();
+    setState({
+      isLoading: false,
+      progress: 0,
+      loaded: 0,
+      total: 0,
+      errors: []
+    });
+  }, []);
+  return {
+    ...state,
+    loadModel,
+    loadOBJ,
+    loadTexture,
+    preload,
+    hasModel,
+    hasTexture,
+    getModel,
+    getTexture,
+    clearCache
+  };
+}
+function useGameCanvas3DEvents(options) {
+  const {
+    tileClickEvent,
+    unitClickEvent,
+    featureClickEvent,
+    canvasClickEvent,
+    tileHoverEvent,
+    tileLeaveEvent,
+    unitAnimationEvent,
+    cameraChangeEvent,
+    onTileClick,
+    onUnitClick,
+    onFeatureClick,
+    onCanvasClick,
+    onTileHover,
+    onUnitAnimation
+  } = options;
+  const emit = useEmitEvent();
+  const optionsRef = React113.useRef(options);
+  optionsRef.current = options;
+  const handleTileClick = React113.useCallback(
+    (tile, event) => {
+      if (tileClickEvent) {
+        emit(tileClickEvent, {
+          tileId: tile.id,
+          x: tile.x,
+          z: tile.z ?? tile.y ?? 0,
+          type: tile.type,
+          terrain: tile.terrain,
+          elevation: tile.elevation
+        });
+      }
+      optionsRef.current.onTileClick?.(tile, event);
+    },
+    [tileClickEvent, emit]
+  );
+  const handleUnitClick = React113.useCallback(
+    (unit, event) => {
+      if (unitClickEvent) {
+        emit(unitClickEvent, {
+          unitId: unit.id,
+          x: unit.x,
+          z: unit.z ?? unit.y ?? 0,
+          unitType: unit.unitType,
+          name: unit.name,
+          team: unit.team,
+          faction: unit.faction,
+          health: unit.health,
+          maxHealth: unit.maxHealth
+        });
+      }
+      optionsRef.current.onUnitClick?.(unit, event);
+    },
+    [unitClickEvent, emit]
+  );
+  const handleFeatureClick = React113.useCallback(
+    (feature, event) => {
+      if (featureClickEvent) {
+        emit(featureClickEvent, {
+          featureId: feature.id,
+          x: feature.x,
+          z: feature.z ?? feature.y ?? 0,
+          type: feature.type,
+          elevation: feature.elevation
+        });
+      }
+      optionsRef.current.onFeatureClick?.(feature, event);
+    },
+    [featureClickEvent, emit]
+  );
+  const handleCanvasClick = React113.useCallback(
+    (event) => {
+      if (canvasClickEvent) {
+        emit(canvasClickEvent, {
+          clientX: event.clientX,
+          clientY: event.clientY,
+          button: event.button
+        });
+      }
+      optionsRef.current.onCanvasClick?.(event);
+    },
+    [canvasClickEvent, emit]
+  );
+  const handleTileHover = React113.useCallback(
+    (tile, event) => {
+      if (tile) {
+        if (tileHoverEvent) {
+          emit(tileHoverEvent, {
+            tileId: tile.id,
+            x: tile.x,
+            z: tile.z ?? tile.y ?? 0,
+            type: tile.type
+          });
+        }
+      } else {
+        if (tileLeaveEvent) {
+          emit(tileLeaveEvent, {});
+        }
+      }
+      optionsRef.current.onTileHover?.(tile, event);
+    },
+    [tileHoverEvent, tileLeaveEvent, emit]
+  );
+  const handleUnitAnimation = React113.useCallback(
+    (unitId, state) => {
+      if (unitAnimationEvent) {
+        emit(unitAnimationEvent, {
+          unitId,
+          state,
+          timestamp: Date.now()
+        });
+      }
+      optionsRef.current.onUnitAnimation?.(unitId, state);
+    },
+    [unitAnimationEvent, emit]
+  );
+  const handleCameraChange = React113.useCallback(
+    (position) => {
+      if (cameraChangeEvent) {
+        emit(cameraChangeEvent, {
+          position,
+          timestamp: Date.now()
+        });
+      }
+    },
+    [cameraChangeEvent, emit]
+  );
+  return {
+    handleTileClick,
+    handleUnitClick,
+    handleFeatureClick,
+    handleCanvasClick,
+    handleTileHover,
+    handleUnitAnimation,
+    handleCameraChange
+  };
+}
+function detectAssetRoot3(modelUrl) {
+  const idx = modelUrl.indexOf("/3d/");
+  if (idx !== -1) {
+    return modelUrl.substring(0, idx + 4);
+  }
+  return modelUrl.substring(0, modelUrl.lastIndexOf("/") + 1);
+}
+function useGLTFModel2(url, resourceBasePath) {
+  const [state, setState] = React113.useState({
+    model: null,
+    isLoading: false,
+    error: null
+  });
+  React113.useEffect(() => {
+    if (!url) {
+      setState({ model: null, isLoading: false, error: null });
+      return;
+    }
+    console.log("[ModelLoader] Loading:", url);
+    setState((prev) => ({ ...prev, isLoading: true, error: null }));
+    const assetRoot = resourceBasePath || detectAssetRoot3(url);
+    const loader = new GLTFLoader.GLTFLoader();
+    loader.setResourcePath(assetRoot);
+    loader.load(
+      url,
+      (gltf) => {
+        console.log("[ModelLoader] Loaded:", url);
+        setState({
+          model: gltf.scene,
+          isLoading: false,
+          error: null
+        });
+      },
+      void 0,
+      (err) => {
+        const errorMsg = err instanceof Error ? err.message : String(err);
+        console.warn("[ModelLoader] Failed:", url, errorMsg);
+        setState({
+          model: null,
+          isLoading: false,
+          error: err instanceof Error ? err : new Error(String(err))
+        });
+      }
+    );
+  }, [url, resourceBasePath]);
+  return state;
+}
+function ModelLoader({
+  url,
+  position = [0, 0, 0],
+  scale = 1,
+  rotation = [0, 0, 0],
+  isSelected = false,
+  isHovered = false,
+  onClick,
+  onHover,
+  fallbackGeometry = "box",
+  castShadow = true,
+  receiveShadow = true,
+  resourceBasePath
+}) {
+  const { model: loadedModel, isLoading, error } = useGLTFModel2(url, resourceBasePath);
+  const model = React113.useMemo(() => {
+    if (!loadedModel) return null;
+    const cloned = loadedModel.clone();
+    cloned.traverse((child) => {
+      if (child instanceof THREE__namespace.Mesh) {
+        child.castShadow = castShadow;
+        child.receiveShadow = receiveShadow;
+      }
+    });
+    return cloned;
+  }, [loadedModel, castShadow, receiveShadow]);
+  const scaleArray = React113.useMemo(() => {
+    if (typeof scale === "number") {
+      return [scale, scale, scale];
+    }
+    return scale;
+  }, [scale]);
+  const rotationRad = React113.useMemo(() => {
+    return [
+      rotation[0] * Math.PI / 180,
+      rotation[1] * Math.PI / 180,
+      rotation[2] * Math.PI / 180
+    ];
+  }, [rotation]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsxRuntime.jsx("group", { position, children: /* @__PURE__ */ jsxRuntime.jsxs("mesh", { rotation: [Math.PI / 2, 0, 0], children: [
+      /* @__PURE__ */ jsxRuntime.jsx("ringGeometry", { args: [0.3, 0.35, 16] }),
+      /* @__PURE__ */ jsxRuntime.jsx("meshBasicMaterial", { color: "#4a90d9", transparent: true, opacity: 0.8 })
+    ] }) });
+  }
+  if (error || !model) {
+    if (fallbackGeometry === "none") {
+      return /* @__PURE__ */ jsxRuntime.jsx("group", { position });
+    }
+    const fallbackProps = {
+      onClick,
+      onPointerOver: () => onHover?.(true),
+      onPointerOut: () => onHover?.(false)
+    };
+    return /* @__PURE__ */ jsxRuntime.jsxs("group", { position, children: [
+      (isSelected || isHovered) && /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.02, 0], rotation: [-Math.PI / 2, 0, 0], children: [
+        /* @__PURE__ */ jsxRuntime.jsx("ringGeometry", { args: [0.6, 0.7, 32] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "meshBasicMaterial",
+          {
+            color: isSelected ? 16755200 : 16777215,
+            transparent: true,
+            opacity: 0.5
+          }
+        )
+      ] }),
+      fallbackGeometry === "box" && /* @__PURE__ */ jsxRuntime.jsxs("mesh", { ...fallbackProps, position: [0, 0.5, 0], children: [
+        /* @__PURE__ */ jsxRuntime.jsx("boxGeometry", { args: [0.8, 0.8, 0.8] }),
+        /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color: error ? 16729156 : 8947848 })
+      ] }),
+      fallbackGeometry === "sphere" && /* @__PURE__ */ jsxRuntime.jsxs("mesh", { ...fallbackProps, position: [0, 0.5, 0], children: [
+        /* @__PURE__ */ jsxRuntime.jsx("sphereGeometry", { args: [0.4, 16, 16] }),
+        /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color: error ? 16729156 : 8947848 })
+      ] }),
+      fallbackGeometry === "cylinder" && /* @__PURE__ */ jsxRuntime.jsxs("mesh", { ...fallbackProps, position: [0, 0.5, 0], children: [
+        /* @__PURE__ */ jsxRuntime.jsx("cylinderGeometry", { args: [0.3, 0.3, 0.8, 16] }),
+        /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color: error ? 16729156 : 8947848 })
+      ] })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "group",
+    {
+      position,
+      rotation: rotationRad,
+      onClick,
+      onPointerOver: () => onHover?.(true),
+      onPointerOut: () => onHover?.(false),
+      children: [
+        (isSelected || isHovered) && /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.02, 0], rotation: [-Math.PI / 2, 0, 0], children: [
+          /* @__PURE__ */ jsxRuntime.jsx("ringGeometry", { args: [0.6, 0.7, 32] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "meshBasicMaterial",
+            {
+              color: isSelected ? 16755200 : 16777215,
+              transparent: true,
+              opacity: 0.5
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("primitive", { object: model, scale: scaleArray })
+      ]
+    }
+  );
+}
+var DEFAULT_GRID_CONFIG = {
+  cellSize: 1,
+  offsetX: 0,
+  offsetZ: 0
+};
+function CameraController({
+  onCameraChange
+}) {
+  const { camera } = fiber.useThree();
+  React113.useEffect(() => {
+    if (onCameraChange) {
+      onCameraChange({
+        x: camera.position.x,
+        y: camera.position.y,
+        z: camera.position.z
+      });
+    }
+  }, [camera.position, onCameraChange]);
+  return null;
+}
+var GameCanvas3D = React113.forwardRef(
+  ({
+    tiles = [],
+    units = [],
+    features = [],
+    events: events2 = [],
+    orientation = "standard",
+    cameraMode = "isometric",
+    showGrid = true,
+    showCoordinates = false,
+    showTileInfo = false,
+    overlay = "default",
+    shadows = true,
+    backgroundColor = "#1a1a2e",
+    onTileClick,
+    onUnitClick,
+    onFeatureClick,
+    onCanvasClick,
+    onTileHover,
+    onUnitAnimation,
+    assetLoader: customAssetLoader,
+    tileRenderer: CustomTileRenderer,
+    unitRenderer: CustomUnitRenderer,
+    featureRenderer: CustomFeatureRenderer,
+    className,
+    isLoading: externalLoading,
+    error: externalError,
+    entity,
+    preloadAssets = [],
+    tileClickEvent,
+    unitClickEvent,
+    featureClickEvent,
+    canvasClickEvent,
+    tileHoverEvent,
+    tileLeaveEvent,
+    unitAnimationEvent,
+    cameraChangeEvent,
+    loadingMessage = "Loading 3D Scene...",
+    useInstancing = true,
+    validMoves = [],
+    attackTargets = [],
+    selectedTileIds = [],
+    selectedUnitId = null,
+    children
+  }, ref) => {
+    const containerRef = React113.useRef(null);
+    const controlsRef = React113.useRef(null);
+    const [hoveredTile, setHoveredTile] = React113.useState(null);
+    const [internalError, setInternalError] = React113.useState(null);
+    const { isLoading: assetsLoading, progress, loaded, total } = useAssetLoader({
+      preloadUrls: preloadAssets,
+      loader: customAssetLoader
+    });
+    const eventHandlers = useGameCanvas3DEvents({
+      tileClickEvent,
+      unitClickEvent,
+      featureClickEvent,
+      canvasClickEvent,
+      tileHoverEvent,
+      tileLeaveEvent,
+      unitAnimationEvent,
+      cameraChangeEvent,
+      onTileClick,
+      onUnitClick,
+      onFeatureClick,
+      onCanvasClick,
+      onTileHover,
+      onUnitAnimation
+    });
+    const gridBounds = React113.useMemo(() => {
+      if (tiles.length === 0) {
+        return { minX: 0, maxX: 10, minZ: 0, maxZ: 10 };
+      }
+      const xs = tiles.map((t) => t.x);
+      const zs = tiles.map((t) => t.z || t.y || 0);
+      return {
+        minX: Math.min(...xs),
+        maxX: Math.max(...xs),
+        minZ: Math.min(...zs),
+        maxZ: Math.max(...zs)
+      };
+    }, [tiles]);
+    const cameraTarget = React113.useMemo(() => {
+      return [
+        (gridBounds.minX + gridBounds.maxX) / 2,
+        0,
+        (gridBounds.minZ + gridBounds.maxZ) / 2
+      ];
+    }, [gridBounds]);
+    const gridConfig = React113.useMemo(
+      () => ({
+        ...DEFAULT_GRID_CONFIG,
+        offsetX: -(gridBounds.maxX - gridBounds.minX) / 2,
+        offsetZ: -(gridBounds.maxZ - gridBounds.minZ) / 2
+      }),
+      [gridBounds]
+    );
+    const gridToWorld = React113.useCallback(
+      (x, z, y = 0) => {
+        const worldX = (x - gridBounds.minX) * gridConfig.cellSize;
+        const worldZ = (z - gridBounds.minZ) * gridConfig.cellSize;
+        return [worldX, y * gridConfig.cellSize, worldZ];
+      },
+      [gridBounds, gridConfig]
+    );
+    React113.useImperativeHandle(ref, () => ({
+      getCameraPosition: () => {
+        if (controlsRef.current) {
+          const pos = controlsRef.current.object.position;
+          return new THREE__namespace.Vector3(pos.x, pos.y, pos.z);
+        }
+        return null;
+      },
+      setCameraPosition: (x, y, z) => {
+        if (controlsRef.current) {
+          controlsRef.current.object.position.set(x, y, z);
+          controlsRef.current.update();
+        }
+      },
+      lookAt: (x, y, z) => {
+        if (controlsRef.current) {
+          controlsRef.current.target.set(x, y, z);
+          controlsRef.current.update();
+        }
+      },
+      resetCamera: () => {
+        if (controlsRef.current) {
+          controlsRef.current.reset();
+        }
+      },
+      screenshot: () => {
+        const canvas = containerRef.current?.querySelector("canvas");
+        if (canvas) {
+          return canvas.toDataURL("image/png");
+        }
+        return null;
+      },
+      export: () => ({
+        tiles,
+        units,
+        features
+      })
+    }));
+    const handleTileClick = React113.useCallback(
+      (tile, event) => {
+        eventHandlers.handleTileClick(tile, event);
+      },
+      [eventHandlers]
+    );
+    const handleUnitClick = React113.useCallback(
+      (unit, event) => {
+        eventHandlers.handleUnitClick(unit, event);
+      },
+      [eventHandlers]
+    );
+    const handleFeatureClick = React113.useCallback(
+      (feature, event) => {
+        if (event) {
+          eventHandlers.handleFeatureClick(feature, event);
+        }
+      },
+      [eventHandlers]
+    );
+    const handleTileHover = React113.useCallback(
+      (tile, event) => {
+        setHoveredTile(tile);
+        if (event) {
+          eventHandlers.handleTileHover(tile, event);
+        }
+      },
+      [eventHandlers]
+    );
+    const cameraConfig = React113.useMemo(() => {
+      const size = Math.max(
+        gridBounds.maxX - gridBounds.minX,
+        gridBounds.maxZ - gridBounds.minZ
+      );
+      const distance = size * 1.5;
+      switch (cameraMode) {
+        case "isometric":
+          return {
+            position: [distance, distance * 0.8, distance],
+            fov: 45
+          };
+        case "top-down":
+          return {
+            position: [0, distance * 2, 0],
+            fov: 45
+          };
+        case "perspective":
+        default:
+          return {
+            position: [distance, distance, distance],
+            fov: 45
+          };
+      }
+    }, [cameraMode, gridBounds]);
+    const DefaultTileRenderer = React113.useCallback(
+      ({ tile, position }) => {
+        const isSelected = tile.id ? selectedTileIds.includes(tile.id) : false;
+        const isHovered = hoveredTile?.id === tile.id;
+        const isValidMove = validMoves.some(
+          (m) => m.x === tile.x && m.z === (tile.z ?? tile.y ?? 0)
+        );
+        const isAttackTarget = attackTargets.some(
+          (m) => m.x === tile.x && m.z === (tile.z ?? tile.y ?? 0)
+        );
+        let color = 8421504;
+        if (tile.type === "water") color = 4491468;
+        else if (tile.type === "grass") color = 4500036;
+        else if (tile.type === "sand") color = 14535816;
+        else if (tile.type === "rock") color = 8947848;
+        else if (tile.type === "snow") color = 15658734;
+        let emissive = 0;
+        if (isSelected) emissive = 4473924;
+        else if (isAttackTarget) emissive = 4456448;
+        else if (isValidMove) emissive = 17408;
+        else if (isHovered) emissive = 2236962;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "mesh",
+          {
+            position,
+            onClick: (e) => handleTileClick(tile, e),
+            onPointerEnter: (e) => handleTileHover(tile, e),
+            onPointerLeave: (e) => handleTileHover(null, e),
+            userData: { type: "tile", tileId: tile.id, gridX: tile.x, gridZ: tile.z ?? tile.y },
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("boxGeometry", { args: [0.95, 0.2, 0.95] }),
+              /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color, emissive })
+            ]
+          }
+        );
+      },
+      [selectedTileIds, hoveredTile, validMoves, attackTargets, handleTileClick, handleTileHover]
+    );
+    const DefaultUnitRenderer = React113.useCallback(
+      ({ unit, position }) => {
+        const isSelected = selectedUnitId === unit.id;
+        const color = unit.faction === "player" ? 4491519 : unit.faction === "enemy" ? 16729156 : 16777028;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "group",
+          {
+            position,
+            onClick: (e) => handleUnitClick(unit, e),
+            userData: { type: "unit", unitId: unit.id },
+            children: [
+              isSelected && /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.05, 0], rotation: [-Math.PI / 2, 0, 0], children: [
+                /* @__PURE__ */ jsxRuntime.jsx("ringGeometry", { args: [0.4, 0.5, 32] }),
+                /* @__PURE__ */ jsxRuntime.jsx("meshBasicMaterial", { color: "#ffff00", transparent: true, opacity: 0.8 })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.3, 0], children: [
+                /* @__PURE__ */ jsxRuntime.jsx("cylinderGeometry", { args: [0.3, 0.3, 0.1, 8] }),
+                /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.6, 0], children: [
+                /* @__PURE__ */ jsxRuntime.jsx("capsuleGeometry", { args: [0.2, 0.4, 4, 8] }),
+                /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.9, 0], children: [
+                /* @__PURE__ */ jsxRuntime.jsx("sphereGeometry", { args: [0.12, 8, 8] }),
+                /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color })
+              ] }),
+              unit.health !== void 0 && unit.maxHealth !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("group", { position: [0, 1.2, 0], children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [-0.25, 0, 0], children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("planeGeometry", { args: [0.5, 0.05] }),
+                  /* @__PURE__ */ jsxRuntime.jsx("meshBasicMaterial", { color: 3355443 })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs(
+                  "mesh",
+                  {
+                    position: [
+                      -0.25 + 0.5 * (unit.health / unit.maxHealth) / 2,
+                      0,
+                      0.01
+                    ],
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx("planeGeometry", { args: [0.5 * (unit.health / unit.maxHealth), 0.05] }),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "meshBasicMaterial",
+                        {
+                          color: unit.health / unit.maxHealth > 0.5 ? 4500036 : unit.health / unit.maxHealth > 0.25 ? 11184708 : 16729156
+                        }
+                      )
+                    ]
+                  }
+                )
+              ] })
+            ]
+          }
+        );
+      },
+      [selectedUnitId, handleUnitClick]
+    );
+    const DefaultFeatureRenderer = React113.useCallback(
+      ({
+        feature,
+        position
+      }) => {
+        if (feature.assetUrl) {
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            ModelLoader,
+            {
+              url: feature.assetUrl,
+              position,
+              scale: 0.5,
+              rotation: [0, feature.rotation ?? 0, 0],
+              onClick: () => handleFeatureClick(feature, null),
+              fallbackGeometry: "box"
+            },
+            feature.id
+          );
+        }
+        if (feature.type === "tree") {
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            "group",
+            {
+              position,
+              onClick: (e) => handleFeatureClick(feature, e),
+              userData: { type: "feature", featureId: feature.id },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.4, 0], children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("cylinderGeometry", { args: [0.1, 0.15, 0.8, 6] }),
+                  /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color: 9127187 })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs("mesh", { position: [0, 0.9, 0], children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("coneGeometry", { args: [0.5, 0.8, 8] }),
+                  /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color: 2263842 })
+                ] })
+              ]
+            }
+          );
+        }
+        if (feature.type === "rock") {
+          return /* @__PURE__ */ jsxRuntime.jsxs(
+            "mesh",
+            {
+              position: [position[0], position[1] + 0.3, position[2]],
+              onClick: (e) => handleFeatureClick(feature, e),
+              userData: { type: "feature", featureId: feature.id },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("dodecahedronGeometry", { args: [0.3, 0] }),
+                /* @__PURE__ */ jsxRuntime.jsx("meshStandardMaterial", { color: 8421504 })
+              ]
+            }
+          );
+        }
+        return null;
+      },
+      [handleFeatureClick]
+    );
+    if (externalLoading || assetsLoading && preloadAssets.length > 0) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Canvas3DLoadingState,
+        {
+          progress,
+          loaded,
+          total,
+          message: loadingMessage,
+          className
+        }
+      );
+    }
+    const displayError = externalError || internalError;
+    if (displayError) {
+      return /* @__PURE__ */ jsxRuntime.jsx(Canvas3DErrorBoundary, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "game-canvas-3d game-canvas-3d--error", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "game-canvas-3d__error", children: [
+        "Error: ",
+        displayError
+      ] }) }) });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Canvas3DErrorBoundary,
+      {
+        onError: (err) => setInternalError(err.message),
+        onReset: () => setInternalError(null),
+        children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            ref: containerRef,
+            className: `game-canvas-3d ${className || ""}`,
+            "data-orientation": orientation,
+            "data-camera-mode": cameraMode,
+            "data-overlay": overlay,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                fiber.Canvas,
+                {
+                  shadows,
+                  camera: {
+                    position: cameraConfig.position,
+                    fov: cameraConfig.fov,
+                    near: 0.1,
+                    far: 1e3
+                  },
+                  style: { background: backgroundColor },
+                  onClick: (e) => {
+                    if (e.target === e.currentTarget) {
+                      eventHandlers.handleCanvasClick(e);
+                    }
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(CameraController, { onCameraChange: eventHandlers.handleCameraChange }),
+                    /* @__PURE__ */ jsxRuntime.jsx("ambientLight", { intensity: 0.6 }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "directionalLight",
+                      {
+                        position: [10, 20, 10],
+                        intensity: 0.8,
+                        castShadow: shadows,
+                        "shadow-mapSize": [2048, 2048]
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx("hemisphereLight", { intensity: 0.3, color: "#87ceeb", groundColor: "#362d1d" }),
+                    showGrid && /* @__PURE__ */ jsxRuntime.jsx(
+                      drei.Grid,
+                      {
+                        args: [
+                          Math.max(gridBounds.maxX - gridBounds.minX + 2, 10),
+                          Math.max(gridBounds.maxZ - gridBounds.minZ + 2, 10)
+                        ],
+                        position: [
+                          (gridBounds.maxX - gridBounds.minX) / 2 - 0.5,
+                          0,
+                          (gridBounds.maxZ - gridBounds.minZ) / 2 - 0.5
+                        ],
+                        cellSize: 1,
+                        cellThickness: 1,
+                        cellColor: "#444444",
+                        sectionSize: 5,
+                        sectionThickness: 1.5,
+                        sectionColor: "#666666",
+                        fadeDistance: 50,
+                        fadeStrength: 1
+                      }
+                    ),
+                    tiles.map((tile, index) => {
+                      const position = gridToWorld(
+                        tile.x,
+                        tile.z ?? tile.y ?? 0,
+                        tile.elevation ?? 0
+                      );
+                      const Renderer = CustomTileRenderer || DefaultTileRenderer;
+                      return /* @__PURE__ */ jsxRuntime.jsx(Renderer, { tile, position }, tile.id ?? `tile-${index}`);
+                    }),
+                    features.map((feature, index) => {
+                      const position = gridToWorld(
+                        feature.x,
+                        feature.z ?? feature.y ?? 0,
+                        (feature.elevation ?? 0) + 0.5
+                      );
+                      const Renderer = CustomFeatureRenderer || DefaultFeatureRenderer;
+                      return /* @__PURE__ */ jsxRuntime.jsx(Renderer, { feature, position }, feature.id ?? `feature-${index}`);
+                    }),
+                    units.map((unit) => {
+                      const position = gridToWorld(
+                        unit.x ?? 0,
+                        unit.z ?? unit.y ?? 0,
+                        (unit.elevation ?? 0) + 0.5
+                      );
+                      const Renderer = CustomUnitRenderer || DefaultUnitRenderer;
+                      return /* @__PURE__ */ jsxRuntime.jsx(Renderer, { unit, position }, unit.id);
+                    }),
+                    children,
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      drei.OrbitControls,
+                      {
+                        ref: controlsRef,
+                        target: cameraTarget,
+                        enableDamping: true,
+                        dampingFactor: 0.05,
+                        minDistance: 2,
+                        maxDistance: 100,
+                        maxPolarAngle: Math.PI / 2 - 0.1
+                      }
+                    )
+                  ]
+                }
+              ),
+              showCoordinates && hoveredTile && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "game-canvas-3d__coordinates", children: [
+                "X: ",
+                hoveredTile.x,
+                ", Z: ",
+                hoveredTile.z ?? hoveredTile.y ?? 0
+              ] }),
+              showTileInfo && hoveredTile && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "game-canvas-3d__tile-info", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tile-info__type", children: hoveredTile.type }),
+                hoveredTile.terrain && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "tile-info__terrain", children: hoveredTile.terrain })
+              ] })
+            ]
+          }
+        )
+      }
+    );
+  }
+);
+GameCanvas3D.displayName = "GameCanvas3D";
+
+// lib/traitRegistry.ts
+var traits = /* @__PURE__ */ new Map();
+var listeners2 = /* @__PURE__ */ new Set();
+function notifyListeners2() {
+  listeners2.forEach((listener) => listener());
+}
+function registerTrait(info) {
+  traits.set(info.id, info);
+  notifyListeners2();
+}
+function updateTraitState(id, newState) {
+  const trait = traits.get(id);
+  if (trait) {
+    trait.currentState = newState;
+    trait.transitionCount++;
+    notifyListeners2();
+  }
+}
+function unregisterTrait(id) {
+  traits.delete(id);
+  notifyListeners2();
+}
+React113.createContext({ enabled: false });
+React113.createContext(false);
+React113.createContext(null);
+
+// runtime/createClientEffectHandlers.ts
+function createClientEffectHandlers(options) {
+  const { eventBus, slotSetter, navigate, notify, enrichPattern } = options;
+  return {
+    emit: (event, payload) => {
+      const prefixedEvent = event.startsWith("UI:") ? event : `UI:${event}`;
+      eventBus.emit(prefixedEvent, { payload });
+    },
+    persist: async () => {
+      console.warn("[ClientEffectHandlers] persist is server-side only, ignored on client");
+    },
+    set: () => {
+      console.warn("[ClientEffectHandlers] set is server-side only, ignored on client");
+    },
+    callService: async () => {
+      console.warn("[ClientEffectHandlers] callService is server-side only, ignored on client");
+      return {};
+    },
+    renderUI: (slot, pattern, props) => {
+      if (pattern === null) {
+        slotSetter.clearSlot(slot);
+        return;
+      }
+      const enriched = enrichPattern ? enrichPattern(pattern) : pattern;
+      slotSetter.addPattern(slot, enriched, props);
+    },
+    navigate: navigate ?? ((path) => {
+      console.warn("[ClientEffectHandlers] No navigate handler, ignoring:", path);
+    }),
+    notify: notify ?? ((msg, type) => {
+      console.log(`[ClientEffectHandlers] notify (${type}):`, msg);
+    })
+  };
+}
+var EntitySchemaContext = React113.createContext(null);
+function EntitySchemaProvider({
+  entities,
+  children
+}) {
+  const entitiesMap = React113.useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const entity of entities) {
+      map.set(entity.name, entity);
+    }
+    return map;
+  }, [entities]);
+  const contextValue = React113.useMemo(
+    () => ({
+      entities: entitiesMap
+    }),
+    [entitiesMap]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(EntitySchemaContext.Provider, { value: contextValue, children });
+}
+function useEntitySchema() {
+  const context = React113.useContext(EntitySchemaContext);
+  if (!context) {
+    throw new Error("useEntitySchema must be used within an EntitySchemaProvider");
+  }
+  return context;
+}
+function useEntityDefinition(entityName) {
+  const { entities } = useEntitySchema();
+  return entities.get(entityName);
+}
+
+// runtime/useTraitStateMachine.ts
+function toTraitDefinition(binding) {
+  return {
+    name: binding.trait.name,
+    states: binding.trait.states,
+    transitions: binding.trait.transitions,
+    listens: binding.trait.listens
+  };
+}
+function normalizeEventKey(eventKey) {
+  return eventKey.startsWith("UI:") ? eventKey.slice(3) : eventKey;
+}
+function useTraitStateMachine(traitBindings, slotsActions, options) {
+  const eventBus = useEventBus();
+  const { entities } = useEntitySchema();
+  const fetchedDataContext = useFetchedDataContext();
+  const manager = React113.useMemo(() => {
+    const traitDefs = traitBindings.map(toTraitDefinition);
+    return new runtime.StateMachineManager(traitDefs);
+  }, [traitBindings]);
+  const [traitStates, setTraitStates] = React113.useState(() => {
+    return manager.getAllStates();
+  });
+  const eventQueueRef = React113.useRef([]);
+  const processingRef = React113.useRef(false);
+  const traitBindingsRef = React113.useRef(traitBindings);
+  const managerRef = React113.useRef(manager);
+  const slotsActionsRef = React113.useRef(slotsActions);
+  const optionsRef = React113.useRef(options);
+  React113.useEffect(() => {
+    traitBindingsRef.current = traitBindings;
+  }, [traitBindings]);
+  React113.useEffect(() => {
+    managerRef.current = manager;
+    setTraitStates(manager.getAllStates());
+  }, [manager]);
+  React113.useEffect(() => {
+    slotsActionsRef.current = slotsActions;
+  }, [slotsActions]);
+  React113.useEffect(() => {
+    optionsRef.current = options;
+  }, [options]);
+  const traitStatesRef = React113.useRef(traitStates);
+  const fetchedDataContextRef = React113.useRef(fetchedDataContext);
+  React113.useEffect(() => {
+    traitStatesRef.current = traitStates;
+  }, [traitStates]);
+  React113.useEffect(() => {
+    fetchedDataContextRef.current = fetchedDataContext;
+  }, [fetchedDataContext]);
+  React113.useEffect(() => {
+    const mgr = managerRef.current;
+    const bindings = traitBindingsRef.current;
+    const ids = [];
+    for (const binding of bindings) {
+      const trait = binding.trait;
+      const state = mgr.getState(trait.name);
+      const info = {
+        id: trait.name,
+        name: trait.name,
+        currentState: state?.currentState ?? trait.states[0]?.name ?? "unknown",
+        states: trait.states.map((s) => s.name),
+        transitions: trait.transitions.flatMap((t) => {
+          const froms = Array.isArray(t.from) ? t.from : [t.from];
+          return froms.map((f) => ({
+            from: f,
+            to: t.to,
+            event: t.event,
+            guard: t.guard ? String(t.guard) : void 0
+          }));
+        }),
+        guards: trait.transitions.filter((t) => t.guard).map((t) => ({ name: String(t.guard) })),
+        transitionCount: 0
+      };
+      registerTrait(info);
+      ids.push(trait.name);
+    }
+    return () => {
+      for (const id of ids) {
+        unregisterTrait(id);
+      }
+    };
+  }, [traitBindings]);
+  React113.useEffect(() => {
+    const newManager = managerRef.current;
+    newManager.resetAll();
+    setTraitStates(newManager.getAllStates());
+    console.log(
+      "[TraitStateMachine] Reset states for page navigation:",
+      Array.from(newManager.getAllStates().keys()).join(", ")
+    );
+  }, [traitBindings]);
+  const runTickEffects = React113.useCallback((tick, binding) => {
+    const fdc = fetchedDataContextRef.current;
+    const actions = slotsActionsRef.current;
+    const linkedEntity = binding.linkedEntity ?? "";
+    const currentState = traitStatesRef.current.get(binding.trait.name)?.currentState ?? "";
+    if (tick.appliesTo.length > 0 && !tick.appliesTo.includes(currentState)) return;
+    const records = linkedEntity && fdc ? fdc.getData(linkedEntity) : [];
+    const entityData = records.length > 0 ? Object.assign([...records], records[0]) : {};
+    const bindingCtx = { entity: entityData, payload: {}, state: currentState };
+    const evalCtx = runtime.createContextFromBindings(bindingCtx);
+    if (tick.guard !== void 0) {
+      const passed = runtime.interpolateValue(tick.guard, evalCtx);
+      if (!passed) return;
+    }
+    const entityMutations = /* @__PURE__ */ new Map();
+    const pendingSlots = /* @__PURE__ */ new Map();
+    const slotSource = {
+      trait: binding.trait.name,
+      state: currentState,
+      transition: `${currentState}->tick:${tick.name}`,
+      effects: tick.effects,
+      traitDefinition: binding.trait
+    };
+    const enrichTickNode = (node) => {
+      if (!node || typeof node !== "object") return node;
+      const rec = node;
+      const nodeType = rec.type;
+      let enriched = rec;
+      if (Array.isArray(rec.children)) {
+        enriched = { ...rec, children: rec.children.map(enrichTickNode) };
+      }
+      if (nodeType && patterns.isEntityAwarePattern(nodeType) && fdc) {
+        let injected = false;
+        if (typeof enriched.entity === "string") {
+          const entityRecords = fdc.getData(enriched.entity);
+          if (entityRecords.length > 0) {
+            enriched = { ...enriched, entity: entityRecords };
+            injected = true;
+          }
+        } else if (!enriched.entity && linkedEntity) {
+          const entityRecords = fdc.getData(linkedEntity);
+          if (entityRecords.length > 0) {
+            enriched = { ...enriched, entity: entityRecords };
+            injected = true;
+          }
+        }
+        if (injected && !enriched.fields && !enriched.columns) {
+          const sample = enriched.entity[0];
+          if (sample && typeof sample === "object") {
+            const keys = Object.keys(sample).filter((k) => k !== "id" && k !== "_id");
+            enriched = { ...enriched, fields: keys.map((k, i) => ({ name: k, variant: i === 0 ? "h4" : "body" })), children: void 0 };
+          }
+        }
+      }
+      return enriched;
+    };
+    for (const effect of tick.effects) {
+      if (!Array.isArray(effect)) continue;
+      const op = effect[0];
+      if (op === "set") {
+        const path = effect[1];
+        if (typeof path !== "string" || !path.startsWith("@entity.")) continue;
+        const field = path.slice("@entity.".length);
+        const updatedCtx = runtime.createContextFromBindings(bindingCtx);
+        const value = runtime.interpolateValue(effect[2], updatedCtx);
+        bindingCtx.entity[field] = value;
+        entityMutations.set(field, value);
+      } else if (op === "render-ui" || op === "render") {
+        const slot = effect[1];
+        const rawPattern = effect[2];
+        if (rawPattern === null || rawPattern === void 0) {
+          pendingSlots.set(slot, []);
+          continue;
+        }
+        const updatedCtx = runtime.createContextFromBindings(bindingCtx);
+        const resolved = runtime.interpolateValue(rawPattern, updatedCtx);
+        const enriched = enrichTickNode(resolved);
+        const existing = pendingSlots.get(slot) ?? [];
+        existing.push({ pattern: enriched, props: {} });
+        pendingSlots.set(slot, existing);
+      }
+    }
+    for (const [slot, patterns] of pendingSlots) {
+      if (patterns.length === 0) {
+        actions.clearSlot(slot);
+      } else {
+        actions.setSlotPatterns(slot, patterns, slotSource);
+      }
+    }
+    if (linkedEntity && entityMutations.size > 0 && fdc) {
+      const latestRecords = fdc.getData(linkedEntity);
+      if (latestRecords.length > 0) {
+        const updated = latestRecords.map(
+          (r, i) => i === 0 ? { ...r, ...Object.fromEntries(entityMutations) } : r
+        );
+        fdc.setData({ [linkedEntity]: updated });
+      }
+    }
+  }, []);
+  React113.useEffect(() => {
+    const hasFrameTicks = traitBindingsRef.current.some(
+      (b) => b.trait.ticks?.some((t) => t.interval === "frame")
+    );
+    if (!hasFrameTicks) return;
+    let running = true;
+    let rafId = 0;
+    const frame = () => {
+      if (!running) return;
+      for (const binding of traitBindingsRef.current) {
+        for (const tick of binding.trait.ticks ?? []) {
+          if (tick.interval !== "frame") continue;
+          runTickEffects(tick, binding);
+        }
+      }
+      rafId = requestAnimationFrame(frame);
+    };
+    rafId = requestAnimationFrame(frame);
+    return () => {
+      running = false;
+      cancelAnimationFrame(rafId);
+    };
+  }, [traitBindings, runTickEffects]);
+  React113.useEffect(() => {
+    const intervals = [];
+    for (const binding of traitBindings) {
+      for (const tick of binding.trait.ticks ?? []) {
+        if (tick.interval === "frame") continue;
+        const ms = tick.interval;
+        intervals.push(setInterval(() => {
+          runTickEffects(tick, binding);
+        }, ms));
+      }
+    }
+    return () => {
+      for (const id of intervals) clearInterval(id);
+    };
+  }, [traitBindings, runTickEffects]);
+  const processEventQueued = React113.useCallback(async (eventKey, payload) => {
+    const normalizedEvent = normalizeEventKey(eventKey);
+    const bindings = traitBindingsRef.current;
+    const currentManager = managerRef.current;
+    const actions = slotsActionsRef.current;
+    console.log("[TraitStateMachine] Processing event:", normalizedEvent, "payload:", payload);
+    const bindingMap = new Map(bindings.map((b) => [b.trait.name, b]));
+    const results = currentManager.sendEvent(normalizedEvent, payload);
+    for (const { traitName, result } of results) {
+      const binding = bindingMap.get(traitName);
+      const traitState = currentManager.getState(traitName);
+      if (!binding || !traitState) continue;
+      if (result.executed && result.effects.length > 0) {
+        console.log(
+          "[TraitStateMachine] Executing",
+          result.effects.length,
+          "effects for",
+          traitName,
+          "| linkedEntity:",
+          binding.linkedEntity,
+          "| transition:",
+          `${result.previousState} -> ${result.newState}`,
+          "| effects:",
+          JSON.stringify(result.effects)
+        );
+        const linkedEntity = binding.linkedEntity || "";
+        const entityId = payload?.entityId;
+        const entityData = (() => {
+          if (!linkedEntity || !fetchedDataContext) return payload || {};
+          if (entityId) {
+            return fetchedDataContext.getById(linkedEntity, entityId) || {};
+          }
+          const records = fetchedDataContext.getData(linkedEntity);
+          if (records.length === 0) return payload || {};
+          const firstRecord = records[0];
+          return Object.assign([...records], firstRecord);
+        })();
+        const pendingSlots = /* @__PURE__ */ new Map();
+        const slotSource = {
+          trait: binding.trait.name,
+          state: result.previousState,
+          transition: `${result.previousState}->${result.newState}`,
+          effects: result.effects,
+          traitDefinition: binding.trait
+        };
+        const handlers = createClientEffectHandlers({
+          eventBus,
+          slotSetter: {
+            addPattern: (slot, pattern, props) => {
+              const existing = pendingSlots.get(slot) || [];
+              existing.push({ pattern, props: props || {} });
+              pendingSlots.set(slot, existing);
+            },
+            clearSlot: (slot) => {
+              pendingSlots.set(slot, []);
+            }
+          },
+          navigate: optionsRef.current?.navigate,
+          notify: optionsRef.current?.notify,
+          enrichPattern: (pattern) => {
+            const enrichNode = (node) => {
+              if (!node || typeof node !== "object") return node;
+              const rec = node;
+              const nodeType = rec.type;
+              let enriched = rec;
+              if (Array.isArray(rec.children)) {
+                const enrichedChildren = rec.children.map(enrichNode);
+                enriched = { ...rec, children: enrichedChildren };
+              }
+              if (nodeType && patterns.isEntityAwarePattern(nodeType) && fetchedDataContext) {
+                let injected = false;
+                if (typeof enriched.entity === "string") {
+                  const records = fetchedDataContext.getData(enriched.entity);
+                  if (records.length > 0) {
+                    enriched = { ...enriched, entity: records };
+                    injected = true;
+                  }
+                } else if (!enriched.entity && linkedEntity) {
+                  const records = fetchedDataContext.getData(linkedEntity);
+                  if (records.length > 0) {
+                    enriched = { ...enriched, entity: records };
+                    injected = true;
+                  }
+                }
+                if (injected && !enriched.fields && !enriched.columns) {
+                  const sample = enriched.entity[0];
+                  if (sample && typeof sample === "object") {
+                    const keys = Object.keys(sample).filter((k) => k !== "id" && k !== "_id");
+                    enriched = {
+                      ...enriched,
+                      fields: keys.map((k, i) => ({
+                        name: k,
+                        variant: i === 0 ? "h4" : "body"
+                      })),
+                      // Remove pattern-config children that components
+                      // can't render (they expect a function or nothing)
+                      children: void 0
+                    };
+                  }
+                }
+              }
+              return enriched;
+            };
+            return enrichNode(pattern);
+          }
+        });
+        const bindingCtx = {
+          entity: entityData,
+          payload: payload || {},
+          state: result.previousState
+        };
+        const entityMutations = /* @__PURE__ */ new Map();
+        for (const effect of result.effects) {
+          if (!Array.isArray(effect) || effect[0] !== "set") continue;
+          const path = effect[1];
+          if (typeof path !== "string" || !path.startsWith("@entity.")) continue;
+          const field = path.slice("@entity.".length);
+          const evalCtx = runtime.createContextFromBindings(bindingCtx);
+          const value = runtime.interpolateValue(effect[2], evalCtx);
+          if (bindingCtx.entity !== null && typeof bindingCtx.entity === "object") {
+            bindingCtx.entity[field] = value;
+          }
+          entityMutations.set(field, value);
+        }
+        const effectContext = {
+          traitName: binding.trait.name,
+          state: result.previousState,
+          transition: `${result.previousState}->${result.newState}`,
+          linkedEntity,
+          entityId
+        };
+        const executor = new runtime.EffectExecutor({ handlers, bindings: bindingCtx, context: effectContext });
+        try {
+          await executor.executeAll(result.effects);
+          console.log(
+            "[TraitStateMachine] After executeAll, pendingSlots:",
+            Object.fromEntries(pendingSlots.entries())
+          );
+          for (const [slot, patterns] of pendingSlots) {
+            if (patterns.length === 0) {
+              actions.clearSlot(slot);
+            } else {
+              actions.setSlotPatterns(slot, patterns, slotSource);
+            }
+          }
+          if (linkedEntity && entityMutations.size > 0 && fetchedDataContext) {
+            const records = fetchedDataContext.getData(linkedEntity);
+            if (records.length > 0) {
+              const updated = records.map(
+                (r, i) => i === 0 ? { ...r, ...Object.fromEntries(entityMutations) } : r
+              );
+              fetchedDataContext.setData({ [linkedEntity]: updated });
+            }
+          }
+          if (fetchedDataContext) {
+            for (const effect of result.effects) {
+              if (!Array.isArray(effect) || effect[0] !== "persist") continue;
+              const action = effect[1];
+              const entityType = effect[2] || linkedEntity;
+              if (!entityType) continue;
+              const records = fetchedDataContext.getData(entityType);
+              if (action === "create") {
+                const evalCtx = runtime.createContextFromBindings(bindingCtx);
+                const rawData = effect[3];
+                const newRecord = { id: `${entityType}-${Date.now()}` };
+                if (rawData) {
+                  for (const [k, v] of Object.entries(rawData)) {
+                    newRecord[k] = runtime.interpolateValue(v, evalCtx);
+                  }
+                }
+                for (const [k, v] of entityMutations) {
+                  newRecord[k] = v;
+                }
+                fetchedDataContext.setData({ [entityType]: [...records, newRecord] });
+              } else if (action === "delete") {
+                const deleteId = effect[3];
+                if (deleteId) {
+                  const filtered = records.filter((r) => r.id !== deleteId);
+                  fetchedDataContext.setData({ [entityType]: filtered });
+                }
+              } else if (action === "update") {
+                const updateId = effect[3];
+                const updateData = effect[4];
+                if (updateId && updateData) {
+                  const evalCtx = runtime.createContextFromBindings(bindingCtx);
+                  const updated = records.map((r) => {
+                    if (r.id !== updateId) return r;
+                    const patched = { ...r };
+                    for (const [k, v] of Object.entries(updateData)) {
+                      patched[k] = runtime.interpolateValue(v, evalCtx);
+                    }
+                    return patched;
+                  });
+                  fetchedDataContext.setData({ [entityType]: updated });
+                }
+              }
+            }
+          }
+        } catch (error) {
+          console.error(
+            "[TraitStateMachine] Effect execution error:",
+            error,
+            "| effects:",
+            JSON.stringify(result.effects)
+          );
+        }
+      } else if (!result.executed) {
+        if (result.guardResult === false) {
+          console.log(
+            "[TraitStateMachine] Guard blocked transition:",
+            traitName,
+            result.previousState,
+            "->",
+            result.transition?.to
+          );
+        } else if (!result.transition) {
+          if (core.isCircuitEvent(normalizedEvent)) {
+            console.warn(
+              `[CLOSED CIRCUIT VIOLATION] Trait "${traitName}" in state "${traitState.currentState}" received event "${normalizedEvent}" but has no transition to handle it.
+   This is likely a schema issue. To fix, add a transition:
+   { from: "${traitState.currentState}", to: "<target_state>", event: "${normalizedEvent}", effects: [...] }
+   Or ensure the previous action (that opened this UI) properly transitions back before emitting this event.`
+            );
+          } else {
+            console.log(
+              "[TraitStateMachine] No transition for",
+              traitName,
+              "from state:",
+              traitState.currentState,
+              "on event:",
+              normalizedEvent
+            );
+          }
+        }
+      }
+    }
+    for (const { traitName, result } of results) {
+      if (result.executed) {
+        updateTraitState(traitName, result.newState);
+        const effectTraces = result.effects.map(
+          (e) => {
+            const eff = e;
+            return {
+              type: String(eff.type ?? "unknown"),
+              args: Array.isArray(eff.args) ? eff.args : [],
+              status: "executed"
+            };
+          }
+        );
+        recordTransition({
+          traitName,
+          from: result.previousState,
+          to: result.newState,
+          event: normalizedEvent,
+          effects: effectTraces,
+          timestamp: Date.now()
+        });
+      }
+    }
+    if (results.length > 0) {
+      setTraitStates(currentManager.getAllStates());
+    }
+    const onEventProcessed = optionsRef.current?.onEventProcessed;
+    if (onEventProcessed) {
+      onEventProcessed(normalizedEvent, payload);
+    }
+  }, [entities, fetchedDataContext, eventBus]);
+  const drainEventQueue = React113.useCallback(async () => {
+    if (processingRef.current) return;
+    processingRef.current = true;
+    try {
+      while (eventQueueRef.current.length > 0) {
+        const entry = eventQueueRef.current.shift();
+        await processEventQueued(entry.eventKey, entry.payload);
+      }
+    } finally {
+      processingRef.current = false;
+    }
+  }, [processEventQueued]);
+  const enqueueAndDrain = React113.useCallback((eventKey, payload) => {
+    eventQueueRef.current.push({ eventKey, payload });
+    void drainEventQueue();
+  }, [drainEventQueue]);
+  React113.useCallback((eventKey, payload) => {
+    enqueueAndDrain(eventKey, payload);
+  }, [enqueueAndDrain]);
+  const sendEvent = React113.useCallback((eventKey, payload) => {
+    enqueueAndDrain(eventKey, payload);
+  }, [enqueueAndDrain]);
+  const getTraitState = React113.useCallback((traitName) => {
+    return managerRef.current.getState(traitName);
+  }, []);
+  const canHandleEvent = React113.useCallback((traitName, eventKey) => {
+    const normalizedEvent = normalizeEventKey(eventKey);
+    return managerRef.current.canHandleEvent(traitName, normalizedEvent);
+  }, []);
+  React113.useEffect(() => {
+    const allEvents = /* @__PURE__ */ new Set();
+    for (const binding of traitBindings) {
+      for (const event of binding.trait.events) {
+        allEvents.add(event.key);
+      }
+      for (const transition of binding.trait.transitions) {
+        allEvents.add(transition.event);
+      }
+    }
+    console.log("[TraitStateMachine] Subscribing to events:", Array.from(allEvents));
+    const unsubscribes = [];
+    for (const eventKey of allEvents) {
+      if (eventKey === "INIT" || eventKey === "LOAD" || eventKey === "$MOUNT") {
+        continue;
+      }
+      const unsub = eventBus.on(`UI:${eventKey}`, (event) => {
+        console.log("[TraitStateMachine] Received event:", `UI:${eventKey}`, event);
+        enqueueAndDrain(eventKey, event.payload);
+      });
+      unsubscribes.push(unsub);
+    }
+    return () => {
+      for (const unsub of unsubscribes) {
+        unsub();
+      }
+    };
+  }, [traitBindings, eventBus, enqueueAndDrain]);
+  return {
+    traitStates,
+    sendEvent,
+    getTraitState,
+    canHandleEvent
+  };
+}
+function useResolvedSchema(schema, pageName) {
+  const [loading, setLoading] = React113.useState(true);
+  const [error, setError] = React113.useState(null);
+  const ir = React113.useMemo(() => {
+    if (!schema) return null;
+    try {
+      return core.schemaToIR(schema);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Schema resolution failed");
+      return null;
+    }
+  }, [schema]);
+  React113.useEffect(() => {
+    setLoading(false);
+  }, [ir]);
+  const result = React113.useMemo(() => {
+    if (!ir) {
+      return {
+        page: void 0,
+        traits: [],
+        entities: /* @__PURE__ */ new Map(),
+        allEntities: /* @__PURE__ */ new Map(),
+        allTraits: /* @__PURE__ */ new Map(),
+        loading,
+        error: error || (schema ? null : "No schema provided"),
+        ir: null
+      };
+    }
+    const page = core.getPage(ir, pageName);
+    console.log("[useResolvedSchema] Resolved page:", page?.name, "| path:", page?.path, "| traits:", page?.traits.length);
+    const traits2 = page?.traits || [];
+    const entities = /* @__PURE__ */ new Map();
+    if (page) {
+      for (const binding of page.entityBindings) {
+        entities.set(binding.entity.name, binding.entity);
+      }
+    }
+    return {
+      page,
+      traits: traits2,
+      entities,
+      allEntities: ir.entities,
+      allTraits: ir.traits,
+      loading,
+      error,
+      ir
+    };
+  }, [ir, pageName, loading, error, schema]);
+  return result;
+}
+function clearSchemaCache() {
+  core.clearSchemaCache();
+}
+var TraitContext = React113.createContext(null);
+function TraitProvider({
+  traits: traitBindings,
+  children
+}) {
+  const traitInstances = React113.useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const binding of traitBindings) {
+      const trait = binding.trait;
+      const initialState = trait.states.find((s) => s.isInitial);
+      const stateName = initialState?.name || trait.states[0]?.name || "idle";
+      const instance = {
+        name: trait.name,
+        currentState: stateName,
+        availableEvents: trait.transitions.filter((t) => t.from === stateName).map((t) => t.event),
+        dispatch: (eventKey, payload) => {
+          console.log(`[TraitProvider] Dispatch to ${trait.name}: ${eventKey}`, payload);
+        },
+        canDispatch: (eventKey) => {
+          return trait.transitions.some(
+            (t) => t.from === stateName && t.event === eventKey
+          );
+        },
+        trait
+      };
+      map.set(trait.name, instance);
+    }
+    return map;
+  }, [traitBindings]);
+  const contextValue = React113.useMemo(() => {
+    return {
+      traits: traitInstances,
+      getTrait: (name) => traitInstances.get(name),
+      dispatchToTrait: (traitName, eventKey, payload) => {
+        const instance = traitInstances.get(traitName);
+        if (instance) {
+          instance.dispatch(eventKey, payload);
+        }
+      },
+      canDispatch: (traitName, eventKey) => {
+        const instance = traitInstances.get(traitName);
+        return instance?.canDispatch(eventKey) || false;
+      }
+    };
+  }, [traitInstances]);
+  return /* @__PURE__ */ jsxRuntime.jsx(TraitContext.Provider, { value: contextValue, children });
+}
+function useTraitContext() {
+  const context = React113.useContext(TraitContext);
+  if (!context) {
+    throw new Error("useTraitContext must be used within a TraitProvider");
+  }
+  return context;
+}
+function useTrait(traitName) {
+  const context = useTraitContext();
+  return context.getTrait(traitName);
+}
+var SlotsStateContext = React113.createContext({});
+var SlotsActionsContext = React113.createContext(null);
+function SlotsProvider({ children }) {
+  const [slots, setSlots] = React113.useState({});
+  const setSlotPatterns = React113.useCallback((slot, patterns, source) => {
+    setSlots((prev) => ({
+      ...prev,
+      [slot]: { patterns, source }
+    }));
+  }, []);
+  const clearSlot = React113.useCallback((slot) => {
+    setSlots((prev) => {
+      if (!(slot in prev)) return prev;
+      const next = { ...prev };
+      delete next[slot];
+      return next;
+    });
+  }, []);
+  const clearAllSlots = React113.useCallback(() => {
+    setSlots({});
+  }, []);
+  const actionsRef = React113.useRef({ setSlotPatterns, clearSlot, clearAllSlots });
+  actionsRef.current = { setSlotPatterns, clearSlot, clearAllSlots };
+  const [stableActions] = React113.useState(() => ({
+    setSlotPatterns: (...args) => actionsRef.current.setSlotPatterns(...args),
+    clearSlot: (...args) => actionsRef.current.clearSlot(...args),
+    clearAllSlots: () => actionsRef.current.clearAllSlots()
+  }));
+  return /* @__PURE__ */ jsxRuntime.jsx(SlotsActionsContext.Provider, { value: stableActions, children: /* @__PURE__ */ jsxRuntime.jsx(SlotsStateContext.Provider, { value: slots, children }) });
+}
+function useSlots() {
+  return React113.useContext(SlotsStateContext);
+}
+function useSlotContent(slotName) {
+  const slots = React113.useContext(SlotsStateContext);
+  return slots[slotName] || null;
+}
+function useSlotsActions() {
+  const actions = React113.useContext(SlotsActionsContext);
+  if (!actions) {
+    throw new Error("useSlotsActions must be used within a SlotsProvider");
+  }
+  return actions;
+}
+
+exports.EntitySchemaProvider = EntitySchemaProvider;
+exports.SlotsProvider = SlotsProvider;
+exports.TraitContext = TraitContext;
+exports.TraitProvider = TraitProvider;
+exports.clearSchemaCache = clearSchemaCache;
+exports.createClientEffectHandlers = createClientEffectHandlers;
+exports.useEntityDefinition = useEntityDefinition;
+exports.useEntitySchema = useEntitySchema;
+exports.useResolvedSchema = useResolvedSchema;
+exports.useSlotContent = useSlotContent;
+exports.useSlots = useSlots;
+exports.useSlotsActions = useSlotsActions;
+exports.useTrait = useTrait;
+exports.useTraitContext = useTraitContext;
+exports.useTraitStateMachine = useTraitStateMachine;