@vue/language-core 3.0.0-alpha.0 → 3.0.0-alpha.2
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.
- package/lib/codegen/globalTypes.js +2 -4
- package/lib/codegen/script/component.js +21 -9
- package/lib/codegen/script/index.js +1 -1
- package/lib/codegen/script/scriptSetup.js +1 -10
- package/lib/codegen/script/styleModulesType.d.ts +4 -0
- package/lib/codegen/script/styleModulesType.js +34 -0
- package/lib/codegen/template/context.d.ts +25 -17
- package/lib/codegen/template/context.js +87 -53
- package/lib/codegen/template/element.d.ts +2 -2
- package/lib/codegen/template/element.js +10 -24
- package/lib/codegen/template/elementChildren.d.ts +1 -1
- package/lib/codegen/template/elementChildren.js +4 -6
- package/lib/codegen/template/elementDirectives.js +1 -3
- package/lib/codegen/template/elementEvents.js +0 -1
- package/lib/codegen/template/elementProps.js +1 -1
- package/lib/codegen/template/index.js +20 -7
- package/lib/codegen/template/interpolation.d.ts +1 -1
- package/lib/codegen/template/interpolation.js +52 -52
- package/lib/codegen/template/slotOutlet.js +1 -2
- package/lib/codegen/template/templateChild.d.ts +1 -1
- package/lib/codegen/template/templateChild.js +12 -46
- package/lib/codegen/template/vFor.js +5 -10
- package/lib/codegen/template/vIf.js +2 -10
- package/lib/codegen/template/vSlot.d.ts +1 -2
- package/lib/codegen/template/vSlot.js +84 -62
- package/lib/codegen/utils/objectProperty.d.ts +3 -0
- package/lib/codegen/utils/objectProperty.js +41 -0
- package/lib/parsers/scriptSetupRanges.js +8 -6
- package/lib/plugins/vue-tsx.d.ts +24 -16
- package/lib/plugins/vue-tsx.js +31 -19
- package/lib/types.d.ts +1 -1
- package/lib/utils/forEachElementNode.d.ts +1 -0
- package/lib/utils/forEachElementNode.js +3 -0
- package/package.json +2 -2
|
@@ -5,4 +5,4 @@ export declare function generateInterpolation(options: {
|
|
|
5
5
|
ts: typeof ts;
|
|
6
6
|
destructuredPropNames: Set<string> | undefined;
|
|
7
7
|
templateRefNames: Set<string> | undefined;
|
|
8
|
-
}, ctx: TemplateCodegenContext, source: string, data: VueCodeInformation | ((offset: number) => VueCodeInformation) | undefined,
|
|
8
|
+
}, ctx: TemplateCodegenContext, source: string, data: VueCodeInformation | ((offset: number) => VueCodeInformation) | undefined, code: string, start: number | undefined, astHolder?: any, prefix?: string, suffix?: string): Generator<Code>;
|
|
@@ -4,17 +4,17 @@ exports.generateInterpolation = generateInterpolation;
|
|
|
4
4
|
const shared_1 = require("@vue/shared");
|
|
5
5
|
const shared_2 = require("../../utils/shared");
|
|
6
6
|
const utils_1 = require("../utils");
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
for (let [section, offset, type] of forEachInterpolationSegment(options.ts, options.destructuredPropNames, options.templateRefNames, ctx, code, start
|
|
7
|
+
// https://github.com/vuejs/core/blob/fb0c3ca519f1fccf52049cd6b8db3a67a669afe9/packages/compiler-core/src/transforms/transformExpression.ts#L47
|
|
8
|
+
const isLiteralWhitelisted = /*@__PURE__*/ (0, shared_1.makeMap)('true,false,null,this');
|
|
9
|
+
function* generateInterpolation(options, ctx, source, data, code, start, astHolder = {}, prefix = '', suffix = '') {
|
|
10
|
+
for (let [section, offset, type] of forEachInterpolationSegment(options.ts, options.destructuredPropNames, options.templateRefNames, ctx, code, start, astHolder, prefix, suffix)) {
|
|
11
11
|
if (offset === undefined) {
|
|
12
12
|
yield section;
|
|
13
13
|
}
|
|
14
14
|
else {
|
|
15
15
|
offset -= prefix.length;
|
|
16
16
|
let addSuffix = '';
|
|
17
|
-
const overLength = offset + section.length -
|
|
17
|
+
const overLength = offset + section.length - code.length;
|
|
18
18
|
if (overLength > 0) {
|
|
19
19
|
addSuffix = section.slice(section.length - overLength);
|
|
20
20
|
section = section.slice(0, -overLength);
|
|
@@ -46,58 +46,46 @@ function* generateInterpolation(options, ctx, source, data, _code, start, astHol
|
|
|
46
46
|
}
|
|
47
47
|
}
|
|
48
48
|
;
|
|
49
|
-
function* forEachInterpolationSegment(ts, destructuredPropNames, templateRefNames, ctx,
|
|
49
|
+
function* forEachInterpolationSegment(ts, destructuredPropNames, templateRefNames, ctx, originalCode, start, astHolder, prefix, suffix) {
|
|
50
|
+
const code = prefix + originalCode + suffix;
|
|
51
|
+
const offset = start !== undefined ? start - prefix.length : undefined;
|
|
50
52
|
let ctxVars = [];
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
return;
|
|
68
|
-
}
|
|
69
|
-
if (offset !== undefined) {
|
|
70
|
-
ctx.accessExternalVariable(text, offset + (0, shared_2.getStartEnd)(ts, id, ast).start);
|
|
71
|
-
}
|
|
72
|
-
else {
|
|
73
|
-
ctx.accessExternalVariable(text);
|
|
53
|
+
if (utils_1.identifierRegex.test(originalCode) && !shouldIdentifierSkipped(ctx, originalCode, destructuredPropNames)) {
|
|
54
|
+
ctxVars.push({
|
|
55
|
+
text: originalCode,
|
|
56
|
+
offset: prefix.length,
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
else {
|
|
60
|
+
const ast = (0, utils_1.createTsAst)(ts, astHolder, code);
|
|
61
|
+
const varCb = (id, isShorthand) => {
|
|
62
|
+
const text = (0, shared_2.getNodeText)(ts, id, ast);
|
|
63
|
+
if (!shouldIdentifierSkipped(ctx, text, destructuredPropNames)) {
|
|
64
|
+
ctxVars.push({
|
|
65
|
+
text,
|
|
66
|
+
offset: (0, shared_2.getStartEnd)(ts, id, ast).start,
|
|
67
|
+
isShorthand,
|
|
68
|
+
});
|
|
74
69
|
}
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
|
|
70
|
+
};
|
|
71
|
+
ts.forEachChild(ast, node => walkIdentifiers(ts, node, ast, varCb, ctx));
|
|
72
|
+
}
|
|
78
73
|
ctxVars = ctxVars.sort((a, b) => a.offset - b.offset);
|
|
79
74
|
if (ctxVars.length) {
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
yield [': ', undefined];
|
|
83
|
-
}
|
|
84
|
-
else if (ctxVars[0].offset > 0) {
|
|
85
|
-
yield [code.slice(0, ctxVars[0].offset), 0, 'startText'];
|
|
86
|
-
}
|
|
87
|
-
for (let i = 0; i < ctxVars.length - 1; i++) {
|
|
75
|
+
for (let i = 0; i < ctxVars.length; i++) {
|
|
76
|
+
const lastVar = ctxVars[i - 1];
|
|
88
77
|
const curVar = ctxVars[i];
|
|
89
|
-
const
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
yield [code.slice(curVar.offset + curVar.text.length, nextVar.offset + nextVar.text.length), curVar.offset + curVar.text.length];
|
|
78
|
+
const lastVarEnd = lastVar ? lastVar.offset + lastVar.text.length : 0;
|
|
79
|
+
if (curVar.isShorthand) {
|
|
80
|
+
yield [code.slice(lastVarEnd, curVar.offset + curVar.text.length), lastVarEnd];
|
|
93
81
|
yield [': ', undefined];
|
|
94
82
|
}
|
|
95
83
|
else {
|
|
96
|
-
yield [code.slice(
|
|
84
|
+
yield [code.slice(lastVarEnd, curVar.offset), lastVarEnd, i ? undefined : 'startText'];
|
|
97
85
|
}
|
|
86
|
+
yield* generateVar(templateRefNames, ctx, code, offset, curVar);
|
|
98
87
|
}
|
|
99
88
|
const lastVar = ctxVars.at(-1);
|
|
100
|
-
yield* generateVar(code, ctx.dollarVars, destructuredPropNames, templateRefNames, lastVar);
|
|
101
89
|
if (lastVar.offset + lastVar.text.length < code.length) {
|
|
102
90
|
yield [code.slice(lastVar.offset + lastVar.text.length), lastVar.offset + lastVar.text.length, 'endText'];
|
|
103
91
|
}
|
|
@@ -106,11 +94,10 @@ function* forEachInterpolationSegment(ts, destructuredPropNames, templateRefName
|
|
|
106
94
|
yield [code, 0];
|
|
107
95
|
}
|
|
108
96
|
}
|
|
109
|
-
function* generateVar(
|
|
97
|
+
function* generateVar(templateRefNames, ctx, code, offset, curVar) {
|
|
110
98
|
// fix https://github.com/vuejs/language-tools/issues/1205
|
|
111
99
|
// fix https://github.com/vuejs/language-tools/issues/1264
|
|
112
100
|
yield ['', curVar.offset, 'errorMappingOnly'];
|
|
113
|
-
const isDestructuredProp = destructuredPropNames?.has(curVar.text) ?? false;
|
|
114
101
|
const isTemplateRef = templateRefNames?.has(curVar.text) ?? false;
|
|
115
102
|
if (isTemplateRef) {
|
|
116
103
|
yield [`__VLS_unref(`, undefined];
|
|
@@ -118,12 +105,16 @@ function* generateVar(code, dollarVars, destructuredPropNames, templateRefNames,
|
|
|
118
105
|
yield [`)`, undefined];
|
|
119
106
|
}
|
|
120
107
|
else {
|
|
121
|
-
if (
|
|
122
|
-
|
|
108
|
+
if (offset !== undefined) {
|
|
109
|
+
ctx.accessExternalVariable(curVar.text, offset + curVar.offset);
|
|
123
110
|
}
|
|
124
|
-
else
|
|
125
|
-
|
|
111
|
+
else {
|
|
112
|
+
ctx.accessExternalVariable(curVar.text);
|
|
113
|
+
}
|
|
114
|
+
if (ctx.dollarVars.has(curVar.text)) {
|
|
115
|
+
yield [`__VLS_dollars.`, undefined];
|
|
126
116
|
}
|
|
117
|
+
yield [`__VLS_ctx.`, undefined];
|
|
127
118
|
yield [code.slice(curVar.offset, curVar.offset + curVar.text.length), curVar.offset];
|
|
128
119
|
}
|
|
129
120
|
}
|
|
@@ -222,4 +213,13 @@ function walkIdentifiersInTypeReference(ts, node, cb) {
|
|
|
222
213
|
ts.forEachChild(node, node => walkIdentifiersInTypeReference(ts, node, cb));
|
|
223
214
|
}
|
|
224
215
|
}
|
|
216
|
+
function shouldIdentifierSkipped(ctx, text, destructuredPropNames) {
|
|
217
|
+
return ctx.hasLocalVariable(text)
|
|
218
|
+
// https://github.com/vuejs/core/blob/245230e135152900189f13a4281302de45fdcfaa/packages/compiler-core/src/transforms/transformExpression.ts#L342-L352
|
|
219
|
+
|| (0, shared_1.isGloballyAllowed)(text)
|
|
220
|
+
|| isLiteralWhitelisted(text)
|
|
221
|
+
|| text === 'require'
|
|
222
|
+
|| text.startsWith('__VLS_')
|
|
223
|
+
|| destructuredPropNames?.has(text);
|
|
224
|
+
}
|
|
225
225
|
//# sourceMappingURL=interpolation.js.map
|
|
@@ -93,7 +93,6 @@ function* generateSlotOutlet(options, ctx, node) {
|
|
|
93
93
|
});
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
|
-
yield* ctx.
|
|
97
|
-
yield* (0, elementChildren_1.generateElementChildren)(options, ctx, node);
|
|
96
|
+
yield* (0, elementChildren_1.generateElementChildren)(options, ctx, node.children);
|
|
98
97
|
}
|
|
99
98
|
//# sourceMappingURL=slotOutlet.js.map
|
|
@@ -2,6 +2,6 @@ import * as CompilerDOM from '@vue/compiler-dom';
|
|
|
2
2
|
import type { Code } from '../../types';
|
|
3
3
|
import type { TemplateCodegenContext } from './context';
|
|
4
4
|
import type { TemplateCodegenOptions } from './index';
|
|
5
|
-
export declare function generateTemplateChild(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.RootNode | CompilerDOM.TemplateChildNode | CompilerDOM.SimpleExpressionNode,
|
|
5
|
+
export declare function generateTemplateChild(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.RootNode | CompilerDOM.TemplateChildNode | CompilerDOM.SimpleExpressionNode, enterNode?: boolean): Generator<Code>;
|
|
6
6
|
export declare function getVForNode(node: CompilerDOM.ElementNode): CompilerDOM.ForNode | undefined;
|
|
7
7
|
export declare function parseInterpolationNode(node: CompilerDOM.InterpolationNode, template: string): readonly [string, number];
|
|
@@ -7,12 +7,12 @@ const CompilerDOM = require("@vue/compiler-dom");
|
|
|
7
7
|
const shared_1 = require("../../utils/shared");
|
|
8
8
|
const utils_1 = require("../utils");
|
|
9
9
|
const element_1 = require("./element");
|
|
10
|
+
const elementChildren_1 = require("./elementChildren");
|
|
10
11
|
const interpolation_1 = require("./interpolation");
|
|
11
12
|
const slotOutlet_1 = require("./slotOutlet");
|
|
12
13
|
const vFor_1 = require("./vFor");
|
|
13
14
|
const vIf_1 = require("./vIf");
|
|
14
15
|
const vSlot_1 = require("./vSlot");
|
|
15
|
-
const commentDirectiveRegex = /^<!--\s*@vue-(?<name>[-\w]+)\b(?<content>[\s\S]*)-->$/;
|
|
16
16
|
// @ts-ignore
|
|
17
17
|
const transformContext = {
|
|
18
18
|
onError: () => { },
|
|
@@ -28,36 +28,9 @@ const transformContext = {
|
|
|
28
28
|
},
|
|
29
29
|
expressionPlugins: ['typescript'],
|
|
30
30
|
};
|
|
31
|
-
function* generateTemplateChild(options, ctx, node,
|
|
32
|
-
if (
|
|
33
|
-
|
|
34
|
-
if (match) {
|
|
35
|
-
const { name, content } = match.groups;
|
|
36
|
-
switch (name) {
|
|
37
|
-
case 'skip': {
|
|
38
|
-
yield `// @vue-skip${utils_1.newLine}`;
|
|
39
|
-
return;
|
|
40
|
-
}
|
|
41
|
-
case 'ignore': {
|
|
42
|
-
yield* ctx.ignoreError();
|
|
43
|
-
break;
|
|
44
|
-
}
|
|
45
|
-
case 'expect-error': {
|
|
46
|
-
yield* ctx.expectError(prevNode);
|
|
47
|
-
break;
|
|
48
|
-
}
|
|
49
|
-
case 'generic': {
|
|
50
|
-
const text = content.trim();
|
|
51
|
-
if (text.startsWith('{') && text.endsWith('}')) {
|
|
52
|
-
ctx.lastGenericComment = {
|
|
53
|
-
content: text.slice(1, -1),
|
|
54
|
-
offset: prevNode.loc.start.offset + prevNode.loc.source.indexOf('{') + 1,
|
|
55
|
-
};
|
|
56
|
-
}
|
|
57
|
-
break;
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
}
|
|
31
|
+
function* generateTemplateChild(options, ctx, node, enterNode = true) {
|
|
32
|
+
if (enterNode && !ctx.enter(node)) {
|
|
33
|
+
return;
|
|
61
34
|
}
|
|
62
35
|
const cur = node;
|
|
63
36
|
if (cur.codegenNode?.type === CompilerDOM.NodeTypes.JS_CACHE_EXPRESSION) {
|
|
@@ -67,12 +40,7 @@ function* generateTemplateChild(options, ctx, node, prevNode, isVForChild = fals
|
|
|
67
40
|
for (const item of collectSingleRootNodes(options, node.children)) {
|
|
68
41
|
ctx.singleRootNodes.add(item);
|
|
69
42
|
}
|
|
70
|
-
|
|
71
|
-
for (const childNode of node.children) {
|
|
72
|
-
yield* generateTemplateChild(options, ctx, childNode, prev);
|
|
73
|
-
prev = childNode;
|
|
74
|
-
}
|
|
75
|
-
yield* ctx.resetDirectiveComments('end of root');
|
|
43
|
+
yield* (0, elementChildren_1.generateElementChildren)(options, ctx, node.children);
|
|
76
44
|
}
|
|
77
45
|
else if (node.type === CompilerDOM.NodeTypes.ELEMENT) {
|
|
78
46
|
const vForNode = getVForNode(node);
|
|
@@ -95,32 +63,27 @@ function* generateTemplateChild(options, ctx, node, prevNode, isVForChild = fals
|
|
|
95
63
|
}
|
|
96
64
|
else if (node.tagType === CompilerDOM.ElementTypes.ELEMENT
|
|
97
65
|
|| node.tagType === CompilerDOM.ElementTypes.TEMPLATE) {
|
|
98
|
-
yield* (0, element_1.generateElement)(options, ctx, node
|
|
66
|
+
yield* (0, element_1.generateElement)(options, ctx, node);
|
|
99
67
|
}
|
|
100
68
|
else {
|
|
101
69
|
const { currentComponent } = ctx;
|
|
102
|
-
yield* (0, element_1.generateComponent)(options, ctx, node
|
|
70
|
+
yield* (0, element_1.generateComponent)(options, ctx, node);
|
|
103
71
|
ctx.currentComponent = currentComponent;
|
|
104
72
|
}
|
|
105
73
|
}
|
|
106
74
|
}
|
|
107
75
|
else if (node.type === CompilerDOM.NodeTypes.TEXT_CALL) {
|
|
108
76
|
// {{ var }}
|
|
109
|
-
yield* generateTemplateChild(options, ctx, node.content,
|
|
77
|
+
yield* generateTemplateChild(options, ctx, node.content, false);
|
|
110
78
|
}
|
|
111
79
|
else if (node.type === CompilerDOM.NodeTypes.COMPOUND_EXPRESSION) {
|
|
112
80
|
// {{ ... }} {{ ... }}
|
|
113
|
-
|
|
114
|
-
if (typeof childNode === 'object') {
|
|
115
|
-
yield* generateTemplateChild(options, ctx, childNode, undefined);
|
|
116
|
-
}
|
|
117
|
-
}
|
|
81
|
+
yield* (0, elementChildren_1.generateElementChildren)(options, ctx, node.children.filter(child => typeof child === 'object'), false);
|
|
118
82
|
}
|
|
119
83
|
else if (node.type === CompilerDOM.NodeTypes.INTERPOLATION) {
|
|
120
84
|
// {{ ... }}
|
|
121
85
|
const [content, start] = parseInterpolationNode(node, options.template.content);
|
|
122
86
|
yield* (0, interpolation_1.generateInterpolation)(options, ctx, 'template', ctx.codeFeatures.all, content, start, node.content.loc, `(`, `)${utils_1.endOfLine}`);
|
|
123
|
-
yield* ctx.resetDirectiveComments('end of INTERPOLATION');
|
|
124
87
|
}
|
|
125
88
|
else if (node.type === CompilerDOM.NodeTypes.IF) {
|
|
126
89
|
// v-if / v-else-if / v-else
|
|
@@ -133,6 +96,9 @@ function* generateTemplateChild(options, ctx, node, prevNode, isVForChild = fals
|
|
|
133
96
|
else if (node.type === CompilerDOM.NodeTypes.TEXT) {
|
|
134
97
|
// not needed progress
|
|
135
98
|
}
|
|
99
|
+
if (enterNode) {
|
|
100
|
+
yield* ctx.exit();
|
|
101
|
+
}
|
|
136
102
|
}
|
|
137
103
|
function* collectSingleRootNodes(options, children) {
|
|
138
104
|
if (children.length !== 1) {
|
|
@@ -4,8 +4,8 @@ exports.generateVFor = generateVFor;
|
|
|
4
4
|
exports.parseVForNode = parseVForNode;
|
|
5
5
|
const CompilerDOM = require("@vue/compiler-dom");
|
|
6
6
|
const utils_1 = require("../utils");
|
|
7
|
+
const elementChildren_1 = require("./elementChildren");
|
|
7
8
|
const interpolation_1 = require("./interpolation");
|
|
8
|
-
const templateChild_1 = require("./templateChild");
|
|
9
9
|
function* generateVFor(options, ctx, node) {
|
|
10
10
|
const { source } = node.parseResult;
|
|
11
11
|
const { leftExpressionRange, leftExpressionText } = parseVForNode(node);
|
|
@@ -52,18 +52,13 @@ function* generateVFor(options, ctx, node) {
|
|
|
52
52
|
}
|
|
53
53
|
}
|
|
54
54
|
}
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
for (const childNode of node.children) {
|
|
60
|
-
yield* (0, templateChild_1.generateTemplateChild)(options, ctx, childNode, prev, true);
|
|
61
|
-
prev = childNode;
|
|
62
|
-
}
|
|
55
|
+
const { inVFor } = ctx;
|
|
56
|
+
ctx.inVFor = true;
|
|
57
|
+
yield* (0, elementChildren_1.generateElementChildren)(options, ctx, node.children, isFragment);
|
|
58
|
+
ctx.inVFor = inVFor;
|
|
63
59
|
for (const varName of forBlockVars) {
|
|
64
60
|
ctx.removeLocalVariable(varName);
|
|
65
61
|
}
|
|
66
|
-
yield* ctx.generateAutoImportCompletion();
|
|
67
62
|
yield `}${utils_1.newLine}`;
|
|
68
63
|
}
|
|
69
64
|
function parseVForNode(node) {
|
|
@@ -4,8 +4,8 @@ exports.generateVIf = generateVIf;
|
|
|
4
4
|
const CompilerDOM = require("@vue/compiler-dom");
|
|
5
5
|
const muggle_string_1 = require("muggle-string");
|
|
6
6
|
const utils_1 = require("../utils");
|
|
7
|
+
const elementChildren_1 = require("./elementChildren");
|
|
7
8
|
const interpolation_1 = require("./interpolation");
|
|
8
|
-
const templateChild_1 = require("./templateChild");
|
|
9
9
|
function* generateVIf(options, ctx, node) {
|
|
10
10
|
const originalBlockConditionsLength = ctx.blockConditions.length;
|
|
11
11
|
for (let i = 0; i < node.branches.length; i++) {
|
|
@@ -28,15 +28,7 @@ function* generateVIf(options, ctx, node) {
|
|
|
28
28
|
yield ` `;
|
|
29
29
|
}
|
|
30
30
|
yield `{${utils_1.newLine}`;
|
|
31
|
-
|
|
32
|
-
yield* ctx.resetDirectiveComments('end of v-if start');
|
|
33
|
-
}
|
|
34
|
-
let prev;
|
|
35
|
-
for (const childNode of branch.children) {
|
|
36
|
-
yield* (0, templateChild_1.generateTemplateChild)(options, ctx, childNode, prev);
|
|
37
|
-
prev = childNode;
|
|
38
|
-
}
|
|
39
|
-
yield* ctx.generateAutoImportCompletion();
|
|
31
|
+
yield* (0, elementChildren_1.generateElementChildren)(options, ctx, branch.children, isFragment(node));
|
|
40
32
|
yield `}${utils_1.newLine}`;
|
|
41
33
|
if (addedBlockCondition) {
|
|
42
34
|
ctx.blockConditions[ctx.blockConditions.length - 1] = `!${ctx.blockConditions[ctx.blockConditions.length - 1]}`;
|
|
@@ -2,5 +2,4 @@ import * as CompilerDOM from '@vue/compiler-dom';
|
|
|
2
2
|
import type { Code } from '../../types';
|
|
3
3
|
import type { TemplateCodegenContext } from './context';
|
|
4
4
|
import type { TemplateCodegenOptions } from './index';
|
|
5
|
-
export declare function generateVSlot(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode, slotDir: CompilerDOM.DirectiveNode): Generator<Code>;
|
|
6
|
-
export declare function generateImplicitDefaultSlot(ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode): Generator<Code, void, any>;
|
|
5
|
+
export declare function generateVSlot(options: TemplateCodegenOptions, ctx: TemplateCodegenContext, node: CompilerDOM.ElementNode, slotDir: CompilerDOM.DirectiveNode | undefined): Generator<Code>;
|
|
@@ -1,93 +1,115 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.generateVSlot = generateVSlot;
|
|
4
|
-
exports.generateImplicitDefaultSlot = generateImplicitDefaultSlot;
|
|
5
4
|
const CompilerDOM = require("@vue/compiler-dom");
|
|
5
|
+
const shared_1 = require("../../utils/shared");
|
|
6
6
|
const utils_1 = require("../utils");
|
|
7
7
|
const wrapWith_1 = require("../utils/wrapWith");
|
|
8
|
+
const elementChildren_1 = require("./elementChildren");
|
|
8
9
|
const objectProperty_1 = require("./objectProperty");
|
|
9
|
-
const templateChild_1 = require("./templateChild");
|
|
10
10
|
function* generateVSlot(options, ctx, node, slotDir) {
|
|
11
11
|
if (!ctx.currentComponent) {
|
|
12
12
|
return;
|
|
13
13
|
}
|
|
14
|
-
ctx.currentComponent.used = true;
|
|
15
14
|
const slotBlockVars = [];
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
yield* (0, objectProperty_1.generateObjectProperty)(options, ctx, slotDir.arg.loc.source, slotDir.arg.loc.start.offset, slotDir.arg.isStatic ? ctx.codeFeatures.withoutHighlight : ctx.codeFeatures.all, slotDir.arg.loc, false, true);
|
|
15
|
+
const slotVar = ctx.getInternalVariable();
|
|
16
|
+
if (slotDir) {
|
|
17
|
+
yield `{${utils_1.newLine}`;
|
|
20
18
|
}
|
|
21
|
-
|
|
22
|
-
|
|
19
|
+
if (slotDir || node.children.length) {
|
|
20
|
+
ctx.currentComponent.used = true;
|
|
21
|
+
yield `const { `;
|
|
22
|
+
if (slotDir) {
|
|
23
|
+
if (slotDir.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION && slotDir.arg.content) {
|
|
24
|
+
yield* (0, objectProperty_1.generateObjectProperty)(options, ctx, slotDir.arg.loc.source, slotDir.arg.loc.start.offset, slotDir.arg.isStatic ? ctx.codeFeatures.withoutHighlight : ctx.codeFeatures.all, slotDir.arg.loc, false, true);
|
|
25
|
+
}
|
|
26
|
+
else {
|
|
27
|
+
yield* (0, wrapWith_1.wrapWith)(slotDir.loc.start.offset, slotDir.loc.start.offset + (slotDir.rawName?.length ?? 0), ctx.codeFeatures.withoutHighlightAndCompletion, `default`);
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
else {
|
|
31
|
+
yield* (0, wrapWith_1.wrapWith)(node.children[0].loc.start.offset, node.children.at(-1).loc.end.offset, ctx.codeFeatures.navigation, `default`);
|
|
32
|
+
}
|
|
33
|
+
yield `: ${slotVar} } = ${ctx.currentComponent.ctxVar}.slots!${utils_1.endOfLine}`;
|
|
23
34
|
}
|
|
24
|
-
|
|
25
|
-
if (slotDir.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
|
|
35
|
+
if (slotDir?.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
|
|
26
36
|
const slotAst = (0, utils_1.createTsAst)(options.ts, slotDir, `(${slotDir.exp.content}) => {}`);
|
|
27
37
|
(0, utils_1.collectVars)(options.ts, slotAst, slotAst, slotBlockVars);
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
38
|
+
yield* generateSlotParameters(options, ctx, slotAst, slotDir.exp, slotVar);
|
|
39
|
+
}
|
|
40
|
+
for (const varName of slotBlockVars) {
|
|
41
|
+
ctx.addLocalVariable(varName);
|
|
42
|
+
}
|
|
43
|
+
yield* (0, elementChildren_1.generateElementChildren)(options, ctx, node.children);
|
|
44
|
+
for (const varName of slotBlockVars) {
|
|
45
|
+
ctx.removeLocalVariable(varName);
|
|
46
|
+
}
|
|
47
|
+
if (slotDir) {
|
|
48
|
+
let isStatic = true;
|
|
49
|
+
if (slotDir.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION) {
|
|
50
|
+
isStatic = slotDir.arg.isStatic;
|
|
37
51
|
}
|
|
38
|
-
|
|
39
|
-
yield
|
|
52
|
+
if (isStatic && !slotDir.arg) {
|
|
53
|
+
yield `${ctx.currentComponent.ctxVar}.slots!['`;
|
|
40
54
|
yield [
|
|
41
|
-
|
|
55
|
+
'',
|
|
42
56
|
'template',
|
|
43
|
-
slotDir.
|
|
44
|
-
|
|
57
|
+
slotDir.loc.start.offset + (slotDir.loc.source.startsWith('#')
|
|
58
|
+
? '#'.length
|
|
59
|
+
: slotDir.loc.source.startsWith('v-slot:')
|
|
60
|
+
? 'v-slot:'.length
|
|
61
|
+
: 0),
|
|
62
|
+
ctx.codeFeatures.completion,
|
|
45
63
|
];
|
|
46
|
-
yield `
|
|
64
|
+
yield `'/* empty slot name completion */]${utils_1.endOfLine}`;
|
|
47
65
|
}
|
|
66
|
+
yield `}${utils_1.newLine}`;
|
|
48
67
|
}
|
|
49
|
-
|
|
50
|
-
|
|
68
|
+
}
|
|
69
|
+
function* generateSlotParameters(options, ctx, ast, exp, slotVar) {
|
|
70
|
+
const { ts } = options;
|
|
71
|
+
const statement = ast.statements[0];
|
|
72
|
+
if (!ts.isExpressionStatement(statement) || !ts.isArrowFunction(statement.expression)) {
|
|
73
|
+
return;
|
|
51
74
|
}
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
75
|
+
const { expression } = statement;
|
|
76
|
+
const startOffset = exp.loc.start.offset - 1;
|
|
77
|
+
const modifies = [];
|
|
78
|
+
const types = [];
|
|
79
|
+
for (const { name, type } of expression.parameters) {
|
|
80
|
+
if (type) {
|
|
81
|
+
modifies.push([
|
|
82
|
+
[``],
|
|
83
|
+
name.end,
|
|
84
|
+
type.end,
|
|
85
|
+
]);
|
|
86
|
+
types.push(chunk((0, shared_1.getStartEnd)(ts, type, ast).start, type.end));
|
|
87
|
+
}
|
|
88
|
+
else {
|
|
89
|
+
types.push(null);
|
|
90
|
+
}
|
|
57
91
|
}
|
|
58
|
-
|
|
59
|
-
|
|
92
|
+
yield `const [`;
|
|
93
|
+
let nextStart = 1;
|
|
94
|
+
for (const [codes, start, end] of modifies) {
|
|
95
|
+
yield chunk(nextStart, start);
|
|
96
|
+
yield* codes;
|
|
97
|
+
nextStart = end;
|
|
60
98
|
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
99
|
+
yield chunk(nextStart, expression.equalsGreaterThanToken.pos - 1);
|
|
100
|
+
yield `] = __VLS_getSlotParameters(${slotVar}`;
|
|
101
|
+
if (types.some(t => t)) {
|
|
102
|
+
yield `, `;
|
|
103
|
+
yield* (0, wrapWith_1.wrapWith)(exp.loc.start.offset, exp.loc.end.offset, ctx.codeFeatures.verification, `(`, ...types.flatMap(type => type ? [`_: `, type, `, `] : `_, `), `) => [] as any`);
|
|
64
104
|
}
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
105
|
+
yield `)${utils_1.endOfLine}`;
|
|
106
|
+
function chunk(start, end) {
|
|
107
|
+
return [
|
|
108
|
+
ast.text.slice(start, end),
|
|
69
109
|
'template',
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
: slotDir.loc.source.startsWith('v-slot:')
|
|
73
|
-
? 'v-slot:'.length
|
|
74
|
-
: 0),
|
|
75
|
-
ctx.codeFeatures.completion,
|
|
110
|
+
startOffset + start,
|
|
111
|
+
ctx.codeFeatures.all,
|
|
76
112
|
];
|
|
77
|
-
yield `'/* empty slot name completion */]${utils_1.endOfLine}`;
|
|
78
|
-
}
|
|
79
|
-
yield* ctx.generateAutoImportCompletion();
|
|
80
|
-
yield `}${utils_1.newLine}`;
|
|
81
|
-
}
|
|
82
|
-
function* generateImplicitDefaultSlot(ctx, node) {
|
|
83
|
-
if (!ctx.currentComponent) {
|
|
84
|
-
return;
|
|
85
|
-
}
|
|
86
|
-
if (node.children.length) {
|
|
87
|
-
ctx.currentComponent.used = true;
|
|
88
|
-
yield `${ctx.currentComponent.ctxVar}.slots!.`;
|
|
89
|
-
yield* (0, wrapWith_1.wrapWith)(node.children[0].loc.start.offset, node.children[node.children.length - 1].loc.end.offset, ctx.codeFeatures.navigation, `default`);
|
|
90
|
-
yield utils_1.endOfLine;
|
|
91
113
|
}
|
|
92
114
|
}
|
|
93
115
|
//# sourceMappingURL=vSlot.js.map
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { Code, VueCodeInformation } from '../../types';
|
|
2
|
+
export declare function getObjectProperty(code: string): string;
|
|
3
|
+
export declare function generateObjectProperty(code: string, source: string, offset: number, features: VueCodeInformation, hasQuotes?: boolean, shouldCamelize?: boolean): Generator<Code>;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getObjectProperty = getObjectProperty;
|
|
4
|
+
exports.generateObjectProperty = generateObjectProperty;
|
|
5
|
+
const shared_1 = require("@vue/shared");
|
|
6
|
+
const utils_1 = require("../utils");
|
|
7
|
+
const camelized_1 = require("../utils/camelized");
|
|
8
|
+
const stringLiteralKey_1 = require("../utils/stringLiteralKey");
|
|
9
|
+
function getObjectProperty(code) {
|
|
10
|
+
if (utils_1.identifierRegex.test(code)) {
|
|
11
|
+
return code;
|
|
12
|
+
}
|
|
13
|
+
else {
|
|
14
|
+
return `'${code}'`;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
function* generateObjectProperty(code, source, offset, features, hasQuotes = false, shouldCamelize = false) {
|
|
18
|
+
const start = offset;
|
|
19
|
+
const end = offset + code.length;
|
|
20
|
+
if (hasQuotes) {
|
|
21
|
+
code = code.slice(1, -1);
|
|
22
|
+
offset++;
|
|
23
|
+
}
|
|
24
|
+
if (shouldCamelize) {
|
|
25
|
+
if (utils_1.identifierRegex.test((0, shared_1.camelize)(code))) {
|
|
26
|
+
yield* (0, camelized_1.generateCamelized)(code, source, offset, features);
|
|
27
|
+
}
|
|
28
|
+
else {
|
|
29
|
+
yield* (0, utils_1.wrapWith)(start, end, source, features, `'`, ...(0, camelized_1.generateCamelized)(code, source, offset, features), `'`);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
else {
|
|
33
|
+
if (utils_1.identifierRegex.test(code)) {
|
|
34
|
+
yield [code, source, offset, features];
|
|
35
|
+
}
|
|
36
|
+
else {
|
|
37
|
+
yield* (0, stringLiteralKey_1.generateStringLiteralKey)(code, source, offset, features);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
//# sourceMappingURL=objectProperty.js.map
|
|
@@ -159,7 +159,7 @@ function parseScriptSetupRanges(ts, ast, vueCompilerOptions) {
|
|
|
159
159
|
defaultValue,
|
|
160
160
|
required,
|
|
161
161
|
isModel: isDefineModel,
|
|
162
|
-
comments:
|
|
162
|
+
comments: getClosestMultiLineCommentRange(ts, node, parents, ast),
|
|
163
163
|
argNode: options,
|
|
164
164
|
});
|
|
165
165
|
}
|
|
@@ -410,18 +410,20 @@ function getStatementRange(ts, parents, node, ast) {
|
|
|
410
410
|
}
|
|
411
411
|
return statementRange;
|
|
412
412
|
}
|
|
413
|
-
function
|
|
413
|
+
function getClosestMultiLineCommentRange(ts, node, parents, ast) {
|
|
414
414
|
for (let i = parents.length - 1; i >= 0; i--) {
|
|
415
415
|
if (ts.isStatement(node)) {
|
|
416
416
|
break;
|
|
417
417
|
}
|
|
418
418
|
node = parents[i];
|
|
419
419
|
}
|
|
420
|
-
const
|
|
421
|
-
|
|
420
|
+
const comment = ts.getLeadingCommentRanges(ast.text, node.pos)
|
|
421
|
+
?.reverse()
|
|
422
|
+
.find(range => range.kind === 3);
|
|
423
|
+
if (comment) {
|
|
422
424
|
return {
|
|
423
|
-
start:
|
|
424
|
-
end:
|
|
425
|
+
start: comment.pos,
|
|
426
|
+
end: comment.end,
|
|
425
427
|
};
|
|
426
428
|
}
|
|
427
429
|
}
|