@pactor-app/runtime 0.1.0 → 1.0.0

package/dist/index.cjs

@@ -23,6 +23,8 @@ __export(index_exports, {
   ActionEngine: () => ActionEngine,
   DataStore: () => DataStore,
   DslRenderer: () => DslRenderer,
+  DslSourceBoundary: () => DslSourceBoundary,
+  DslSourceResolver: () => DslSourceResolver,
   I18nContextProvider: () => I18nContextProvider,
   PageRuntimeError: () => PageRuntimeError,
   PageRuntimeView: () => PageRuntimeView,
@@ -34,6 +36,7 @@ __export(index_exports, {
   createFetchHttpAdapter: () => createFetchHttpAdapter,
   createPageRuntime: () => createPageRuntime,
   createRuntimeContext: () => createRuntimeContext,
+  dslSourceKey: () => dslSourceKey,
   registerBuiltinActions: () => registerBuiltinActions,
   resolveDeep: () => resolveDeep,
   useDataSource: () => useDataSource,
@@ -162,6 +165,14 @@ var DataStore = class {
     }
     return out;
   }
+  /** 各数据源的加载状态（loading / error），供表达式作用域的 `dataStatus` 键使用 */
+  getAllStatus() {
+    const out = {};
+    for (const [name, status] of this.statuses) {
+      out[name] = { loading: status.loading, error: status.error };
+    }
+    return out;
+  }
   subscribe(listener) {
     this.listeners.add(listener);
     return () => {
@@ -188,7 +199,8 @@ var DataStore = class {
     const previous = this.get(name);
     this.update(name, { loading: true, error: void 0, data: previous.data });
     try {
-      const data = await this.loadByType(config);
+      const raw = await this.loadByType(config);
+      const data = applyOptionMapping(raw, config);
       this.update(name, { loading: false, data, error: void 0 });
     } catch (cause) {
       this.update(name, {
@@ -254,6 +266,69 @@ var DataStore = class {
     }
   }
 };
+function applyOptionMapping(data, config) {
+  if (!config.valueField && !config.labelField && !config.disabledField) {
+    return data;
+  }
+  if (!Array.isArray(data)) {
+    return data;
+  }
+  const valueField = config.valueField ?? "value";
+  const labelField = config.labelField ?? "label";
+  return data.map((item) => {
+    if (item === null || typeof item !== "object") {
+      return item;
+    }
+    const record = item;
+    return {
+      ...record,
+      label: record[labelField],
+      value: record[valueField],
+      disabled: config.disabledField ? Boolean(record[config.disabledField]) : Boolean(record.disabled)
+    };
+  });
+}
+
+// src/datasource/dsl-source-resolver.ts
+function dslSourceKey(ref) {
+  const source = ref.source;
+  if (source.type === "service") {
+    return `service:${source.service}:${JSON.stringify(source.params ?? {})}`;
+  }
+  const request = source.request;
+  return `http:${(request.method ?? "GET").toUpperCase()}:${request.url}:${JSON.stringify(request.params ?? {})}:${JSON.stringify(request.headers ?? {})}`;
+}
+var DslSourceResolver = class {
+  constructor(deps) {
+    this.deps = deps;
+    this.cache = /* @__PURE__ */ new Map();
+  }
+  resolve(ref) {
+    const key = dslSourceKey(ref);
+    let cached = this.cache.get(key);
+    if (cached === void 0) {
+      cached = this.load(ref);
+      this.cache.set(key, cached);
+    }
+    return cached;
+  }
+  async load(ref) {
+    const scope = this.deps.getScope();
+    const source = ref.source;
+    if (source.type === "service") {
+      const handler = this.deps.services.get(source.service);
+      if (!handler) {
+        throw new Error(
+          `[@pactor-app/runtime] service not registered: "${source.service}"`
+        );
+      }
+      const params = resolveDeep(source.params ?? {}, scope);
+      return handler(params);
+    }
+    const request = resolveDeep(source.request, scope);
+    return this.deps.http.request(request);
+  }
+};
 
 // src/context/scope.ts
 function buildScope(context, local) {
@@ -263,6 +338,7 @@ function buildScope(context, local) {
     state: context.state.getState(),
     form: context.state.get("form"),
     data: context.data.getAllData(),
+    dataStatus: context.data.getAllStatus(),
     route: context.route,
     user: context.user,
     params: context.route.params,
@@ -372,6 +448,11 @@ function createRuntimeContext(options = {}) {
     http,
     getScope: () => buildScope(context)
   });
+  const dslSources = new DslSourceResolver({
+    services,
+    http,
+    getScope: () => buildScope(context)
+  });
   context = {
     app: options.app ?? {},
     page: options.page ?? {},
@@ -384,9 +465,12 @@ function createRuntimeContext(options = {}) {
     actions,
     forms,
     actionResults: {},
+    namedActions: options.namedActions ?? {},
+    pageComponents: options.pageComponents ?? {},
     permission,
     capabilities,
     http,
+    dslSources,
     locale: options.locale ?? "zh-CN",
     i18n: (0, import_core.createI18nContext)({
       locale: options.locale,
@@ -402,8 +486,8 @@ var import_core2 = require("@pactor-app/core");
 var import_react = require("react");
 var I18nReactContext = (0, import_react.createContext)(null);
 var I18nContextProvider = I18nReactContext.Provider;
-var defaultI18n = (0, import_core2.createI18nContext)({
-  messages: {
+var defaultMessages = {
+  "zh-CN": {
     "pactor.layout.expandSidebar": "\u5C55\u5F00\u4FA7\u8FB9\u680F",
     "pactor.layout.collapseSidebar": "\u6536\u8D77\u4FA7\u8FB9\u680F",
     "pactor.layout.closeTab": "\u5173\u95ED {{title}}",
@@ -411,19 +495,42 @@ var defaultI18n = (0, import_core2.createI18nContext)({
     "pactor.table.loading": "\u52A0\u8F7D\u4E2D\u2026",
     "pactor.table.empty": "\u6682\u65E0\u6570\u636E",
     "pactor.form.required": "\u5FC5\u586B",
-    "pactor.select.clear": "\u6E05\u9664"
+    "pactor.select.clear": "\u6E05\u9664",
+    "pactor.alertDialog.confirm": "\u786E\u5B9A",
+    "pactor.alertDialog.cancel": "\u53D6\u6D88",
+    "pactor.command.empty": "\u65E0\u5339\u914D\u7ED3\u679C",
+    "pactor.overlay.close": "\u5173\u95ED"
+  },
+  "en-US": {
+    "pactor.layout.expandSidebar": "Expand sidebar",
+    "pactor.layout.collapseSidebar": "Collapse sidebar",
+    "pactor.layout.closeTab": "Close {{title}}",
+    "pactor.layout.breadcrumb": "Breadcrumb",
+    "pactor.table.loading": "Loading\u2026",
+    "pactor.table.empty": "No data",
+    "pactor.form.required": "Required",
+    "pactor.select.clear": "Clear",
+    "pactor.alertDialog.confirm": "Confirm",
+    "pactor.alertDialog.cancel": "Cancel",
+    "pactor.command.empty": "No results found",
+    "pactor.overlay.close": "Close"
   }
-});
+};
+function createDefaultI18n(locale) {
+  return (0, import_core2.createI18nContext)({ locale, messages: defaultMessages });
+}
+var defaultI18n = createDefaultI18n();
 function useI18n() {
   const value = (0, import_react.useContext)(I18nReactContext);
   if (value === null) {
     return defaultI18n;
   }
+  const fallback = createDefaultI18n(value.locale);
   return {
     ...value,
     t: (key, params) => {
       const translated = value.t(key, params);
-      return translated === key ? defaultI18n.t(key, params) : translated;
+      return translated === key ? fallback.t(key, params) : translated;
     }
   };
 }
@@ -488,6 +595,45 @@ function registerBuiltinActions(registry) {
     }
     return { ok: true };
   });
+  register("call", async (action, ctx) => {
+    const name = action.params?.["name"];
+    if (typeof name !== "string" || !name) {
+      return {
+        ok: false,
+        error: new Error("[@pactor-app/runtime] call \u52A8\u4F5C\u7F3A\u5C11 name \u53C2\u6570")
+      };
+    }
+    const target = ctx.context.namedActions[name];
+    if (target === void 0) {
+      return {
+        ok: false,
+        error: new Error(
+          `[@pactor-app/runtime] unknown named action: "${name}"`
+        )
+      };
+    }
+    const depth = (callDepth.get(ctx.context) ?? 0) + 1;
+    if (depth > MAX_CALL_DEPTH) {
+      return {
+        ok: false,
+        error: new Error(
+          `[@pactor-app/runtime] call \u5D4C\u5957\u8D85\u8FC7 ${MAX_CALL_DEPTH} \u5C42\uFF08\u7591\u4F3C\u5FAA\u73AF\u5F15\u7528\uFF09: "${name}"`
+        )
+      };
+    }
+    callDepth.set(ctx.context, depth);
+    try {
+      for (const child of asActions(target)) {
+        const result = await ctx.execute(child);
+        if (!result.ok) {
+          return result;
+        }
+      }
+      return { ok: true };
+    } finally {
+      callDepth.set(ctx.context, depth - 1);
+    }
+  });
   register("parallel", async (action, ctx) => {
     const results = await Promise.all(
       asActions(action.params?.["actions"]).map((child) => ctx.execute(child))
@@ -544,6 +690,8 @@ function asActions(value) {
   }
   return [];
 }
+var callDepth = /* @__PURE__ */ new WeakMap();
+var MAX_CALL_DEPTH = 20;
 function isRecord(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
 }
@@ -597,7 +745,7 @@ var ActionEngine = class {
         // Renderer 的 resolveProps）保持原样，由各自执行/渲染时
         // 按当时的 state 与作用域求值
         params: resolveDeep(action.params ?? {}, scope, {
-          isOpaque: (value) => typeof value["action"] === "string" || typeof value["type"] === "string"
+          isOpaque: (value) => typeof value["action"] === "string" || typeof value["type"] === "string" || typeof value["component"] === "string"
         })
       };
       const ctx = {
@@ -632,15 +780,57 @@ var ActionEngine = class {
 };
 
 // src/renderer/renderer.tsx
+var import_core3 = require("@pactor-app/core");
 var import_expression3 = require("@pactor-app/expression");
-var import_react3 = require("react");
+var import_schema = require("@pactor-app/schema");
+var import_react4 = require("react");
 
-// src/renderer/renderer-context.ts
+// src/renderer/dsl-source-boundary.tsx
 var import_react2 = require("react");
-var RendererReactContext = (0, import_react2.createContext)(null);
+var import_jsx_runtime = require("react/jsx-runtime");
+function DslSourceBoundary({
+  context,
+  sourceRef,
+  placeholder,
+  children
+}) {
+  const [state, setState] = (0, import_react2.useState)({ status: "loading" });
+  const key = dslSourceKey(sourceRef);
+  (0, import_react2.useEffect)(() => {
+    let cancelled = false;
+    setState({ status: "loading" });
+    context.dslSources.resolve(sourceRef).then(
+      (content) => {
+        if (!cancelled) {
+          setState({ status: "ready", content });
+        }
+      },
+      (cause) => {
+        if (!cancelled) {
+          console.warn("[@pactor-app/runtime] DSL \u52A8\u6001\u5F15\u7528\u89E3\u6790\u5931\u8D25", cause);
+          setState({ status: "error" });
+        }
+      }
+    );
+    return () => {
+      cancelled = true;
+    };
+  }, [context, key]);
+  if (state.status === "ready") {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: children(state.content) });
+  }
+  if (state.status === "error") {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: placeholder ?? null });
+}
+
+// src/renderer/renderer-context.ts
+var import_react3 = require("react");
+var RendererReactContext = (0, import_react3.createContext)(null);
 var RendererContextProvider = RendererReactContext.Provider;
 function useRenderer() {
-  const value = (0, import_react2.useContext)(RendererReactContext);
+  const value = (0, import_react3.useContext)(RendererReactContext);
   if (!value) {
     throw new Error("[@pactor-app/runtime] useRenderer \u5FC5\u987B\u5728 <DslRenderer> \u5185\u4F7F\u7528");
   }
@@ -648,23 +838,23 @@ function useRenderer() {
 }
 function useRuntimeState(path) {
   const { context } = useRenderer();
-  return (0, import_react2.useSyncExternalStore)(
+  return (0, import_react3.useSyncExternalStore)(
     (onChange) => context.state.subscribe(onChange),
     () => path === void 0 ? context.state.getState() : context.state.get(path)
   );
 }
 function useDataSource(name) {
   const { context } = useRenderer();
-  return (0, import_react2.useSyncExternalStore)(
+  return (0, import_react3.useSyncExternalStore)(
     (onChange) => context.data.subscribe(onChange),
     () => context.data.get(name)
   );
 }
 
 // src/renderer/unsupported.tsx
-var import_jsx_runtime = require("react/jsx-runtime");
+var import_jsx_runtime2 = require("react/jsx-runtime");
 function UnsupportedComponent({ type }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
     "div",
     {
       "data-pactor-unsupported": type,
@@ -684,9 +874,9 @@ function UnsupportedComponent({ type }) {
 }
 
 // src/renderer/renderer.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 function DslRenderer({ context, node, engine, children }) {
-  (0, import_react3.useSyncExternalStore)(
+  (0, import_react4.useSyncExternalStore)(
     (onChange) => {
       const offState = context.state.subscribe(onChange);
       const offData = context.data.subscribe(onChange);
@@ -697,26 +887,65 @@ function DslRenderer({ context, node, engine, children }) {
     },
     () => `${context.state.getVersion()}:${context.data.getVersion()}`
   );
-  const resolvedEngine = (0, import_react3.useMemo)(
+  const resolvedEngine = (0, import_react4.useMemo)(
     () => engine ?? new ActionEngine(context),
     [engine, context]
   );
-  const value = (0, import_react3.useMemo)(() => {
+  const value = (0, import_react4.useMemo)(() => {
     const root = {
       context,
       engine: resolvedEngine,
       scope: {},
+      referenceStack: [],
       renderChildren: (children2, extraScope) => renderChildrenOf(root, children2, extraScope)
     };
     return root;
   }, [context, resolvedEngine]);
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(RendererContextProvider, { value, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(RendererContextProvider, { value, children: [
     node ? renderNode(node, value, node.id ?? "root") : null,
     children
   ] });
 }
 function renderNode(node, value, key) {
   const scope = buildScope(value.context, value.scope);
+  if (node.component !== void 0) {
+    const name = node.component;
+    const stack = value.referenceStack ?? [];
+    if (stack.includes(name)) {
+      console.warn(
+        `[@pactor-app/runtime] \u7EC4\u4EF6\u5F15\u7528\u5FAA\u73AF\uFF1A${[...stack, name].join(" \u2192 ")}`
+      );
+      return null;
+    }
+    const subtree = value.context.pageComponents[name];
+    if (!subtree) {
+      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(UnsupportedComponent, { type: `component(${name})` }, key);
+    }
+    const scoped = {
+      ...value,
+      referenceStack: [...stack, name]
+    };
+    scoped.renderChildren = (children, extraScope) => renderChildrenOf(scoped, children, extraScope);
+    if ((0, import_core3.isDslSourceRef)(subtree)) {
+      const ref = subtree;
+      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RendererContextProvider, { value: scoped, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+        DslSourceBoundary,
+        {
+          context: value.context,
+          sourceRef: ref,
+          placeholder: ref.placeholder ? renderNode(ref.placeholder, scoped, "placeholder") : null,
+          children: (content) => {
+            const resolved = validateResolvedNode(content, `components.${name}`);
+            if (!resolved) {
+              return null;
+            }
+            return renderNode(mergeReferenceNode(resolved, node), scoped, key);
+          }
+        }
+      ) }, key);
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RendererContextProvider, { value: scoped, children: renderNode(mergeReferenceNode(subtree, node), scoped, key) }, key);
+  }
   if (node.when !== void 0) {
     const expression = typeof node.when === "string" ? node.when : node.when.expression;
     let visible;
@@ -743,7 +972,7 @@ function renderNode(node, value, key) {
   const entry = value.context.components.get(node.type);
   const normalized = normalizeEntry(entry);
   if (!normalized) {
-    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(UnsupportedComponent, { type: node.type }, key);
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(UnsupportedComponent, { type: node.type }, key);
   }
   const props = resolveProps(node.props, scope);
   if (node.events) {
@@ -759,13 +988,13 @@ function renderNode(node, value, key) {
     props["readOnly"] = true;
   }
   if (normalized.withScope) {
-    return (0, import_react3.createElement)(normalized.component, {
+    return (0, import_react4.createElement)(normalized.component, {
       key,
       ...props,
       dslChildren: node.children
     });
   }
-  return (0, import_react3.createElement)(
+  return (0, import_react4.createElement)(
     normalized.component,
     { key, ...props },
     renderChildrenOf(value, node.children)
@@ -777,23 +1006,102 @@ function resolveDeniedStrategy(permission) {
   }
   return "hidden";
 }
+function mergeReferenceNode(definition, reference) {
+  return {
+    ...definition,
+    props: { ...definition.props, ...reference.props },
+    events: { ...definition.events, ...reference.events },
+    when: reference.when ?? definition.when,
+    permission: reference.permission ?? definition.permission,
+    id: reference.id ?? definition.id
+  };
+}
+function validateResolvedNode(content, label) {
+  const errors = (0, import_schema.validateDslNode)(content);
+  if (errors.length > 0) {
+    console.warn(
+      `[@pactor-app/runtime] \u52A8\u6001\u5F15\u7528\uFF08${label}\uFF09\u8FD4\u56DE\u5185\u5BB9\u672A\u901A\u8FC7\u6821\u9A8C`,
+      errors
+    );
+    return null;
+  }
+  return content;
+}
+function validateResolvedNodes(content, label) {
+  const errors = (0, import_schema.validateDslNodes)(content);
+  if (errors.length > 0) {
+    console.warn(
+      `[@pactor-app/runtime] \u52A8\u6001\u5F15\u7528\uFF08${label}\uFF09\u8FD4\u56DE\u5185\u5BB9\u672A\u901A\u8FC7\u6821\u9A8C`,
+      errors
+    );
+    return null;
+  }
+  return content;
+}
+function renderChildItem(value, item, key) {
+  if ((0, import_core3.isDslSourceRef)(item)) {
+    const ref = item;
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      DslSourceBoundary,
+      {
+        context: value.context,
+        sourceRef: ref,
+        placeholder: ref.placeholder ? renderNode(ref.placeholder, value, "placeholder") : null,
+        children: (content) => {
+          const nodes = validateResolvedNodes(content, "children");
+          if (!nodes) {
+            return null;
+          }
+          return nodes.map(
+            (child, index) => renderChildItem(value, child, (0, import_core3.isDslSourceRef)(child) ? `ref-${index}` : child.id ?? index)
+          );
+        }
+      },
+      key
+    );
+  }
+  return renderNode(item, value, key);
+}
 function renderChildrenOf(value, children, extraScope) {
-  if (!children || children.length === 0) {
+  if (!children || Array.isArray(children) && children.length === 0) {
     return null;
   }
+  if ((0, import_core3.isDslSourceRef)(children)) {
+    const ref = children;
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      DslSourceBoundary,
+      {
+        context: value.context,
+        sourceRef: ref,
+        placeholder: ref.placeholder ? renderNode(ref.placeholder, value, "placeholder") : null,
+        children: (content) => {
+          const nodes = validateResolvedNodes(content, "children");
+          if (!nodes) {
+            return null;
+          }
+          return nodes.map(
+            (child, index) => renderChildItem(value, child, (0, import_core3.isDslSourceRef)(child) ? `ref-${index}` : child.id ?? index)
+          );
+        }
+      },
+      "dsl-source"
+    );
+  }
+  const itemKey = (child, index) => (0, import_core3.isDslSourceRef)(child) ? `ref-${index}` : child.id ?? index;
   if (!extraScope) {
     return children.map(
-      (child, index) => renderNode(child, value, child.id ?? index)
+      (child, index) => renderChildItem(value, child, itemKey(child, index))
     );
   }
   const scoped = {
     context: value.context,
     engine: value.engine,
     scope: { ...value.scope, ...extraScope },
+    referenceStack: value.referenceStack,
     renderChildren: (nested, nestedScope) => renderChildrenOf(scoped, nested, nestedScope)
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RendererContextProvider, { value: scoped, children: children.map(
-    (child, index) => renderNode(child, scoped, child.id ?? index)
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(RendererContextProvider, { value: scoped, children: children.map(
+    (child, index) => renderChildItem(scoped, child, itemKey(child, index))
   ) });
 }
 function normalizeEntry(entry) {
@@ -816,12 +1124,13 @@ function resolveProps(props, scope) {
   return out;
 }
 function isEmbeddedDslNode(value) {
-  return typeof value.type === "string";
+  return typeof value.type === "string" || typeof value.component === "string";
 }
 
 // src/page/page-runtime.tsx
-var import_schema = require("@pactor-app/schema");
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_core4 = require("@pactor-app/core");
+var import_schema2 = require("@pactor-app/schema");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var PageRuntimeError = class extends Error {
   constructor(errors) {
     super(
@@ -832,7 +1141,7 @@ var PageRuntimeError = class extends Error {
   }
 };
 function createPageRuntime(pageDsl, options = {}) {
-  const validation = (0, import_schema.validatePageDsl)(pageDsl);
+  const validation = (0, import_schema2.validatePageDsl)(pageDsl);
   if (!validation.valid) {
     throw new PageRuntimeError(validation.errors);
   }
@@ -840,7 +1149,9 @@ function createPageRuntime(pageDsl, options = {}) {
     ...options,
     page: pageDsl.page,
     state: pageDsl.state ?? options.state,
-    dataSources: pageDsl.dataSources ?? options.dataSources
+    dataSources: pageDsl.dataSources ?? options.dataSources,
+    namedActions: pageDsl.actions ?? options.namedActions,
+    pageComponents: pageDsl.components ?? options.pageComponents
   });
   registerBuiltinActions(context.actions);
   const engine = new ActionEngine(context);
@@ -876,10 +1187,7 @@ function createPageRuntime(pageDsl, options = {}) {
       return destroyed;
     },
     render() {
-      if (!pageDsl.body) {
-        return null;
-      }
-      return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DslRenderer, { context, node: pageDsl.body, engine });
+      return renderRoots(pageDsl, context, engine);
     },
     ready: () => triggerWhenAlive("onReady"),
     show: () => triggerWhenAlive("onShow"),
@@ -907,17 +1215,68 @@ function PageRuntimeView({
   runtime,
   children
 }) {
-  const body = runtime.pageDsl.body;
-  if (!body) {
-    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: children ?? null });
+  return renderRoots(runtime.pageDsl, runtime.context, runtime.engine, children);
+}
+function renderRoots(pageDsl, context, engine, children) {
+  if (!pageDsl.body && (0, import_core4.isDslSourceRef)(pageDsl.children)) {
+    const ref = pageDsl.children;
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      DslSourceBoundary,
+      {
+        context,
+        sourceRef: ref,
+        placeholder: ref.placeholder ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DslRenderer, { context, node: ref.placeholder, engine }) : null,
+        children: (content) => renderResolvedRoots(content, context, engine, children)
+      }
+    );
+  }
+  const roots = (0, import_core4.resolveRootNodes)(pageDsl);
+  if (roots.length === 0) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: children ?? null });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DslRenderer, { context: runtime.context, node: body, engine: runtime.engine, children });
+  return renderRootItems(roots, context, engine, children);
+}
+function renderResolvedRoots(content, context, engine, children) {
+  const errors = (0, import_schema2.validateDslNodes)(content);
+  if (errors.length > 0) {
+    console.warn(
+      "[@pactor-app/runtime] \u6839\u7EA7 children \u52A8\u6001\u5F15\u7528\u8FD4\u56DE\u5185\u5BB9\u672A\u901A\u8FC7\u6821\u9A8C",
+      errors
+    );
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: children ?? null });
+  }
+  return renderRootItems(content, context, engine, children);
+}
+function renderRootItems(items, context, engine, children) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: items.map(
+    (item, index) => (0, import_core4.isDslSourceRef)(item) ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      DslSourceBoundary,
+      {
+        context,
+        sourceRef: item,
+        placeholder: item.placeholder ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DslRenderer, { context, node: item.placeholder, engine }) : null,
+        children: (content) => renderResolvedRoots(content, context, engine, children)
+      },
+      dslSourceKey(item)
+    ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      DslRenderer,
+      {
+        context,
+        node: item,
+        engine,
+        children: index === items.length - 1 ? children : null
+      },
+      item.id ?? index
+    )
+  ) });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ActionEngine,
   DataStore,
   DslRenderer,
+  DslSourceBoundary,
+  DslSourceResolver,
   I18nContextProvider,
   PageRuntimeError,
   PageRuntimeView,
@@ -929,6 +1288,7 @@ function PageRuntimeView({
   createFetchHttpAdapter,
   createPageRuntime,
   createRuntimeContext,
+  dslSourceKey,
   registerBuiltinActions,
   resolveDeep,
   useDataSource,