vue-jsx-vapor 3.2.18 → 3.2.19

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.
Files changed (3) hide show
  1. package/dist/volar.cjs +153 -107
  2. package/dist/volar.js +153 -107
  3. package/package.json +7 -7
package/dist/volar.cjs CHANGED
@@ -5,7 +5,46 @@ _vue_jsx_vapor_macros_volar = require_chunk.__toESM(_vue_jsx_vapor_macros_volar)
5
5
  let ts_macro = require("ts-macro");
6
6
  let _vue_shared = require("@vue/shared");
7
7
 
8
- //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.2_patch_hash=0c8e80125adad1ff087195b3b3c1aad5bb1392f1c5dfe7d84145_7b274381fa4fb7e0ad99c5d1af9cbc92/node_modules/@vue-macros/volar/dist/jsx-directive-Cfx4Hdxx.js
8
+ //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.4_patch_hash=6ca9aac764781d42cb930c1f62df7446f01fc5a40603f75f7a0c_f678b1758eb5df936adf57a88134fc6f/node_modules/@vue-macros/volar/dist/jsx-directive-w2gUTWdx.js
9
+ function getDirectiveArgs(attribute, options) {
10
+ const { ts, ast } = options;
11
+ const attributeName = attribute.name.getText(ast);
12
+ let isDynamic = false;
13
+ let argument = "";
14
+ let [name, ...modifiers] = attributeName.split(/\s/)[0].replace(/\$([^$]+)\$/, (_, $1) => {
15
+ isDynamic = true;
16
+ return $1.replaceAll("_", ".");
17
+ }).split("_");
18
+ if (name.includes(":")) [name, argument] = name.split(":");
19
+ const initializer = attribute.initializer;
20
+ let modifiersCode;
21
+ let valueCode;
22
+ let argumentCode;
23
+ if (initializer && initializer.kind === ts.SyntaxKind.JsxExpression && initializer.expression && ts.isArrayLiteralExpression(initializer.expression)) {
24
+ const elements = initializer.expression.elements;
25
+ if (elements[0]) valueCode = [elements[0].getText(ast), elements[0].getStart(ast)];
26
+ if (elements[1] && ts.isArrayLiteralExpression(elements[1])) modifiersCode = [elements[1].getText(ast), elements[1].getStart(ast)];
27
+ else {
28
+ if (!argument && elements[1]) {
29
+ isDynamic ||= !ts.isStringLiteral(elements[1]);
30
+ argumentCode = [elements[1].getText(ast), elements[1].getStart(ast)];
31
+ }
32
+ if (elements[2] && ts.isArrayLiteralExpression(elements[2])) modifiersCode = [elements[2].getText(ast), elements[2].getStart(ast)];
33
+ }
34
+ } else if (initializer) valueCode = [ts.isStringLiteral(attribute.initializer) ? attribute.initializer.getText(ast) : attribute.initializer.getText(ast).slice(1, -1), attribute.initializer.getStart(ast) + (ts.isStringLiteral(attribute.initializer) ? 0 : 1)];
35
+ return {
36
+ name,
37
+ valueCode,
38
+ argumentCode,
39
+ modifiersCode,
40
+ isDynamic,
41
+ argument,
42
+ modifiers
43
+ };
44
+ }
45
+ const getModifierPropName = (name) => {
46
+ return `${name === "modelValue" || name === "model-value" ? "model" : name}Modifiers${name === "model" ? "$" : ""}`;
47
+ };
9
48
  function resolveCtxMap(ctxNodeMap, options) {
10
49
  if (ctxNodeMap.size) options.codes.push(`
11
50
  type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
@@ -61,7 +100,7 @@ declare function __VLS_asFunctionalComponent<
61
100
  expose?: any
62
101
  slots?: any
63
102
  emit?: any
64
- }
103
+ }
65
104
  };
66
105
  const __VLS_nativeElements = {
67
106
  ...{} as SVGElementTagNameMap,
@@ -73,9 +112,9 @@ declare function __VLS_getFunctionalComponentCtx<T, K, const S>(
73
112
  s: S,
74
113
  ): S extends keyof typeof __VLS_nativeElements
75
114
  ? { expose: (exposed: (typeof __VLS_nativeElements)[S]) => any }
76
- : '__ctx' extends keyof __VLS_PickNotAny<K, {}>
115
+ : '__ctx' extends keyof __VLS_PickNotAny<K, {}>
77
116
  ? K extends { __ctx?: infer Ctx } ? Ctx : never
78
- : T extends (props: infer P, ctx: { expose: (exposed: infer Exposed) => void } & infer Ctx) => any
117
+ : T extends (props: infer P, ctx: { expose: (exposed: infer Exposed) => void } & infer Ctx) => any
79
118
  ? Ctx & {
80
119
  props: P,
81
120
  expose: (
@@ -101,8 +140,11 @@ function transformCtx(node, root, index, options) {
101
140
  continue;
102
141
  }
103
142
  const prefixModel = `${prefix}model`;
104
- if (name.startsWith(prefixModel)) name = name.split("$")[0].split("_")[0].split(":")[1] ?? "modelValue";
105
- else if (name.includes("_")) name = name.split("_")[0];
143
+ if (name.startsWith(prefixModel)) {
144
+ const dir = getDirectiveArgs(prop, options);
145
+ if (dir.valueCode && !dir.isDynamic) props += `'${dir.argument || dir.argumentCode?.[0].slice(1, -1) || "modelValue"}': ${dir.valueCode[0]},`;
146
+ continue;
147
+ } else if (name.includes("_")) name = name.split("_")[0];
106
148
  else if (prefix && name.startsWith(prefix)) continue;
107
149
  if (!name) continue;
108
150
  const value = prop.initializer ? ts.isJsxExpression(prop.initializer) && prop.initializer.expression ? prop.initializer.expression.getText(ast) : prop.initializer.getText(ast) : "true";
@@ -147,30 +189,47 @@ function transformCustomDirective(attributes, options) {
147
189
  options.codes.push(`
148
190
  type __VLS_ResolveDirective<T> = T extends import('vue').Directive<
149
191
  any,
150
- infer V,
151
- infer M extends string,
152
- infer A extends string
192
+ infer Value,
193
+ infer Modifiers extends string,
194
+ infer Argument extends string
153
195
  >
154
- ? [any, V, A, Record<M, true>]
196
+ ? [Value, Argument, Array<Modifiers>]
155
197
  : any;
156
198
  `);
157
199
  }
158
200
  function transform$1(attribute, options) {
159
- const { codes, ts, ast } = options;
160
- const attributeName = attribute.name.getText(ast);
161
- let directiveName = attributeName.split(/\s/)[0].split("v-")[1];
162
- let modifiers = [];
163
- if (directiveName.includes("_")) [directiveName, ...modifiers] = directiveName.split("_");
164
- if (directiveName) directiveName = directiveName[0].toUpperCase() + directiveName.slice(1);
165
- let arg;
166
- if (directiveName.includes(":")) [directiveName, arg] = directiveName.split(":");
201
+ const { codes, ast } = options;
202
+ const { name, modifiersCode, argument, modifiers, argumentCode, valueCode, isDynamic } = getDirectiveArgs(attribute, options);
167
203
  const start = attribute.getStart(ast);
168
- const offset = start + directiveName.length + 2;
169
204
  codes.replaceRange(start, attribute.end, [
170
- ast.text.slice(start, offset),
205
+ ast.text.slice(start, start + name.length),
171
206
  start,
172
207
  { verification: true }
173
- ], `={[`, [
208
+ ], `={[`, valueCode || "{} as any", ",", ...argument ? [
209
+ ...isDynamic && !argument.includes("-") ? [] : [[
210
+ `'`,
211
+ start + name.length + 1,
212
+ { verification: true }
213
+ ]],
214
+ [argument, start + name.length + 1 + (isDynamic ? 1 : 0)],
215
+ ...isDynamic && !argument.includes("-") ? [] : [[
216
+ `'`,
217
+ start + name.length + argument.length,
218
+ { verification: true }
219
+ ]]
220
+ ] : argumentCode ? [argumentCode] : ["{} as any"], ",", ...modifiersCode ? [modifiersCode] : modifiers.length ? [
221
+ "[",
222
+ ...modifiers.flatMap((modify, index) => {
223
+ const offset = start + name.length + (argument ? argument.length + 1 : 0) + (argument && isDynamic ? 2 : 0) + 1 + (index ? modifiers.slice(0, index).join("").length + index : 0);
224
+ return [
225
+ [`'`, offset],
226
+ [modify, offset],
227
+ [`'`, offset + modify.length - 1],
228
+ ","
229
+ ];
230
+ }),
231
+ "]"
232
+ ] : ["{} as any"], `] satisfies __VLS_ResolveDirective<typeof `, [
174
233
  `v`,
175
234
  start,
176
235
  {
@@ -178,33 +237,13 @@ function transform$1(attribute, options) {
178
237
  verification: false
179
238
  }
180
239
  ], [
181
- directiveName,
240
+ name[2].toUpperCase() + name.slice(3),
182
241
  start + 2,
183
242
  {
184
243
  ...ts_macro.allCodeFeatures,
185
244
  verification: false
186
245
  }
187
- ], `,`, attribute.initializer ? [ts.isStringLiteral(attribute.initializer) ? attribute.initializer.getText(ast) : attribute.initializer.getText(ast).slice(1, -1), attribute.initializer.getStart(ast) + (ts.isStringLiteral(attribute.initializer) ? 0 : 1)] : "{} as any", ",", ...arg === void 0 ? ["{} as any"] : [
188
- [
189
- `'`,
190
- offset + 1,
191
- { verification: true }
192
- ],
193
- [arg, offset + 1],
194
- [
195
- `'`,
196
- offset + arg.length,
197
- { verification: true }
198
- ]
199
- ], ",", ...modifiers.length ? [
200
- "{",
201
- ...modifiers.flatMap((modify, index) => [
202
- modify ? "" : `'`,
203
- [modify, attribute.getStart(ast) + (attributeName.indexOf("_") + 1) + (index ? modifiers.slice(0, index).join("").length + index : 0)],
204
- modify ? ": true," : `'`
205
- ]),
206
- "}"
207
- ] : ["{} as any"], `] satisfies __VLS_ResolveDirective<typeof v${directiveName}>}`);
246
+ ], `>}`);
208
247
  }
