@vue/compat 3.2.43 → 3.2.45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2123,12 +2123,6 @@ function reload(id, newComp) {
2123
2123
  // components to be unmounted and re-mounted. Queue the update so that we
2124
2124
  // don't end up forcing the same parent to re-render multiple times.
2125
2125
  queueJob(instance.parent.update);
2126
- // instance is the inner component of an async custom element
2127
- // invoke to reset styles
2128
- if (instance.parent.type.__asyncLoader &&
2129
- instance.parent.ceReload) {
2130
- instance.parent.ceReload(newComp.styles);
2131
- }
2132
2126
  }
2133
2127
  else if (instance.appContext.reload) {
2134
2128
  // root instance mounted via createApp() has a reload method
@@ -2359,8 +2353,8 @@ const deprecationData = {
2359
2353
  },
2360
2354
  ["INSTANCE_EVENT_HOOKS" /* DeprecationTypes.INSTANCE_EVENT_HOOKS */]: {
2361
2355
  message: event => `"${event}" lifecycle events are no longer supported. From templates, ` +
2362
- `use the "vnode" prefix instead of "hook:". For example, @${event} ` +
2363
- `should be changed to @vnode-${event.slice(5)}. ` +
2356
+ `use the "vue:" prefix instead of "hook:". For example, @${event} ` +
2357
+ `should be changed to @vue:${event.slice(5)}. ` +
2364
2358
  `From JavaScript, use Composition API to dynamically register lifecycle ` +
2365
2359
  `hooks.`,
2366
2360
  link: `https://v3-migration.vuejs.org/breaking-changes/vnode-lifecycle-events.html`
@@ -3967,10 +3961,11 @@ function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EM
3967
3961
  callWithAsyncErrorHandling(cb, instance, 3 /* ErrorCodes.WATCH_CALLBACK */, [
3968
3962
  newValue,
3969
3963
  // pass undefined as the old value when it's changed for the first time
3970
- oldValue === INITIAL_WATCHER_VALUE ||
3971
- (isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE)
3972
- ? []
3973
- : oldValue,
3964
+ oldValue === INITIAL_WATCHER_VALUE
3965
+ ? undefined
3966
+ : (isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE)
3967
+ ? []
3968
+ : oldValue,
3974
3969
  onCleanup
3975
3970
  ]);
3976
3971
  oldValue = newValue;
@@ -4575,10 +4570,15 @@ function defineAsyncComponent(source) {
4575
4570
  }
4576
4571
  });
4577
4572
  }
4578
- function createInnerComp(comp, { vnode: { ref, props, children, shapeFlag }, parent }) {
4573
+ function createInnerComp(comp, parent) {
4574
+ const { ref, props, children, ce } = parent.vnode;
4579
4575
  const vnode = createVNode(comp, props, children);
4580
4576
  // ensure inner component inherits the async wrapper's ref owner
4581
4577
  vnode.ref = ref;
4578
+ // pass the custom element callback on to the inner comp
4579
+ // and remove it from the async wrapper
4580
+ vnode.ce = ce;
4581
+ delete parent.vnode.ce;
4582
4582
  return vnode;
4583
4583
  }
4584
4584
 
@@ -4744,8 +4744,7 @@ const KeepAliveImpl = {
4744
4744
  : comp);
4745
4745
  const { include, exclude, max } = props;
4746
4746
  if ((include && (!name || !matches(include, name))) ||
4747
- (exclude && name && matches(exclude, name)) ||
4748
- ((process.env.NODE_ENV !== 'production') && hmrDirtyComponents.has(comp))) {
4747
+ (exclude && name && matches(exclude, name))) {
4749
4748
  current = vnode;
4750
4749
  return rawVNode;
4751
4750
  }
@@ -4858,14 +4857,9 @@ function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) {
4858
4857
  }, target);
4859
4858
  }
4860
4859
  function resetShapeFlag(vnode) {
4861
- let shapeFlag = vnode.shapeFlag;
4862
- if (shapeFlag & 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */) {
4863
- shapeFlag -= 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
4864
- }
4865
- if (shapeFlag & 512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */) {
4866
- shapeFlag -= 512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
4867
- }
4868
- vnode.shapeFlag = shapeFlag;
4860
+ // bitwise operations to remove keep alive flags
4861
+ vnode.shapeFlag &= ~256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
4862
+ vnode.shapeFlag &= ~512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
4869
4863
  }
4870
4864
  function getInnerChild(vnode) {
4871
4865
  return vnode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */ ? vnode.ssContent : vnode;
@@ -5493,7 +5487,9 @@ fallback, noSlotted) {
5493
5487
  (currentRenderingInstance.parent &&
5494
5488
  isAsyncWrapper(currentRenderingInstance.parent) &&
5495
5489
  currentRenderingInstance.parent.isCE)) {
5496
- return createVNode('slot', name === 'default' ? null : { name }, fallback && fallback());
5490
+ if (name !== 'default')
5491
+ props.name = name;
5492
+ return createVNode('slot', props, fallback && fallback());
5497
5493
  }
5498
5494
  let slot = slots[name];
