-
-
Notifications
You must be signed in to change notification settings - Fork 366
/
slotOutlet.ts
112 lines (109 loc) · 3.42 KB
/
slotOutlet.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
import * as CompilerDOM from '@vue/compiler-dom';
import type { Code } from '../../types';
import { endOfLine, newLine, wrapWith } from '../common';
import type { TemplateCodegenContext } from './context';
import { generateElementChildren } from './elementChildren';
import { generateElementProps } from './elementProps';
import type { TemplateCodegenOptions } from './index';
import { generateInterpolation } from './interpolation';
export function* generateSlotOutlet(
options: TemplateCodegenOptions,
ctx: TemplateCodegenContext,
node: CompilerDOM.SlotOutletNode,
currentComponent: CompilerDOM.ElementNode | undefined,
componentCtxVar: string | undefined,
): Generator<Code> {
const startTagOffset = node.loc.start.offset + options.template.content.substring(node.loc.start.offset).indexOf(node.tag);
const varSlot = ctx.getInternalVariable();
const nameProp = node.props.find(prop => {
if (prop.type === CompilerDOM.NodeTypes.ATTRIBUTE) {
return prop.name === 'name';
}
if (
prop.type === CompilerDOM.NodeTypes.DIRECTIVE
&& prop.name === 'bind'
&& prop.arg?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
) {
return prop.arg.content === 'name';
}
});
if (options.hasDefineSlots) {
yield `__VLS_normalizeSlot(`;
yield* wrapWith(
node.loc.start.offset,
node.loc.end.offset,
ctx.codeFeatures.verification,
`${options.slotsAssignName ?? '__VLS_slots'}[`,
...wrapWith(
node.loc.start.offset,
node.loc.end.offset,
ctx.codeFeatures.verification,
nameProp?.type === CompilerDOM.NodeTypes.ATTRIBUTE && nameProp.value
? `'${nameProp.value.content}'`
: nameProp?.type === CompilerDOM.NodeTypes.DIRECTIVE && nameProp.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
? nameProp.exp.content
: `('default' as const)`
),
`]`,
);
yield `)?.(`;
yield* wrapWith(
startTagOffset,
startTagOffset + node.tag.length,
ctx.codeFeatures.verification,
`{${newLine}`,
...generateElementProps(options, ctx, node, node.props.filter(prop => prop !== nameProp), true),
`}`,
);
yield `)${endOfLine}`;
}
else {
yield `var ${varSlot} = {${newLine}`;
yield* generateElementProps(options, ctx, node, node.props.filter(prop => prop !== nameProp), true);
yield `}${endOfLine}`;
if (
nameProp?.type === CompilerDOM.NodeTypes.ATTRIBUTE
&& nameProp.value
) {
ctx.slots.push({
name: nameProp.value.content,
loc: nameProp.loc.start.offset + nameProp.loc.source.indexOf(nameProp.value.content, nameProp.name.length),
tagRange: [startTagOffset, startTagOffset + node.tag.length],
varName: varSlot,
nodeLoc: node.loc,
});
}
else if (
nameProp?.type === CompilerDOM.NodeTypes.DIRECTIVE
&& nameProp.exp?.type === CompilerDOM.NodeTypes.SIMPLE_EXPRESSION
) {
const slotExpVar = ctx.getInternalVariable();
yield `var ${slotExpVar} = `;
yield* generateInterpolation(
options,
ctx,
nameProp.exp.content,
nameProp.exp,
nameProp.exp.loc.start.offset,
ctx.codeFeatures.all,
'(',
')',
);
yield ` as const${endOfLine}`;
ctx.dynamicSlots.push({
expVar: slotExpVar,
varName: varSlot,
});
}
else {
ctx.slots.push({
name: 'default',
tagRange: [startTagOffset, startTagOffset + node.tag.length],
varName: varSlot,
nodeLoc: node.loc,
});
}
}
yield* ctx.generateAutoImportCompletion();
yield* generateElementChildren(options, ctx, node, currentComponent, componentCtxVar);
}