209
248
  function transformRef$1(nodes, ctxMap, options) {
210
249
  const { codes, ts, ast } = options;
@@ -296,69 +335,67 @@ function transformVModel(nodeMap, ctxMap, options) {
296
335
  getModelsType(options.codes);
297
336
  }
298
337
  function transform(nodes, ctxMap, options) {
299
- const { codes, ts, ast, prefix } = options;
338
+ const { codes, ast } = options;
300
339
  let firstNamespacedNode;
301
340
  const result = [];
302
341
  const emitsResult = [];
303
342
  const modifiersResult = [];
304
- const offset = `${prefix}model`.length + 1;
305
- for (const { attribute: attribute$1, node: node$1 } of nodes) {
306
- const isNative = isNativeFormElement(getTagName(node$1, options));
343
+ for (const { attribute, node } of nodes) {
344
+ const isNative = isNativeFormElement(getTagName(node, options));
307
345
  const modelValue = isNative ? "value" : "modelValue";
308
- const isArrayExpression = attribute$1.initializer && ts.isJsxExpression(attribute$1.initializer) && attribute$1.initializer.expression && ts.isArrayLiteralExpression(attribute$1.initializer.expression);
309
- const name = attribute$1.name.getText(ast);
310
- const start = attribute$1.name.getStart(ast);
311
- if (name.startsWith(`${prefix}model:`) || isArrayExpression) {
312
- let isDynamic = false;
313
- const [attributeName$1, ...modifiers] = name.slice(offset).split(/\s/)[0].replace(/^\$(.*)\$/, (_, $1) => {
314
- isDynamic = true;
315
- return $1.replaceAll("_", ".");
316
- }).split("_");
317
- firstNamespacedNode ??= {
318
- attribute: attribute$1,
319
- attributeName: attributeName$1,
320
- node: node$1
321
- };
322
- if (firstNamespacedNode.attribute !== attribute$1) {
323
- codes.replaceRange(attribute$1.getStart(ast), attribute$1.end);
324
- result.push(",");
325
- }
326
- if (isArrayExpression) {
327
- const { elements } = attribute$1.initializer.expression;
328
- if (elements[1] && !ts.isArrayLiteralExpression(elements[1])) {
329
- isDynamic = !ts.isStringLiteral(elements[1]);
330
- result.push(isDynamic ? "[`${" : "", [elements[1].getText(ast), elements[1].getStart(ast)], isDynamic ? "}`]" : "");
331
- } else result.push(modelValue);
332
- if (elements[0]) result.push(":", [elements[0].getText(ast), elements[0].getStart(ast)]);
333
- } else {
334
- result.push(isDynamic ? "[`${" : "", ...attributeName$1.split("-").map((code, index, codes$1) => [index ? code.at(0)?.toUpperCase() + code.slice(1) : code, start + offset + (isDynamic ? 1 : 0) + (index && codes$1[index - 1].length + 1)]), isDynamic ? "}`]" : "");
335
- if (attributeName$1) {
336
- if (attribute$1.initializer && ts.isJsxExpression(attribute$1.initializer) && attribute$1.initializer.expression) result.push(":", [attribute$1.initializer.expression.getText(ast), attribute$1.initializer.expression.getStart(ast)]);
337
- if (!isDynamic && modifiers.length) modifiersResult.push(` {...{`, ...modifiers.flatMap((modify, index) => [
338
- modify ? "" : `'`,
339
- [modify, start + offset + attributeName$1.length + 1 + (index ? modifiers.slice(0, index).join("").length + index : 0)],
340
- modify ? ": true, " : `'`
341
- ]), `} satisfies typeof ${ctxMap.get(node$1)}.props.${attributeName$1}Modifiers}`);
342
- }
343
- }
344
- emitsResult.push(`'onUpdate:${attributeName$1}': () => {}, `);
345
- } else {
346
- const [, ...modifiers] = name.split("_");
346
+ const { name, argument, argumentCode, isDynamic, modifiers, modifiersCode, valueCode } = getDirectiveArgs(attribute, options);
347
+ if (!valueCode) continue;
348
+ const start = attribute.name.getStart(ast);
349
+ const resolvedArgument = argument || argumentCode?.[0].slice(1, -1) || modelValue;
350
+ const modifierProps = isDynamic ? "Record<string, true>" : `__VLS_GetModifierProps<typeof ${ctxMap.get(node)}.props, '${getModifierPropName(resolvedArgument)}'>`;
351
+ if (!argument && !argumentCode) {
347
352
  const result$1 = [];
348
- result$1.push(...isNative ? isRadioOrCheckbox(node$1, options) ? "v-model" : [[modelValue, start + 2]] : [[modelValue.slice(0, 3), start], [modelValue.slice(3), start]]);
349
- if (modifiers.length) result$1.unshift(`{...{`, ...modifiers.flatMap((modify, index) => [
350
- modify ? "" : `'`,
351
- [modify, start + offset + (index ? modifiers.slice(0, index).join("").length + index : 0)],
352
- modify ? ": true, " : `'`
353
- ]), `} satisfies `, isNative ? "{ trim?: true, number?: true, lazy?: true}" : `typeof ${ctxMap.get(node$1)}.props.modelValueModifiers`, `} `);
353
+ result$1.push(...isNative ? isRadioOrCheckbox(node, options) ? "v-model" : [[modelValue, start + 2]] : [[modelValue.slice(0, 3), start], [modelValue.slice(3), start]]);
354
+ if (modifiers.length || modifiersCode) result$1.unshift(`{...`, ...modifiersCode ? [modifiersCode] : modifiers.length ? [
355
+ "{",
356
+ ...modifiers.flatMap((modify, index) => [
357
+ modify ? modify.includes("-") ? `'` : "" : `'`,
358
+ [modify, start + name.length + 1 + (index ? modifiers.slice(0, index).join("").length + index : 0)],
359
+ modify ? `${modify.includes("-") ? `'` : ""}: true, ` : `'`
360
+ ]),
361
+ "}"
362
+ ] : [], ` satisfies `, isNative ? modifiersCode ? `('trim' | 'number' | 'lazy')[]` : `{ trim?: true, number?: true, lazy?: true }` : modifiersCode ? `(keyof ${modifierProps})[]` : modifierProps, "} ");
354
363
  if (!isNative) result$1.unshift(`{...{'onUpdate:${modelValue}': () => {} }} `);
355
- codes.replaceRange(start, attribute$1.name.end, ...result$1);
364
+ codes.replaceRange(start, attribute.end, ...result$1, "={", valueCode, "}");
365
+ } else {
366
+ if (firstNamespacedNode) {
367
+ codes.replaceRange(attribute.getStart(ast), attribute.end);
368
+ result.push(",");
369
+ } else firstNamespacedNode = {
370
+ attribute,
371
+ node
372
+ };
373
+ result.push(isDynamic ? "[" : "", ...argument ? [
374
+ argument.includes("-") ? [
375
+ `'`,
376
+ start + name.length + 1,
377
+ { verification: true }
378
+ ] : "",
379
+ [argument, start + name.length + 1 + (isDynamic ? 1 : 0)],
380
+ argument.includes("-") ? [
381
+ `'`,
382
+ start + name.length + argument.length,
383
+ { verification: true }
384
+ ] : ""
385
+ ] : argumentCode ? [argumentCode] : [modelValue], isDynamic ? "]" : "", ":", valueCode);
386
+ if (modifiersCode) modifiersResult.push(` {...`, modifiersCode, ` satisfies (keyof ${modifierProps})[]}`);
387
+ else if (modifiers.length) modifiersResult.push(` {...{`, ...modifiers.flatMap((modify, index) => [
388
+ modify ? modify.includes("-") ? `'` : "" : `'`,
389
+ [modify, start + name.length + (argument ? argument.length : -1) + (argument && isDynamic ? 4 : 2) + (index ? modifiers.slice(0, index).join("").length + index : 0)],
390
+ modify ? `${modify.includes("-") ? `'` : ""}: true, ` : `'`
391
+ ]), "} satisfies ", modifierProps, "}");
392
+ if (!isDynamic) emitsResult.push(`'onUpdate:${resolvedArgument}': () => {}, `);
356
393
  }
357
394
  }
358
- if (!firstNamespacedNode) return;
359
- const { attribute, attributeName, node } = firstNamespacedNode;
360
- const end = attributeName ? attribute.end : attribute.getStart(ast) + offset;
361
- codes.replaceRange(attribute.getStart(ast), end, `{...{`, ...result, `} satisfies __VLS_GetModels<__VLS_NormalizeProps<typeof ${ctxMap.get(node)}.props>>}`, ...modifiersResult, ` {...{`, ...emitsResult, `}}`);
395
+ if (firstNamespacedNode) {
396
+ const { attribute, node } = firstNamespacedNode;
397
+ codes.replaceRange(attribute.getStart(ast), attribute.end, `{...{`, ...result, `} satisfies __VLS_GetModels<__VLS_NormalizeProps<typeof ${ctxMap.get(node)}.props>>}`, ...modifiersResult, ` {...{`, ...emitsResult, `}}`);
398
+ }
362
399
  }
363
400
  function isRadioOrCheckbox(node, options) {
364
401
  const { ts, ast } = options;
@@ -398,6 +435,9 @@ type __VLS_GetModels<P, E = __VLS_PropsToEmits<P>> = P extends object
398
435
  : never]: K extends keyof P ? P[K] : never
399
436
  }
400
437
  : {};
438
+ type __VLS_GetModifierProps<T, K extends string> = K extends keyof T
439
+ ? NonNullable<T[K]>
440
+ : Record<symbol, never>;
401
441
  `);
402
442
  }
403
443
  function transformVOn(nodes, ctxMap, options) {
@@ -460,15 +500,21 @@ function transformVSlot(nodeMap, ctxMap, options) {
460
500
  else if (`${prefix}else` === vIfAttributeName) result.push("{");
461
501
  }
462
502
  if (vForAttribute) result.push("...", ...resolveVFor(vForAttribute, options), "({");
463
- let isDynamic = false;
464
- let attributeName = attribute.name.getText(ast).slice(6).split(/\s/)[0].replace(/\$(.*)\$/, (_, $1) => {
465
- isDynamic = true;
466
- return $1.replaceAll("_", ".");
467
- });
468
- const isNamespace = attributeName.startsWith(":");
469
- attributeName = attributeName.slice(1);
470
- const wrapByQuotes = !attributeName || attributeName.includes("-");
471
- result.push(isNamespace ? [isDynamic ? `[${attributeName}]` : wrapByQuotes ? `'${attributeName}'` : attributeName, attribute.name.getStart(ast) + (wrapByQuotes ? 6 : 7)] : "default", `: (`, ...(!isNamespace || attributeName) && attribute.initializer && ts.isJsxExpression(attribute.initializer) && attribute.initializer.expression ? [[attribute.initializer.expression.getText(ast), attribute.initializer.expression.getStart(ast)], isDynamic ? ": any" : ""] : [], ") => <>", ...children.map((child) => {
503
+ const { name, argument, argumentCode, valueCode, isDynamic } = getDirectiveArgs(attribute, options);
504
+ const offset = attribute.getStart(ast) + name.length;
505
+ result.push(isDynamic ? "[" : "", ...argument ? [
506
+ argument.includes("-") ? [
507
+ `'`,
508
+ offset + 1,
509
+ { verification: true }
510
+ ] : "",
511
+ [argument, offset + 1 + (isDynamic ? 1 : 0)],
512
+ argument.includes("-") ? [
513
+ `'`,
514
+ offset + argument.length,
515
+ { verification: true }
516
+ ] : ""
517
+ ] : [argumentCode || "default"], isDynamic ? "]" : "", `: (`, ...valueCode ? [valueCode, isDynamic ? ": any" : ""] : [], ") => <>", ...children.map((child) => {
472
518
  codes.replaceRange(child.pos, child.end);
473
519
  const isSlotTemplate = getTagName(child, options) === "template" && !vSlotAttribute;
474
520
  const node$1 = isSlotTemplate && ts.isJsxElement(child) ? child.children : child;
@@ -676,7 +722,7 @@ const plugin$2 = (0, ts_macro.createPlugin)(({ ts, vueCompilerOptions }, options
676
722
  var jsx_directive_default = plugin$2;
677
723
 
678
724
  //#endregion
679
- //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.2_patch_hash=0c8e80125adad1ff087195b3b3c1aad5bb1392f1c5dfe7d84145_7b274381fa4fb7e0ad99c5d1af9cbc92/node_modules/@vue-macros/volar/dist/jsx-ref-DZlb-F7c.js
725
+ //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.4_patch_hash=6ca9aac764781d42cb930c1f62df7446f01fc5a40603f75f7a0c_f678b1758eb5df936adf57a88134fc6f/node_modules/@vue-macros/volar/dist/jsx-ref-DZlb-F7c.js
680
726
  function transformRef({ nodes, codes, ts }) {
681
727
  for (const { name, initializer } of nodes) if (ts.isCallExpression(initializer)) codes.replaceRange(initializer.expression.end, initializer.expression.end, `<Parameters<typeof __VLS_ctx_${name.text}['expose']>[0] | null>`);
682
728
  }
package/dist/volar.js CHANGED
@@ -2,7 +2,46 @@ import jsxMacros from "@vue-jsx-vapor/macros/volar";
2
2
  import { allCodeFeatures, createPlugin } from "ts-macro";
3
3
  import { isHTMLTag, isSVGTag } from "@vue/shared";
4
4
 
5
- //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.2_patch_hash=0c8e80125adad1ff087195b3b3c1aad5bb1392f1c5dfe7d84145_7b274381fa4fb7e0ad99c5d1af9cbc92/node_modules/@vue-macros/volar/dist/jsx-directive-Cfx4Hdxx.js
5
+ //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.4_patch_hash=6ca9aac764781d42cb930c1f62df7446f01fc5a40603f75f7a0c_f678b1758eb5df936adf57a88134fc6f/node_modules/@vue-macros/volar/dist/jsx-directive-w2gUTWdx.js
6
+ function getDirectiveArgs(attribute, options) {
7
+ const { ts, ast } = options;
8
+ const attributeName = attribute.name.getText(ast);
9
+ let isDynamic = false;
10
+ let argument = "";
11
+ let [name, ...modifiers] = attributeName.split(/\s/)[0].replace(/\$([^$]+)\$/, (_, $1) => {
12
+ isDynamic = true;
13
+ return $1.replaceAll("_", ".");
14
+ }).split("_");
15
+ if (name.includes(":")) [name, argument] = name.split(":");
16
+ const initializer = attribute.initializer;
17
+ let modifiersCode;
18
+ let valueCode;
19
+ let argumentCode;
20
+ if (initializer && initializer.kind === ts.SyntaxKind.JsxExpression && initializer.expression && ts.isArrayLiteralExpression(initializer.expression)) {
21
+ const elements = initializer.expression.elements;
22
+ if (elements[0]) valueCode = [elements[0].getText(ast), elements[0].getStart(ast)];
23
+ if (elements[1] && ts.isArrayLiteralExpression(elements[1])) modifiersCode = [elements[1].getText(ast), elements[1].getStart(ast)];
24
+ else {
25
+ if (!argument && elements[1]) {
26
+ isDynamic ||= !ts.isStringLiteral(elements[1]);
27
+ argumentCode = [elements[1].getText(ast), elements[1].getStart(ast)];
28
+ }
29
+ if (elements[2] && ts.isArrayLiteralExpression(elements[2])) modifiersCode = [elements[2].getText(ast), elements[2].getStart(ast)];
30
+ }
31
+ } else if (initializer) valueCode = [ts.isStringLiteral(attribute.initializer) ? attribute.initializer.getText(ast) : attribute.initializer.getText(ast).slice(1, -1), attribute.initializer.getStart(ast) + (ts.isStringLiteral(attribute.initializer) ? 0 : 1)];
32
+ return {
33
+ name,
34
+ valueCode,
35
+ argumentCode,
36
+ modifiersCode,
37
+ isDynamic,
38
+ argument,
39
+ modifiers
40
+ };
41
+ }
42
+ const getModifierPropName = (name) => {
43
+ return `${name === "modelValue" || name === "model-value" ? "model" : name}Modifiers${name === "model" ? "$" : ""}`;
44
+ };
6
45
  function resolveCtxMap(ctxNodeMap, options) {
7
46
  if (ctxNodeMap.size) options.codes.push(`
8
47
  type __VLS_IsAny<T> = 0 extends 1 & T ? true : false;
@@ -58,7 +97,7 @@ declare function __VLS_asFunctionalComponent<
58
97
  expose?: any
59
98
  slots?: any
60
99
  emit?: any
61
- }
100
+ }
62
101
  };
63
102
  const __VLS_nativeElements = {
64
103
  ...{} as SVGElementTagNameMap,
@@ -70,9 +109,9 @@ declare function __VLS_getFunctionalComponentCtx<T, K, const S>(
70
109
  s: S,
71
110
  ): S extends keyof typeof __VLS_nativeElements
72
111
  ? { expose: (exposed: (typeof __VLS_nativeElements)[S]) => any }
73
- : '__ctx' extends keyof __VLS_PickNotAny<K, {}>
112
+ : '__ctx' extends keyof __VLS_PickNotAny<K, {}>
74
113
  ? K extends { __ctx?: infer Ctx } ? Ctx : never
75
- : T extends (props: infer P, ctx: { expose: (exposed: infer Exposed) => void } & infer Ctx) => any
114
+ : T extends (props: infer P, ctx: { expose: (exposed: infer Exposed) => void } & infer Ctx) => any
76
115
  ? Ctx & {
77
116
  props: P,
78
117
  expose: (
@@ -98,8 +137,11 @@ function transformCtx(node, root, index, options) {
98
137
  continue;
99
138
  }
100
139
  const prefixModel = `${prefix}model`;
101
- if (name.startsWith(prefixModel)) name = name.split("$")[0].split("_")[0].split(":")[1] ?? "modelValue";
102
- else if (name.includes("_")) name = name.split("_")[0];
140
+ if (name.startsWith(prefixModel)) {
141
+ const dir = getDirectiveArgs(prop, options);
142
+ if (dir.valueCode && !dir.isDynamic) props += `'${dir.argument || dir.argumentCode?.[0].slice(1, -1) || "modelValue"}': ${dir.valueCode[0]},`;
143
+ continue;
144
+ } else if (name.includes("_")) name = name.split("_")[0];
103
145
  else if (prefix && name.startsWith(prefix)) continue;
104
146
  if (!name) continue;
105
147
  const value = prop.initializer ? ts.isJsxExpression(prop.initializer) && prop.initializer.expression ? prop.initializer.expression.getText(ast) : prop.initializer.getText(ast) : "true";
@@ -144,30 +186,47 @@ function transformCustomDirective(attributes, options) {
144
186
  options.codes.push(`
145
187
  type __VLS_ResolveDirective<T> = T extends import('vue').Directive<
146
188
  any,
147
- infer V,
148
- infer M extends string,
149
- infer A extends string
189
+ infer Value,
190
+ infer Modifiers extends string,
191
+ infer Argument extends string
150
192
  >
151
- ? [any, V, A, Record<M, true>]
193
+ ? [Value, Argument, Array<Modifiers>]
152
194
  : any;
153
195
  `);
154
196
  }
155
197
  function transform$1(attribute, options) {
156
- const { codes, ts, ast } = options;
157
- const attributeName = attribute.name.getText(ast);
158
- let directiveName = attributeName.split(/\s/)[0].split("v-")[1];
159
- let modifiers = [];
160
- if (directiveName.includes("_")) [directiveName, ...modifiers] = directiveName.split("_");
161
- if (directiveName) directiveName = directiveName[0].toUpperCase() + directiveName.slice(1);
162
- let arg;
163
- if (directiveName.includes(":")) [directiveName, arg] = directiveName.split(":");
198
+ const { codes, ast } = options;
199
+ const { name, modifiersCode, argument, modifiers, argumentCode, valueCode, isDynamic } = getDirectiveArgs(attribute, options);
164
200
  const start = attribute.getStart(ast);
165
- const offset = start + directiveName.length + 2;
166
201
  codes.replaceRange(start, attribute.end, [
167
- ast.text.slice(start, offset),
202
+ ast.text.slice(start, start + name.length),
168
203
  start,
169
204
  { verification: true }
170
- ], `={[`, [
205
+ ], `={[`, valueCode || "{} as any", ",", ...argument ? [
206
+ ...isDynamic && !argument.includes("-") ? [] : [[
207
+ `'`,
208
+ start + name.length + 1,
209
+ { verification: true }
210
+ ]],
211
+ [argument, start + name.length + 1 + (isDynamic ? 1 : 0)],
212
+ ...isDynamic && !argument.includes("-") ? [] : [[
213
+ `'`,
214
+ start + name.length + argument.length,
215
+ { verification: true }
216
+ ]]
217
+ ] : argumentCode ? [argumentCode] : ["{} as any"], ",", ...modifiersCode ? [modifiersCode] : modifiers.length ? [
218
+ "[",
219
+ ...modifiers.flatMap((modify, index) => {
220
+ const offset = start + name.length + (argument ? argument.length + 1 : 0) + (argument && isDynamic ? 2 : 0) + 1 + (index ? modifiers.slice(0, index).join("").length + index : 0);
221
+ return [
222
+ [`'`, offset],
223
+ [modify, offset],
224
+ [`'`, offset + modify.length - 1],
225
+ ","
226
+ ];
227
+ }),
228
+ "]"
229
+ ] : ["{} as any"], `] satisfies __VLS_ResolveDirective<typeof `, [
171
230
  `v`,
172
231
  start,
173
232
  {
@@ -175,33 +234,13 @@ function transform$1(attribute, options) {
175
234
  verification: false
176
235
  }
177
236
  ], [
178
- directiveName,
237
+ name[2].toUpperCase() + name.slice(3),
179
238
  start + 2,
180
239
  {
181
240
  ...allCodeFeatures,
182
241
  verification: false
183
242
  }
184
- ], `,`, attribute.initializer ? [ts.isStringLiteral(attribute.initializer) ? attribute.initializer.getText(ast) : attribute.initializer.getText(ast).slice(1, -1), attribute.initializer.getStart(ast) + (ts.isStringLiteral(attribute.initializer) ? 0 : 1)] : "{} as any", ",", ...arg === void 0 ? ["{} as any"] : [
185
- [
186
- `'`,
187
- offset + 1,
188
- { verification: true }
189
- ],
190
- [arg, offset + 1],
191
- [
192
- `'`,
193
- offset + arg.length,
194
- { verification: true }
195
- ]
196
- ], ",", ...modifiers.length ? [
197
- "{",
198
- ...modifiers.flatMap((modify, index) => [
199
- modify ? "" : `'`,
200
- [modify, attribute.getStart(ast) + (attributeName.indexOf("_") + 1) + (index ? modifiers.slice(0, index).join("").length + index : 0)],
201
- modify ? ": true," : `'`
202
- ]),
203
- "}"
204
- ] : ["{} as any"], `] satisfies __VLS_ResolveDirective<typeof v${directiveName}>}`);
243
+ ], `>}`);
205
244
  }
206
245
  function transformRef$1(nodes, ctxMap, options) {
207
246
  const { codes, ts, ast } = options;
@@ -293,69 +332,67 @@ function transformVModel(nodeMap, ctxMap, options) {
293
332
  getModelsType(options.codes);
294
333
  }
295
334
  function transform(nodes, ctxMap, options) {
296
- const { codes, ts, ast, prefix } = options;
335
+ const { codes, ast } = options;
297
336
  let firstNamespacedNode;
298
337
  const result = [];
299
338
  const emitsResult = [];
300
339
  const modifiersResult = [];
301
- const offset = `${prefix}model`.length + 1;
302
- for (const { attribute: attribute$1, node: node$1 } of nodes) {
303
- const isNative = isNativeFormElement(getTagName(node$1, options));
340
+ for (const { attribute, node } of nodes) {
341
+ const isNative = isNativeFormElement(getTagName(node, options));
304
342
  const modelValue = isNative ? "value" : "modelValue";
305
- const isArrayExpression = attribute$1.initializer && ts.isJsxExpression(attribute$1.initializer) && attribute$1.initializer.expression && ts.isArrayLiteralExpression(attribute$1.initializer.expression);
306
- const name = attribute$1.name.getText(ast);
307
- const start = attribute$1.name.getStart(ast);
308
- if (name.startsWith(`${prefix}model:`) || isArrayExpression) {
309
- let isDynamic = false;
310
- const [attributeName$1, ...modifiers] = name.slice(offset).split(/\s/)[0].replace(/^\$(.*)\$/, (_, $1) => {
311
- isDynamic = true;
312
- return $1.replaceAll("_", ".");
313
- }).split("_");
314
- firstNamespacedNode ??= {
315
- attribute: attribute$1,
316
- attributeName: attributeName$1,
317
- node: node$1
318
- };
319
- if (firstNamespacedNode.attribute !== attribute$1) {
320
- codes.replaceRange(attribute$1.getStart(ast), attribute$1.end);
321
- result.push(",");
322
- }
323
- if (isArrayExpression) {
324
- const { elements } = attribute$1.initializer.expression;
325
- if (elements[1] && !ts.isArrayLiteralExpression(elements[1])) {
326
- isDynamic = !ts.isStringLiteral(elements[1]);
327
- result.push(isDynamic ? "[`${" : "", [elements[1].getText(ast), elements[1].getStart(ast)], isDynamic ? "}`]" : "");
328
- } else result.push(modelValue);
329
- if (elements[0]) result.push(":", [elements[0].getText(ast), elements[0].getStart(ast)]);
330
- } else {
331
- result.push(isDynamic ? "[`${" : "", ...attributeName$1.split("-").map((code, index, codes$1) => [index ? code.at(0)?.toUpperCase() + code.slice(1) : code, start + offset + (isDynamic ? 1 : 0) + (index && codes$1[index - 1].length + 1)]), isDynamic ? "}`]" : "");
332
- if (attributeName$1) {
333
- if (attribute$1.initializer && ts.isJsxExpression(attribute$1.initializer) && attribute$1.initializer.expression) result.push(":", [attribute$1.initializer.expression.getText(ast), attribute$1.initializer.expression.getStart(ast)]);
334
- if (!isDynamic && modifiers.length) modifiersResult.push(` {...{`, ...modifiers.flatMap((modify, index) => [
335
- modify ? "" : `'`,
336
- [modify, start + offset + attributeName$1.length + 1 + (index ? modifiers.slice(0, index).join("").length + index : 0)],
337
- modify ? ": true, " : `'`
338
- ]), `} satisfies typeof ${ctxMap.get(node$1)}.props.${attributeName$1}Modifiers}`);
339
- }
340
- }
341
- emitsResult.push(`'onUpdate:${attributeName$1}': () => {}, `);
342
- } else {
343
- const [, ...modifiers] = name.split("_");
343
+ const { name, argument, argumentCode, isDynamic, modifiers, modifiersCode, valueCode } = getDirectiveArgs(attribute, options);
344
+ if (!valueCode) continue;
345
+ const start = attribute.name.getStart(ast);
346
+ const resolvedArgument = argument || argumentCode?.[0].slice(1, -1) || modelValue;
347
+ const modifierProps = isDynamic ? "Record<string, true>" : `__VLS_GetModifierProps<typeof ${ctxMap.get(node)}.props, '${getModifierPropName(resolvedArgument)}'>`;
348
+ if (!argument && !argumentCode) {
344
349
  const result$1 = [];
345
- result$1.push(...isNative ? isRadioOrCheckbox(node$1, options) ? "v-model" : [[modelValue, start + 2]] : [[modelValue.slice(0, 3), start], [modelValue.slice(3), start]]);
346
- if (modifiers.length) result$1.unshift(`{...{`, ...modifiers.flatMap((modify, index) => [
347
- modify ? "" : `'`,
348
- [modify, start + offset + (index ? modifiers.slice(0, index).join("").length + index : 0)],
349
- modify ? ": true, " : `'`
350
- ]), `} satisfies `, isNative ? "{ trim?: true, number?: true, lazy?: true}" : `typeof ${ctxMap.get(node$1)}.props.modelValueModifiers`, `} `);
350
+ result$1.push(...isNative ? isRadioOrCheckbox(node, options) ? "v-model" : [[modelValue, start + 2]] : [[modelValue.slice(0, 3), start], [modelValue.slice(3), start]]);
351
+ if (modifiers.length || modifiersCode) result$1.unshift(`{...`, ...modifiersCode ? [modifiersCode] : modifiers.length ? [
352
+ "{",
353
+ ...modifiers.flatMap((modify, index) => [
354
+ modify ? modify.includes("-") ? `'` : "" : `'`,
355
+ [modify, start + name.length + 1 + (index ? modifiers.slice(0, index).join("").length + index : 0)],
356
+ modify ? `${modify.includes("-") ? `'` : ""}: true, ` : `'`
357
+ ]),
358
+ "}"
359
+ ] : [], ` satisfies `, isNative ? modifiersCode ? `('trim' | 'number' | 'lazy')[]` : `{ trim?: true, number?: true, lazy?: true }` : modifiersCode ? `(keyof ${modifierProps})[]` : modifierProps, "} ");
351
360
  if (!isNative) result$1.unshift(`{...{'onUpdate:${modelValue}': () => {} }} `);
352
- codes.replaceRange(start, attribute$1.name.end, ...result$1);
361
+ codes.replaceRange(start, attribute.end, ...result$1, "={", valueCode, "}");
362
+ } else {
363
+ if (firstNamespacedNode) {
364
+ codes.replaceRange(attribute.getStart(ast), attribute.end);
365
+ result.push(",");
366
+ } else firstNamespacedNode = {
367
+ attribute,
368
+ node
369
+ };
370
+ result.push(isDynamic ? "[" : "", ...argument ? [
371
+ argument.includes("-") ? [
372
+ `'`,
373
+ start + name.length + 1,
374
+ { verification: true }
375
+ ] : "",
376
+ [argument, start + name.length + 1 + (isDynamic ? 1 : 0)],
377
+ argument.includes("-") ? [
378
+ `'`,
379
+ start + name.length + argument.length,
380
+ { verification: true }
381
+ ] : ""
382
+ ] : argumentCode ? [argumentCode] : [modelValue], isDynamic ? "]" : "", ":", valueCode);
383
+ if (modifiersCode) modifiersResult.push(` {...`, modifiersCode, ` satisfies (keyof ${modifierProps})[]}`);
384
+ else if (modifiers.length) modifiersResult.push(` {...{`, ...modifiers.flatMap((modify, index) => [
385
+ modify ? modify.includes("-") ? `'` : "" : `'`,
386
+ [modify, start + name.length + (argument ? argument.length : -1) + (argument && isDynamic ? 4 : 2) + (index ? modifiers.slice(0, index).join("").length + index : 0)],
387
+ modify ? `${modify.includes("-") ? `'` : ""}: true, ` : `'`
388
+ ]), "} satisfies ", modifierProps, "}");
389
+ if (!isDynamic) emitsResult.push(`'onUpdate:${resolvedArgument}': () => {}, `);
353
390
  }
354
391
  }
355
- if (!firstNamespacedNode) return;
356
- const { attribute, attributeName, node } = firstNamespacedNode;
357
- const end = attributeName ? attribute.end : attribute.getStart(ast) + offset;
358
- codes.replaceRange(attribute.getStart(ast), end, `{...{`, ...result, `} satisfies __VLS_GetModels<__VLS_NormalizeProps<typeof ${ctxMap.get(node)}.props>>}`, ...modifiersResult, ` {...{`, ...emitsResult, `}}`);
392
+ if (firstNamespacedNode) {
393
+ const { attribute, node } = firstNamespacedNode;
394
+ codes.replaceRange(attribute.getStart(ast), attribute.end, `{...{`, ...result, `} satisfies __VLS_GetModels<__VLS_NormalizeProps<typeof ${ctxMap.get(node)}.props>>}`, ...modifiersResult, ` {...{`, ...emitsResult, `}}`);
395
+ }
359
396
  }
360
397
  function isRadioOrCheckbox(node, options) {
361
398
  const { ts, ast } = options;
@@ -395,6 +432,9 @@ type __VLS_GetModels<P, E = __VLS_PropsToEmits<P>> = P extends object
395
432
  : never]: K extends keyof P ? P[K] : never
396
433
  }
397
434
  : {};
435
+ type __VLS_GetModifierProps<T, K extends string> = K extends keyof T
436
+ ? NonNullable<T[K]>
437
+ : Record<symbol, never>;
398
438
  `);
399
439
  }
400
440
  function transformVOn(nodes, ctxMap, options) {
@@ -457,15 +497,21 @@ function transformVSlot(nodeMap, ctxMap, options) {
457
497
  else if (`${prefix}else` === vIfAttributeName) result.push("{");
458
498
  }
459
499
  if (vForAttribute) result.push("...", ...resolveVFor(vForAttribute, options), "({");
460
- let isDynamic = false;
461
- let attributeName = attribute.name.getText(ast).slice(6).split(/\s/)[0].replace(/\$(.*)\$/, (_, $1) => {
462
- isDynamic = true;
463
- return $1.replaceAll("_", ".");
464
- });
465
- const isNamespace = attributeName.startsWith(":");
466
- attributeName = attributeName.slice(1);
467
- const wrapByQuotes = !attributeName || attributeName.includes("-");
468
- result.push(isNamespace ? [isDynamic ? `[${attributeName}]` : wrapByQuotes ? `'${attributeName}'` : attributeName, attribute.name.getStart(ast) + (wrapByQuotes ? 6 : 7)] : "default", `: (`, ...(!isNamespace || attributeName) && attribute.initializer && ts.isJsxExpression(attribute.initializer) && attribute.initializer.expression ? [[attribute.initializer.expression.getText(ast), attribute.initializer.expression.getStart(ast)], isDynamic ? ": any" : ""] : [], ") => <>", ...children.map((child) => {
500
+ const { name, argument, argumentCode, valueCode, isDynamic } = getDirectiveArgs(attribute, options);
501
+ const offset = attribute.getStart(ast) + name.length;
502
+ result.push(isDynamic ? "[" : "", ...argument ? [
503
+ argument.includes("-") ? [
504
+ `'`,
505
+ offset + 1,
506
+ { verification: true }
507
+ ] : "",
508
+ [argument, offset + 1 + (isDynamic ? 1 : 0)],
509
+ argument.includes("-") ? [
510
+ `'`,
511
+ offset + argument.length,
512
+ { verification: true }
513
+ ] : ""
514
+ ] : [argumentCode || "default"], isDynamic ? "]" : "", `: (`, ...valueCode ? [valueCode, isDynamic ? ": any" : ""] : [], ") => <>", ...children.map((child) => {
469
515
  codes.replaceRange(child.pos, child.end);
470
516
  const isSlotTemplate = getTagName(child, options) === "template" && !vSlotAttribute;
471
517
  const node$1 = isSlotTemplate && ts.isJsxElement(child) ? child.children : child;
@@ -673,7 +719,7 @@ const plugin$2 = createPlugin(({ ts, vueCompilerOptions }, options = vueCompiler
673
719
  var jsx_directive_default = plugin$2;
674
720
 
675
721
  //#endregion
676
- //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.2_patch_hash=0c8e80125adad1ff087195b3b3c1aad5bb1392f1c5dfe7d84145_7b274381fa4fb7e0ad99c5d1af9cbc92/node_modules/@vue-macros/volar/dist/jsx-ref-DZlb-F7c.js
722
+ //#region ../../node_modules/.pnpm/@vue-macros+volar@3.1.4_patch_hash=6ca9aac764781d42cb930c1f62df7446f01fc5a40603f75f7a0c_f678b1758eb5df936adf57a88134fc6f/node_modules/@vue-macros/volar/dist/jsx-ref-DZlb-F7c.js
677
723
  function transformRef({ nodes, codes, ts }) {
678
724
  for (const { name, initializer } of nodes) if (ts.isCallExpression(initializer)) codes.replaceRange(initializer.expression.end, initializer.expression.end, `<Parameters<typeof __VLS_ctx_${name.text}['expose']>[0] | null>`);
679
725
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "vue-jsx-vapor",
3
3
  "type": "module",
4
- "version": "3.2.18",
4
+ "version": "3.2.19",
5
5
  "description": "Vapor Mode of Vue JSX",
6
6
  "license": "MIT",
7
7
  "homepage": "https://github.com/vuejs/vue-jsx-vapor#readme",
@@ -171,20 +171,20 @@
171
171
  }
172
172
  },
173
173
  "dependencies": {
174
- "@vue/shared": "3.6.0-beta.16",
174
+ "@vue/shared": "3.6.0-rc.1",
175
175
  "pathe": "^2.0.3",
176
176
  "ts-macro": "^0.3.7",
177
177
  "unplugin": "^3.0.0",
178
178
  "unplugin-utils": "^0.3.1",
179
- "@vue-jsx-vapor/compiler-rs": "3.2.18",
180
- "@vue-jsx-vapor/macros": "3.2.18",
181
- "@vue-jsx-vapor/runtime": "3.2.18"
179
+ "@vue-jsx-vapor/compiler-rs": "3.2.19",
180
+ "@vue-jsx-vapor/runtime": "3.2.19",
181
+ "@vue-jsx-vapor/macros": "3.2.19"
182
182
  },
183
183
  "devDependencies": {
184
184
  "@nuxt/kit": "^3.21.4",
185
185
  "@nuxt/schema": "^3.21.4",
186
- "@vue-macros/volar": "^3.1.2",
187
- "vue": "3.6.0-beta.16"
186
+ "@vue-macros/volar": "^3.1.4",
187
+ "vue": "3.6.0-rc.1"
188
188
  },
189
189
  "scripts": {
190
190
  "build": "tsdown",