@arkcit/engine-react 0.3.0

package/dist/engine.d.ts

@@ -0,0 +1,96 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React__default from 'react';
+import { UIEngineProps, UINodeSize, UINodeWrapperProps } from '@arkcit/engine-core';
+import { UINode } from '@arkcit/engine-schema';
+import { UIRuntimeAdapter } from '@arkcit/engine-runtime';
+import { r as renderReactNode } from './renderReactNode-DmxD8hot.js';
+import '@arkcit/engine-render-layer';
+
+type EngineWarningFallbackProps = {
+    message: string;
+};
+declare const EngineWarningFallback: ({ message }: EngineWarningFallbackProps) => react_jsx_runtime.JSX.Element;
+
+type NodeErrorBoundaryProps = {
+    nodeId: string;
+    nodeType: string;
+    resetToken: string;
+    children: React__default.ReactNode;
+};
+type NodeErrorBoundaryState = {
+    hasError: boolean;
+};
+declare class NodeErrorBoundary extends React__default.Component<NodeErrorBoundaryProps, NodeErrorBoundaryState> {
+    constructor(props: NodeErrorBoundaryProps);
+    static getDerivedStateFromError(): NodeErrorBoundaryState;
+    componentDidUpdate(prevProps: Readonly<{
+        resetToken: string;
+    }>): void;
+    render(): string | number | bigint | boolean | Iterable<React__default.ReactNode> | Promise<string | number | bigint | boolean | React__default.ReactPortal | React__default.ReactElement<unknown, string | React__default.JSXElementConstructor<any>> | Iterable<React__default.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
+}
+
+type UseUIEngineEffectsArgs = {
+    schema: UIEngineProps["schema"];
+    runtime: UIRuntimeAdapter;
+    onNodeResize?: ((nodeId: string, size: UINodeSize) => void) | undefined;
+    onNodeResizeEnd?: ((nodeId: string, size: UINodeSize) => void) | undefined;
+    resizeStateRef: React__default.MutableRefObject<unknown>;
+    pendingFieldFocusRef: React__default.MutableRefObject<unknown>;
+    setVersion: React__default.Dispatch<React__default.SetStateAction<number>>;
+    minWidthPct: number;
+    minHeightPct: number;
+    minHeightPx: number;
+};
+type UseUIEngineEffectsResult = {
+    ancestorTypeMembership: Record<string, Set<string>>;
+    overlaysByNodeId: Record<string, unknown>;
+    captureFieldFocus: (target: EventTarget | null) => void;
+};
+type RenderSafeNodeArgs<TInlineEditing> = {
+    node: UINode;
+    registry: NonNullable<UIEngineProps["registry"]>;
+    runtime: UIRuntimeAdapter;
+    schemaNodes: UINode[];
+    renderNode: (node: UINode, studioSizing?: {
+        widthPct: number | null;
+        heightPct: number | null;
+        heightPx: number | null;
+    }) => React__default.ReactNode;
+    isStudioRendererContext: boolean;
+    overlaysByNodeId: Record<string, unknown>;
+    selectedNodeId: string | null;
+    onNodeClick: UIEngineProps["onNodeClick"];
+    onInlineTextEdit: UIEngineProps["onInlineTextEdit"];
+    onNodeResize: UIEngineProps["onNodeResize"];
+    onNodeResizeStart: UIEngineProps["onNodeResizeStart"];
+    onNodeResizeEnd: UIEngineProps["onNodeResizeEnd"];
+    inlineEditing: TInlineEditing | null;
+    setInlineEditing: React__default.Dispatch<React__default.SetStateAction<TInlineEditing | null>>;
+    ancestorTypeMembership: Record<string, Set<string>>;
+    resizeStateRef: React__default.MutableRefObject<unknown>;
+    pinchStateRef: React__default.MutableRefObject<unknown>;
+    minWidthPct: number;
+    minHeightPct: number;
+    minHeightPx: number;
+    overlayRootId: string;
+    NodeWrapper: React__default.ComponentType<UINodeWrapperProps>;
+    isFormInteractiveTarget: (target: HTMLElement | null) => boolean;
+};
+type ReactWebEngineRootDependencies<TInlineEditing> = {
+    useUIEngineEffects: (args: UseUIEngineEffectsArgs) => UseUIEngineEffectsResult;
+    renderSafeNode: (args: RenderSafeNodeArgs<TInlineEditing>) => React__default.ReactNode;
+    InlineTextEditor: React__default.ComponentType<{
+        editing: TInlineEditing;
+        onChange: (value: string) => void;
+        onCancel: () => void;
+        onCommit: () => void;
+    }>;
+    StudioNodeWrapper: React__default.ComponentType<UINodeWrapperProps>;
+    renderReactNodeDependencies: Parameters<typeof renderReactNode<TInlineEditing>>[0]["dependencies"];
+};
+type ReactWebEngineRootArgs<TInlineEditing> = UIEngineProps & {
+    dependencies: ReactWebEngineRootDependencies<TInlineEditing>;
+};
+declare const ReactWebEngineRoot: <TInlineEditing = unknown>({ schema, registry, store, onNodeClick, onInlineTextEdit, onNodeResize, onNodeResizeStart, onNodeResizeEnd, onNodeDragStart, onNodeDragOverTarget, onNodeDropTarget, selectedNodeId, nodeWrapper, dependencies, }: ReactWebEngineRootArgs<TInlineEditing>) => react_jsx_runtime.JSX.Element;
+
+export { EngineWarningFallback, NodeErrorBoundary, ReactWebEngineRoot };

