|
5 | 5 |
|
6 | 6 | const CODEMOD_ANALYSIS = process.env.CODEMOD_ANALYSIS; |
7 | 7 |
|
8 | | -function processChildren(children, asPrefix, b) { |
9 | | - let hasUpdatedChildren = false; |
10 | | - let processedChildren = []; |
11 | | - |
12 | | - children.forEach((child) => { |
13 | | - let updatedChild; |
14 | | - let isProcessed = false; |
15 | | - |
16 | | - // Check if the child is an ElementNode with the specified tag |
17 | | - if (child.type === 'ElementNode' && child.tag === `${asPrefix}.Interactive`) { |
18 | | - const textAttr = child.attributes.find((a) => a.name === '@text'); |
19 | | - |
20 | | - if (textAttr) { |
21 | | - const childOutputAttributes = child.attributes.filter((a) => a.name !== '@text'); |
22 | | - |
23 | | - const isHandlebarsAttr = textAttr.value.type === 'MustacheStatement'; |
24 | | - |
25 | | - let children = []; |
26 | | - |
27 | | - // Handle different types of MustacheStatement values |
28 | | - if (isHandlebarsAttr) { |
29 | | - if (textAttr.value.path.type === 'NumberLiteral') { |
30 | | - children = [b.mustache(b.number(textAttr.value.path.value))]; |
31 | | - } else if (textAttr.value.path.type === 'StringLiteral') { |
32 | | - children = [b.mustache(b.string(textAttr.value.path.value))]; |
33 | | - } else { |
34 | | - children = [ |
35 | | - b.mustache( |
36 | | - textAttr.value.path.original, |
37 | | - [...textAttr.value.params], |
38 | | - textAttr.value.hash |
39 | | - ), |
40 | | - ]; |
41 | | - } |
42 | | - } else { |
43 | | - children = [b.text(textAttr.value.chars)]; |
44 | | - } |
45 | | - |
46 | | - // Create a new element with the updated children and attributes |
47 | | - updatedChild = b.element( |
48 | | - { name: child.tag, selfClosing: false }, |
49 | | - { |
50 | | - children, |
51 | | - attrs: childOutputAttributes, |
52 | | - modifiers: child.modifiers, |
53 | | - blockParams: child.blockParams, |
54 | | - } |
55 | | - ); |
56 | | - |
57 | | - isProcessed = true; |
58 | | - } else { |
59 | | - updatedChild = child; |
60 | | - } |
61 | | - } else if (child.type === 'BlockStatement') { |
62 | | - // Recursively process children of BlockStatement nodes |
63 | | - const { hasUpdatedChildren: nestedHasUpdated, processedChildren: nestedProcessed } = |
64 | | - processChildren(child.program.body, asPrefix, b); |
65 | | - |
66 | | - if (nestedHasUpdated) { |
67 | | - updatedChild = b.block( |
68 | | - child.path, |
69 | | - child.params, |
70 | | - child.hash, |
71 | | - b.program(nestedProcessed, child.program.blockParams), |
72 | | - child.inverse |
73 | | - ); |
74 | | - isProcessed = true; |
75 | | - } else { |
76 | | - updatedChild = child; |
77 | | - } |
78 | | - } |
79 | | - |
80 | | - processedChildren.push(updatedChild || child); |
81 | | - hasUpdatedChildren = hasUpdatedChildren || isProcessed; |
82 | | - }); |
83 | | - |
84 | | - return { hasUpdatedChildren, processedChildren }; |
85 | | -} |
86 | | - |
87 | 8 | module.exports = function ({ source /*, path*/ }, { parse, visit }) { |
88 | 9 | const ast = parse(source); |
89 | 10 |
|
| 11 | + // A stack is used to correctly handle nested <Hds::Dropdown> components |
| 12 | + const asPrefixStack = []; |
| 13 | + |
90 | 14 | return visit(ast, (env) => { |
91 | | - let { builders: b } = env.syntax; |
| 15 | + const { builders: b } = env.syntax; |
92 | 16 |
|
93 | 17 | return { |
94 | | - ElementNode(node) { |
95 | | - // Check if the node is an Hds::Dropdown element |
96 | | - if (node.type === 'ElementNode' && node.tag === 'Hds::Dropdown') { |
97 | | - if (node.blockParams && node.blockParams.length > 0) { |
98 | | - const asPrefix = node.blockParams[0]; |
99 | | - |
100 | | - // Process the children of the Hds::Dropdown element |
101 | | - const { hasUpdatedChildren, processedChildren } = processChildren( |
102 | | - node.children, |
103 | | - asPrefix, |
104 | | - b |
105 | | - ); |
| 18 | + ElementNode: { |
| 19 | + // "enter" is called before visiting the node's children |
| 20 | + enter(node) { |
| 21 | + // If we encounter a Dropdown, push its `as` parameter onto the stack |
| 22 | + if (node.tag === 'Hds::Dropdown') { |
| 23 | + if (node.blockParams && node.blockParams.length > 0) { |
| 24 | + asPrefixStack.push(node.blockParams[0]); |
| 25 | + } else { |
| 26 | + // Push a falsy value to keep the stack balanced if there's no block param |
| 27 | + asPrefixStack.push(null); |
| 28 | + } |
| 29 | + } |
106 | 30 |
|
107 | | - // Return the updated element if any children were updated |
108 | | - if (hasUpdatedChildren && !CODEMOD_ANALYSIS) { |
109 | | - return [ |
110 | | - b.element( |
111 | | - { name: node.tag, selfClosing: false }, |
112 | | - { |
113 | | - attrs: node.attributes, |
114 | | - children: processedChildren, |
115 | | - modifiers: node.modifiers, |
116 | | - blockParams: node.blockParams, |
117 | | - } |
118 | | - ), |
119 | | - ]; |
| 31 | + // Get the current prefix from the top of the stack |
| 32 | + const asPrefix = asPrefixStack[asPrefixStack.length - 1]; |
| 33 | + |
| 34 | + // If there's a prefix and this node is the one we want to transform... |
| 35 | + if (!CODEMOD_ANALYSIS && asPrefix && node.tag === `${asPrefix}.Interactive`) { |
| 36 | + const textAttr = node.attributes.find((a) => a.name === '@text'); |
| 37 | + |
| 38 | + if (textAttr) { |
| 39 | + const childOutputAttributes = node.attributes.filter((a) => a.name !== '@text'); |
| 40 | + const attrValue = textAttr.value; |
| 41 | + let newChildren = []; |
| 42 | + |
| 43 | + if (attrValue.type === 'ConcatStatement') { |
| 44 | + newChildren = attrValue.parts; |
| 45 | + } else if (attrValue.type === 'MustacheStatement') { |
| 46 | + if (attrValue.path.type === 'NumberLiteral') { |
| 47 | + newChildren = [b.mustache(b.number(attrValue.path.value))]; |
| 48 | + } else if (attrValue.path.type === 'StringLiteral') { |
| 49 | + newChildren = [b.mustache(b.string(attrValue.path.value))]; |
| 50 | + } else { |
| 51 | + newChildren = [ |
| 52 | + b.mustache(attrValue.path.original, [...attrValue.params], attrValue.hash), |
| 53 | + ]; |
| 54 | + } |
| 55 | + } else { |
| 56 | + newChildren = [b.text(attrValue.chars)]; |
| 57 | + } |
| 58 | + |
| 59 | + // Return a new element to replace the current one |
| 60 | + // The visitor will automatically use this returned value |
| 61 | + return b.element( |
| 62 | + { name: node.tag, selfClosing: false }, |
| 63 | + { |
| 64 | + children: newChildren, |
| 65 | + attrs: childOutputAttributes, |
| 66 | + modifiers: node.modifiers, |
| 67 | + blockParams: node.blockParams, |
| 68 | + } |
| 69 | + ); |
120 | 70 | } |
121 | 71 | } |
122 | | - } |
| 72 | + }, |
| 73 | + // "exit" is called after visiting the node's children |
| 74 | + exit(node) { |
| 75 | + // As we leave a Dropdown, pop its prefix off the stack |
| 76 | + if (node.tag === 'Hds::Dropdown') { |
| 77 | + asPrefixStack.pop(); |
| 78 | + } |
| 79 | + }, |
123 | 80 | }, |
124 | 81 | }; |
125 | 82 | }); |
|
0 commit comments