@djvlc/runtime-host-react 1.1.3 → 1.1.4

package/dist/index.js

@@ -1,937 +1 @@
-// src/react-runtime.ts
-import { useState, useCallback, useRef, useMemo } from "react";
-import {
-  createRuntime
-} from "@djvlc/runtime-core";
-var defaultMetrics = {
-  initTime: 0,
-  loadTime: 0,
-  renderTime: 0,
-  totalTime: 0,
-  initTimestamp: null,
-  readyTimestamp: null
-};
-function useReactRuntime(options) {
-  const [runtime, setRuntime] = useState(null);
-  const [loading, setLoading] = useState(true);
-  const [phase, setPhase] = useState("idle");
-  const [page, setPage] = useState(null);
-  const [error, setError] = useState(null);
-  const [hostApi, setHostApi] = useState(null);
-  const [metrics, setMetrics] = useState(defaultMetrics);
-  const runtimeRef = useRef(null);
-  const timingRef = useRef({
-    startTime: 0,
-    initStartTime: 0,
-    loadStartTime: 0,
-    renderStartTime: 0
-  });
-  const isReady = useMemo(() => phase === "ready", [phase]);
-  const hasError = useMemo(() => phase === "error" || error !== null, [phase, error]);
-  const init = useCallback(async () => {
-    const container = options.containerRef?.current;
-    if (!container) {
-      throw new Error("Container element not found");
-    }
-    timingRef.current.startTime = performance.now();
-    timingRef.current.initStartTime = timingRef.current.startTime;
-    if (options.enableMetrics) {
-      setMetrics((prev) => ({
-        ...prev,
-        initTimestamp: Date.now()
-      }));
-    }
-    const runtimeInstance = createRuntime({
-      ...options,
-      container,
-      onError: (err) => {
-        setError(err);
-        options.onError?.(err);
-      },
-      onEvent: (event) => {
-        options.onEvent?.(event);
-      }
-    });
-    runtimeRef.current = runtimeInstance;
-    setRuntime(runtimeInstance);
-    runtimeInstance.onStateChange((state) => {
-      setPhase(state.phase);
-      setLoading(state.phase !== "ready" && state.phase !== "error");
-      if (state.page) {
-        setPage(state.page);
-      }
-      if (state.error) {
-        setError(state.error);
-      }
-    });
-    await runtimeInstance.init();
-    setHostApi(runtimeInstance.getHostApi());
-    if (options.enableMetrics) {
-      setMetrics((prev) => ({
-        ...prev,
-        initTime: performance.now() - timingRef.current.initStartTime
-      }));
-    }
-  }, [options]);
-  const load = useCallback(async () => {
-    if (!runtimeRef.current) {
-      throw new Error("Runtime not initialized");
-    }
-    timingRef.current.loadStartTime = performance.now();
-    const result = await runtimeRef.current.load();
-    setPage(result);
-    setHostApi(runtimeRef.current.getHostApi());
-    if (options.enableMetrics) {
-      setMetrics((prev) => ({
-        ...prev,
-        loadTime: performance.now() - timingRef.current.loadStartTime
-      }));
-    }
-    return result;
-  }, [options.enableMetrics]);
-  const render = useCallback(async () => {
-    if (!runtimeRef.current) {
-      throw new Error("Runtime not initialized");
-    }
-    timingRef.current.renderStartTime = performance.now();
-    await runtimeRef.current.render();
-    setLoading(false);
-    if (options.enableMetrics) {
-      const now = performance.now();
-      setMetrics((prev) => ({
-        ...prev,
-        renderTime: now - timingRef.current.renderStartTime,
-        totalTime: now - timingRef.current.startTime,
-        readyTimestamp: Date.now()
-      }));
-    }
-  }, [options.enableMetrics]);
-  const destroy = useCallback(() => {
-    runtimeRef.current?.destroy();
-    runtimeRef.current = null;
-    setRuntime(null);
-    setHostApi(null);
-    setPage(null);
-    setError(null);
-    setPhase("idle");
-    setLoading(true);
-    setMetrics(defaultMetrics);
-  }, []);
-  const reload = useCallback(async () => {
-    if (!runtimeRef.current) {
-      throw new Error("Runtime not initialized");
-    }
-    setError(null);
-    setLoading(true);
-    await load();
-    await render();
-  }, [load, render]);
-  const setVariable = useCallback((key, value) => {
-    runtimeRef.current?.setVariable(key, value);
-  }, []);
-  const setVariables = useCallback((variables) => {
-    if (!runtimeRef.current) return;
-    Object.entries(variables).forEach(([key, value]) => {
-      runtimeRef.current?.setVariable(key, value);
-    });
-  }, []);
-  const getVariable = useCallback((key) => {
-    return runtimeRef.current?.getState().variables[key];
-  }, []);
-  const refreshData = useCallback(async (queryId) => {
-    await runtimeRef.current?.refreshData(queryId);
-  }, []);
-  const executeAction = useCallback(async (actionType, params) => {
-    const api = hostApi;
-    if (!api) {
-      throw new Error("HostAPI not available");
-    }
-    const response = await api.executeAction(actionType, params || {});
-    if (response.success) {
-      return response.data;
-    }
-    throw new Error(response.errorMessage || "Action failed");
-  }, [hostApi]);
-  return {
-    runtime,
-    loading,
-    phase,
-    page,
-    error,
-    hostApi,
-    isReady,
-    hasError,
-    metrics,
-    init,
-    load,
-    render,
-    destroy,
-    reload,
-    setVariable,
-    setVariables,
-    getVariable,
-    refreshData,
-    executeAction
-  };
-}
-
-// src/context.tsx
-import { createContext, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-var defaultState = {
-  phase: "idle",
-  page: null,
-  variables: {},
-  queries: {},
-  components: /* @__PURE__ */ new Map(),
-  error: null,
-  destroyed: false
-};
-var RuntimeContext = createContext({
-  runtime: null,
-  state: defaultState,
-  hostApi: null
-});
-function RuntimeProvider({
-  runtime,
-  state,
-  hostApi,
-  children
-}) {
-  const value = {
-    runtime,
-    state,
-    hostApi
-  };
-  return /* @__PURE__ */ jsx(RuntimeContext.Provider, { value, children });
-}
-function useRuntimeContext() {
-  const context = useContext(RuntimeContext);
-  return context;
-}
-
-// src/components/DJVRenderer.tsx
-import { useRef as useRef2, useEffect, useState as useState2, useCallback as useCallback2 } from "react";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-function DJVRenderer({
-  pageUid,
-  apiBaseUrl,
-  cdnBaseUrl,
-  channel = "prod",
-  userId,
-  deviceId,
-  authToken,
-  previewToken,
-  debug = false,
-  enableSRI = true,
-  onLoad,
-  onError,
-  onReady,
-  onPhaseChange,
-  loadingComponent,
-  errorComponent,
-  emptyComponent,
-  children,
-  className,
-  style,
-  retryCount = 3,
-  retryDelay = 1e3,
-  timeout = 3e4
-}) {
-  const containerRef = useRef2(null);
-  const mountedRef = useRef2(true);
-  const retryCountRef = useRef2(0);
-  const [state, setState] = useState2({
-    phase: "idle",
-    page: null,
-    variables: {},
-    queries: {},
-    components: /* @__PURE__ */ new Map(),
-    error: null,
-    destroyed: false
-  });
-  const options = {
-    pageUid,
-    apiBaseUrl,
-    cdnBaseUrl,
-    channel,
-    userId,
-    deviceId,
-    authToken,
-    previewToken,
-    debug,
-    enableSRI,
-    containerRef,
-    onError: (error2) => {
-      onError?.(error2);
-    }
-  };
-  const {
-    runtime,
-    loading,
-    phase,
-    page,
-    error,
-    hostApi,
-    init,
-    load,
-    render,
-    destroy
-  } = useReactRuntime(options);
-  useEffect(() => {
-    onPhaseChange?.(phase);
-  }, [phase, onPhaseChange]);
-  const initWithRetry = useCallback2(async () => {
-    if (!containerRef.current || !mountedRef.current) return;
-    const timeoutPromise = new Promise((_, reject) => {
-      setTimeout(() => reject(new Error("\u52A0\u8F7D\u8D85\u65F6")), timeout);
-    });
-    try {
-      await Promise.race([
-        (async () => {
-          await init();
-          const pageData = await load();
-          if (mountedRef.current) {
-            onLoad?.(pageData);
-          }
-          await render();
-          if (mountedRef.current) {
-            onReady?.();
-            retryCountRef.current = 0;
-            if (runtime) {
-              runtime.onStateChange((newState) => {
-                if (mountedRef.current) {
-                  setState(newState);
-                }
-              });
-            }
-          }
-        })(),
-        timeoutPromise
-      ]);
-    } catch (err) {
-      if (!mountedRef.current) return;
-      if (retryCountRef.current < retryCount) {
-        retryCountRef.current++;
-        if (debug) {
-          console.log(`[DJVRenderer] \u91CD\u8BD5 ${retryCountRef.current}/${retryCount}...`);
-        }
-        setTimeout(() => {
-          if (mountedRef.current) {
-            initWithRetry();
-          }
-        }, retryDelay);
-      }
-    }
-  }, [init, load, render, runtime, onLoad, onReady, timeout, retryCount, retryDelay, debug]);
-  const handleRetry = useCallback2(() => {
-    retryCountRef.current = 0;
-    initWithRetry();
-  }, [initWithRetry]);
-  useEffect(() => {
-    mountedRef.current = true;
-    initWithRetry();
-    return () => {
-      mountedRef.current = false;
-      destroy();
-    };
-  }, [pageUid]);
-  const renderLoading = () => {
-    if (!loading) return null;
-    return loadingComponent || /* @__PURE__ */ jsxs("div", { className: "djvlc-loading", children: [
-      /* @__PURE__ */ jsx2("div", { className: "djvlc-loading-spinner" }),
-      /* @__PURE__ */ jsx2("span", { children: "\u52A0\u8F7D\u4E2D..." }),
-      retryCountRef.current > 0 && /* @__PURE__ */ jsxs("span", { className: "djvlc-loading-retry", children: [
-        "\u91CD\u8BD5 ",
-        retryCountRef.current,
-        "/",
-        retryCount
-      ] })
-    ] });
-  };
-  const renderError = () => {
-    if (!error) return null;
-    if (typeof errorComponent === "function") {
-      return errorComponent(error, handleRetry);
-    }
-    return errorComponent || /* @__PURE__ */ jsxs("div", { className: "djvlc-error", children: [
-      /* @__PURE__ */ jsx2("div", { className: "djvlc-error-icon", children: "\u26A0\uFE0F" }),
-      /* @__PURE__ */ jsxs("span", { className: "djvlc-error-message", children: [
-        "\u52A0\u8F7D\u5931\u8D25\uFF1A",
-        error.message
-      ] }),
-      /* @__PURE__ */ jsx2(
-        "button",
-        {
-          className: "djvlc-error-retry-btn",
-          onClick: handleRetry,
-          type: "button",
-          children: "\u91CD\u8BD5"
-        }
-      )
-    ] });
-  };
-  const renderEmpty = () => {
-    if (loading || error || page) return null;
-    if (phase === "ready" && !page) {
-      return emptyComponent || /* @__PURE__ */ jsx2("div", { className: "djvlc-empty", children: /* @__PURE__ */ jsx2("span", { children: "\u6682\u65E0\u5185\u5BB9" }) });
-    }
-    return null;
-  };
-  return /* @__PURE__ */ jsx2(RuntimeProvider, { runtime, state, hostApi, children: /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: containerRef,
-      className: `djvlc-renderer ${className || ""}`,
-      style,
-      "data-phase": phase,
-      "data-page-uid": pageUid,
-      children: [
-        renderLoading(),
-        renderError(),
-        renderEmpty(),
-        children
-      ]
-    }
-  ) });
-}
-
-// src/components/DJVProvider.tsx
-import { useState as useState3, useEffect as useEffect2, useRef as useRef3 } from "react";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var defaultState2 = {
-  phase: "idle",
-  page: null,
-  variables: {},
-  queries: {},
-  components: /* @__PURE__ */ new Map(),
-  error: null,
-  destroyed: false
-};
-function DJVProvider({
-  runtime,
-  hostApi,
-  children,
-  className,
-  debug = false,
-  onStateChange,
-  onPhaseChange,
-  onError
-}) {
-  const [state, setState] = useState3(
-    runtime?.getState() || defaultState2
-  );
-  const prevPhaseRef = useRef3(state.phase);
-  useEffect2(() => {
-    if (!runtime) {
-      setState(defaultState2);
-      return;
-    }
-    setState(runtime.getState());
-    const unsubscribe = runtime.onStateChange((newState) => {
-      setState(newState);
-      onStateChange?.(newState);
-      if (newState.phase !== prevPhaseRef.current) {
-        onPhaseChange?.(newState.phase);
-        if (debug) {
-          console.log(`[DJVProvider] Phase changed: ${prevPhaseRef.current} -> ${newState.phase}`);
-        }
-        prevPhaseRef.current = newState.phase;
-      }
-      if (newState.error) {
-        onError?.(newState.error);
-      }
-    });
-    return () => {
-      unsubscribe();
-    };
-  }, [runtime, onStateChange, onPhaseChange, onError, debug]);
-  useEffect2(() => {
-  }, [hostApi]);
-  return /* @__PURE__ */ jsx3(RuntimeProvider, { runtime, state, hostApi, children: /* @__PURE__ */ jsx3(
-    "div",
-    {
-      className: ["djvlc-provider", className].filter(Boolean).join(" "),
-      "data-phase": state.phase,
-      children
-    }
-  ) });
-}
-
-// src/hooks/useDJVRuntime.ts
-import { useCallback as useCallback3, useState as useState4, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef4 } from "react";
-function useDJVRuntime() {
-  const context = useRuntimeContext();
-  const loading = useMemo2(() => {
-    const phase = context.state.phase;
-    return phase !== "ready" && phase !== "error";
-  }, [context.state.phase]);
-  const isReady = context.state.phase === "ready";
-  const hasError = context.state.phase === "error" || context.state.error !== null;
-  const reload = useCallback3(async () => {
-    if (!context.runtime) {
-      throw new Error("Runtime not available");
-    }
-    await context.runtime.load();
-    await context.runtime.render();
-  }, [context.runtime]);
-  return {
-    runtime: context.runtime,
-    state: context.state,
-    loading,
-    phase: context.state.phase,
-    error: context.state.error,
-    page: context.state.page,
-    isReady,
-    hasError,
-    reload
-  };
-}
-function useHostApi() {
-  const context = useRuntimeContext();
-  if (!context.hostApi) {
-    throw new Error("HostAPI not available. Make sure runtime is initialized.");
-  }
-  return context.hostApi;
-}
-function useRuntimeState(key) {
-  const context = useRuntimeContext();
-  return context.state.variables[key];
-}
-function useRuntimeStateWritable(key, defaultValue) {
-  const context = useRuntimeContext();
-  const value = context.state.variables[key] ?? defaultValue;
-  const setValue = useCallback3(
-    (newValue) => {
-      context.runtime?.setVariable(key, newValue);
-    },
-    [context.runtime, key]
-  );
-  return [value, setValue];
-}
-function useQuery(queryId, options) {
-  const context = useRuntimeContext();
-  const [loading, setLoading] = useState4(false);
-  const [error, setError] = useState4(null);
-  const [lastUpdated, setLastUpdated] = useState4(null);
-  const mountedRef = useRef4(true);
-  const data = context.state.queries[queryId];
-  const refetch = useCallback3(async () => {
-    if (!mountedRef.current) return;
-    setLoading(true);
-    setError(null);
-    try {
-      await context.runtime?.refreshData(queryId);
-      if (mountedRef.current) {
-        setLastUpdated(Date.now());
-      }
-    } catch (e) {
-      if (mountedRef.current) {
-        setError(e);
-      }
-    } finally {
-      if (mountedRef.current) {
-        setLoading(false);
-      }
-    }
-  }, [context.runtime, queryId]);
-  useEffect3(() => {
-    mountedRef.current = true;
-    if (options?.refreshOnMount && context.runtime) {
-      refetch();
-    }
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  useEffect3(() => {
-    if (!options?.refreshInterval || options.refreshInterval <= 0) return;
-    const timer = setInterval(() => {
-      refetch();
-    }, options.refreshInterval);
-    return () => clearInterval(timer);
-  }, [options?.refreshInterval, refetch]);
-  useEffect3(() => {
-    if (!options?.refreshOnFocus) return;
-    const handleFocus = () => {
-      refetch();
-    };
-    window.addEventListener("focus", handleFocus);
-    return () => window.removeEventListener("focus", handleFocus);
-  }, [options?.refreshOnFocus, refetch]);
-  return {
-    data,
-    loading,
-    error,
-    refetch,
-    lastUpdated
-  };
-}
-function useAction(actionType, options) {
-  const context = useRuntimeContext();
-  const [loading, setLoading] = useState4(false);
-  const [result, setResult] = useState4();
-  const [error, setError] = useState4(null);
-  const [executionCount, setExecutionCount] = useState4(0);
-  const mountedRef = useRef4(true);
-  useEffect3(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  const reset = useCallback3(() => {
-    setResult(void 0);
-    setError(null);
-    setExecutionCount(0);
-  }, []);
-  const executeWithRetry = useCallback3(
-    async (params, retriesLeft) => {
-      const hostApi = context.hostApi;
-      if (!hostApi) {
-        throw new Error("HostAPI not available");
-      }
-      try {
-        const response = await hostApi.executeAction(
-          actionType,
-          params
-        );
-        if (response.success) {
-          return response.data;
-        } else {
-          throw new Error(response.errorMessage || "Action failed");
-        }
-      } catch (e) {
-        if (retriesLeft > 0) {
-          await new Promise((resolve) => setTimeout(resolve, options?.retryDelay || 1e3));
-          return executeWithRetry(params, retriesLeft - 1);
-        }
-        throw e;
-      }
-    },
-    [context.hostApi, actionType, options?.retryDelay]
-  );
-  const execute = useCallback3(
-    async (params) => {
-      if (!mountedRef.current) return void 0;
-      setLoading(true);
-      setError(null);
-      setExecutionCount((c) => c + 1);
-      try {
-        const data = await executeWithRetry(params, options?.retryCount || 0);
-        if (mountedRef.current) {
-          setResult(data);
-          options?.onSuccess?.(data);
-        }
-        return data;
-      } catch (e) {
-        const err = e;
-        if (mountedRef.current) {
-          setError(err);
-          options?.onError?.(err);
-        }
-        throw e;
-      } finally {
-        if (mountedRef.current) {
-          setLoading(false);
-        }
-      }
-    },
-    [executeWithRetry, options]
-  );
-  return {
-    execute,
-    loading,
-    result,
-    error,
-    reset,
-    executionCount
-  };
-}
-function useData(queryId, params, options) {
-  const context = useRuntimeContext();
-  const [data, setData] = useState4();
-  const [loading, setLoading] = useState4(false);
-  const [error, setError] = useState4(null);
-  const [isFetched, setIsFetched] = useState4(false);
-  const mountedRef = useRef4(true);
-  const paramsRef = useRef4(params);
-  useEffect3(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  const refetch = useCallback3(
-    async (newParams) => {
-      const hostApi = context.hostApi;
-      if (!hostApi || !mountedRef.current) return;
-      setLoading(true);
-      setError(null);
-      try {
-        const data2 = await hostApi.requestData(
-          queryId,
-          newParams || paramsRef.current
-        );
-        if (!mountedRef.current) return;
-        setData(data2);
-        setIsFetched(true);
-        options?.onSuccess?.(data2);
-      } catch (e) {
-        if (mountedRef.current) {
-          const err = e;
-          setError(err);
-          options?.onError?.(err);
-        }
-      } finally {
-        if (mountedRef.current) {
-          setLoading(false);
-        }
-      }
-    },
-    [context.hostApi, queryId, options]
-  );
-  useEffect3(() => {
-    const prevParams = paramsRef.current;
-    paramsRef.current = params;
-    if (options?.refreshOnParamsChange !== false && context.hostApi && isFetched && JSON.stringify(prevParams) !== JSON.stringify(params)) {
-      refetch();
-    }
-  }, [params, context.hostApi, options?.refreshOnParamsChange, isFetched, refetch]);
-  useEffect3(() => {
-    if (options?.immediate !== false && context.hostApi) {
-      refetch();
-    }
-  }, [context.hostApi]);
-  useEffect3(() => {
-    if (!options?.refreshInterval || options.refreshInterval <= 0) return;
-    const timer = setInterval(() => {
-      refetch();
-    }, options.refreshInterval);
-    return () => clearInterval(timer);
-  }, [options?.refreshInterval, refetch]);
-  return {
-    data,
-    loading,
-    error,
-    refetch,
-    isFetched
-  };
-}
-function useRuntimeEvent(eventType, handler) {
-  const context = useRuntimeContext();
-  useEffect3(() => {
-    const unsubscribe = context.runtime?.on(eventType, (event) => {
-      handler(event.data);
-    });
-    return () => {
-      unsubscribe?.();
-    };
-  }, [context.runtime, eventType, handler]);
-}
-function usePageInfo() {
-  const context = useRuntimeContext();
-  const page = context.state.page;
-  return useMemo2(() => ({
-    /** 页面 UID */
-    pageUid: page?.pageUid,
-    /** 页面版本 ID */
-    pageVersionId: page?.pageVersionId,
-    /** Schema 版本 */
-    schemaVersion: page?.pageJson?.schemaVersion,
-    /** 页面标题 */
-    title: page?.title,
-    /** 页面配置 */
-    config: page?.config,
-    /** 页面是否已加载 */
-    isLoaded: page !== null
-  }), [page]);
-}
-function useComponentState(componentId) {
-  const context = useRuntimeContext();
-  const componentStatus = context.state.components.get(componentId);
-  return useMemo2(() => ({
-    /** 组件是否已加载 */
-    isLoaded: componentStatus?.status === "loaded",
-    /** 组件是否加载中 */
-    isLoading: componentStatus?.status === "loading",
-    /** 组件是否加载失败 */
-    hasError: componentStatus?.status === "failed",
-    /** 加载耗时 */
-    loadTime: componentStatus?.loadTime,
-    /** 组件信息 */
-    info: componentStatus
-  }), [componentStatus]);
-}
-function useLifecycle(options) {
-  const context = useRuntimeContext();
-  const [hasMounted, setHasMounted] = useState4(false);
-  const [hasReady, setHasReady] = useState4(false);
-  const prevPhaseRef = useRef4(context.state.phase);
-  const mountedRef = useRef4(true);
-  useEffect3(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  useEffect3(() => {
-    const currentPhase = context.state.phase;
-    if (currentPhase !== prevPhaseRef.current) {
-      options?.onPhaseChange?.(currentPhase);
-      prevPhaseRef.current = currentPhase;
-    }
-    if (!hasMounted && currentPhase !== "idle") {
-      setHasMounted(true);
-      Promise.resolve(options?.onMounted?.()).catch((error) => {
-        options?.onError?.(error);
-      });
-    }
-    if (!hasReady && currentPhase === "ready") {
-      setHasReady(true);
-      Promise.resolve(options?.onReady?.()).catch((error) => {
-        options?.onError?.(error);
-      });
-    }
-    if (currentPhase === "error" && context.state.error) {
-      options?.onError?.(context.state.error);
-    }
-  }, [context.state.phase, context.state.error, hasMounted, hasReady, options]);
-  return {
-    /** 当前阶段 */
-    phase: context.state.phase,
-    /** 是否已 mounted */
-    hasMounted,
-    /** 是否已 ready */
-    hasReady
-  };
-}
-function useWhen(condition, callback, options) {
-  const [executed, setExecuted] = useState4(false);
-  const { once = true } = options || {};
-  useEffect3(() => {
-    if (condition && (!once || !executed)) {
-      setExecuted(true);
-      callback();
-    }
-  }, [condition, callback, once, executed]);
-  return {
-    /** 是否已执行 */
-    executed
-  };
-}
-function useDebouncedAction(actionType, delay = 300) {
-  const { execute: rawExecute, loading, result, error } = useAction(actionType);
-  const timeoutRef = useRef4(null);
-  const mountedRef = useRef4(true);
-  useEffect3(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-      if (timeoutRef.current) {
-        clearTimeout(timeoutRef.current);
-      }
-    };
-  }, []);
-  const execute = useCallback3((params) => {
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    timeoutRef.current = setTimeout(() => {
-      if (mountedRef.current) {
-        rawExecute(params).catch(() => {
-        });
-      }
-    }, delay);
-  }, [rawExecute, delay]);
-  const cancel = useCallback3(() => {
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-      timeoutRef.current = null;
-    }
-  }, []);
-  return {
-    execute,
-    loading,
-    result,
-    error,
-    cancel
-  };
-}
-function useAsync(asyncFn, deps = [], options) {
-  const [data, setData] = useState4();
-  const [loading, setLoading] = useState4(false);
-  const [error, setError] = useState4(null);
-  const mountedRef = useRef4(true);
-  useEffect3(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  const execute = useCallback3(async () => {
-    if (!mountedRef.current) return void 0;
-    setLoading(true);
-    setError(null);
-    try {
-      const result = await asyncFn();
-      if (mountedRef.current) {
-        setData(result);
-        options?.onSuccess?.(result);
-      }
-      return result;
-    } catch (e) {
-      const err = e;
-      if (mountedRef.current) {
-        setError(err);
-        options?.onError?.(err);
-      }
-      return void 0;
-    } finally {
-      if (mountedRef.current) {
-        setLoading(false);
-      }
-    }
-  }, [asyncFn, ...deps]);
-  useEffect3(() => {
-    if (options?.immediate !== false) {
-      execute();
-    }
-  }, []);
-  return {
-    data,
-    loading,
-    error,
-    execute
-  };
-}
-function usePrevious(value) {
-  const ref = useRef4();
-  useEffect3(() => {
-    ref.current = value;
-  }, [value]);
-  return ref.current;
-}
-export {
-  DJVProvider,
-  DJVRenderer,
-  RuntimeContext,
-  RuntimeProvider,
-  useAction,
-  useAsync,
-  useComponentState,
-  useDJVRuntime,
-  useData,
-  useDebouncedAction,
-  useHostApi,
-  useLifecycle,
-  usePageInfo,
-  usePrevious,
-  useQuery,
-  useReactRuntime,
-  useRuntimeContext,
-  useRuntimeEvent,
-  useRuntimeState,
-  useRuntimeStateWritable,
-  useWhen
-};
+import{createContext as e,useState as r,useRef as n,useMemo as t,useCallback as a,useContext as o,useEffect as i}from"react";import{createRuntime as l}from"@djvlc/runtime-core";import{jsx as s,jsxs as c}from"react/jsx-runtime";var u={initTime:0,loadTime:0,renderTime:0,totalTime:0,initTimestamp:null,readyTimestamp:null};function d(e){const[o,i]=r(null),[s,c]=r(!0),[d,m]=r("idle"),[f,h]=r(null),[p,w]=r(null),[y,v]=r(null),[g,T]=r(u),b=n(null),E=n({startTime:0,initStartTime:0,loadStartTime:0,renderStartTime:0}),A=t(()=>"ready"===d,[d]),I=t(()=>"error"===d||null!==p,[d,p]),N=a(async()=>{const r=e.containerRef?.current;if(!r)throw new Error("Container element not found");E.current.startTime=performance.now(),E.current.initStartTime=E.current.startTime,e.enableMetrics&&T(e=>({...e,initTimestamp:Date.now()}));const n=l({...e,container:r,onError:r=>{w(r),e.onError?.(r)},onEvent:r=>{e.onEvent?.(r)}});b.current=n,i(n),n.onStateChange(e=>{m(e.phase),c("ready"!==e.phase&&"error"!==e.phase),e.page&&h(e.page),e.error&&w(e.error)}),await n.init(),v(n.getHostApi()),e.enableMetrics&&T(e=>({...e,initTime:performance.now()-E.current.initStartTime}))},[e]),j=a(async()=>{if(!b.current)throw new Error("Runtime not initialized");E.current.loadStartTime=performance.now();const r=await b.current.load();return h(r),v(b.current.getHostApi()),e.enableMetrics&&T(e=>({...e,loadTime:performance.now()-E.current.loadStartTime})),r},[e.enableMetrics]),R=a(async()=>{if(!b.current)throw new Error("Runtime not initialized");if(E.current.renderStartTime=performance.now(),await b.current.render(),c(!1),e.enableMetrics){const e=performance.now();T(r=>({...r,renderTime:e-E.current.renderStartTime,totalTime:e-E.current.startTime,readyTimestamp:Date.now()}))}},[e.enableMetrics]),C=a(()=>{b.current?.destroy(),b.current=null,i(null),v(null),h(null),w(null),m("idle"),c(!0),T(u)},[]),P=a(async()=>{if(!b.current)throw new Error("Runtime not initialized");w(null),c(!0),await j(),await R()},[j,R]),x=a((e,r)=>{b.current?.setVariable(e,r)},[]),S=a(e=>{b.current&&Object.entries(e).forEach(([e,r])=>{b.current?.setVariable(e,r)})},[]),U=a(e=>b.current?.getState().variables[e],[]),k=a(async e=>{await(b.current?.refreshData(e))},[]),B=a(async(e,r)=>{const n=y;if(!n)throw new Error("HostAPI not available");const t=await n.executeAction(e,r||{});if(t.success)return t.data;throw new Error(t.errorMessage||"Action failed")},[y]);return{runtime:o,loading:s,phase:d,page:f,error:p,hostApi:y,isReady:A,hasError:I,metrics:g,init:N,load:j,render:R,destroy:C,reload:P,setVariable:x,setVariables:S,getVariable:U,refreshData:k,executeAction:B}}var m=e({runtime:null,state:{phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1},hostApi:null});function f({runtime:e,state:r,hostApi:n,children:t}){const a={runtime:e,state:r,hostApi:n};return s(m.Provider,{value:a,children:t})}function h(){return o(m)}function p({pageUid:e,apiBaseUrl:t,cdnBaseUrl:o,channel:l="prod",userId:u,deviceId:m,authToken:h,previewToken:p,debug:w=!1,enableSRI:y=!0,onLoad:v,onError:g,onReady:T,onPhaseChange:b,loadingComponent:E,errorComponent:A,emptyComponent:I,children:N,className:j,style:R,retryCount:C=3,retryDelay:P=1e3,timeout:x=3e4}){const S=n(null),U=n(!0),k=n(0),[B,D]=r({phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1}),M={pageUid:e,apiBaseUrl:t,cdnBaseUrl:o,channel:l,userId:u,deviceId:m,authToken:h,previewToken:p,debug:w,enableSRI:y,containerRef:S,onError:e=>{g?.(e)}},{runtime:V,loading:z,phase:L,page:q,error:H,hostApi:O,init:J,load:F,render:$,destroy:G}=d(M);i(()=>{b?.(L)},[L,b]);const K=a(async()=>{if(!S.current||!U.current)return;const e=new Promise((e,r)=>{setTimeout(()=>r(new Error("加载超时")),x)});try{await Promise.race([(async()=>{await J();const e=await F();U.current&&v?.(e),await $(),U.current&&(T?.(),k.current=0,V&&V.onStateChange(e=>{U.current&&D(e)}))})(),e])}catch(e){if(!U.current)return;k.current<C&&(k.current++,setTimeout(()=>{U.current&&K()},P))}},[J,F,$,V,v,T,x,C,P,w]),Q=a(()=>{k.current=0,K()},[K]);return i(()=>(U.current=!0,K(),()=>{U.current=!1,G()}),[e]),s(f,{runtime:V,state:B,hostApi:O,children:c("div",{ref:S,className:`djvlc-renderer ${j||""}`,style:R,"data-phase":L,"data-page-uid":e,children:[z?E||c("div",{className:"djvlc-loading",children:[s("div",{className:"djvlc-loading-spinner"}),s("span",{children:"加载中..."}),k.current>0&&c("span",{className:"djvlc-loading-retry",children:["重试 ",k.current,"/",C]})]}):null,H?"function"==typeof A?A(H,Q):A||c("div",{className:"djvlc-error",children:[s("div",{className:"djvlc-error-icon",children:"⚠️"}),c("span",{className:"djvlc-error-message",children:["加载失败：",H.message]}),s("button",{className:"djvlc-error-retry-btn",onClick:Q,type:"button",children:"重试"})]}):null,z||H||q||"ready"!==L||q?null:I||s("div",{className:"djvlc-empty",children:s("span",{children:"暂无内容"})}),N]})})}var w={phase:"idle",page:null,variables:{},queries:{},components:new Map,error:null,destroyed:!1};function y({runtime:e,hostApi:t,children:a,className:o,debug:l=!1,onStateChange:c,onPhaseChange:u,onError:d}){const[m,h]=r(e?.getState()||w),p=n(m.phase);return i(()=>{if(!e)return void h(w);h(e.getState());const r=e.onStateChange(e=>{h(e),c?.(e),e.phase!==p.current&&(u?.(e.phase),p.current=e.phase),e.error&&d?.(e.error)});return()=>{r()}},[e,c,u,d,l]),i(()=>{},[t]),s(f,{runtime:e,state:m,hostApi:t,children:s("div",{className:["djvlc-provider",o].filter(Boolean).join(" "),"data-phase":m.phase,children:a})})}function v(){const e=h(),r=t(()=>{const r=e.state.phase;return"ready"!==r&&"error"!==r},[e.state.phase]),n="ready"===e.state.phase,o="error"===e.state.phase||null!==e.state.error,i=a(async()=>{if(!e.runtime)throw new Error("Runtime not available");await e.runtime.load(),await e.runtime.render()},[e.runtime]);return{runtime:e.runtime,state:e.state,loading:r,phase:e.state.phase,error:e.state.error,page:e.state.page,isReady:n,hasError:o,reload:i}}function g(){const e=h();if(!e.hostApi)throw new Error("HostAPI not available. Make sure runtime is initialized.");return e.hostApi}function T(e){return h().state.variables[e]}function b(e,r){const n=h();return[n.state.variables[e]??r,a(r=>{n.runtime?.setVariable(e,r)},[n.runtime,e])]}function E(e,t){const o=h(),[l,s]=r(!1),[c,u]=r(null),[d,m]=r(null),f=n(!0),p=o.state.queries[e],w=a(async()=>{if(f.current){s(!0),u(null);try{await(o.runtime?.refreshData(e)),f.current&&m(Date.now())}catch(e){f.current&&u(e)}finally{f.current&&s(!1)}}},[o.runtime,e]);return i(()=>(f.current=!0,t?.refreshOnMount&&o.runtime&&w(),()=>{f.current=!1}),[]),i(()=>{if(!t?.refreshInterval||t.refreshInterval<=0)return;const e=setInterval(()=>{w()},t.refreshInterval);return()=>clearInterval(e)},[t?.refreshInterval,w]),i(()=>{if(!t?.refreshOnFocus)return;const e=()=>{w()};return window.addEventListener("focus",e),()=>window.removeEventListener("focus",e)},[t?.refreshOnFocus,w]),{data:p,loading:l,error:c,refetch:w,lastUpdated:d}}function A(e,t){const o=h(),[l,s]=r(!1),[c,u]=r(),[d,m]=r(null),[f,p]=r(0),w=n(!0);i(()=>(w.current=!0,()=>{w.current=!1}),[]);const y=a(()=>{u(void 0),m(null),p(0)},[]),v=a(async(r,n)=>{const a=o.hostApi;if(!a)throw new Error("HostAPI not available");try{const n=await a.executeAction(e,r);if(n.success)return n.data;throw new Error(n.errorMessage||"Action failed")}catch(e){if(n>0)return await new Promise(e=>setTimeout(e,t?.retryDelay||1e3)),v(r,n-1);throw e}},[o.hostApi,e,t?.retryDelay]);return{execute:a(async e=>{if(w.current){s(!0),m(null),p(e=>e+1);try{const r=await v(e,t?.retryCount||0);return w.current&&(u(r),t?.onSuccess?.(r)),r}catch(e){const r=e;throw w.current&&(m(r),t?.onError?.(r)),e}finally{w.current&&s(!1)}}},[v,t]),loading:l,result:c,error:d,reset:y,executionCount:f}}function I(e,t,o){const l=h(),[s,c]=r(),[u,d]=r(!1),[m,f]=r(null),[p,w]=r(!1),y=n(!0),v=n(t);i(()=>(y.current=!0,()=>{y.current=!1}),[]);const g=a(async r=>{const n=l.hostApi;if(n&&y.current){d(!0),f(null);try{const t=await n.requestData(e,r||v.current);if(!y.current)return;c(t),w(!0),o?.onSuccess?.(t)}catch(e){if(y.current){const r=e;f(r),o?.onError?.(r)}}finally{y.current&&d(!1)}}},[l.hostApi,e,o]);return i(()=>{const e=v.current;v.current=t,!1!==o?.refreshOnParamsChange&&l.hostApi&&p&&JSON.stringify(e)!==JSON.stringify(t)&&g()},[t,l.hostApi,o?.refreshOnParamsChange,p,g]),i(()=>{!1!==o?.immediate&&l.hostApi&&g()},[l.hostApi]),i(()=>{if(!o?.refreshInterval||o.refreshInterval<=0)return;const e=setInterval(()=>{g()},o.refreshInterval);return()=>clearInterval(e)},[o?.refreshInterval,g]),{data:s,loading:u,error:m,refetch:g,isFetched:p}}function N(e,r){const n=h();i(()=>{const t=n.runtime?.on(e,e=>{r(e.data)});return()=>{t?.()}},[n.runtime,e,r])}function j(){const e=h().state.page;return t(()=>({pageUid:e?.pageUid,pageVersionId:e?.pageVersionId,schemaVersion:e?.pageJson?.schemaVersion,title:e?.title,config:e?.config,isLoaded:null!==e}),[e])}function R(e){const r=h().state.components.get(e);return t(()=>({isLoaded:"loaded"===r?.status,isLoading:"loading"===r?.status,hasError:"failed"===r?.status,loadTime:r?.loadTime,info:r}),[r])}function C(e){const t=h(),[a,o]=r(!1),[l,s]=r(!1),c=n(t.state.phase),u=n(!0);return i(()=>(u.current=!0,()=>{u.current=!1}),[]),i(()=>{const r=t.state.phase;r!==c.current&&(e?.onPhaseChange?.(r),c.current=r),a||"idle"===r||(o(!0),Promise.resolve(e?.onMounted?.()).catch(r=>{e?.onError?.(r)})),l||"ready"!==r||(s(!0),Promise.resolve(e?.onReady?.()).catch(r=>{e?.onError?.(r)})),"error"===r&&t.state.error&&e?.onError?.(t.state.error)},[t.state.phase,t.state.error,a,l,e]),{phase:t.state.phase,hasMounted:a,hasReady:l}}function P(e,n,t){const[a,o]=r(!1),{once:l=!0}=t||{};return i(()=>{!e||l&&a||(o(!0),n())},[e,n,l,a]),{executed:a}}function x(e,r=300){const{execute:t,loading:o,result:l,error:s}=A(e),c=n(null),u=n(!0);return i(()=>(u.current=!0,()=>{u.current=!1,c.current&&clearTimeout(c.current)}),[]),{execute:a(e=>{c.current&&clearTimeout(c.current),c.current=setTimeout(()=>{u.current&&t(e).catch(()=>{})},r)},[t,r]),loading:o,result:l,error:s,cancel:a(()=>{c.current&&(clearTimeout(c.current),c.current=null)},[])}}function S(e,t=[],o){const[l,s]=r(),[c,u]=r(!1),[d,m]=r(null),f=n(!0);i(()=>(f.current=!0,()=>{f.current=!1}),[]);const h=a(async()=>{if(f.current){u(!0),m(null);try{const r=await e();return f.current&&(s(r),o?.onSuccess?.(r)),r}catch(e){const r=e;return void(f.current&&(m(r),o?.onError?.(r)))}finally{f.current&&u(!1)}}},[e,...t]);return i(()=>{!1!==o?.immediate&&h()},[]),{data:l,loading:c,error:d,execute:h}}function U(e){const r=n();return i(()=>{r.current=e},[e]),r.current}export{y as DJVProvider,p as DJVRenderer,m as RuntimeContext,f as RuntimeProvider,A as useAction,S as useAsync,R as useComponentState,v as useDJVRuntime,I as useData,x as useDebouncedAction,g as useHostApi,C as useLifecycle,j as usePageInfo,U as usePrevious,E as useQuery,d as useReactRuntime,h as useRuntimeContext,N as useRuntimeEvent,T as useRuntimeState,b as useRuntimeStateWritable,P as useWhen};