package/dist/engine.js

@@ -0,0 +1,508 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// src/engine/EngineWarningFallback.tsx
+import { jsx } from "react/jsx-runtime";
+var EngineWarningFallback = ({ message }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    role: "alert",
+    className: "rounded-md border border-amber-300 bg-amber-50 px-3 py-2 text-sm text-amber-900",
+    children: message
+  }
+);
+var EngineWarningFallback_default = EngineWarningFallback;
+
+// src/engine/NodeErrorBoundary.tsx
+import React from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var NodeErrorBoundary = class extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false };
+  }
+  static getDerivedStateFromError() {
+    return { hasError: true };
+  }
+  componentDidUpdate(prevProps) {
+    if (this.state.hasError && prevProps.resetToken !== this.props.resetToken) {
+      this.setState({ hasError: false });
+    }
+  }
+  render() {
+    if (!this.state.hasError) return this.props.children;
+    return /* @__PURE__ */ jsx2(
+      EngineWarningFallback_default,
+      {
+        message: `Renderer fallback: node "${this.props.nodeType}" (${this.props.nodeId}) failed.`
+      }
+    );
+  }
+};
+
+// src/engine/ReactWebEngineRoot.tsx
+import React4, { useRef, useState as useState2 } from "react";
+
+// src/rendering/resolveResolvedReactNode.ts
+import {
+  resolveResolvedNode
+} from "@arkcit/engine-render-layer";
+
+// src/rendering/prepareRenderableChildren.tsx
+import React3 from "react";
+import {
+  resolveChildContentDescriptor,
+  resolveChildDescriptors
+} from "@arkcit/engine-render-layer";
+
+// src/rendering/gridItemWrapperProps.ts
+var getGridItemWrapperProps = (colSpan) => ({
+  className: "w-full min-w-0",
+  style: {
+    gridColumn: `span ${colSpan} / span ${colSpan}`
+  }
+});
+
+// src/materialization/materializeChildContent.tsx
+import React2 from "react";
+import { Fragment, jsx as jsx3 } from "react/jsx-runtime";
+var materializeChildContent = ({
+  descriptor,
+  renderSafeNode
+}) => {
+  if (descriptor.kind === "empty") {
+    return null;
+  }
+  const renderDescriptor = (childDescriptor) => {
+    if (childDescriptor.kind === "grid-item") {
+      return /* @__PURE__ */ jsx3("div", __spreadProps(__spreadValues({}, getGridItemWrapperProps(childDescriptor.colSpan)), { children: renderSafeNode(childDescriptor.child) }), childDescriptor.child.id);
+    }
+    return /* @__PURE__ */ jsx3(React2.Fragment, { children: renderSafeNode(childDescriptor.child) }, childDescriptor.child.id);
+  };
+  if (descriptor.kind === "single") {
+    return renderDescriptor(descriptor.child);
+  }
+  return /* @__PURE__ */ jsx3(Fragment, { children: descriptor.children.map(renderDescriptor) });
+};
+
+// src/rendering/prepareRenderableChildren.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var prepareRenderableChildren = ({
+  node,
+  internalStudioNodeTypes,
+  renderSafeNode,
+  childDescriptors,
+  childContentDescriptor
+}) => {
+  const resolvedDescriptors = childDescriptors != null ? childDescriptors : resolveChildDescriptors({
+    node,
+    internalStudioNodeTypes
+  });
+  const children = resolvedDescriptors.map((descriptor) => {
+    if (descriptor.kind === "grid-item") {
+      return /* @__PURE__ */ jsx4("div", __spreadProps(__spreadValues({}, getGridItemWrapperProps(descriptor.colSpan)), { children: renderSafeNode(descriptor.child) }), descriptor.child.id);
+    }
+    return /* @__PURE__ */ jsx4(React3.Fragment, { children: renderSafeNode(descriptor.child) }, descriptor.child.id);
+  });
+  const resolvedChildContentDescriptor = childContentDescriptor != null ? childContentDescriptor : resolveChildContentDescriptor({
+    childDescriptors: resolvedDescriptors
+  });
+  const resolvedChildContent = materializeChildContent({
+    descriptor: resolvedChildContentDescriptor,
+    renderSafeNode
+  });
+  return {
+    children,
+    resolvedChildContent,
+    childDescriptors: resolvedDescriptors,
+    childContentDescriptor: resolvedChildContentDescriptor
+  };
+};
+
+// src/rendering/resolveResolvedReactNode.ts
+var resolveResolvedReactNode = ({
+  node,
+  runtime,
+  registry,
+  internalStudioNodeTypes,
+  renderSafeNode,
+  isStudioRendererContext,
+  studioSizing
+}) => {
+  const registryEntry = registry[node.type];
+  if (!registryEntry) {
+    return null;
+  }
+  const resolvedNode = resolveResolvedNode({
+    node,
+    runtime,
+    internalStudioNodeTypes,
+    isStudioRendererContext,
+    studioSizing
+  });
+  const { children, resolvedChildContent } = prepareRenderableChildren({
+    node,
+    internalStudioNodeTypes,
+    renderSafeNode,
+    childDescriptors: resolvedNode.childDescriptors,
+    childContentDescriptor: resolvedNode.childContentDescriptor
+  });
+  return __spreadProps(__spreadValues({}, resolvedNode), {
+    registryEntry,
+    children,
+    resolvedChildContent
+  });
+};
+
+// src/rendering/renderReactNode.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var renderReactNode = ({
+  node,
+  runtime,
+  registry,
+  schemaNodes,
+  renderSafeNode,
+  internalStudioNodeTypes,
+  overlaysByNodeId,
+  onInlineTextEdit,
+  isStudioRendererContext,
+  dropdownOpenByNodeId,
+  setDropdownOpenByNodeId,
+  captureFieldFocus,
+  selectedNodeId,
+  wizardActiveStepByNodeId,
+  accordionOpenIdsByNodeId,
+  expandablePanelOpenByNodeId,
+  setWizardActiveStepByNodeId,
+  setAccordionOpenIdsByNodeId,
+  setExpandablePanelOpenByNodeId,
+  onNodeClick,
+  setInlineEditing,
+  studioSizing,
+  dependencies
+}) => {
+  try {
+    const resolvedNode = resolveResolvedReactNode({
+      node,
+      runtime,
+      registry,
+      internalStudioNodeTypes,
+      renderSafeNode,
+      isStudioRendererContext,
+      studioSizing
+    });
+    if (!resolvedNode) {
+      return /* @__PURE__ */ jsx5(
+        EngineWarningFallback_default,
+        {
+          message: `Unknown component type "${node.type}" for node "${node.id}".`
+        }
+      );
+    }
+    const {
+      registryEntry,
+      componentProps,
+      renderBindingProps,
+      children,
+      resolvedChildContent,
+      contentPlans,
+      navigationPlans,
+      renderDirectivePlans,
+      finalRenderPlans
+    } = resolvedNode;
+    dependencies.applyStudioOverlayComponentProps({
+      node,
+      componentProps,
+      runtime,
+      overlaysByNodeId,
+      renderBindingProps,
+      resolvedChildContent,
+      onInlineTextEdit,
+      isStudioRendererContext,
+      dropdownOpenByNodeId,
+      setDropdownOpenByNodeId
+    });
+    const contentNode = dependencies.applyContentComposition({
+      node,
+      componentProps,
+      isStudioRendererContext,
+      internalStudioNodeTypes,
+      schemaNodes,
+      onInlineTextEdit,
+      captureFieldFocus,
+      renderSafeNode,
+      normalizeRenderableChild: dependencies.normalizeRenderableChild,
+      findNodeById: dependencies.findNodeById,
+      runtime,
+      plans: contentPlans
+    });
+    if (contentNode) {
+      return contentNode;
+    }
+    dependencies.applyRenderDirectives({
+      node,
+      componentProps,
+      renderBindingProps,
+      runtime,
+      plans: renderDirectivePlans
+    });
+    dependencies.applyNavigationComposition({
+      node,
+      componentProps,
+      isStudioRendererContext,
+      selectedNodeId: selectedNodeId != null ? selectedNodeId : null,
+      wizardActiveStepByNodeId,
+      accordionOpenIdsByNodeId,
+      expandablePanelOpenByNodeId,
+      runtime,
+      setWizardActiveStepByNodeId,
+      setAccordionOpenIdsByNodeId,
+      setExpandablePanelOpenByNodeId,
+      onNodeClick,
+      onInlineTextEdit,
+      renderSafeNode,
+      normalizeRenderableChild: dependencies.normalizeRenderableChild,
+      captureFieldFocus,
+      setInlineEditing,
+      internalStudioNodeTypes,
+      plans: navigationPlans
+    });
+    return dependencies.finalizeRenderedNode({
+      node,
+      children,
+      componentProps,
+      registryComponent: registryEntry.Component,
+      runtime,
+      isStudioRendererContext,
+      studioSizing,
+      plans: finalRenderPlans
+    });
+  } catch (e) {
+    return /* @__PURE__ */ jsx5(
+      EngineWarningFallback_default,
+      {
+        message: `Renderer fallback: node "${node.type}" (${node.id}) could not be resolved.`
+      }
+    );
+  }
+};
+
+// src/hooks/useUIEngineState.ts
+import { useState } from "react";
+var useUIEngineState = () => {
+  const [inlineEditing, setInlineEditing] = useState(null);
+  const [wizardActiveStepByNodeId, setWizardActiveStepByNodeId] = useState({});
+  const [expandablePanelOpenByNodeId, setExpandablePanelOpenByNodeId] = useState({});
+  const [accordionOpenIdsByNodeId, setAccordionOpenIdsByNodeId] = useState({});
+  const [dropdownOpenByNodeId, setDropdownOpenByNodeId] = useState(
+    {}
+  );
+  return {
+    inlineEditing,
+    setInlineEditing,
+    wizardActiveStepByNodeId,
+    setWizardActiveStepByNodeId,
+    expandablePanelOpenByNodeId,
+    setExpandablePanelOpenByNodeId,
+    accordionOpenIdsByNodeId,
+    setAccordionOpenIdsByNodeId,
+    dropdownOpenByNodeId,
+    setDropdownOpenByNodeId
+  };
+};
+
+// src/engine/ReactWebEngineRoot.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var INTERNAL_STUDIO_NODE_TYPES = /* @__PURE__ */ new Set();
+var STUDIO_CANVAS_OVERLAY_ROOT_ID = "studio-canvas-overlay-root";
+var STUDIO_MIN_WIDTH_PCT = 5;
+var STUDIO_MIN_HEIGHT_PCT = 5;
+var STUDIO_MIN_HEIGHT_PX = 20;
+var NOOP_RUNTIME = {
+  get: () => void 0,
+  dispatch: () => void 0
+};
+var EMPTY_UI_REGISTRY = {};
+var isFormInteractiveTarget = (target) => {
+  if (!target) return false;
+  const interactive = target.closest(
+    "button,input,textarea,select,option,label,[role='button'],[role='link']"
+  );
+  if (!interactive) return false;
+  return true;
+};
+var FallbackInlineTextEditor = ({
+  editing,
+  onChange,
+  onCancel,
+  onCommit
+}) => editing.multiline ? /* @__PURE__ */ jsx6(
+  "textarea",
+  {
+    style: editing.editorStyle,
+    value: editing.value,
+    autoFocus: true,
+    "aria-label": "Inline text editor",
+    onChange: (event) => onChange(event.target.value),
+    onBlur: onCommit,
+    onKeyDown: (event) => {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        onCancel();
+        return;
+      }
+      if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+        event.preventDefault();
+        onCommit();
+      }
+    }
+  }
+) : /* @__PURE__ */ jsx6(
+  "input",
+  {
+    style: editing.editorStyle,
+    value: editing.value,
+    autoFocus: true,
+    "aria-label": "Inline text editor",
+    onChange: (event) => onChange(event.target.value),
+    onBlur: onCommit,
+    onKeyDown: (event) => {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        onCancel();
+        return;
+      }
+      if (event.key === "Enter") {
+        event.preventDefault();
+        onCommit();
+      }
+    }
+  }
+);
+var ReactWebEngineRoot = ({
+  schema,
+  registry = EMPTY_UI_REGISTRY,
+  store,
+  onNodeClick,
+  onInlineTextEdit,
+  onNodeResize,
+  onNodeResizeStart,
+  onNodeResizeEnd,
+  onNodeDragStart,
+  onNodeDragOverTarget,
+  onNodeDropTarget,
+  selectedNodeId = null,
+  nodeWrapper,
+  dependencies
+}) => {
+  var _a;
+  const runtime = store != null ? store : NOOP_RUNTIME;
+  const NodeWrapper = nodeWrapper != null ? nodeWrapper : dependencies.StudioNodeWrapper;
+  const InlineTextEditor = (_a = dependencies.InlineTextEditor) != null ? _a : FallbackInlineTextEditor;
+  const isStudioRendererContext = Boolean(
+    onNodeClick || onInlineTextEdit || onNodeResize || onNodeDragStart || onNodeDragOverTarget || onNodeDropTarget || selectedNodeId
+  );
+  const [, setVersion] = useState2(0);
+  const {
+    inlineEditing,
+    setInlineEditing,
+    wizardActiveStepByNodeId,
+    setWizardActiveStepByNodeId,
+    expandablePanelOpenByNodeId,
+    setExpandablePanelOpenByNodeId,
+    accordionOpenIdsByNodeId,
+    setAccordionOpenIdsByNodeId,
+    dropdownOpenByNodeId,
+    setDropdownOpenByNodeId
+  } = useUIEngineState();
+  const resizeStateRef = useRef(null);
+  const pinchStateRef = useRef(null);
+  const pendingFieldFocusRef = useRef(null);
+  const { ancestorTypeMembership, overlaysByNodeId, captureFieldFocus } = dependencies.useUIEngineEffects({
+    schema,
+    runtime,
+    onNodeResize,
+    onNodeResizeEnd,
+    resizeStateRef,
+    pendingFieldFocusRef,
+    setVersion,
+    minWidthPct: STUDIO_MIN_WIDTH_PCT,
+    minHeightPct: STUDIO_MIN_HEIGHT_PCT,
+    minHeightPx: STUDIO_MIN_HEIGHT_PX
+  });
+  const renderNode = (node, studioSizing) => renderReactNode({
+    node,
+    runtime,
+    registry,
+    schemaNodes: schema.nodes,
+    renderSafeNode: renderSafeEngineNode,
+    internalStudioNodeTypes: INTERNAL_STUDIO_NODE_TYPES,
+    overlaysByNodeId,
+    onInlineTextEdit,
+    isStudioRendererContext,
+    dropdownOpenByNodeId,
+    setDropdownOpenByNodeId,
+    captureFieldFocus,
+    selectedNodeId,
+    wizardActiveStepByNodeId,
+    accordionOpenIdsByNodeId,
+    expandablePanelOpenByNodeId,
+    setWizardActiveStepByNodeId,
+    setAccordionOpenIdsByNodeId,
+    setExpandablePanelOpenByNodeId,
+    onNodeClick,
+    setInlineEditing,
+    studioSizing,
+    dependencies: dependencies.renderReactNodeDependencies
+  });
+  const renderSafeEngineNode = (node) => dependencies.renderSafeNode({
+    node,
+    registry,
+    runtime,
+    schemaNodes: schema.nodes,
+    renderNode,
+    isStudioRendererContext,
+    overlaysByNodeId,
+    selectedNodeId,
+    onNodeClick,
+    onInlineTextEdit,
+    onNodeResize,
+    onNodeResizeStart,
+    onNodeResizeEnd,
+    inlineEditing,
+    setInlineEditing,
+    ancestorTypeMembership,
+    resizeStateRef,
+    pinchStateRef,
+    minWidthPct: STUDIO_MIN_WIDTH_PCT,
+    minHeightPct: STUDIO_MIN_HEIGHT_PCT,
+    minHeightPx: STUDIO_MIN_HEIGHT_PX,
+    overlayRootId: STUDIO_CANVAS_OVERLAY_ROOT_ID,
+    NodeWrapper,
+    InlineTextEditorComponent: InlineTextEditor,
+    isFormInteractiveTarget
+  });
+  return /* @__PURE__ */ jsx6("div", { className: "flex h-full min-w-0 w-full flex-wrap content-start items-start gap-3", children: schema.nodes.map((node) => /* @__PURE__ */ jsx6(React4.Fragment, { children: renderSafeEngineNode(node) }, node.id)) });
+};
+export {
+  EngineWarningFallback_default as EngineWarningFallback,
+  NodeErrorBoundary,
+  ReactWebEngineRoot
+};

