From: daiwei Date: Mon, 10 Nov 2025 06:27:43 +0000 (+0800) Subject: chore: Merge branch 'minor' into edison/refactor/vaporUseCssVars X-Git-Url: http://git.ipfire.org/gitweb.cgi?a=commitdiff_plain;h=ca5715e27f50952e3e1ca287587452652372d128;p=thirdparty%2Fvuejs%2Fcore.git chore: Merge branch 'minor' into edison/refactor/vaporUseCssVars --- ca5715e27f50952e3e1ca287587452652372d128 diff --cc packages/compiler-sfc/src/compileScript.ts index 798e746507,022dd2ba02..835daa2fc6 --- a/packages/compiler-sfc/src/compileScript.ts +++ b/packages/compiler-sfc/src/compileScript.ts @@@ -757,9 -823,9 +823,9 @@@ export function compileScript if ( sfc.cssVars.length && // no need to do this when targeting SSR - !options.templateOptions?.ssr + !ssr ) { - ctx.helperImports.add(CSS_VARS_HELPER) + ctx.helperImports.add(getCssVarsHelper(vapor)) ctx.helperImports.add('unref') ctx.s.prependLeft( startOffset, diff --cc packages/runtime-core/src/component.ts index 64ef565e20,2bd8bc6209..5d8f497291 --- a/packages/runtime-core/src/component.ts +++ b/packages/runtime-core/src/component.ts @@@ -662,6 -690,19 +701,7 @@@ export interface ComponentInternalInsta * @internal */ n?: () => Promise - /** - * `updateTeleportCssVars` - * For updating css vars on contained teleports - * @internal - */ - ut?: (vars?: Record) => void - - /** - * dev only. For style v-bind hydration mismatch checks - * @internal - */ - getCssVars?: () => Record + /** * v2 compat only, for caching mutated $options * @internal diff --cc packages/runtime-dom/src/helpers/useCssVars.ts index cbaea4e812,3032143d9a..64ac46ae48 --- a/packages/runtime-dom/src/helpers/useCssVars.ts +++ b/packages/runtime-dom/src/helpers/useCssVars.ts @@@ -18,28 -17,56 +18,30 @@@ export const CSS_VAR_TEXT: unique symbo * Runtime helper for SFC's CSS variable injection feature. * @private */ - export function useCssVars(getter: (ctx: any) => Record): void { + export function useCssVars( + getter: (ctx: any) => Record, + ): void { if (!__BROWSER__ && !__TEST__) return - const instance = getCurrentInstance() - /* v8 ignore start */ - if (!instance) { - __DEV__ && - warn(`useCssVars is called without current active component instance.`) - return - } - /* v8 ignore stop */ - - const updateTeleports = (instance.ut = (vars = getter(instance.proxy)) => { - Array.from( - document.querySelectorAll(`[data-v-owner="${instance.uid}"]`), - ).forEach(node => setVarsOnNode(node, vars)) - }) - - if (__DEV__) { - instance.getCssVars = () => getter(instance.proxy) - } - - const setVars = () => { - const vars = getter(instance.proxy) + const instance = getCurrentInstance()! // to be check in baseUseCssVars + const getVars = () => getter(instance.proxy) + const setVars = (vars: Record) => { if (instance.ce) { setVarsOnNode(instance.ce as any, vars) } else { setVarsOnVNode(instance.subTree, vars) } - updateTeleports(vars) } - // handle cases where child component root is affected - // and triggers reflow in onMounted - onBeforeUpdate(() => { - queuePostFlushCb(setVars) - }) - - onMounted(() => { - // run setVars synchronously here, but run as post-effect on changes - watch(setVars, NOOP, { flush: 'post' }) - const ob = new MutationObserver(setVars) - ob.observe(instance.subTree.el!.parentNode, { childList: true }) - onUnmounted(() => ob.disconnect()) - }) + baseUseCssVars( - instance, ++ instance as GenericComponentInstance, + () => instance.subTree.el!.parentNode!, + getVars, + setVars, + ) } -function setVarsOnVNode(vnode: VNode, vars: Record) { +function setVarsOnVNode(vnode: VNode, vars: Record) { if (__FEATURE_SUSPENSE__ && vnode.shapeFlag & ShapeFlags.SUSPENSE) { const suspense = vnode.suspense! vnode = suspense.activeBranch! diff --cc packages/runtime-dom/src/index.ts index 4287e54c3f,784a32172f..fc3d0524c1 --- a/packages/runtime-dom/src/index.ts +++ b/packages/runtime-dom/src/index.ts @@@ -322,7 -328,53 +328,57 @@@ export { patchStyle } from './modules/s * @internal */ export { shouldSetAsProp } from './patchProp' +/** + * @internal + */ +export { baseUseCssVars, setVarsOnNode } from './helpers/useCssVars' + /** + * @internal + */ + export { + vShowOriginalDisplay, + vShowHidden, + type VShowElement, + } from './directives/vShow' + /** + * @internal + */ + export { + vModelTextInit, + vModelTextUpdate, + vModelCheckboxInit, + vModelCheckboxUpdate, + getValue as vModelGetValue, + vModelSelectInit, + vModelSetSelected, + } from './directives/vModel' + /** + * @internal + */ + export { svgNS } from './nodeOps' + /** + * @internal + */ + export { xlinkNS } from './modules/attrs' + /** + * @internal + */ + export { + resolveTransitionProps, + TransitionPropsValidators, + forceReflow, + type ElementWithTransition, + } from './components/Transition' + /** + * @internal + */ + export { + hasCSSTransform, + callPendingCbs, + handleMovedChildren, + baseApplyTranslation, + } from './components/TransitionGroup' + /** + * @internal + */ + export { unsafeToTrustedHTML } from './nodeOps' diff --cc packages/runtime-vapor/src/index.ts index 8c4bb25d24,c20c624906..e6d0eacaf2 --- a/packages/runtime-vapor/src/index.ts +++ b/packages/runtime-vapor/src/index.ts @@@ -19,9 -36,34 +36,35 @@@ export setProp, setDOMProp, setDynamicProps, + setElementText, } from './dom/prop' - export { on, delegate, delegateEvents, setDynamicEvents } from './dom/event' + export { + on, + delegate, + delegateEvents, + setDynamicEvents, + createInvoker, + } from './dom/event' export { createIf } from './apiCreateIf' - export { createFor } from './apiCreateFor' + export { createKeyedFragment } from './apiCreateFragment' + export { + createFor, + createForSlots, + getRestElement, + getDefaultValue, + } from './apiCreateFor' export { createTemplateRefSetter } from './apiTemplateRef' +export { vaporUseCssVars } from './helpers/useCssVars' + export { createDynamicComponent } from './apiCreateDynamicComponent' + export { applyVShow } from './directives/vShow' + export { + applyTextModel, + applyRadioModel, + applyCheckboxModel, + applySelectModel, + applyDynamicModel, + } from './directives/vModel' + export { withVaporDirectives } from './directives/custom' + export { isFragment, VaporFragment } from './fragment' + export { VaporTransition } from './components/Transition' + export { VaporTransitionGroup } from './components/TransitionGroup'