UNPKG

@kdujs/runtime-core-canary

Version:
1,652 lines (1,641 loc) 252 kB
/** * @kdujs/runtime-core-canary v3.20251208.0 * (c) 2021-present NKDuy * @license MIT **/ import { pauseTracking, resetTracking, isRef, toRaw, shallowReadonly, isShallow, isReactive, ReactiveEffect, getCurrentScope, ref, track, reactive, shallowReactive, trigger, isProxy, proxyRefs, markRaw, EffectScope, computed as computed$1, customRef, isReadonly } from '@kdujs/reactivity'; export { EffectScope, ReactiveEffect, TrackOpTypes, TriggerOpTypes, customRef, effect, effectScope, getCurrentScope, isProxy, isReactive, isReadonly, isRef, isShallow, markRaw, onScopeDispose, proxyRefs, reactive, readonly, ref, shallowReactive, shallowReadonly, shallowRef, stop, toRaw, toRef, toRefs, toValue, triggerRef, unref } from '@kdujs/reactivity'; import { isString, isFunction, isPromise, isArray, NOOP, getGlobalThis, extend, EMPTY_OBJ, toHandlerKey, looseToNumber, hyphenate, camelize, isObject, isOn, hasOwn, isModelListener, capitalize, toNumber, hasChanged, remove, isSet, isMap, isPlainObject, isBuiltInDirective, invokeArrayFns, isRegExp, isGloballyAllowed, NO, isReservedProp, EMPTY_ARR, toRawType, makeMap, def, normalizeClass, stringifyStyle, normalizeStyle, isKnownSvgAttr, isBooleanAttr, isKnownHtmlAttr, includeBooleanAttr, isRenderableAttrValue } from '@kdujs/shared'; export { camelize, capitalize, normalizeClass, normalizeProps, normalizeStyle, toDisplayString, toHandlerKey } from '@kdujs/shared'; const stack = []; function pushWarningContext(knode) { stack.push(knode); } function popWarningContext() { stack.pop(); } function warn$1(msg, ...args) { pauseTracking(); const instance = stack.length ? stack[stack.length - 1].component : null; const appWarnHandler = instance && instance.appContext.config.warnHandler; const trace = getComponentTrace(); if (appWarnHandler) { callWithErrorHandling( appWarnHandler, instance, 11, [ msg + args.map((a) => { var _a, _b; return (_b = (_a = a.toString) == null ? void 0 : _a.call(a)) != null ? _b : JSON.stringify(a); }).join(""), instance && instance.proxy, trace.map( ({ knode }) => `at <${formatComponentName(instance, knode.type)}>` ).join("\n"), trace ] ); } else { const warnArgs = [`[Kdu warn]: ${msg}`, ...args]; if (trace.length && // avoid spamming console during tests true) { warnArgs.push(` `, ...formatTrace(trace)); } console.warn(...warnArgs); } resetTracking(); } function getComponentTrace() { let currentKNode = stack[stack.length - 1]; if (!currentKNode) { return []; } const normalizedStack = []; while (currentKNode) { const last = normalizedStack[0]; if (last && last.knode === currentKNode) { last.recurseCount++; } else { normalizedStack.push({ knode: currentKNode, recurseCount: 0 }); } const parentInstance = currentKNode.component && currentKNode.component.parent; currentKNode = parentInstance && parentInstance.knode; } return normalizedStack; } function formatTrace(trace) { const logs = []; trace.forEach((entry, i) => { logs.push(...i === 0 ? [] : [` `], ...formatTraceEntry(entry)); }); return logs; } function formatTraceEntry({ knode, recurseCount }) { const postfix = recurseCount > 0 ? `... (${recurseCount} recursive calls)` : ``; const isRoot = knode.component ? knode.component.parent == null : false; const open = ` at <${formatComponentName( knode.component, knode.type, isRoot )}`; const close = `>` + postfix; return knode.props ? [open, ...formatProps(knode.props), close] : [open + close]; } function formatProps(props) { const res = []; const keys = Object.keys(props); keys.slice(0, 3).forEach((key) => { res.push(...formatProp(key, props[key])); }); if (keys.length > 3) { res.push(` ...`); } return res; } function formatProp(key, value, raw) { if (isString(value)) { value = JSON.stringify(value); return raw ? value : [`${key}=${value}`]; } else if (typeof value === "number" || typeof value === "boolean" || value == null) { return raw ? value : [`${key}=${value}`]; } else if (isRef(value)) { value = formatProp(key, toRaw(value.value), true); return raw ? value : [`${key}=Ref<`, value, `>`]; } else if (isFunction(value)) { return [`${key}=fn${value.name ? `<${value.name}>` : ``}`]; } else { value = toRaw(value); return raw ? value : [`${key}=`, value]; } } function assertNumber(val, type) { if (!!!(process.env.NODE_ENV !== "production")) return; if (val === void 0) { return; } else if (typeof val !== "number") { warn$1(`${type} is not a valid number - got ${JSON.stringify(val)}.`); } else if (isNaN(val)) { warn$1(`${type} is NaN - the duration expression might be incorrect.`); } } const ErrorCodes = { "SETUP_FUNCTION": 0, "0": "SETUP_FUNCTION", "RENDER_FUNCTION": 1, "1": "RENDER_FUNCTION", "WATCH_GETTER": 2, "2": "WATCH_GETTER", "WATCH_CALLBACK": 3, "3": "WATCH_CALLBACK", "WATCH_CLEANUP": 4, "4": "WATCH_CLEANUP", "NATIVE_EVENT_HANDLER": 5, "5": "NATIVE_EVENT_HANDLER", "COMPONENT_EVENT_HANDLER": 6, "6": "COMPONENT_EVENT_HANDLER", "KNODE_HOOK": 7, "7": "KNODE_HOOK", "DIRECTIVE_HOOK": 8, "8": "DIRECTIVE_HOOK", "TRANSITION_HOOK": 9, "9": "TRANSITION_HOOK", "APP_ERROR_HANDLER": 10, "10": "APP_ERROR_HANDLER", "APP_WARN_HANDLER": 11, "11": "APP_WARN_HANDLER", "FUNCTION_REF": 12, "12": "FUNCTION_REF", "ASYNC_COMPONENT_LOADER": 13, "13": "ASYNC_COMPONENT_LOADER", "SCHEDULER": 14, "14": "SCHEDULER" }; const ErrorTypeStrings$1 = { ["sp"]: "serverPrefetch hook", ["bc"]: "beforeCreate hook", ["c"]: "created hook", ["bm"]: "beforeMount hook", ["m"]: "mounted hook", ["bu"]: "beforeUpdate hook", ["u"]: "updated", ["bum"]: "beforeUnmount hook", ["um"]: "unmounted hook", ["a"]: "activated hook", ["da"]: "deactivated hook", ["ec"]: "errorCaptured hook", ["rtc"]: "renderTracked hook", ["rtg"]: "renderTriggered hook", [0]: "setup function", [1]: "render function", [2]: "watcher getter", [3]: "watcher callback", [4]: "watcher cleanup function", [5]: "native event handler", [6]: "component event handler", [7]: "knode hook", [8]: "directive hook", [9]: "transition hook", [10]: "app errorHandler", [11]: "app warnHandler", [12]: "ref function", [13]: "async component loader", [14]: "scheduler flush. This is likely a Kdu internals bug. Please open an issue at https://kdujs-new-issue.web.app/?repo=kdujs/core" }; function callWithErrorHandling(fn, instance, type, args) { try { return args ? fn(...args) : fn(); } catch (err) { handleError(err, instance, type); } } function callWithAsyncErrorHandling(fn, instance, type, args) { if (isFunction(fn)) { const res = callWithErrorHandling(fn, instance, type, args); if (res && isPromise(res)) { res.catch((err) => { handleError(err, instance, type); }); } return res; } if (isArray(fn)) { const values = []; for (let i = 0; i < fn.length; i++) { values.push(callWithAsyncErrorHandling(fn[i], instance, type, args)); } return values; } else if (!!(process.env.NODE_ENV !== "production")) { warn$1( `Invalid value type passed to callWithAsyncErrorHandling(): ${typeof fn}` ); } } function handleError(err, instance, type, throwInDev = true) { const contextKNode = instance ? instance.knode : null; if (instance) { let cur = instance.parent; const exposedInstance = instance.proxy; const errorInfo = !!(process.env.NODE_ENV !== "production") ? ErrorTypeStrings$1[type] : `https://kdu-js.web.app/error-reference/#runtime-${type}`; while (cur) { const errorCapturedHooks = cur.ec; if (errorCapturedHooks) { for (let i = 0; i < errorCapturedHooks.length; i++) { if (errorCapturedHooks[i](err, exposedInstance, errorInfo) === false) { return; } } } cur = cur.parent; } const appErrorHandler = instance.appContext.config.errorHandler; if (appErrorHandler) { pauseTracking(); callWithErrorHandling( appErrorHandler, null, 10, [err, exposedInstance, errorInfo] ); resetTracking(); return; } } logError(err, type, contextKNode, throwInDev); } function logError(err, type, contextKNode, throwInDev = true) { if (!!(process.env.NODE_ENV !== "production")) { const info = ErrorTypeStrings$1[type]; if (contextKNode) { pushWarningContext(contextKNode); } warn$1(`Unhandled error${info ? ` during execution of ${info}` : ``}`); if (contextKNode) { popWarningContext(); } if (throwInDev) { throw err; } else { console.error(err); } } else { console.error(err); } } let isFlushing = false; let isFlushPending = false; const queue = []; let flushIndex = 0; const pendingPostFlushCbs = []; let activePostFlushCbs = null; let postFlushIndex = 0; const resolvedPromise = /* @__PURE__ */ Promise.resolve(); let currentFlushPromise = null; const RECURSION_LIMIT = 100; function nextTick(fn) { const p = currentFlushPromise || resolvedPromise; return fn ? p.then(this ? fn.bind(this) : fn) : p; } function findInsertionIndex(id) { let start = flushIndex + 1; let end = queue.length; while (start < end) { const middle = start + end >>> 1; const middleJob = queue[middle]; const middleJobId = getId(middleJob); if (middleJobId < id || middleJobId === id && middleJob.pre) { start = middle + 1; } else { end = middle; } } return start; } function queueJob(job) { if (!queue.length || !queue.includes( job, isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex )) { if (job.id == null) { queue.push(job); } else { queue.splice(findInsertionIndex(job.id), 0, job); } queueFlush(); } } function queueFlush() { if (!isFlushing && !isFlushPending) { isFlushPending = true; currentFlushPromise = resolvedPromise.then(flushJobs); } } function invalidateJob(job) { const i = queue.indexOf(job); if (i > flushIndex) { queue.splice(i, 1); } } function queuePostFlushCb(cb) { if (!isArray(cb)) { if (!activePostFlushCbs || !activePostFlushCbs.includes( cb, cb.allowRecurse ? postFlushIndex + 1 : postFlushIndex )) { pendingPostFlushCbs.push(cb); } } else { pendingPostFlushCbs.push(...cb); } queueFlush(); } function flushPreFlushCbs(instance, seen, i = isFlushing ? flushIndex + 1 : 0) { if (!!(process.env.NODE_ENV !== "production")) { seen = seen || /* @__PURE__ */ new Map(); } for (; i < queue.length; i++) { const cb = queue[i]; if (cb && cb.pre) { if (instance && cb.id !== instance.uid) { continue; } if (!!(process.env.NODE_ENV !== "production") && checkRecursiveUpdates(seen, cb)) { continue; } queue.splice(i, 1); i--; cb(); } } } function flushPostFlushCbs(seen) { if (pendingPostFlushCbs.length) { const deduped = [...new Set(pendingPostFlushCbs)].sort( (a, b) => getId(a) - getId(b) ); pendingPostFlushCbs.length = 0; if (activePostFlushCbs) { activePostFlushCbs.push(...deduped); return; } activePostFlushCbs = deduped; if (!!(process.env.NODE_ENV !== "production")) { seen = seen || /* @__PURE__ */ new Map(); } for (postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++) { if (!!(process.env.NODE_ENV !== "production") && checkRecursiveUpdates(seen, activePostFlushCbs[postFlushIndex])) { continue; } activePostFlushCbs[postFlushIndex](); } activePostFlushCbs = null; postFlushIndex = 0; } } const getId = (job) => job.id == null ? Infinity : job.id; const comparator = (a, b) => { const diff = getId(a) - getId(b); if (diff === 0) { if (a.pre && !b.pre) return -1; if (b.pre && !a.pre) return 1; } return diff; }; function flushJobs(seen) { isFlushPending = false; isFlushing = true; if (!!(process.env.NODE_ENV !== "production")) { seen = seen || /* @__PURE__ */ new Map(); } queue.sort(comparator); const check = !!(process.env.NODE_ENV !== "production") ? (job) => checkRecursiveUpdates(seen, job) : NOOP; try { for (flushIndex = 0; flushIndex < queue.length; flushIndex++) { const job = queue[flushIndex]; if (job && job.active !== false) { if (!!(process.env.NODE_ENV !== "production") && check(job)) { continue; } callWithErrorHandling(job, null, 14); } } } finally { flushIndex = 0; queue.length = 0; flushPostFlushCbs(seen); isFlushing = false; currentFlushPromise = null; if (queue.length || pendingPostFlushCbs.length) { flushJobs(seen); } } } function checkRecursiveUpdates(seen, fn) { if (!seen.has(fn)) { seen.set(fn, 1); } else { const count = seen.get(fn); if (count > RECURSION_LIMIT) { const instance = fn.ownerInstance; const componentName = instance && getComponentName(instance.type); handleError( `Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.`, null, 10 ); return true; } else { seen.set(fn, count + 1); } } } let isHmrUpdating = false; const hmrDirtyComponents = /* @__PURE__ */ new Set(); if (!!(process.env.NODE_ENV !== "production")) { getGlobalThis().__KDU_HMR_RUNTIME__ = { createRecord: tryWrap(createRecord), rerender: tryWrap(rerender), reload: tryWrap(reload) }; } const map = /* @__PURE__ */ new Map(); function registerHMR(instance) { const id = instance.type.__hmrId; let record = map.get(id); if (!record) { createRecord(id, instance.type); record = map.get(id); } record.instances.add(instance); } function unregisterHMR(instance) { map.get(instance.type.__hmrId).instances.delete(instance); } function createRecord(id, initialDef) { if (map.has(id)) { return false; } map.set(id, { initialDef: normalizeClassComponent(initialDef), instances: /* @__PURE__ */ new Set() }); return true; } function normalizeClassComponent(component) { return isClassComponent(component) ? component.__kccOpts : component; } function rerender(id, newRender) { const record = map.get(id); if (!record) { return; } record.initialDef.render = newRender; [...record.instances].forEach((instance) => { if (newRender) { instance.render = newRender; normalizeClassComponent(instance.type).render = newRender; } instance.renderCache = []; isHmrUpdating = true; instance.effect.dirty = true; instance.update(); isHmrUpdating = false; }); } function reload(id, newComp) { const record = map.get(id); if (!record) return; newComp = normalizeClassComponent(newComp); updateComponentDef(record.initialDef, newComp); const instances = [...record.instances]; for (const instance of instances) { const oldComp = normalizeClassComponent(instance.type); if (!hmrDirtyComponents.has(oldComp)) { if (oldComp !== record.initialDef) { updateComponentDef(oldComp, newComp); } hmrDirtyComponents.add(oldComp); } instance.appContext.propsCache.delete(instance.type); instance.appContext.emitsCache.delete(instance.type); instance.appContext.optionsCache.delete(instance.type); if (instance.ceReload) { hmrDirtyComponents.add(oldComp); instance.ceReload(newComp.styles); hmrDirtyComponents.delete(oldComp); } else if (instance.parent) { instance.parent.effect.dirty = true; queueJob(instance.parent.update); } else if (instance.appContext.reload) { instance.appContext.reload(); } else if (typeof window !== "undefined") { window.location.reload(); } else { console.warn( "[HMR] Root or manually mounted instance modified. Full reload required." ); } } queuePostFlushCb(() => { for (const instance of instances) { hmrDirtyComponents.delete( normalizeClassComponent(instance.type) ); } }); } function updateComponentDef(oldComp, newComp) { extend(oldComp, newComp); for (const key in oldComp) { if (key !== "__file" && !(key in newComp)) { delete oldComp[key]; } } } function tryWrap(fn) { return (id, arg) => { try { return fn(id, arg); } catch (e) { console.error(e); console.warn( `[HMR] Something went wrong during Kdu component hot-reload. Full reload required.` ); } }; } let devtools$1; let buffer = []; let devtoolsNotInstalled = false; function emit$1(event, ...args) { if (devtools$1) { devtools$1.emit(event, ...args); } else if (!devtoolsNotInstalled) { buffer.push({ event, args }); } } function setDevtoolsHook$1(hook, target) { var _a, _b; devtools$1 = hook; if (devtools$1) { devtools$1.enabled = true; buffer.forEach(({ event, args }) => devtools$1.emit(event, ...args)); buffer = []; } else if ( // handle late devtools injection - only do this if we are in an actual // browser environment to avoid the timer handle stalling test runner exit // (#4815) typeof window !== "undefined" && // some envs mock window but not fully window.HTMLElement && // also exclude jsdom !((_b = (_a = window.navigator) == null ? void 0 : _a.userAgent) == null ? void 0 : _b.includes("jsdom")) ) { const replay = target.__KDU_DEVTOOLS_HOOK_REPLAY__ = target.__KDU_DEVTOOLS_HOOK_REPLAY__ || []; replay.push((newHook) => { setDevtoolsHook$1(newHook, target); }); setTimeout(() => { if (!devtools$1) { target.__KDU_DEVTOOLS_HOOK_REPLAY__ = null; devtoolsNotInstalled = true; buffer = []; } }, 3e3); } else { devtoolsNotInstalled = true; buffer = []; } } function devtoolsInitApp(app, version) { emit$1("app:init" /* APP_INIT */, app, version, { Fragment, Text, Comment, Static }); } function devtoolsUnmountApp(app) { emit$1("app:unmount" /* APP_UNMOUNT */, app); } const devtoolsComponentAdded = /* @__PURE__ */ createDevtoolsComponentHook( "component:added" /* COMPONENT_ADDED */ ); const devtoolsComponentUpdated = /* @__PURE__ */ createDevtoolsComponentHook("component:updated" /* COMPONENT_UPDATED */); const _devtoolsComponentRemoved = /* @__PURE__ */ createDevtoolsComponentHook( "component:removed" /* COMPONENT_REMOVED */ ); const devtoolsComponentRemoved = (component) => { if (devtools$1 && typeof devtools$1.cleanupBuffer === "function" && // remove the component if it wasn't buffered !devtools$1.cleanupBuffer(component)) { _devtoolsComponentRemoved(component); } }; /*! #__NO_SIDE_EFFECTS__ */ // @__NO_SIDE_EFFECTS__ function createDevtoolsComponentHook(hook) { return (component) => { emit$1( hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : void 0, component ); }; } const devtoolsPerfStart = /* @__PURE__ */ createDevtoolsPerformanceHook( "perf:start" /* PERFORMANCE_START */ ); const devtoolsPerfEnd = /* @__PURE__ */ createDevtoolsPerformanceHook( "perf:end" /* PERFORMANCE_END */ ); function createDevtoolsPerformanceHook(hook) { return (component, type, time) => { emit$1(hook, component.appContext.app, component.uid, component, type, time); }; } function devtoolsComponentEmit(component, event, params) { emit$1( "component:emit" /* COMPONENT_EMIT */, component.appContext.app, component, event, params ); } function emit(instance, event, ...rawArgs) { if (instance.isUnmounted) return; const props = instance.knode.props || EMPTY_OBJ; if (!!(process.env.NODE_ENV !== "production")) { const { emitsOptions, propsOptions: [propsOptions] } = instance; if (emitsOptions) { if (!(event in emitsOptions) && true) { if (!propsOptions || !(toHandlerKey(event) in propsOptions)) { warn$1( `Component emitted event "${event}" but it is neither declared in the emits option nor as an "${toHandlerKey(event)}" prop.` ); } } else { const validator = emitsOptions[event]; if (isFunction(validator)) { const isValid = validator(...rawArgs); if (!isValid) { warn$1( `Invalid event arguments: event validation failed for event "${event}".` ); } } } } } let args = rawArgs; const isModelListener = event.startsWith("update:"); const modelArg = isModelListener && event.slice(7); if (modelArg && modelArg in props) { const modifiersKey = `${modelArg === "modelValue" ? "model" : modelArg}Modifiers`; const { number, trim } = props[modifiersKey] || EMPTY_OBJ; if (trim) { args = rawArgs.map((a) => isString(a) ? a.trim() : a); } if (number) { args = rawArgs.map(looseToNumber); } } if (!!(process.env.NODE_ENV !== "production") || __KDU_PROD_DEVTOOLS__) { devtoolsComponentEmit(instance, event, args); } if (!!(process.env.NODE_ENV !== "production")) { const lowerCaseEvent = event.toLowerCase(); if (lowerCaseEvent !== event && props[toHandlerKey(lowerCaseEvent)]) { warn$1( `Event "${lowerCaseEvent}" is emitted in component ${formatComponentName( instance, instance.type )} but the handler is registered for "${event}". Note that HTML attributes are case-insensitive and you cannot use k-on to listen to camelCase events when using in-DOM templates. You should probably use "${hyphenate( event )}" instead of "${event}".` ); } } let handlerName; let handler = props[handlerName = toHandlerKey(event)] || // also try camelCase event handler (#2249) props[handlerName = toHandlerKey(camelize(event))]; if (!handler && isModelListener) { handler = props[handlerName = toHandlerKey(hyphenate(event))]; } if (handler) { callWithAsyncErrorHandling( handler, instance, 6, args ); } const onceHandler = props[handlerName + `Once`]; if (onceHandler) { if (!instance.emitted) { instance.emitted = {}; } else if (instance.emitted[handlerName]) { return; } instance.emitted[handlerName] = true; callWithAsyncErrorHandling( onceHandler, instance, 6, args ); } } function normalizeEmitsOptions(comp, appContext, asMixin = false) { const cache = appContext.emitsCache; const cached = cache.get(comp); if (cached !== void 0) { return cached; } const raw = comp.emits; let normalized = {}; let hasExtends = false; if (__KDU_OPTIONS_API__ && !isFunction(comp)) { const extendEmits = (raw2) => { const normalizedFromExtend = normalizeEmitsOptions(raw2, appContext, true); if (normalizedFromExtend) { hasExtends = true; extend(normalized, normalizedFromExtend); } }; if (!asMixin && appContext.mixins.length) { appContext.mixins.forEach(extendEmits); } if (comp.extends) { extendEmits(comp.extends); } if (comp.mixins) { comp.mixins.forEach(extendEmits); } } if (!raw && !hasExtends) { if (isObject(comp)) { cache.set(comp, null); } return null; } if (isArray(raw)) { raw.forEach((key) => normalized[key] = null); } else { extend(normalized, raw); } if (isObject(comp)) { cache.set(comp, normalized); } return normalized; } function isEmitListener(options, key) { if (!options || !isOn(key)) { return false; } key = key.slice(2).replace(/Once$/, ""); return hasOwn(options, key[0].toLowerCase() + key.slice(1)) || hasOwn(options, hyphenate(key)) || hasOwn(options, key); } let currentRenderingInstance = null; let currentScopeId = null; function setCurrentRenderingInstance(instance) { const prev = currentRenderingInstance; currentRenderingInstance = instance; currentScopeId = instance && instance.type.__scopeId || null; return prev; } function pushScopeId(id) { currentScopeId = id; } function popScopeId() { currentScopeId = null; } const withScopeId = (_id) => withCtx; function withCtx(fn, ctx = currentRenderingInstance, isNonScopedSlot) { if (!ctx) return fn; if (fn._n) { return fn; } const renderFnWithContext = (...args) => { if (renderFnWithContext._d) { setBlockTracking(-1); } const prevInstance = setCurrentRenderingInstance(ctx); let res; try { res = fn(...args); } finally { setCurrentRenderingInstance(prevInstance); if (renderFnWithContext._d) { setBlockTracking(1); } } if (!!(process.env.NODE_ENV !== "production") || __KDU_PROD_DEVTOOLS__) { devtoolsComponentUpdated(ctx); } return res; }; renderFnWithContext._n = true; renderFnWithContext._c = true; renderFnWithContext._d = true; return renderFnWithContext; } let accessedAttrs = false; function markAttrsAccessed() { accessedAttrs = true; } function renderComponentRoot(instance) { const { type: Component, knode, proxy, withProxy, propsOptions: [propsOptions], slots, attrs, emit, render, renderCache, props, data, setupState, ctx, inheritAttrs } = instance; const prev = setCurrentRenderingInstance(instance); let result; let fallthroughAttrs; if (!!(process.env.NODE_ENV !== "production")) { accessedAttrs = false; } try { if (knode.shapeFlag & 4) { const proxyToUse = withProxy || proxy; const thisProxy = !!(process.env.NODE_ENV !== "production") && setupState.__isScriptSetup ? new Proxy(proxyToUse, { get(target, key, receiver) { warn$1( `Property '${String( key )}' was accessed via 'this'. Avoid using 'this' in templates.` ); return Reflect.get(target, key, receiver); } }) : proxyToUse; result = normalizeKNode( render.call( thisProxy, proxyToUse, renderCache, !!(process.env.NODE_ENV !== "production") ? shallowReadonly(props) : props, setupState, data, ctx ) ); fallthroughAttrs = attrs; } else { const render2 = Component; if (!!(process.env.NODE_ENV !== "production") && attrs === props) { markAttrsAccessed(); } result = normalizeKNode( render2.length > 1 ? render2( !!(process.env.NODE_ENV !== "production") ? shallowReadonly(props) : props, !!(process.env.NODE_ENV !== "production") ? { get attrs() { markAttrsAccessed(); return shallowReadonly(attrs); }, slots, emit } : { attrs, slots, emit } ) : render2( !!(process.env.NODE_ENV !== "production") ? shallowReadonly(props) : props, null ) ); fallthroughAttrs = Component.props ? attrs : getFunctionalFallthrough(attrs); } } catch (err) { blockStack.length = 0; handleError(err, instance, 1); result = createKNode(Comment); } let root = result; let setRoot = void 0; if (!!(process.env.NODE_ENV !== "production") && result.patchFlag > 0 && result.patchFlag & 2048) { [root, setRoot] = getChildRoot(result); } if (fallthroughAttrs && inheritAttrs !== false) { const keys = Object.keys(fallthroughAttrs); const { shapeFlag } = root; if (keys.length) { if (shapeFlag & (1 | 6)) { if (propsOptions && keys.some(isModelListener)) { fallthroughAttrs = filterModelListeners( fallthroughAttrs, propsOptions ); } root = cloneKNode(root, fallthroughAttrs, false, true); } else if (!!(process.env.NODE_ENV !== "production") && !accessedAttrs && root.type !== Comment) { const allAttrs = Object.keys(attrs); const eventAttrs = []; const extraAttrs = []; for (let i = 0, l = allAttrs.length; i < l; i++) { const key = allAttrs[i]; if (isOn(key)) { if (!isModelListener(key)) { eventAttrs.push(key[2].toLowerCase() + key.slice(3)); } } else { extraAttrs.push(key); } } if (extraAttrs.length) { warn$1( `Extraneous non-props attributes (${extraAttrs.join(", ")}) were passed to component but could not be automatically inherited because component renders fragment or text root nodes.` ); } if (eventAttrs.length) { warn$1( `Extraneous non-emits event listeners (${eventAttrs.join(", ")}) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. If the listener is intended to be a component custom event listener only, declare it using the "emits" option.` ); } } } } if (knode.dirs) { if (!!(process.env.NODE_ENV !== "production") && !isElementRoot(root)) { warn$1( `Runtime directive used on component with non-element root node. The directives will not function as intended.` ); } root = cloneKNode(root, null, false, true); root.dirs = root.dirs ? root.dirs.concat(knode.dirs) : knode.dirs; } if (knode.transition) { if (!!(process.env.NODE_ENV !== "production") && !isElementRoot(root)) { warn$1( `Component inside <Transition> renders non-element root node that cannot be animated.` ); } root.transition = knode.transition; } if (!!(process.env.NODE_ENV !== "production") && setRoot) { setRoot(root); } else { result = root; } setCurrentRenderingInstance(prev); return result; } const getChildRoot = (knode) => { const rawChildren = knode.children; const dynamicChildren = knode.dynamicChildren; const childRoot = filterSingleRoot(rawChildren, false); if (!childRoot) { return [knode, void 0]; } else if (!!(process.env.NODE_ENV !== "production") && childRoot.patchFlag > 0 && childRoot.patchFlag & 2048) { return getChildRoot(childRoot); } const index = rawChildren.indexOf(childRoot); const dynamicIndex = dynamicChildren ? dynamicChildren.indexOf(childRoot) : -1; const setRoot = (updatedRoot) => { rawChildren[index] = updatedRoot; if (dynamicChildren) { if (dynamicIndex > -1) { dynamicChildren[dynamicIndex] = updatedRoot; } else if (updatedRoot.patchFlag > 0) { knode.dynamicChildren = [...dynamicChildren, updatedRoot]; } } }; return [normalizeKNode(childRoot), setRoot]; }; function filterSingleRoot(children, recurse = true) { let singleRoot; for (let i = 0; i < children.length; i++) { const child = children[i]; if (isKNode(child)) { if (child.type !== Comment || child.children === "k-if") { if (singleRoot) { return; } else { singleRoot = child; if (!!(process.env.NODE_ENV !== "production") && recurse && singleRoot.patchFlag > 0 && singleRoot.patchFlag & 2048) { return filterSingleRoot(singleRoot.children); } } } } else { return; } } return singleRoot; } const getFunctionalFallthrough = (attrs) => { let res; for (const key in attrs) { if (key === "class" || key === "style" || isOn(key)) { (res || (res = {}))[key] = attrs[key]; } } return res; }; const filterModelListeners = (attrs, props) => { const res = {}; for (const key in attrs) { if (!isModelListener(key) || !(key.slice(9) in props)) { res[key] = attrs[key]; } } return res; }; const isElementRoot = (knode) => { return knode.shapeFlag & (6 | 1) || knode.type === Comment; }; function shouldUpdateComponent(prevKNode, nextKNode, optimized) { const { props: prevProps, children: prevChildren, component } = prevKNode; const { props: nextProps, children: nextChildren, patchFlag } = nextKNode; const emits = component.emitsOptions; if (!!(process.env.NODE_ENV !== "production") && (prevChildren || nextChildren) && isHmrUpdating) { return true; } if (nextKNode.dirs || nextKNode.transition) { return true; } if (optimized && patchFlag >= 0) { if (patchFlag & 1024) { return true; } if (patchFlag & 16) { if (!prevProps) { return !!nextProps; } return hasPropsChanged(prevProps, nextProps, emits); } else if (patchFlag & 8) { const dynamicProps = nextKNode.dynamicProps; for (let i = 0; i < dynamicProps.length; i++) { const key = dynamicProps[i]; if (nextProps[key] !== prevProps[key] && !isEmitListener(emits, key)) { return true; } } } } else { if (prevChildren || nextChildren) { if (!nextChildren || !nextChildren.$stable) { return true; } } if (prevProps === nextProps) { return false; } if (!prevProps) { return !!nextProps; } if (!nextProps) { return true; } return hasPropsChanged(prevProps, nextProps, emits); } return false; } function hasPropsChanged(prevProps, nextProps, emitsOptions) { const nextKeys = Object.keys(nextProps); if (nextKeys.length !== Object.keys(prevProps).length) { return true; } for (let i = 0; i < nextKeys.length; i++) { const key = nextKeys[i]; if (nextProps[key] !== prevProps[key] && !isEmitListener(emitsOptions, key)) { return true; } } return false; } function updateHOCHostEl({ knode, parent }, el) { while (parent) { const root = parent.subTree; if (root.suspense && root.suspense.activeBranch === knode) { root.el = knode.el; } if (root === knode) { (knode = parent.knode).el = el; parent = parent.parent; } else { break; } } } const COMPONENTS = "components"; const DIRECTIVES = "directives"; function resolveComponent(name, maybeSelfReference) { return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name; } const NULL_DYNAMIC_COMPONENT = Symbol.for("k-ndc"); function resolveDynamicComponent(component) { if (isString(component)) { return resolveAsset(COMPONENTS, component, false) || component; } else { return component || NULL_DYNAMIC_COMPONENT; } } function resolveDirective(name) { return resolveAsset(DIRECTIVES, name); } function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) { const instance = currentRenderingInstance || currentInstance; if (instance) { const Component = instance.type; if (type === COMPONENTS) { const selfName = getComponentName( Component, false ); if (selfName && (selfName === name || selfName === camelize(name) || selfName === capitalize(camelize(name)))) { return Component; } } const res = ( // local registration // check instance[type] first which is resolved for options API resolve(instance[type] || Component[type], name) || // global registration resolve(instance.appContext[type], name) ); if (!res && maybeSelfReference) { return Component; } if (!!(process.env.NODE_ENV !== "production") && warnMissing && !res) { const extra = type === COMPONENTS ? ` If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.` : ``; warn$1(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`); } return res; } else if (!!(process.env.NODE_ENV !== "production")) { warn$1( `resolve${capitalize(type.slice(0, -1))} can only be used in render() or setup().` ); } } function resolve(registry, name) { return registry && (registry[name] || registry[camelize(name)] || registry[capitalize(camelize(name))]); } const isSuspense = (type) => type.__isSuspense; let suspenseId = 0; const SuspenseImpl = { name: "Suspense", // In order to make Suspense tree-shakable, we need to avoid importing it // directly in the renderer. The renderer checks for the __isSuspense flag // on a knode's type and calls the `process` method, passing in renderer // internals. __isSuspense: true, process(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals) { if (n1 == null) { mountSuspense( n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals ); } else { if (parentSuspense && parentSuspense.deps > 0 && !n1.suspense.isInFallback) { n2.suspense = n1.suspense; n2.suspense.knode = n2; n2.el = n1.el; return; } patchSuspense( n1, n2, container, anchor, parentComponent, namespace, slotScopeIds, optimized, rendererInternals ); } }, hydrate: hydrateSuspense, create: createSuspenseBoundary, normalize: normalizeSuspenseChildren }; const Suspense = SuspenseImpl ; function triggerEvent(knode, name) { const eventListener = knode.props && knode.props[name]; if (isFunction(eventListener)) { eventListener(); } } function mountSuspense(knode, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals) { const { p: patch, o: { createElement } } = rendererInternals; const hiddenContainer = createElement("div"); const suspense = knode.suspense = createSuspenseBoundary( knode, parentSuspense, parentComponent, container, hiddenContainer, anchor, namespace, slotScopeIds, optimized, rendererInternals ); patch( null, suspense.pendingBranch = knode.ssContent, hiddenContainer, null, parentComponent, suspense, namespace, slotScopeIds ); if (suspense.deps > 0) { triggerEvent(knode, "onPending"); triggerEvent(knode, "onFallback"); patch( null, knode.ssFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context namespace, slotScopeIds ); setActiveBranch(suspense, knode.ssFallback); } else { suspense.resolve(false, true); } } function patchSuspense(n1, n2, container, anchor, parentComponent, namespace, slotScopeIds, optimized, { p: patch, um: unmount, o: { createElement } }) { const suspense = n2.suspense = n1.suspense; suspense.knode = n2; n2.el = n1.el; const newBranch = n2.ssContent; const newFallback = n2.ssFallback; const { activeBranch, pendingBranch, isInFallback, isHydrating } = suspense; if (pendingBranch) { suspense.pendingBranch = newBranch; if (isSameKNodeType(newBranch, pendingBranch)) { patch( pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, namespace, slotScopeIds, optimized ); if (suspense.deps <= 0) { suspense.resolve(); } else if (isInFallback) { if (!isHydrating) { patch( activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context namespace, slotScopeIds, optimized ); setActiveBranch(suspense, newFallback); } } } else { suspense.pendingId = suspenseId++; if (isHydrating) { suspense.isHydrating = false; suspense.activeBranch = pendingBranch; } else { unmount(pendingBranch, parentComponent, suspense); } suspense.deps = 0; suspense.effects.length = 0; suspense.hiddenContainer = createElement("div"); if (isInFallback) { patch( null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, namespace, slotScopeIds, optimized ); if (suspense.deps <= 0) { suspense.resolve(); } else { patch( activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context namespace, slotScopeIds, optimized ); setActiveBranch(suspense, newFallback); } } else if (activeBranch && isSameKNodeType(newBranch, activeBranch)) { patch( activeBranch, newBranch, container, anchor, parentComponent, suspense, namespace, slotScopeIds, optimized ); suspense.resolve(true); } else { patch( null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, namespace, slotScopeIds, optimized ); if (suspense.deps <= 0) { suspense.resolve(); } } } } else { if (activeBranch && isSameKNodeType(newBranch, activeBranch)) { patch( activeBranch, newBranch, container, anchor, parentComponent, suspense, namespace, slotScopeIds, optimized ); setActiveBranch(suspense, newBranch); } else { triggerEvent(n2, "onPending"); suspense.pendingBranch = newBranch; if (newBranch.shapeFlag & 512) { suspense.pendingId = newBranch.component.suspenseId; } else { suspense.pendingId = suspenseId++; } patch( null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, namespace, slotScopeIds, optimized ); if (suspense.deps <= 0) { suspense.resolve(); } else { const { timeout, pendingId } = suspense; if (timeout > 0) { setTimeout(() => { if (suspense.pendingId === pendingId) { suspense.fallback(newFallback); } }, timeout); } else if (timeout === 0) { suspense.fallback(newFallback); } } } } } let hasWarned = false; function createSuspenseBoundary(knode, parentSuspense, parentComponent, container, hiddenContainer, anchor, namespace, slotScopeIds, optimized, rendererInternals, isHydrating = false) { if (!!(process.env.NODE_ENV !== "production") && true && !hasWarned) { hasWarned = true; console[console.info ? "info" : "log"]( `<Suspense> is an experimental feature and its API will likely change.` ); } const { p: patch, m: move, um: unmount, n: next, o: { parentNode, remove } } = rendererInternals; let parentSuspenseId; const isSuspensible = isKNodeSuspensible(knode); if (isSuspensible) { if (parentSuspense && parentSuspense.pendingBranch) { parentSuspenseId = parentSuspense.pendingId; parentSuspense.deps++; } } const timeout = knode.props ? toNumber(knode.props.timeout) : void 0; if (!!(process.env.NODE_ENV !== "production")) { assertNumber(timeout, `Suspense timeout`); } const initialAnchor = anchor; const suspense = { knode, parent: parentSuspense, parentComponent, namespace, container, hiddenContainer, deps: 0, pendingId: suspenseId++, timeout: typeof timeout === "number" ? timeout : -1, activeBranch: null, pendingBranch: null, isInFallback: !isHydrating, isHydrating, isUnmounted: false, effects: [], resolve(resume = false, sync = false) { if (!!(process.env.NODE_ENV !== "production")) { if (!resume && !suspense.pendingBranch) { throw new Error( `suspense.resolve() is called without a pending branch.` ); } if (suspense.isUnmounted) { throw new Error( `suspense.resolve() is called on an already unmounted suspense boundary.` ); } } const { knode: knode2, activeBranch, pendingBranch, pendingId, effects, parentComponent: parentComponent2, container: container2 } = suspense; let delayEnter = false; if (suspense.isHydrating) { suspense.isHydrating = false; } else if (!resume) { delayEnter = activeBranch && pendingBranch.transition && pendingBranch.transition.mode === "out-in"; if (delayEnter) { activeBranch.transition.afterLeave = () => { if (pendingId === suspense.pendingId) { move( pendingBranch, container2, anchor === initialAnchor ? next(activeBranch) : anchor, 0 ); queuePostFlushCb(effects); } }; } if (activeBranch) { if (parentNode(activeBranch.el) !== suspense.hiddenContainer) { anchor = next(activeBranch); } unmount(activeBranch, parentComponent2, suspense, true); } if (!delayEnter) { move(pendingBranch, container2, anchor, 0); } } setActiveBranch(suspense, pendingBranch); suspense.pendingBranch = null; suspense.isInFallback = false; let parent = suspense.parent; let hasUnresolvedAncestor = false; while (parent) { if (parent.pendingBranch) { parent.effects.push(...effects); hasUnresolvedAncestor = true; break; } parent = parent.parent; } if (!hasUnresolvedAncestor && !delayEnter) { queuePostFlushCb(effects); } suspense.effects = []; if (isSuspensible) { if (parentSuspense && parentSuspense.pendingBranch && parentSuspenseId === parentSuspense.pendingId) { parentSuspense.deps--; if (parentSuspense.deps === 0 && !sync) { parentSuspense.resolve(); } } } triggerEvent(knode2, "onResolve"); }, fallback(fallbackKNode) { if (!suspense.pendingBranch) { return; } const { knode: knode2, activeBranch, parentComponent: parentComponent2, container: container2, namespace: namespace2 } = suspense; triggerEvent(knode2, "onFallback"); const anchor2 = next(activeBranch); const mountFallback = () => { if (!suspense.isInFallback) { return; } patch( null, fallbackKNode, container2, anchor2, parentComponent2, null, // fallback tree will not have suspense context namespace2, slotScopeIds, optimized ); setActiveBranch(suspense, fallbackKNode); }; const delayEnter = fallbackKNode.transition && fallbackKNode.transition.mode === "out-in"; if (delayEnter) { activeBranch.transition.afterLeave = mountFallback; } suspense.isInFallback = true; unmount( activeBranch, parentComponent2, null, // no suspense so unmount hooks fire now true // shouldRemove ); if (!delayEnter) { mountFallback(); } }, move(container2, anchor2, type) { suspense.activeBranch && move(suspense.activeBranch, container2, anchor2, type); suspense.container = container2; }, next() { return suspense.activeBranch && next(suspense.activeBranch); }, registerDep(instance, setupRenderEffect) { const isInPendingSuspense = !!suspense.pendingBranch; if (isInPendingSuspense) { suspense.deps++; } const hydratedEl = instance.knode.el; instance.asyncDep.catch((err) => { handleError(err, instance, 0); }).then((asyncSetupResult) => { if (instance.isUnmounted || suspense.isUnmounted || suspense.pendingId !== instance.suspenseId) { return; } instance.asyncResolved = true; const { knode: knode2 } = instance; if (!!(process.env.NODE_ENV !== "production")) { pushWarningContext(knode2); } handleSetupResult(instance, asyncSetupResult, false); if (hydratedEl) { knode2.el = hydratedEl; } const placeholder = !hydratedEl && instance.subTree.el; setupRenderEffect( instance, knode2, // component may have been moved before resolve. // if this is not a hydration, instance.subTree will be the comment // placeholder. parentNode(hydratedEl || instance.subTree.el), // anchor will not be used if this is hydration, so only need to // consider the comment placeholder case. hydratedEl ? null : next(instance.subTree), suspense, namespace, optimized ); if (placeholder) { remove(placeholder); }