package/dist/hooks.d.ts

@@ -0,0 +1,55 @@
+import { UINodeSize } from '@arkcit/engine-core';
+import { UISchema } from '@arkcit/engine-schema';
+import { UIRuntimeAdapter } from '@arkcit/engine-runtime';
+import * as React$1 from 'react';
+
+type UseUIEngineEffectsArgs = {
+    schema: UISchema;
+    runtime: UIRuntimeAdapter;
+    onNodeResize?: ((nodeId: string, size: UINodeSize) => void) | undefined;
+    onNodeResizeEnd?: ((nodeId: string, size: UINodeSize) => void) | undefined;
+    resizeStateRef: React.MutableRefObject<unknown>;
+    pendingFieldFocusRef: React.MutableRefObject<unknown>;
+    setVersion: React.Dispatch<React.SetStateAction<number>>;
+    minWidthPct: number;
+    minHeightPct: number;
+    minHeightPx: number;
+    dependencies: {
+        buildAncestorTypeMembership: (nodes: UISchema["nodes"], ancestorTypes: string[]) => Record<string, Set<string>>;
+        readOverlayState: (runtime: UIRuntimeAdapter) => Record<string, unknown>;
+        capturePendingFieldFocus: (target: EventTarget | null) => unknown;
+        restorePendingFieldFocus: (pending: unknown) => void;
+        computeMouseResizeSize: (args: {
+            state: unknown;
+            clientX: number;
+            clientY: number;
+            minWidthPct: number;
+            minHeightPct: number;
+            minHeightPx: number;
+        }) => {
+            widthPct: number;
+            heightPct: number;
+            heightPx?: number;
+        };
+    };
+};
+declare const useUIEngineEffects: ({ schema, runtime, onNodeResize, onNodeResizeEnd, resizeStateRef, pendingFieldFocusRef, setVersion, minWidthPct, minHeightPct, minHeightPx, dependencies, }: UseUIEngineEffectsArgs) => {
+    ancestorTypeMembership: Record<string, Set<string>>;
+    overlaysByNodeId: Record<string, unknown>;
+    captureFieldFocus: (target: EventTarget | null) => void;
+};
+
+declare const useUIEngineState: <TInlineEditing = unknown>() => {
+    inlineEditing: TInlineEditing | null;
+    setInlineEditing: React$1.Dispatch<React$1.SetStateAction<TInlineEditing | null>>;
+    wizardActiveStepByNodeId: Record<string, string>;
+    setWizardActiveStepByNodeId: React$1.Dispatch<React$1.SetStateAction<Record<string, string>>>;
+    expandablePanelOpenByNodeId: Record<string, boolean>;
+    setExpandablePanelOpenByNodeId: React$1.Dispatch<React$1.SetStateAction<Record<string, boolean>>>;
+    accordionOpenIdsByNodeId: Record<string, string[]>;
+    setAccordionOpenIdsByNodeId: React$1.Dispatch<React$1.SetStateAction<Record<string, string[]>>>;
+    dropdownOpenByNodeId: Record<string, boolean>;
+    setDropdownOpenByNodeId: React$1.Dispatch<React$1.SetStateAction<Record<string, boolean>>>;
+};
+
+export { useUIEngineEffects, useUIEngineState };