@variojs/vue 0.0.1 → 0.0.2

package/dist/bindings.js

@@ -1,199 +1 @@
-/**
- * Bidirectional binding handlers for Vue integration
- *
- * 功能：
- * - v-model 双向绑定处理
- * - 智能检测组件类型（原生元素 vs Vue 组件）
- * - 自动适配不同的 model 协议（Vue 3 标准 vs 传统协议）
- * - 支持自定义配置（可选）
- *
- * 设计原则：
- * - 使用 vario-core 的路径工具，避免重复代码
- * - 优先自动检测，减少配置需求
- * - 支持 Vue 3 和传统协议
- */
-import { resolveComponent } from 'vue';
-import { getPathValue } from '@variojs/core';
-/**
- * 自定义配置注册表
- */
-const customConfigs = new Map();
-/**
- * 原生表单元素
- */
-const NATIVE_FORM_ELEMENTS = new Set(['input', 'textarea', 'select']);
-/**
- * 原生元素的事件映射
- */
-const NATIVE_EVENT_MAP = {
-    input: 'input',
-    textarea: 'input',
-    select: 'change'
-};
-/**
- * Vue 3 标准 model 配置
- */
-const VUE3_DEFAULT_CONFIG = {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-};
-/**
- * 获取组件的 model 配置
- */
-function getModelConfig(componentType, component) {
-    // 1. 自定义配置优先
-    const custom = customConfigs.get(componentType);
-    if (custom)
-        return custom;
-    // 2. 原生表单元素
-    const lowerType = componentType.toLowerCase();
-    if (NATIVE_FORM_ELEMENTS.has(lowerType)) {
-        return {
-            prop: 'value',
-            event: NATIVE_EVENT_MAP[lowerType] || 'input'
-        };
-    }
-    // 3. 尝试从组件定义检测
-    if (component && typeof component === 'object') {
-        const comp = component;
-        const props = (comp.props || comp.__props || {});
-        // 检查 modelValue（Vue 3 标准）
-        if ('modelValue' in props || comp.__vModel) {
-            return VUE3_DEFAULT_CONFIG;
-        }
-        // 检查 value（传统协议）
-        if ('value' in props) {
-            const emits = (comp.emits || comp.__emits || []);
-            return {
-                prop: 'value',
-                event: emits.includes('update:value') ? 'update:value' : 'input'
-            };
-        }
-    }
-    // 4. 默认 Vue 3 标准
-    return VUE3_DEFAULT_CONFIG;
-}
-/**
- * 转换事件名为 Vue 事件处理器格式
- */
-function toEventHandlerName(event) {
-    if (event.startsWith('update:')) {
-        return `onUpdate:${event.slice(7)}`;
-    }
-    return `on${event.charAt(0).toUpperCase()}${event.slice(1)}`;
-}
-/**
- * 获取默认值（当值为 undefined 时）
- * 确保双向绑定能够正常工作，即使状态中还没有这个字段
- */
-function getDefaultValue(prop) {
-    // 对于输入框相关的 prop，默认为空字符串
-    if (prop === 'value' || prop === 'modelValue') {
-        return '';
-    }
-    // 对于复选框相关的 prop，默认为 false
-    if (prop === 'checked') {
-        return false;
-    }
-    // 其他情况返回 undefined，让组件自己处理
-    return undefined;
-}
-/**
- * 创建双向绑定配置
- *
- * @param componentType 组件类型名
- * @param modelPath 模型路径（如 "user.name"）
- * @param ctx 运行时上下文
- * @param component 组件对象（可选，用于自动检测）
- * @param getState 获取响应式状态的函数（用于 Vue 响应式追踪）
- * @param modelName 具名 model（可选，如 "checked", "value"）
- * @returns 包含 prop 和 event handler 的对象
- */
-export function createModelBinding(componentType, modelPath, ctx, component, getState, modelName) {
-    // 尝试解析组件（如果未提供或者是字符串）
-    let resolvedComponent = component;
-    if (!resolvedComponent || typeof resolvedComponent === 'string') {
-        try {
-            const resolved = resolveComponent(componentType);
-            if (resolved && typeof resolved !== 'string') {
-                resolvedComponent = resolved;
-            }
-        }
-        catch {
-            // 解析失败，使用默认配置
-        }
-    }
-    // 获取配置（支持具名 model）
-    const config = modelName
-        ? getNamedModelConfig(componentType, resolvedComponent, modelName)
-        : getModelConfig(componentType, resolvedComponent);
-    // 获取当前值
-    let value = getState
-        ? getPathValue(getState(), modelPath)
-        : ctx._get(modelPath);
-    // 如果值是 undefined，自动初始化为合适的默认值
-    // 这确保了双向绑定能够正常工作，即使状态中还没有这个字段
-    if (value === undefined) {
-        const defaultValue = getDefaultValue(config.prop);
-        if (defaultValue !== undefined) {
-            // 立即初始化到状态中，确保响应式绑定正常工作
-            value = defaultValue;
-            // 调用 _set 初始化值，会触发 onStateChange 同步到 Vue 状态
-            ctx._set(modelPath, defaultValue);
-        }
-    }
-    return {
-        [config.prop]: value,
-        [toEventHandlerName(config.event)]: (newValue) => {
-            // 直接设置到运行时上下文，会触发 onStateChange 同步到 Vue 状态
-            ctx._set(modelPath, newValue);
-        }
-    };
-}
-/**
- * 获取具名 model 配置（支持多 model）
- */
-function getNamedModelConfig(componentType, component, modelName) {
-    // 1. 检查自定义配置
-    const customKey = `${componentType}:${modelName}`;
-    const custom = customConfigs.get(customKey);
-    if (custom)
-        return custom;
-    // 2. 尝试从组件定义检测
-    if (component && typeof component === 'object') {
-        const comp = component;
-        const props = (comp.props || {});
-        const emits = (comp.emits || []);
-        // Vue 3.4+ 多 model 支持
-        if (modelName in props) {
-            return {
-                prop: modelName,
-                event: emits.includes(`update:${modelName}`)
-                    ? `update:${modelName}`
-                    : `update:${modelName}`
-            };
-        }
-    }
-    // 3. 默认规则：prop 为 modelName，event 为 update:modelName
-    return {
-        prop: modelName,
-        event: `update:${modelName}`
-    };
-}
-/**
- * 注册自定义组件的 model 配置
- * @param componentType 组件类型名
- * @param config model 配置
- * @param modelName 具名 model（可选）
- */
-export function registerModelConfig(componentType, config, modelName) {
-    const key = modelName ? `${componentType}:${modelName}` : componentType;
-    customConfigs.set(key, config);
-}
-/**
- * 清除自定义配置
- */
-export function clearModelConfigs() {
-    customConfigs.clear();
-}
-//# sourceMappingURL=bindings.js.map
+import{resolveComponent as l}from"vue";import{getPathValue as d}from"@variojs/core";const p=new Map,g=new Set(["input","textarea","select"]),v={input:"input",textarea:"input",select:"change"},a={prop:"modelValue",event:"update:modelValue"};function _(t,n){const e=p.get(t);if(e)return e;const i=t.toLowerCase();if(g.has(i))return{prop:"value",event:v[i]||"input"};if(n&&typeof n=="object"){const r=n,o=r.props||r.__props||{};if("modelValue"in o||r.__vModel)return a;if("value"in o)return{prop:"value",event:(r.emits||r.__emits||[]).includes("update:value")?"update:value":"input"}}return a}function V(t){return t.startsWith("update:")?`onUpdate:${t.slice(7)}`:`on${t.charAt(0).toUpperCase()}${t.slice(1)}`}function $(t){if(t==="value"||t==="modelValue")return"";if(t==="checked")return!1}function A(t,n,e,i,r,o){let s=i;if(!s||typeof s=="string")try{const u=l(t);u&&typeof u!="string"&&(s=u)}catch{}const f=o?C(t,s,o):_(t,s);let c=r?d(r(),n):e._get(n);if(c===void 0){const u=$(f.prop);u!==void 0&&(c=u,e._set(n,u))}return{[f.prop]:c,[V(f.event)]:u=>{e._set(n,u)}}}function C(t,n,e){const i=`${t}:${e}`,r=p.get(i);if(r)return r;if(n&&typeof n=="object"){const o=n,s=o.props||{},f=o.emits||[];if(e in s)return{prop:e,event:f.includes(`update:${e}`)?`update:${e}`:`update:${e}`}}return{prop:e,event:`update:${e}`}}function h(t,n,e){const i=e?`${t}:${e}`:t;p.set(i,n)}function w(){p.clear()}export{w as clearModelConfigs,A as createModelBinding,h as registerModelConfig};

