@almadar/ui 2.18.0 → 2.19.1

package/dist/runtime/index.cjs

@@ -1,6 +1,7 @@
 'use strict';
 
 var React110 = require('react');
+var providers = require('@almadar/ui/providers');
 var jsxRuntime = require('react/jsx-runtime');
 require('@tanstack/react-query');
 require('react-dom');
@@ -56,7 +57,6 @@ var dark__default = /*#__PURE__*/_interopDefault(dark);
 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 = React110.createContext(null);
 function getGlobalEventBus() {
   if (typeof window !== "undefined") {
     return window.__kflowEventBus ?? null;
@@ -124,7 +124,7 @@ var fallbackEventBus = {
   }
 };
 function useEventBus() {
-  const context = React110.useContext(EventBusContext);
+  const context = React110.useContext(providers.EventBusContext);
   return context ?? getGlobalEventBus() ?? fallbackEventBus;
 }
 React110.createContext(null);
@@ -255,6 +255,7 @@ function useTranslate() {
 }
 typeof process !== "undefined" && process.env?.VITE_API_URL ? process.env.VITE_API_URL : "http://localhost:3000";
 React110.createContext(void 0);
+React110.createContext(null);
 var FetchedDataContext = React110.createContext(null);
 function useFetchedDataContext() {
   return React110.useContext(FetchedDataContext);
@@ -3013,8 +3014,144 @@ function useSlotsActions() {
   }
   return actions;
 }
+var runtimeCache = null;
+async function loadRuntime() {
+  if (runtimeCache) return runtimeCache;
+  const [providers, context, runtime, components] = await Promise.all([
+    import('@almadar/ui/providers'),
+    import('@almadar/ui/context'),
+    import('@almadar/ui/runtime'),
+    import('@almadar/ui/components')
+  ]);
+  runtimeCache = {
+    OrbitalProvider: providers.OrbitalProvider,
+    UISlotProvider: context.UISlotProvider,
+    SlotsProvider: runtime.SlotsProvider,
+    EntitySchemaProvider: runtime.EntitySchemaProvider,
+    VerificationProvider: providers.VerificationProvider,
+    UISlotRenderer: components.UISlotRenderer,
+    useResolvedSchema: runtime.useResolvedSchema,
+    useTraitStateMachine: runtime.useTraitStateMachine,
+    useSlotsActions: runtime.useSlotsActions,
+    useSlots: runtime.useSlots,
+    useUISlots: context.useUISlots
+  };
+  return runtimeCache;
+}
+function normalizeChild(child) {
+  const { type, children, ...rest } = child;
+  const normalizedChildren = Array.isArray(children) ? children.map((c) => normalizeChild(c)) : children;
+  return {
+    type,
+    props: { ...rest, ...normalizedChildren !== void 0 ? { children: normalizedChildren } : {} }
+  };
+}
+function SlotBridge({ rt }) {
+  const slots = rt.useSlots();
+  const { render, clear } = rt.useUISlots();
+  React110.useEffect(() => {
+    for (const [slotName, slotState] of Object.entries(slots)) {
+      if (slotState.patterns.length === 0) {
+        clear(slotName);
+        continue;
+      }
+      const entry = slotState.patterns[slotState.patterns.length - 1];
+      const { type: patternType, children, ...inlineProps } = entry.pattern;
+      const normalizedChildren = Array.isArray(children) ? children.map((c) => normalizeChild(c)) : children;
+      render({
+        target: slotName,
+        pattern: patternType,
+        props: {
+          ...inlineProps,
+          ...entry.props,
+          ...normalizedChildren !== void 0 ? { children: normalizedChildren } : {}
+        },
+        sourceTrait: slotState.source?.trait
+      });
+    }
+  }, [slots]);
+  return null;
+}
+function TraitInitializer({ rt, traits: traits2 }) {
+  const slotsActions = rt.useSlotsActions();
+  const { sendEvent } = rt.useTraitStateMachine(traits2, slotsActions, {});
+  React110.useEffect(() => {
+    const t = setTimeout(() => sendEvent("INIT"), 50);
+    return () => clearTimeout(t);
+  }, [traits2]);
+  return null;
+}
+function SchemaRunner({ rt, schema, mockData }) {
+  const { traits: traits2, allEntities, ir } = rt.useResolvedSchema(schema);
+  const allPageTraits = React110.useMemo(() => {
+    if (!ir?.pages || ir.pages.size <= 1) return traits2;
+    const combined = [];
+    const seen = /* @__PURE__ */ new Set();
+    for (const page of ir.pages.values()) {
+      for (const t of page.traits) {
+        const binding = t;
+        const traitObj = binding.trait;
+        const name = traitObj?.name ?? binding.name ?? "";
+        if (name && !seen.has(name)) {
+          seen.add(name);
+          combined.push(t);
+        }
+      }
+    }
+    return combined.length > 0 ? combined : traits2;
+  }, [ir, traits2]);
+  return /* @__PURE__ */ jsxRuntime.jsx(rt.VerificationProvider, { enabled: true, children: /* @__PURE__ */ jsxRuntime.jsx(rt.SlotsProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(rt.EntitySchemaProvider, { entities: Array.from(allEntities.values()), children: [
+    /* @__PURE__ */ jsxRuntime.jsx(TraitInitializer, { rt, traits: allPageTraits }),
+    /* @__PURE__ */ jsxRuntime.jsx(SlotBridge, { rt }),
+    /* @__PURE__ */ jsxRuntime.jsx(Box, { className: "min-h-full p-4", children: /* @__PURE__ */ jsxRuntime.jsx(rt.UISlotRenderer, { includeHud: true, hudMode: "inline", includeFloating: true }) })
+  ] }) }) });
+}
+function OrbPreview({
+  schema,
+  mockData = {},
+  height = "400px",
+  className
+}) {
+  const [rt, setRt] = React110.useState(null);
+  const [error, setError] = React110.useState(null);
+  const parsedSchema = React110.useMemo(() => {
+    if (typeof schema === "string") {
+      try {
+        return JSON.parse(schema);
+      } catch (e) {
+        return { error: String(e) };
+      }
+    }
+    return schema;
+  }, [schema]);
+  React110.useEffect(() => {
+    loadRuntime().then(setRt).catch((e) => setError(String(e)));
+  }, []);
+  if (parsedSchema.error) {
+    return /* @__PURE__ */ jsxRuntime.jsx(Box, { className, style: { height }, children: /* @__PURE__ */ jsxRuntime.jsxs(Typography, { as: "pre", color: "error", variant: "small", className: "font-mono whitespace-pre-wrap break-all m-0 p-4", children: [
+      "Parse error: ",
+      parsedSchema.error
+    ] }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsxRuntime.jsx(Box, { className, style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { as: "pre", color: "error", variant: "small", className: "font-mono whitespace-pre-wrap break-all m-0 p-4", children: error }) });
+  }
+  if (!rt) {
+    return /* @__PURE__ */ jsxRuntime.jsx(Box, { className: `flex items-center justify-center ${className ?? ""}`, style: { height }, children: /* @__PURE__ */ jsxRuntime.jsx(Typography, { color: "muted", variant: "small", children: "Loading runtime..." }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Box,
+    {
+      className: `overflow-auto border border-[var(--color-border)] rounded-[var(--radius-md)] ${className ?? ""}`,
+      style: { height },
+      children: /* @__PURE__ */ jsxRuntime.jsx(rt.OrbitalProvider, { initialData: mockData, skipTheme: true, verification: true, children: /* @__PURE__ */ jsxRuntime.jsx(rt.UISlotProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(SchemaRunner, { rt, schema: parsedSchema, mockData }) }) })
+    }
+  );
+}
+OrbPreview.displayName = "OrbPreview";
 
 exports.EntitySchemaProvider = EntitySchemaProvider;
+exports.OrbPreview = OrbPreview;
 exports.SlotsProvider = SlotsProvider;
 exports.TraitContext = TraitContext;
 exports.TraitProvider = TraitProvider;

package/dist/runtime/index.d.ts

@@ -12,4 +12,5 @@ export { EntitySchemaProvider, useEntitySchema, useEntityDefinition, type Entity
 export { TraitProvider, TraitContext, useTraitContext, useTrait, type TraitContextValue, type TraitInstance, type TraitProviderProps, } from './TraitProvider';
 export { SlotsProvider, useSlots, useSlotContent, useSlotsActions, type SlotsState, type SlotState, type SlotPatternEntry, type SlotSource, type SlotsActions, type SlotsProviderProps, } from './ui/SlotsContext';
 export { createClientEffectHandlers, type ClientEventBus, type SlotSetter, type CreateClientEffectHandlersOptions, } from './createClientEffectHandlers';
+export { OrbPreview, type OrbPreviewProps } from './OrbPreview';
 export type { ResolvedTraitBinding, ResolvedTrait, ResolvedEntity, ResolvedPage, ResolvedIR, } from './types';

package/dist/runtime/index.js

@@ -1,5 +1,6 @@
 import * as React110 from 'react';
 import React110__default, { createContext, useCallback, useState, useRef, useLayoutEffect, useEffect, lazy, useContext, useMemo } from 'react';
+import { EventBusContext } from '@almadar/ui/providers';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import '@tanstack/react-query';
 import 'react-dom';
@@ -26,7 +27,6 @@ import { StateMachineManager, createContextFromBindings, interpolateValue, Effec
 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 = createContext(null);
 function getGlobalEventBus() {
   if (typeof window !== "undefined") {
     return window.__kflowEventBus ?? null;
@@ -225,6 +225,7 @@ function useTranslate() {
 }
 typeof process !== "undefined" && process.env?.VITE_API_URL ? process.env.VITE_API_URL : "http://localhost:3000";
 createContext(void 0);
+createContext(null);
 var FetchedDataContext = createContext(null);
 function useFetchedDataContext() {
   return useContext(FetchedDataContext);
@@ -2983,5 +2984,140 @@ function useSlotsActions() {
   }
   return actions;
 }
+var runtimeCache = null;
+async function loadRuntime() {
+  if (runtimeCache) return runtimeCache;
+  const [providers, context, runtime, components] = await Promise.all([
+    import('@almadar/ui/providers'),
+    import('@almadar/ui/context'),
+    import('@almadar/ui/runtime'),
+    import('@almadar/ui/components')
+  ]);
+  runtimeCache = {
+    OrbitalProvider: providers.OrbitalProvider,
+    UISlotProvider: context.UISlotProvider,
+    SlotsProvider: runtime.SlotsProvider,
+    EntitySchemaProvider: runtime.EntitySchemaProvider,
+    VerificationProvider: providers.VerificationProvider,
+    UISlotRenderer: components.UISlotRenderer,
+    useResolvedSchema: runtime.useResolvedSchema,
+    useTraitStateMachine: runtime.useTraitStateMachine,
+    useSlotsActions: runtime.useSlotsActions,
+    useSlots: runtime.useSlots,
+    useUISlots: context.useUISlots
+  };
+  return runtimeCache;
+}
+function normalizeChild(child) {
+  const { type, children, ...rest } = child;
+  const normalizedChildren = Array.isArray(children) ? children.map((c) => normalizeChild(c)) : children;
+  return {
+    type,
+    props: { ...rest, ...normalizedChildren !== void 0 ? { children: normalizedChildren } : {} }
+  };
+}
+function SlotBridge({ rt }) {
+  const slots = rt.useSlots();
+  const { render, clear } = rt.useUISlots();
+  useEffect(() => {
+    for (const [slotName, slotState] of Object.entries(slots)) {
+      if (slotState.patterns.length === 0) {
+        clear(slotName);
+        continue;
+      }
+      const entry = slotState.patterns[slotState.patterns.length - 1];
+      const { type: patternType, children, ...inlineProps } = entry.pattern;
+      const normalizedChildren = Array.isArray(children) ? children.map((c) => normalizeChild(c)) : children;
+      render({
+        target: slotName,
+        pattern: patternType,
+        props: {
+          ...inlineProps,
+          ...entry.props,
+          ...normalizedChildren !== void 0 ? { children: normalizedChildren } : {}
+        },
+        sourceTrait: slotState.source?.trait
+      });
+    }
+  }, [slots]);
+  return null;
+}
+function TraitInitializer({ rt, traits: traits2 }) {
+  const slotsActions = rt.useSlotsActions();
+  const { sendEvent } = rt.useTraitStateMachine(traits2, slotsActions, {});
+  useEffect(() => {
+    const t = setTimeout(() => sendEvent("INIT"), 50);
+    return () => clearTimeout(t);
+  }, [traits2]);
+  return null;
+}
+function SchemaRunner({ rt, schema, mockData }) {
+  const { traits: traits2, allEntities, ir } = rt.useResolvedSchema(schema);
+  const allPageTraits = useMemo(() => {
+    if (!ir?.pages || ir.pages.size <= 1) return traits2;
+    const combined = [];
+    const seen = /* @__PURE__ */ new Set();
+    for (const page of ir.pages.values()) {
+      for (const t of page.traits) {
+        const binding = t;
+        const traitObj = binding.trait;
+        const name = traitObj?.name ?? binding.name ?? "";
+        if (name && !seen.has(name)) {
+          seen.add(name);
+          combined.push(t);
+        }
+      }
+    }
+    return combined.length > 0 ? combined : traits2;
+  }, [ir, traits2]);
+  return /* @__PURE__ */ jsx(rt.VerificationProvider, { enabled: true, children: /* @__PURE__ */ jsx(rt.SlotsProvider, { children: /* @__PURE__ */ jsxs(rt.EntitySchemaProvider, { entities: Array.from(allEntities.values()), children: [
+    /* @__PURE__ */ jsx(TraitInitializer, { rt, traits: allPageTraits }),
+    /* @__PURE__ */ jsx(SlotBridge, { rt }),
+    /* @__PURE__ */ jsx(Box, { className: "min-h-full p-4", children: /* @__PURE__ */ jsx(rt.UISlotRenderer, { includeHud: true, hudMode: "inline", includeFloating: true }) })
+  ] }) }) });
+}
+function OrbPreview({
+  schema,
+  mockData = {},
+  height = "400px",
+  className
+}) {
+  const [rt, setRt] = useState(null);
+  const [error, setError] = useState(null);
+  const parsedSchema = useMemo(() => {
+    if (typeof schema === "string") {
+      try {
+        return JSON.parse(schema);
+      } catch (e) {
+        return { error: String(e) };
+      }
+    }
+    return schema;
+  }, [schema]);
+  useEffect(() => {
+    loadRuntime().then(setRt).catch((e) => setError(String(e)));
+  }, []);
+  if (parsedSchema.error) {
+    return /* @__PURE__ */ jsx(Box, { className, style: { height }, children: /* @__PURE__ */ jsxs(Typography, { as: "pre", color: "error", variant: "small", className: "font-mono whitespace-pre-wrap break-all m-0 p-4", children: [
+      "Parse error: ",
+      parsedSchema.error
+    ] }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx(Box, { className, style: { height }, children: /* @__PURE__ */ jsx(Typography, { as: "pre", color: "error", variant: "small", className: "font-mono whitespace-pre-wrap break-all m-0 p-4", children: error }) });
+  }
+  if (!rt) {
+    return /* @__PURE__ */ jsx(Box, { className: `flex items-center justify-center ${className ?? ""}`, style: { height }, children: /* @__PURE__ */ jsx(Typography, { color: "muted", variant: "small", children: "Loading runtime..." }) });
+  }
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      className: `overflow-auto border border-[var(--color-border)] rounded-[var(--radius-md)] ${className ?? ""}`,
+      style: { height },
+      children: /* @__PURE__ */ jsx(rt.OrbitalProvider, { initialData: mockData, skipTheme: true, verification: true, children: /* @__PURE__ */ jsx(rt.UISlotProvider, { children: /* @__PURE__ */ jsx(SchemaRunner, { rt, schema: parsedSchema, mockData }) }) })
+    }
+  );
+}
+OrbPreview.displayName = "OrbPreview";
 
-export { EntitySchemaProvider, SlotsProvider, TraitContext, TraitProvider, clearSchemaCache, createClientEffectHandlers, useEntityDefinition, useEntitySchema, useResolvedSchema, useSlotContent, useSlots, useSlotsActions, useTrait, useTraitContext, useTraitStateMachine };
+export { EntitySchemaProvider, OrbPreview, SlotsProvider, TraitContext, TraitProvider, clearSchemaCache, createClientEffectHandlers, useEntityDefinition, useEntitySchema, useResolvedSchema, useSlotContent, useSlots, useSlotsActions, useTrait, useTraitContext, useTraitStateMachine };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almadar/ui",
-  "version": "2.18.0",
+  "version": "2.19.1",
   "description": "React UI components, hooks, and providers for Almadar",
   "type": "module",
   "main": "./dist/components/index.js",

package/dist/internals/event-bus-context.d.ts

@@ -1,15 +0,0 @@
-import type { EventBusContextType } from '../hooks/event-bus-types';
-/**
- * Extended context type for backward compatibility.
- */
-export interface EventBusContextTypeExtended extends EventBusContextType {
-    /** @deprecated Use useSelection from SelectionProvider instead. */
-    getSelectedEntity: () => unknown | null;
-    /** @deprecated Use useSelection from SelectionProvider instead. */
-    clearSelectedEntity: () => void;
-}
-/**
- * The one and only EventBusContext.
- * Imported by EventBusProvider (to provide) and useEventBus (to consume).
- */
-export declare const EventBusContext: import("react").Context<EventBusContextTypeExtended | null>;