5499
5495
  if ((process.env.NODE_ENV !== 'production') && slot && slot.length > 1) {
@@ -5813,6 +5809,7 @@ const publicPropertiesMap =
5813
5809
  installCompatInstanceProperties(publicPropertiesMap);
5814
5810
  }
5815
5811
  const isReservedPrefix = (key) => key === '_' || key === '$';
5812
+ const hasSetupBinding = (state, key) => state !== EMPTY_OBJ && !state.__isScriptSetup && hasOwn(state, key);
5816
5813
  const PublicInstanceProxyHandlers = {
5817
5814
  get({ _: instance }, key) {
5818
5815
  const { ctx, setupState, data, props, accessCache, type, appContext } = instance;
@@ -5820,16 +5817,6 @@ const PublicInstanceProxyHandlers = {
5820
5817
  if ((process.env.NODE_ENV !== 'production') && key === '__isVue') {
5821
5818
  return true;
5822
5819
  }
5823
- // prioritize <script setup> bindings during dev.
5824
- // this allows even properties that start with _ or $ to be used - so that
5825
- // it aligns with the production behavior where the render fn is inlined and
5826
- // indeed has access to all declared variables.
5827
- if ((process.env.NODE_ENV !== 'production') &&
5828
- setupState !== EMPTY_OBJ &&
5829
- setupState.__isScriptSetup &&
5830
- hasOwn(setupState, key)) {
5831
- return setupState[key];
5832
- }
5833
5820
  // data / props / ctx
5834
5821
  // This getter gets called for every property access on the render context
5835
5822
  // during render and is a major hotspot. The most expensive part of this
@@ -5852,7 +5839,7 @@ const PublicInstanceProxyHandlers = {
5852
5839
  // default: just fallthrough
5853
5840
  }
5854
5841
  }
5855
- else if (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) {
5842
+ else if (hasSetupBinding(setupState, key)) {
5856
5843
  accessCache[key] = 1 /* AccessTypes.SETUP */;
5857
5844
  return setupState[key];
5858
5845
  }
@@ -5932,23 +5919,28 @@ const PublicInstanceProxyHandlers = {
5932
5919
  },
5933
5920
  set({ _: instance }, key, value) {
5934
5921
  const { data, setupState, ctx } = instance;
5935
- if (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) {
5922
+ if (hasSetupBinding(setupState, key)) {
5936
5923
  setupState[key] = value;
5937
5924
  return true;
5938
5925
  }
5926
+ else if ((process.env.NODE_ENV !== 'production') &&
5927
+ setupState.__isScriptSetup &&
5928
+ hasOwn(setupState, key)) {
5929
+ warn$1(`Cannot mutate <script setup> binding "${key}" from Options API.`);
5930
+ return false;
5931
+ }
5939
5932
  else if (data !== EMPTY_OBJ && hasOwn(data, key)) {
5940
5933
  data[key] = value;
5941
5934
  return true;
5942
5935
  }
5943
5936
  else if (hasOwn(instance.props, key)) {
5944
- (process.env.NODE_ENV !== 'production') &&
5945
- warn$1(`Attempting to mutate prop "${key}". Props are readonly.`, instance);
5937
+ (process.env.NODE_ENV !== 'production') && warn$1(`Attempting to mutate prop "${key}". Props are readonly.`);
5946
5938
  return false;
5947
5939
  }
5948
5940
  if (key[0] === '$' && key.slice(1) in instance) {
5949
5941
  (process.env.NODE_ENV !== 'production') &&
5950
5942
  warn$1(`Attempting to mutate public property "${key}". ` +
5951
- `Properties starting with $ are reserved and readonly.`, instance);
5943
+ `Properties starting with $ are reserved and readonly.`);
5952
5944
  return false;
5953
5945
  }
5954
5946
  else {
@@ -5969,7 +5961,7 @@ const PublicInstanceProxyHandlers = {
5969
5961
  let normalizedProps;
5970
5962
  return (!!accessCache[key] ||
5971
5963
  (data !== EMPTY_OBJ && hasOwn(data, key)) ||
5972
- (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) ||
5964
+ hasSetupBinding(setupState, key) ||
5973
5965
  ((normalizedProps = propsOptions[0]) && hasOwn(normalizedProps, key)) ||
5974
5966
  hasOwn(ctx, key) ||
5975
5967
  hasOwn(publicPropertiesMap, key) ||
@@ -7252,7 +7244,7 @@ function createCompatVue(createApp, createSingletonApp) {
7252
7244
  return vm;
7253
7245
  }
7254
7246
  }
7255
- Vue.version = `2.6.14-compat:${"3.2.43"}`;
7247
+ Vue.version = `2.6.14-compat:${"3.2.45"}`;
7256
7248
  Vue.config = singletonApp.config;
7257
7249
  Vue.use = (p, ...options) => {
7258
7250
  if (p && isFunction(p.install)) {
@@ -9682,6 +9674,10 @@ function traverseStaticChildren(n1, n2, shallow = false) {
9682
9674
  if (!shallow)
9683
9675
  traverseStaticChildren(c1, c2);
9684
9676
  }
9677
+ // #6852 also inherit for text nodes
9678
+ if (c2.type === Text) {
9679
+ c2.el = c1.el;
9680
+ }
9685
9681
  // also inherit for comment nodes, but not placeholders (e.g. v-if which
9686
9682
  // would have received .el during block patch)
9687
9683
  if ((process.env.NODE_ENV !== 'production') && c2.type === Comment && !c2.el) {
@@ -9856,6 +9852,7 @@ const TeleportImpl = {
9856
9852
  }
9857
9853
  }
9858
9854
  }
9855
+ updateCssVars(n2);
9859
9856
  },
9860
9857
  remove(vnode, parentComponent, parentSuspense, optimized, { um: unmount, o: { remove: hostRemove } }, doRemove) {
9861
9858
  const { shapeFlag, children, anchor, targetAnchor, target, props } = vnode;
@@ -9934,11 +9931,26 @@ function hydrateTeleport(node, vnode, parentComponent, parentSuspense, slotScope
9934
9931
  hydrateChildren(targetNode, vnode, target, parentComponent, parentSuspense, slotScopeIds, optimized);
9935
9932
  }
9936
9933
  }
9934
+ updateCssVars(vnode);
9937
9935
  }
9938
9936
  return vnode.anchor && nextSibling(vnode.anchor);
9939
9937
  }
9940
9938
  // Force-casted public typing for h and TSX props inference
9941
9939
  const Teleport = TeleportImpl;
9940
+ function updateCssVars(vnode) {
9941
+ // presence of .ut method indicates owner component uses css vars.
9942
+ // code path here can assume browser environment.
9943
+ const ctx = vnode.ctx;
9944
+ if (ctx && ctx.ut) {
9945
+ let node = vnode.children[0].el;
9946
+ while (node !== vnode.targetAnchor) {
9947
+ if (node.nodeType === 1)
9948
+ node.setAttribute('data-v-owner', ctx.uid);
9949
+ node = node.nextSibling;
9950
+ }
9951
+ ctx.ut();
9952
+ }
9953
+ }
9942
9954
 
9943
9955
  const normalizedAsyncComponentMap = new Map();
9944
9956
  function convertLegacyAsyncComponent(comp) {
@@ -10094,6 +10106,10 @@ function isSameVNodeType(n1, n2) {
10094
10106
  if ((process.env.NODE_ENV !== 'production') &&
10095
10107
  n2.shapeFlag & 6 /* ShapeFlags.COMPONENT */ &&
10096
10108
  hmrDirtyComponents.has(n2.type)) {
10109
+ // #7042, ensure the vnode being unmounted during HMR
10110
+ // bitwise operations to remove keep alive flags
10111
+ n1.shapeFlag &= ~256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
10112
+ n2.shapeFlag &= ~512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
10097
10113
  // HMR only: if the component has been hot-updated, force a reload.
10098
10114
  return false;
10099
10115
  }
@@ -10149,7 +10165,8 @@ function createBaseVNode(type, props = null, children = null, patchFlag = 0, dyn
10149
10165
  patchFlag,
10150
10166
  dynamicProps,
10151
10167
  dynamicChildren: null,
10152
- appContext: null
10168
+ appContext: null,
10169
+ ctx: currentRenderingInstance
10153
10170
  };
10154
10171
  if (needFullChildrenNormalization) {
10155
10172
  normalizeChildren(vnode, children);
@@ -10324,7 +10341,8 @@ function cloneVNode(vnode, extraProps, mergeRef = false) {
10324
10341
  ssContent: vnode.ssContent && cloneVNode(vnode.ssContent),
10325
10342
  ssFallback: vnode.ssFallback && cloneVNode(vnode.ssFallback),
10326
10343
  el: vnode.el,
10327
- anchor: vnode.anchor
10344
+ anchor: vnode.anchor,
10345
+ ctx: vnode.ctx
10328
10346
  };
10329
10347
  {
10330
10348
  defineLegacyVNodeProperties(cloned);
@@ -11337,7 +11355,7 @@ function isMemoSame(cached, memo) {
11337
11355
  }
11338
11356
 
11339
11357
  // Core API ------------------------------------------------------------------
11340
- const version = "3.2.43";
11358
+ const version = "3.2.45";
11341
11359
  const _ssrUtils = {
11342
11360
  createComponentInstance,
11343
11361
  setupComponent,
@@ -11498,6 +11516,7 @@ function patchStyle(el, prev, next) {
11498
11516
  }
11499
11517
  }
11500
11518
  }
11519
+ const semicolonRE = /[^\\];\s*$/;
11501
11520
  const importantRE = /\s*!important$/;
11502
11521
  function setStyle(style, name, val) {
11503
11522
  if (isArray(val)) {
@@ -11506,6 +11525,11 @@ function setStyle(style, name, val) {
11506
11525
  else {
11507
11526
  if (val == null)
11508
11527
  val = '';
11528
+ if ((process.env.NODE_ENV !== 'production')) {
11529
+ if (semicolonRE.test(val)) {
11530
+ warn$1(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
11531
+ }
11532
+ }
11509
11533
  if (name.startsWith('--')) {
11510
11534
  // custom property definition
11511
11535
  style.setProperty(name, val);
@@ -11874,12 +11898,21 @@ class VueElement extends BaseClass {
11874
11898
  `defined as hydratable. Use \`defineSSRCustomElement\`.`);
11875
11899
  }
11876
11900
  this.attachShadow({ mode: 'open' });
11901
+ if (!this._def.__asyncLoader) {
11902
+ // for sync component defs we can immediately resolve props
11903
+ this._resolveProps(this._def);
11904
+ }
11877
11905
  }
11878
11906
  }
11879
11907
  connectedCallback() {
11880
11908
  this._connected = true;
11881
11909
  if (!this._instance) {
11882
- this._resolveDef();
11910
+ if (this._resolved) {
11911
+ this._update();
11912
+ }
11913
+ else {
11914
+ this._resolveDef();
11915
+ }
11883
11916
  }
11884
11917
  }
11885
11918
  disconnectedCallback() {
@@ -11895,9 +11928,6 @@ class VueElement extends BaseClass {
11895
11928
  * resolve inner component definition (handle possible async component)
11896
11929
  */
11897
11930
  _resolveDef() {
11898
- if (this._resolved) {
11899
- return;
11900
- }
11901
11931
  this._resolved = true;
11902
11932
  // set initial attrs
11903
11933
  for (let i = 0; i < this.attributes.length; i++) {
@@ -11909,38 +11939,26 @@ class VueElement extends BaseClass {
11909
11939
  this._setAttr(m.attributeName);
11910
11940
  }
11911
11941
  }).observe(this, { attributes: true });
11912
- const resolve = (def) => {
11913
- const { props = {}, styles } = def;
11914
- const hasOptions = !isArray(props);
11915
- const rawKeys = props ? (hasOptions ? Object.keys(props) : props) : [];
11942
+ const resolve = (def, isAsync = false) => {
11943
+ const { props, styles } = def;
11916
11944
  // cast Number-type props set before resolve
11917
11945
  let numberProps;
11918
- if (hasOptions) {
11919
- for (const key in this._props) {
11946
+ if (props && !isArray(props)) {
11947
+ for (const key in props) {
11920
11948
  const opt = props[key];
11921
11949
  if (opt === Number || (opt && opt.type === Number)) {
11922
- this._props[key] = toNumber(this._props[key]);
11923
- (numberProps || (numberProps = Object.create(null)))[key] = true;
11950
+ if (key in this._props) {
11951
+ this._props[key] = toNumber(this._props[key]);
11952
+ }
11953
+ (numberProps || (numberProps = Object.create(null)))[camelize(key)] = true;
11924
11954
  }
11925
11955
  }
11926
11956
  }
11927
11957
  this._numberProps = numberProps;
11928
- // check if there are props set pre-upgrade or connect
11929
- for (const key of Object.keys(this)) {
11930
- if (key[0] !== '_') {
11931
- this._setProp(key, this[key], true, false);
11932
- }
11933
- }
11934
- // defining getter/setters on prototype
11935
- for (const key of rawKeys.map(camelize)) {
11936
- Object.defineProperty(this, key, {
11937
- get() {
11938
- return this._getProp(key);
11939
- },
11940
- set(val) {
11941
- this._setProp(key, val);
11942
- }
11943
- });
11958
+ if (isAsync) {
11959
+ // defining getter/setters on prototype
11960
+ // for sync defs, this already happened in the constructor
11961
+ this._resolveProps(def);
11944
11962
  }
11945
11963
  // apply CSS
11946
11964
  this._applyStyles(styles);
@@ -11949,12 +11967,33 @@ class VueElement extends BaseClass {
11949
11967
  };
11950
11968
  const asyncDef = this._def.__asyncLoader;
11951
11969
  if (asyncDef) {
11952
- asyncDef().then(resolve);
11970
+ asyncDef().then(def => resolve(def, true));
11953
11971
  }
11954
11972
  else {
11955
11973
  resolve(this._def);
11956
11974
  }
11957
11975
  }
11976
+ _resolveProps(def) {
11977
+ const { props } = def;
11978
+ const declaredPropKeys = isArray(props) ? props : Object.keys(props || {});
11979
+ // check if there are props set pre-upgrade or connect
11980
+ for (const key of Object.keys(this)) {
11981
+ if (key[0] !== '_' && declaredPropKeys.includes(key)) {
11982
+ this._setProp(key, this[key], true, false);
11983
+ }
11984
+ }
11985
+ // defining getter/setters on prototype
11986
+ for (const key of declaredPropKeys.map(camelize)) {
11987
+ Object.defineProperty(this, key, {
11988
+ get() {
11989
+ return this._getProp(key);
11990
+ },
11991
+ set(val) {
11992
+ this._setProp(key, val);
11993
+ }
11994
+ });
11995
+ }
11996
+ }
11958
11997
  _setAttr(key) {
11959
11998
  let value = this.getAttribute(key);
11960
11999
  const camelKey = camelize(key);
@@ -12010,27 +12049,31 @@ class VueElement extends BaseClass {
12010
12049
  this._styles.length = 0;
12011
12050
  }
12012
12051
  this._applyStyles(newStyles);
12013
- // if this is an async component, ceReload is called from the inner
12014
- // component so no need to reload the async wrapper
12015
- if (!this._def.__asyncLoader) {
12016
- // reload
12017
- this._instance = null;
12018
- this._update();
12019
- }
12052
+ this._instance = null;
12053
+ this._update();
12020
12054
  };
12021
12055
  }
12022
- // intercept emit
12023
- instance.emit = (event, ...args) => {
12056
+ const dispatch = (event, args) => {
12024
12057
  this.dispatchEvent(new CustomEvent(event, {
12025
12058
  detail: args
12026
12059
  }));
12027
12060
  };
12061
+ // intercept emit
12062
+ instance.emit = (event, ...args) => {
12063
+ // dispatch both the raw and hyphenated versions of an event
12064
+ // to match Vue behavior
12065
+ dispatch(event, args);
12066
+ if (hyphenate(event) !== event) {
12067
+ dispatch(hyphenate(event), args);
12068
+ }
12069
+ };
12028
12070
  // locate nearest Vue custom element parent for provide/inject
12029
12071
  let parent = this;
12030
12072
  while ((parent =
12031
12073
  parent && (parent.parentNode || parent.host))) {
12032
12074
  if (parent instanceof VueElement) {
12033
12075
  instance.parent = parent._instance;
12076
+ instance.provides = parent._instance.provides;
12034
12077
  break;
12035
12078
  }
12036
12079
  }
@@ -12088,7 +12131,14 @@ function useCssVars(getter) {
12088
12131
  warn$1(`useCssVars is called without current active component instance.`);
12089
12132
  return;
12090
12133
  }
12091
- const setVars = () => setVarsOnVNode(instance.subTree, getter(instance.proxy));
12134
+ const updateTeleports = (instance.ut = (vars = getter(instance.proxy)) => {
12135
+ Array.from(document.querySelectorAll(`[data-v-owner="${instance.uid}"]`)).forEach(node => setVarsOnNode(node, vars));
12136
+ });
12137
+ const setVars = () => {
12138
+ const vars = getter(instance.proxy);
12139
+ setVarsOnVNode(instance.subTree, vars);
12140
+ updateTeleports(vars);
12141
+ };
12092
12142
  watchPostEffect(setVars);
12093
12143
  onMounted(() => {
12094
12144
  const ob = new MutationObserver(setVars);
@@ -13402,15 +13452,16 @@ const errorMessages = {
13402
13452
  [41 /* ErrorCodes.X_V_MODEL_NO_EXPRESSION */]: `v-model is missing expression.`,
13403
13453
  [42 /* ErrorCodes.X_V_MODEL_MALFORMED_EXPRESSION */]: `v-model value must be a valid JavaScript member expression.`,
13404
13454
  [43 /* ErrorCodes.X_V_MODEL_ON_SCOPE_VARIABLE */]: `v-model cannot be used on v-for or v-slot scope variables because they are not writable.`,
13405
- [44 /* ErrorCodes.X_INVALID_EXPRESSION */]: `Error parsing JavaScript expression: `,
13406
- [45 /* ErrorCodes.X_KEEP_ALIVE_INVALID_CHILDREN */]: `<KeepAlive> expects exactly one child component.`,
13455
+ [44 /* ErrorCodes.X_V_MODEL_ON_PROPS */]: `v-model cannot be used on a prop, because local prop bindings are not writable.\nUse a v-bind binding combined with a v-on listener that emits update:x event instead.`,
13456
+ [45 /* ErrorCodes.X_INVALID_EXPRESSION */]: `Error parsing JavaScript expression: `,
13457
+ [46 /* ErrorCodes.X_KEEP_ALIVE_INVALID_CHILDREN */]: `<KeepAlive> expects exactly one child component.`,
13407
13458
  // generic errors
13408
- [46 /* ErrorCodes.X_PREFIX_ID_NOT_SUPPORTED */]: `"prefixIdentifiers" option is not supported in this build of compiler.`,
13409
- [47 /* ErrorCodes.X_MODULE_MODE_NOT_SUPPORTED */]: `ES module mode is not supported in this build of compiler.`,
13410
- [48 /* ErrorCodes.X_CACHE_HANDLER_NOT_SUPPORTED */]: `"cacheHandlers" option is only supported when the "prefixIdentifiers" option is enabled.`,
13411
- [49 /* ErrorCodes.X_SCOPE_ID_NOT_SUPPORTED */]: `"scopeId" option is only supported in module mode.`,
13459
+ [47 /* ErrorCodes.X_PREFIX_ID_NOT_SUPPORTED */]: `"prefixIdentifiers" option is not supported in this build of compiler.`,
13460
+ [48 /* ErrorCodes.X_MODULE_MODE_NOT_SUPPORTED */]: `ES module mode is not supported in this build of compiler.`,
13461
+ [49 /* ErrorCodes.X_CACHE_HANDLER_NOT_SUPPORTED */]: `"cacheHandlers" option is only supported when the "prefixIdentifiers" option is enabled.`,
13462
+ [50 /* ErrorCodes.X_SCOPE_ID_NOT_SUPPORTED */]: `"scopeId" option is only supported in module mode.`,
13412
13463
  // just to fulfill types
13413
- [50 /* ErrorCodes.__EXTEND_POINT__ */]: ``
13464
+ [51 /* ErrorCodes.__EXTEND_POINT__ */]: ``
13414
13465
  };
13415
13466
 
13416
13467
  const FRAGMENT = Symbol((process.env.NODE_ENV !== 'production') ? `Fragment` : ``);
@@ -16041,7 +16092,7 @@ function validateBrowserExpression(node, context, asParams = false, asRawStateme
16041
16092
  if (keywordMatch) {
16042
16093
  message = `avoid using JavaScript keyword as property name: "${keywordMatch[0]}"`;
16043
16094
  }
16044
- context.onError(createCompilerError(44 /* ErrorCodes.X_INVALID_EXPRESSION */, node.loc, undefined, message));
16095
+ context.onError(createCompilerError(45 /* ErrorCodes.X_INVALID_EXPRESSION */, node.loc, undefined, message));
16045
16096
  }
16046
16097
  }
16047
16098
 
@@ -16838,7 +16889,7 @@ const transformElement = (node, context) => {
16838
16889
  // 2. Force keep-alive to always be updated, since it uses raw children.
16839
16890
  patchFlag |= 1024 /* PatchFlags.DYNAMIC_SLOTS */;
16840
16891
  if ((process.env.NODE_ENV !== 'production') && node.children.length > 1) {
16841
- context.onError(createCompilerError(45 /* ErrorCodes.X_KEEP_ALIVE_INVALID_CHILDREN */, {
16892
+ context.onError(createCompilerError(46 /* ErrorCodes.X_KEEP_ALIVE_INVALID_CHILDREN */, {
16842
16893
  start: node.children[0].loc.start,
16843
16894
  end: node.children[node.children.length - 1].loc.end,
16844
16895
  source: ''
@@ -17696,8 +17747,14 @@ const transformModel = (dir, node, context) => {
17696
17747
  const expString = exp.type === 4 /* NodeTypes.SIMPLE_EXPRESSION */ ? exp.content : rawExp;
17697
17748
  // im SFC <script setup> inline mode, the exp may have been transformed into
17698
17749
  // _unref(exp)
17699
- context.bindingMetadata[rawExp];
17700
- const maybeRef = !true /* BindingTypes.SETUP_CONST */;
17750
+ const bindingType = context.bindingMetadata[rawExp];
17751
+ // check props
17752
+ if (bindingType === "props" /* BindingTypes.PROPS */ ||
17753
+ bindingType === "props-aliased" /* BindingTypes.PROPS_ALIASED */) {
17754
+ context.onError(createCompilerError(44 /* ErrorCodes.X_V_MODEL_ON_PROPS */, exp.loc));
17755
+ return createTransformProps();
17756
+ }
17757
+ const maybeRef = !true ;
17701
17758
  if (!expString.trim() ||
17702
17759
  (!isMemberExpression(expString) && !maybeRef)) {
17703
17760
  context.onError(createCompilerError(42 /* ErrorCodes.X_V_MODEL_MALFORMED_EXPRESSION */, exp.loc));
@@ -17966,18 +18023,18 @@ function baseCompile(template, options = {}) {
17966
18023
  /* istanbul ignore if */
17967
18024
  {
17968
18025
  if (options.prefixIdentifiers === true) {
17969
- onError(createCompilerError(46 /* ErrorCodes.X_PREFIX_ID_NOT_SUPPORTED */));
18026
+ onError(createCompilerError(47 /* ErrorCodes.X_PREFIX_ID_NOT_SUPPORTED */));
17970
18027
  }
17971
18028
  else if (isModuleMode) {
17972
- onError(createCompilerError(47 /* ErrorCodes.X_MODULE_MODE_NOT_SUPPORTED */));
18029
+ onError(createCompilerError(48 /* ErrorCodes.X_MODULE_MODE_NOT_SUPPORTED */));
17973
18030
  }
17974
18031
  }
17975
18032
  const prefixIdentifiers = !true ;
17976
18033
  if (options.cacheHandlers) {
17977
- onError(createCompilerError(48 /* ErrorCodes.X_CACHE_HANDLER_NOT_SUPPORTED */));
18034
+ onError(createCompilerError(49 /* ErrorCodes.X_CACHE_HANDLER_NOT_SUPPORTED */));
17978
18035
  }
17979
18036
  if (options.scopeId && !isModuleMode) {
17980
- onError(createCompilerError(49 /* ErrorCodes.X_SCOPE_ID_NOT_SUPPORTED */));
18037
+ onError(createCompilerError(50 /* ErrorCodes.X_SCOPE_ID_NOT_SUPPORTED */));
17981
18038
  }
17982
18039
  const ast = isString(template) ? baseParse(template, options) : template;
17983
18040
  const [nodeTransforms, directiveTransforms] = getBaseTransformPreset();
@@ -18135,26 +18192,26 @@ function createDOMCompilerError(code, loc) {
18135
18192
  return createCompilerError(code, loc, (process.env.NODE_ENV !== 'production') || !true ? DOMErrorMessages : undefined);
18136
18193
  }
18137
18194
  const DOMErrorMessages = {
18138
- [50 /* DOMErrorCodes.X_V_HTML_NO_EXPRESSION */]: `v-html is missing expression.`,
18139
- [51 /* DOMErrorCodes.X_V_HTML_WITH_CHILDREN */]: `v-html will override element children.`,
18140
- [52 /* DOMErrorCodes.X_V_TEXT_NO_EXPRESSION */]: `v-text is missing expression.`,
18141
- [53 /* DOMErrorCodes.X_V_TEXT_WITH_CHILDREN */]: `v-text will override element children.`,
18142
- [54 /* DOMErrorCodes.X_V_MODEL_ON_INVALID_ELEMENT */]: `v-model can only be used on <input>, <textarea> and <select> elements.`,
18143
- [55 /* DOMErrorCodes.X_V_MODEL_ARG_ON_ELEMENT */]: `v-model argument is not supported on plain elements.`,
18144
- [56 /* DOMErrorCodes.X_V_MODEL_ON_FILE_INPUT_ELEMENT */]: `v-model cannot be used on file inputs since they are read-only. Use a v-on:change listener instead.`,
18145
- [57 /* DOMErrorCodes.X_V_MODEL_UNNECESSARY_VALUE */]: `Unnecessary value binding used alongside v-model. It will interfere with v-model's behavior.`,
18146
- [58 /* DOMErrorCodes.X_V_SHOW_NO_EXPRESSION */]: `v-show is missing expression.`,
18147
- [59 /* DOMErrorCodes.X_TRANSITION_INVALID_CHILDREN */]: `<Transition> expects exactly one child element or component.`,
18148
- [60 /* DOMErrorCodes.X_IGNORED_SIDE_EFFECT_TAG */]: `Tags with side effect (<script> and <style>) are ignored in client component templates.`
18195
+ [51 /* DOMErrorCodes.X_V_HTML_NO_EXPRESSION */]: `v-html is missing expression.`,
18196
+ [52 /* DOMErrorCodes.X_V_HTML_WITH_CHILDREN */]: `v-html will override element children.`,
18197
+ [53 /* DOMErrorCodes.X_V_TEXT_NO_EXPRESSION */]: `v-text is missing expression.`,
18198
+ [54 /* DOMErrorCodes.X_V_TEXT_WITH_CHILDREN */]: `v-text will override element children.`,
18199
+ [55 /* DOMErrorCodes.X_V_MODEL_ON_INVALID_ELEMENT */]: `v-model can only be used on <input>, <textarea> and <select> elements.`,
18200
+ [56 /* DOMErrorCodes.X_V_MODEL_ARG_ON_ELEMENT */]: `v-model argument is not supported on plain elements.`,
18201
+ [57 /* DOMErrorCodes.X_V_MODEL_ON_FILE_INPUT_ELEMENT */]: `v-model cannot be used on file inputs since they are read-only. Use a v-on:change listener instead.`,
18202
+ [58 /* DOMErrorCodes.X_V_MODEL_UNNECESSARY_VALUE */]: `Unnecessary value binding used alongside v-model. It will interfere with v-model's behavior.`,
18203
+ [59 /* DOMErrorCodes.X_V_SHOW_NO_EXPRESSION */]: `v-show is missing expression.`,
18204
+ [60 /* DOMErrorCodes.X_TRANSITION_INVALID_CHILDREN */]: `<Transition> expects exactly one child element or component.`,
18205
+ [61 /* DOMErrorCodes.X_IGNORED_SIDE_EFFECT_TAG */]: `Tags with side effect (<script> and <style>) are ignored in client component templates.`
18149
18206
  };
18150
18207
 
18151
18208
  const transformVHtml = (dir, node, context) => {
18152
18209
  const { exp, loc } = dir;
18153
18210
  if (!exp) {
18154
- context.onError(createDOMCompilerError(50 /* DOMErrorCodes.X_V_HTML_NO_EXPRESSION */, loc));
18211
+ context.onError(createDOMCompilerError(51 /* DOMErrorCodes.X_V_HTML_NO_EXPRESSION */, loc));
18155
18212
  }
18156
18213
  if (node.children.length) {
18157
- context.onError(createDOMCompilerError(51 /* DOMErrorCodes.X_V_HTML_WITH_CHILDREN */, loc));
18214
+ context.onError(createDOMCompilerError(52 /* DOMErrorCodes.X_V_HTML_WITH_CHILDREN */, loc));
18158
18215
  node.children.length = 0;
18159
18216
  }
18160
18217
  return {
@@ -18167,10 +18224,10 @@ const transformVHtml = (dir, node, context) => {
18167
18224
  const transformVText = (dir, node, context) => {
18168
18225
  const { exp, loc } = dir;
18169
18226
  if (!exp) {
18170
- context.onError(createDOMCompilerError(52 /* DOMErrorCodes.X_V_TEXT_NO_EXPRESSION */, loc));
18227
+ context.onError(createDOMCompilerError(53 /* DOMErrorCodes.X_V_TEXT_NO_EXPRESSION */, loc));
18171
18228
  }
18172
18229
  if (node.children.length) {
18173
- context.onError(createDOMCompilerError(53 /* DOMErrorCodes.X_V_TEXT_WITH_CHILDREN */, loc));
18230
+ context.onError(createDOMCompilerError(54 /* DOMErrorCodes.X_V_TEXT_WITH_CHILDREN */, loc));
18174
18231
  node.children.length = 0;
18175
18232
  }
18176
18233
  return {
@@ -18191,12 +18248,12 @@ const transformModel$1 = (dir, node, context) => {
18191
18248
  return baseResult;
18192
18249
  }
18193
18250
  if (dir.arg) {
18194
- context.onError(createDOMCompilerError(55 /* DOMErrorCodes.X_V_MODEL_ARG_ON_ELEMENT */, dir.arg.loc));
18251
+ context.onError(createDOMCompilerError(56 /* DOMErrorCodes.X_V_MODEL_ARG_ON_ELEMENT */, dir.arg.loc));
18195
18252
  }
18196
18253
  function checkDuplicatedValue() {
18197
18254
  const value = findProp(node, 'value');
18198
18255
  if (value) {
18199
- context.onError(createDOMCompilerError(57 /* DOMErrorCodes.X_V_MODEL_UNNECESSARY_VALUE */, value.loc));
18256
+ context.onError(createDOMCompilerError(58 /* DOMErrorCodes.X_V_MODEL_UNNECESSARY_VALUE */, value.loc));
18200
18257
  }
18201
18258
  }
18202
18259
  const { tag } = node;
@@ -18224,7 +18281,7 @@ const transformModel$1 = (dir, node, context) => {
18224
18281
  break;
18225
18282
  case 'file':
18226
18283
  isInvalidType = true;
18227
- context.onError(createDOMCompilerError(56 /* DOMErrorCodes.X_V_MODEL_ON_FILE_INPUT_ELEMENT */, dir.loc));
18284
+ context.onError(createDOMCompilerError(57 /* DOMErrorCodes.X_V_MODEL_ON_FILE_INPUT_ELEMENT */, dir.loc));
18228
18285
  break;
18229
18286
  default:
18230
18287
  // text type
@@ -18258,7 +18315,7 @@ const transformModel$1 = (dir, node, context) => {
18258
18315
  }
18259
18316
  }
18260
18317
  else {
18261
- context.onError(createDOMCompilerError(54 /* DOMErrorCodes.X_V_MODEL_ON_INVALID_ELEMENT */, dir.loc));
18318
+ context.onError(createDOMCompilerError(55 /* DOMErrorCodes.X_V_MODEL_ON_INVALID_ELEMENT */, dir.loc));
18262
18319
  }
18263
18320
  // native vmodel doesn't need the `modelValue` props since they are also
18264
18321
  // passed to the runtime as `binding.value`. removing it reduces code size.
@@ -18382,7 +18439,7 @@ const transformOn$1 = (dir, node, context) => {
18382
18439
  const transformShow = (dir, node, context) => {
18383
18440
  const { exp, loc } = dir;
18384
18441
  if (!exp) {
18385
- context.onError(createDOMCompilerError(58 /* DOMErrorCodes.X_V_SHOW_NO_EXPRESSION */, loc));
18442
+ context.onError(createDOMCompilerError(59 /* DOMErrorCodes.X_V_SHOW_NO_EXPRESSION */, loc));
18386
18443
  }
18387
18444
  return {
18388
18445
  props: [],
@@ -18401,7 +18458,7 @@ const transformTransition = (node, context) => {
18401
18458
  }
18402
18459
  // warn multiple transition children
18403
18460
  if (hasMultipleChildren(node)) {
18404
- context.onError(createDOMCompilerError(59 /* DOMErrorCodes.X_TRANSITION_INVALID_CHILDREN */, {
18461
+ context.onError(createDOMCompilerError(60 /* DOMErrorCodes.X_TRANSITION_INVALID_CHILDREN */, {
18405
18462
  start: node.children[0].loc.start,
18406
18463
  end: node.children[node.children.length - 1].loc.end,
18407
18464
  source: ''
@@ -18440,7 +18497,7 @@ const ignoreSideEffectTags = (node, context) => {
18440
18497
  if (node.type === 1 /* NodeTypes.ELEMENT */ &&
18441
18498
  node.tagType === 0 /* ElementTypes.ELEMENT */ &&
18442
18499
  (node.tag === 'script' || node.tag === 'style')) {
18443
- context.onError(createDOMCompilerError(60 /* DOMErrorCodes.X_IGNORED_SIDE_EFFECT_TAG */, node.loc));
18500
+ context.onError(createDOMCompilerError(61 /* DOMErrorCodes.X_IGNORED_SIDE_EFFECT_TAG */, node.loc));
18444
18501
  context.removeNode();
18445
18502
  }
18446
18503
  };