package/dist/composable.js

@@ -1,386 +1 @@
-/**
- * useVario composable for Vue integration
- *
- * 设计目标：
- * - Options 风格（state/computed/methods）零学习成本
- * - Composition 风格透传 reactive/computed
- * - 状态直接可访问（无需 .value）
- * - 方法统一通过 $methods 调用
- * - 生命周期：在使用 useVario 的组件中直接使用 Vue 的生命周期钩子
- *   （如 onMounted, onUnmounted 等），无需通过 options 传递
- *
- * 性能优化：
- * - 1000+ 组件场景：避免在每个 useVario 中注册生命周期钩子
- * - 生命周期钩子应在使用 useVario 的组件中直接使用，减少抽象层开销
- */
-import { ref, reactive, computed, watch, nextTick, getCurrentInstance, h, isReactive } from 'vue';
-import { createRuntimeContext, invalidateCache, setPathValue, ServiceError } from '@variojs/core';
-import { VueRenderer } from './renderer.js';
-import { registerModelConfig } from './bindings.js';
-import { RefsRegistry } from './features/refs.js';
-// 实现：使用箭头函数
-export const useVario = (schema, options = {}) => {
-    const schemaRef = resolveSchema(schema);
-    // 获取组件实例（如果可用）
-    const instance = getCurrentInstance();
-    // 状态：自动包裹为响应式对象
-    // 如果传入的 state 已经是响应式的（通过 isReactive 检查），直接使用
-    // 否则用 reactive() 包裹
-    const reactiveState = (options.state
-        ? (isReactive(options.state) ? options.state : reactive(options.state))
-        : reactive({}));
-    // 应用自定义绑定协议（可选）
-    applyBindingConfigs(options.modelBindings);
-    // 构建方法注册表（支持兼容命名）
-    const methodsRegistry = buildMethodsRegistry(options.methods, reactiveState);
-    // 同步锁，防止双向同步死循环
-    let syncing = false;
-    // 同步路径追踪，用于循环检测
-    const syncingPaths = new Set();
-    // 延迟引用 render 函数（因为 render 在 ctx 之后定义）
-    let renderFn = null;
-    const ctx = createRuntimeContext({}, {
-        onEmit: (event, data) => {
-            options.onEmit?.(event, data);
-        },
-        methods: methodsRegistry,
-        exprOptions: options.exprOptions,
-        onStateChange: ((path, value, runtimeCtx) => {
-            // 如果正在同步，跳过（防止循环）
-            if (syncing)
-                return;
-            // 循环检测：如果当前路径正在同步，跳过
-            if (syncingPaths.has(path))
-                return;
-            syncing = true;
-            syncingPaths.add(path);
-            try {
-                // 同步到 Vue 响应式状态（自动创建缺失的对象结构）
-                setPathValue(reactiveState, path, value, {
-                    createObject: () => reactive({}),
-                    createArray: () => reactive([]),
-                    // 自动创建中间对象，确保路径存在
-                    createIntermediate: true
-                });
-                // 缓存失效
-                invalidateCache(path, runtimeCtx);
-                // 触发重新渲染（确保 UI 及时更新）
-                if (renderFn)
-                    nextTick(renderFn);
-            }
-            finally {
-                syncingPaths.delete(path);
-                syncing = false;
-            }
-        }),
-        createObject: () => reactive({}),
-        createArray: () => reactive([])
-    });
-    // 将初始状态写入 ctx（保持 runtime 与 Vue 一致）
-    // 注意：需要在 watch 之前初始化，避免触发不必要的 watch
-    // 遍历 reactiveState 的所有属性并同步到 ctx
-    // 同时，如果 state 为空，会自动在 onStateChange 中创建结构
-    for (const key in reactiveState) {
-        if (key.startsWith('$') || key.startsWith('_'))
-            continue;
-        const value = reactiveState[key];
-        ctx._set(key, value, { skipCallback: true });
-    }
-    // 计算属性（Options 风格）
-    if (options.computed) {
-        registerComputed(options.computed, reactiveState, ctx);
-    }
-    const ctxRef = ref(ctx);
-    // 规范化 modelPath 配置
-    const modelPathConfig = normalizeModelPathConfig(options.modelPath);
-    // 创建 refs 注册表（用于模板引用）
-    const refsRegistry = options.rendererOptions?.refsRegistry || new RefsRegistry();
-    const renderer = new VueRenderer({
-        ...options.rendererOptions,
-        instance,
-        app: options.app ?? options.rendererOptions?.app,
-        components: options.components ?? options.rendererOptions?.components,
-        getState: () => reactiveState,
-        refsRegistry,
-        modelPath: modelPathConfig
-    });
-    const vnodeRef = ref(null);
-    const errorRef = ref(null);
-    const errorBoundaryEnabled = options.errorBoundary?.enabled !== false;
-    const render = () => {
-        // 清除之前的错误
-        if (errorRef.value && errorBoundaryEnabled) {
-            errorRef.value = null;
-        }
-        try {
-            const currentSchema = schemaRef.value;
-            if (!isValidSchema(currentSchema)) {
-                vnodeRef.value = null;
-                return;
-            }
-            vnodeRef.value = renderer.render(currentSchema, ctx);
-        }
-        catch (error) {
-            const err = error instanceof Error ? error : new Error(String(error));
-            // 错误边界处理
-            if (errorBoundaryEnabled) {
-                errorRef.value = err;
-                // 调用错误恢复回调
-                if (options.errorBoundary?.onRecover) {
-                    try {
-                        options.errorBoundary.onRecover(err);
-                    }
-                    catch (recoverError) {
-                        console.warn('Error recovery callback failed:', recoverError);
-                    }
-                }
-                // 显示错误UI
-                if (options.errorBoundary?.fallback) {
-                    try {
-                        vnodeRef.value = options.errorBoundary.fallback(err);
-                    }
-                    catch (fallbackError) {
-                        // 回退到默认错误显示
-                        vnodeRef.value = createDefaultErrorVNode(err);
-                    }
-                }
-                else {
-                    vnodeRef.value = createDefaultErrorVNode(err);
-                }
-            }
-            else {
-                // 错误边界未启用，使用原有逻辑
-                vnodeRef.value = null;
-                options.onError?.(err);
-            }
-        }
-    };
-    /**
-     * 创建默认错误显示VNode
-     */
-    function createDefaultErrorVNode(error) {
-        return h('div', {
-            style: {
-                padding: '20px',
-                border: '2px solid #f56565',
-                borderRadius: '4px',
-                backgroundColor: '#fff5f5',
-                color: '#c53030'
-            }
-        }, [
-            h('div', { style: { fontWeight: 'bold', marginBottom: '10px' } }, '渲染错误'),
-            h('div', { style: { marginBottom: '10px' } }, error.message),
-            h('button', {
-                onClick: () => {
-                    errorRef.value = null;
-                    render();
-                },
-                style: {
-                    padding: '8px 16px',
-                    backgroundColor: '#4299e1',
-                    color: 'white',
-                    border: 'none',
-                    borderRadius: '4px',
-                    cursor: 'pointer'
-                }
-            }, '重试')
-        ]);
-    }
-    // 设置 renderFn 引用，供 onStateChange 使用
-    renderFn = render;
-    render();
-    // schema 变化重新渲染
-    watch(schemaRef, () => nextTick(render), { deep: true, immediate: false });
-    // 状态变更同步到 ctx（Options/Composition 都生效）
-    // 使用单独的 watchSyncing 标志，避免与 ctx._set 触发的 onStateChange 冲突
-    let watchSyncing = false;
-    watch(reactiveState, () => {
-        // 如果正在同步（watch 自身触发），跳过
-        if (watchSyncing)
-            return;
-        watchSyncing = true;
-        try {
-            syncStateToContext(reactiveState, ctx, { skipCallback: true });
-            // 清除表达式缓存（重要：当数组/对象内部变化时，引用不变但内容变了，需要重新求值）
-            // 遍历所有顶层属性，使其缓存失效
-            for (const key in reactiveState) {
-                if (key.startsWith('$') || key.startsWith('_'))
-                    continue;
-                invalidateCache(key, ctx);
-            }
-            nextTick(render);
-        }
-        finally {
-            watchSyncing = false;
-        }
-    }, { deep: true, flush: 'post', immediate: false });
-    return {
-        vnode: vnodeRef,
-        state: reactiveState,
-        ctx: ctxRef,
-        refs: refsRegistry.getAll(),
-        error: errorRef,
-        /** 手动触发重新渲染（用于错误恢复） */
-        retry: () => {
-            errorRef.value = null;
-            render();
-        }
-    };
-};
-// ============================================================================
-// 内部工具函数
-// ============================================================================
-function resolveSchema(schema) {
-    if (typeof schema === 'function') {
-        return computed(() => {
-            const result = schema();
-            if (result && typeof result === 'object' && 'value' in result && 'effect' in result) {
-                return result.value;
-            }
-            return result;
-        });
-    }
-    if (schema && typeof schema === 'object' && 'value' in schema && 'effect' in schema) {
-        return schema;
-    }
-    return computed(() => schema);
-}
-function isValidSchema(schema) {
-    return schema != null && typeof schema === 'object' && 'type' in schema;
-}
-function buildMethodsRegistry(methods, reactiveState) {
-    if (!methods)
-        return {};
-    const registry = {};
-    for (const [name, fn] of Object.entries(methods)) {
-        const handler = async (ctx, params) => {
-            try {
-                // 调用方法，自动处理同步/异步
-                // ctx 的类型是 RuntimeContext，但 MethodContext 需要 RuntimeContext<TState>
-                // 由于 RuntimeContext 是泛型类型，这里使用类型断言是安全的
-                const methodCtx = ctx;
-                const result = fn({ state: reactiveState, params, event: ctx.$event, ctx: methodCtx });
-                // 自动检测是否为 Promise
-                if (result && typeof result === 'object' && 'then' in result && typeof result.then === 'function') {
-                    // 是 Promise，等待结果
-                    return await result;
-                }
-                // 同步方法，直接返回
-                return result;
-            }
-            catch (error) {
-                // 错误处理：包装为 ServiceError
-                const errorMessage = error instanceof Error ? error.message : String(error);
-                const originalError = error instanceof Error ? error : undefined;
-                // 如果已经是 ServiceError，直接抛出
-                if (error instanceof ServiceError) {
-                    throw error;
-                }
-                // 包装为 ServiceError
-                throw new ServiceError(name, `Method execution failed: ${errorMessage}`, originalError, {
-                    metadata: {
-                        method: name,
-                        params
-                    }
-                });
-            }
-        };
-        // 注册多个别名以支持不同的调用方式
-        registry[name] = handler;
-        registry[`$methods.${name}`] = handler;
-        registry[`methods.${name}`] = handler;
-        registry[`services.${name}`] = handler;
-    }
-    return registry;
-}
-function registerComputed(computedDefs, reactiveState, ctx) {
-    Object.entries(computedDefs).forEach(([key, def]) => {
-        // 支持 Composition 风格（传入 ComputedRef）
-        let cVal;
-        if (def && typeof def === 'object' && 'value' in def && 'effect' in def) {
-            // 已经是 ComputedRef
-            cVal = def;
-        }
-        else {
-            // Options 风格：函数
-            const fn = def;
-            cVal = computed(() => fn(reactiveState));
-        }
-        // 监听计算属性变化，同步到运行时上下文
-        watch(cVal, (val) => {
-            const currentValue = ctx._get(key);
-            // 深度比较，避免不必要的更新
-            if (!isDeepEqual(currentValue, val)) {
-                ctx._set(key, val, { skipCallback: true });
-            }
-        }, { immediate: true });
-        // 将计算属性添加到 state（只读访问）
-        // 使用 configurable: true 允许覆盖已存在的属性
-        Object.defineProperty(reactiveState, key, {
-            get: () => cVal.value,
-            enumerable: true,
-            configurable: true // 允许覆盖，因为 computed 优先级高于初始值
-        });
-    });
-}
-function syncStateToContext(reactiveState, ctx, _options = {}) {
-    for (const key in reactiveState) {
-        if (key.startsWith('$') || key.startsWith('_'))
-            continue;
-        const value = reactiveState[key];
-        const currentValue = ctx._get(key);
-        // 深度比较，避免不必要的更新
-        if (!isDeepEqual(currentValue, value)) {
-            // 使用 skipCallback 避免触发 onStateChange（防止循环）
-            ctx._set(key, value, { skipCallback: true });
-        }
-    }
-}
-/**
- * 深度比较两个值是否相等
- */
-function isDeepEqual(a, b) {
-    if (a === b)
-        return true;
-    if (a == null || b == null)
-        return a === b;
-    if (typeof a !== typeof b)
-        return false;
-    if (Array.isArray(a) && Array.isArray(b)) {
-        if (a.length !== b.length)
-            return false;
-        return a.every((item, index) => isDeepEqual(item, b[index]));
-    }
-    if (typeof a === 'object' && typeof b === 'object') {
-        const keysA = Object.keys(a);
-        const keysB = Object.keys(b);
-        if (keysA.length !== keysB.length)
-            return false;
-        return keysA.every(key => isDeepEqual(a[key], b[key]));
-    }
-    return false;
-}
-/**
- * 规范化 modelPath 配置
- */
-function normalizeModelPathConfig(config) {
-    return {
-        separator: config?.separator ?? '.'
-    };
-}
-function applyBindingConfigs(bindings) {
-    if (!bindings)
-        return;
-    Object.entries(bindings).forEach(([key, config]) => {
-        if (!config)
-            return;
-        if (key.includes(':')) {
-            const [component, modelName] = key.split(':');
-            registerModelConfig(component, config, modelName);
-        }
-        else {
-            registerModelConfig(key, config);
-        }
-    });
-}
-//# sourceMappingURL=composable.js.map
+import{ref as C,reactive as g,computed as x,watch as E,nextTick as R,getCurrentInstance as V,h as v,isReactive as P}from"vue";import{createRuntimeContext as W,invalidateCache as B,setPathValue as M,ServiceError as S}from"@variojs/core";import{VueRenderer as D}from"./renderer.js";import{registerModelConfig as _}from"./bindings.js";import{RefsRegistry as I}from"./features/refs.js";const X=(r,e={})=>{const a=N(r),o=V(),t=e.state?P(e.state)?e.state:g(e.state):g({});H(e.modelBindings);const c=q(e.methods,t);let u=!1;const f=new Set;let l=null;const i=W({},{onEmit:(n,s)=>{e.onEmit?.(n,s)},methods:c,exprOptions:e.exprOptions,onStateChange:(n,s,p)=>{if(!u&&!f.has(n)){u=!0,f.add(n);try{M(t,n,s,{createObject:()=>g({}),createArray:()=>g([]),createIntermediate:!0}),B(n,p),l&&R(l)}finally{f.delete(n),u=!1}}},createObject:()=>g({}),createArray:()=>g([])});for(const n in t){if(n.startsWith("$")||n.startsWith("_"))continue;const s=t[n];i._set(n,s,{skipCallback:!0})}e.computed&&z(e.computed,t,i);const b=C(i),$=G(e.modelPath),j=e.rendererOptions?.refsRegistry||new I,A=new D({...e.rendererOptions,instance:o,app:e.app??e.rendererOptions?.app,components:e.components??e.rendererOptions?.components,getState:()=>t,refsRegistry:j,modelPath:$}),d=C(null),y=C(null),O=e.errorBoundary?.enabled!==!1,m=()=>{y.value&&O&&(y.value=null);try{const n=a.value;if(!T(n)){d.value=null;return}d.value=A.render(n,i)}catch(n){const s=n instanceof Error?n:new Error(String(n));if(O){if(y.value=s,e.errorBoundary?.onRecover)try{e.errorBoundary.onRecover(s)}catch(p){console.warn("Error recovery callback failed:",p)}if(e.errorBoundary?.fallback)try{d.value=e.errorBoundary.fallback(s)}catch{d.value=w(s)}else d.value=w(s)}else d.value=null,e.onError?.(s)}};function w(n){return v("div",{style:{padding:"20px",border:"2px solid #f56565",borderRadius:"4px",backgroundColor:"#fff5f5",color:"#c53030"}},[v("div",{style:{fontWeight:"bold",marginBottom:"10px"}},"\u6E32\u67D3\u9519\u8BEF"),v("div",{style:{marginBottom:"10px"}},n.message),v("button",{onClick:()=>{y.value=null,m()},style:{padding:"8px 16px",backgroundColor:"#4299e1",color:"white",border:"none",borderRadius:"4px",cursor:"pointer"}},"\u91CD\u8BD5")])}l=m,m(),E(a,()=>R(m),{deep:!0,immediate:!1});let k=!1;return E(t,()=>{if(!k){k=!0;try{F(t,i,{skipCallback:!0});for(const n in t)n.startsWith("$")||n.startsWith("_")||B(n,i);R(m)}finally{k=!1}}},{deep:!0,flush:"post",immediate:!1}),{vnode:d,state:t,ctx:b,refs:j.getAll(),error:y,retry:()=>{y.value=null,m()}}};function N(r){return typeof r=="function"?x(()=>{const e=r();return e&&typeof e=="object"&&"value"in e&&"effect"in e?e.value:e}):r&&typeof r=="object"&&"value"in r&&"effect"in r?r:x(()=>r)}function T(r){return r!=null&&typeof r=="object"&&"type"in r}function q(r,e){if(!r)return{};const a={};for(const[o,t]of Object.entries(r)){const c=async(u,f)=>{try{const l=u,i=t({state:e,params:f,event:u.$event,ctx:l});return i&&typeof i=="object"&&"then"in i&&typeof i.then=="function"?await i:i}catch(l){const i=l instanceof Error?l.message:String(l),b=l instanceof Error?l:void 0;throw l instanceof S?l:new S(o,`Method execution failed: ${i}`,b,{metadata:{method:o,params:f}})}};a[o]=c,a[`$methods.${o}`]=c,a[`methods.${o}`]=c,a[`services.${o}`]=c}return a}function z(r,e,a){Object.entries(r).forEach(([o,t])=>{let c;if(t&&typeof t=="object"&&"value"in t&&"effect"in t)c=t;else{const u=t;c=x(()=>u(e))}E(c,u=>{const f=a._get(o);h(f,u)||a._set(o,u,{skipCallback:!0})},{immediate:!0}),Object.defineProperty(e,o,{get:()=>c.value,enumerable:!0,configurable:!0})})}function F(r,e,a={}){for(const o in r){if(o.startsWith("$")||o.startsWith("_"))continue;const t=r[o],c=e._get(o);h(c,t)||e._set(o,t,{skipCallback:!0})}}function h(r,e){if(r===e)return!0;if(r==null||e==null)return r===e;if(typeof r!=typeof e)return!1;if(Array.isArray(r)&&Array.isArray(e))return r.length!==e.length?!1:r.every((a,o)=>h(a,e[o]));if(typeof r=="object"&&typeof e=="object"){const a=Object.keys(r),o=Object.keys(e);return a.length!==o.length?!1:a.every(t=>h(r[t],e[t]))}return!1}function G(r){return{separator:r?.separator??"."}}function H(r){r&&Object.entries(r).forEach(([e,a])=>{if(a)if(e.includes(":")){const[o,t]=e.split(":");_(o,a,t)}else _(e,a)})}export{X as useVario};