146 lines
2.0 KiB
Markdown
146 lines
2.0 KiB
Markdown
|
|||
|
|
## Input
|
||
|
|
|
||
|
|
```javascript
|
||
|
|
// @enableJsxOutlining
|
||
|
|
function Component({arr}) {
|
||
|
|
const x = useX();
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
{arr.map((i, id) => {
|
||
|
|
let jsx = (
|
||
|
|
<Bar key={id} x={x}>
|
||
|
|
<Baz i={i}></Baz>
|
||
|
|
</Bar>
|
||
|
|
);
|
||
|
|
return jsx;
|
||
|
|
})}
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
function Bar({x, children}) {
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
{x}
|
||
|
|
{children}
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
function Baz({i}) {
|
||
|
|
return i;
|
||
|
|
}
|
||
|
|
|
||
|
|
function useX() {
|
||
|
|
return 'x';
|
||
|
|
}
|
||
|
|
|
||
|
|
export const FIXTURE_ENTRYPOINT = {
|
||
|
|
fn: Component,
|
||
|
|
params: [{arr: ['foo', 'bar']}],
|
||
|
|
};
|
||
|
|
|
||
|
|
```
|
||
|
|
|
||
|
|
## Code
|
||
|
|
|
||
|
|
```javascript
|
||
|
|
import { c as _c } from "react/compiler-runtime"; // @enableJsxOutlining
|
||
|
|
function Component(t0) {
|
||
|
|
const $ = _c(7);
|
||
|
|
const { arr } = t0;
|
||
|
|
const x = useX();
|
||
|
|
let t1;
|
||
|
|
if ($[0] !== arr || $[1] !== x) {
|
||
|
|
let t2;
|
||
|
|
if ($[3] !== x) {
|
||
|
|
t2 = (i, id) => {
|
||
|
|
const T0 = _temp;
|
||
|
|
const jsx = <T0 i={i} key={id} x={x} />;
|
||
|
|
|
||
|
|
return jsx;
|
||
|
|
};
|
||
|
|
$[3] = x;
|
||
|
|
$[4] = t2;
|
||
|
|
} else {
|
||
|
|
t2 = $[4];
|
||
|
|
}
|
||
|
|
t1 = arr.map(t2);
|
||
|
|
$[0] = arr;
|
||
|
|
$[1] = x;
|
||
|
|
$[2] = t1;
|
||
|
|
} else {
|
||
|
|
t1 = $[2];
|
||
|
|
}
|
||
|
|
let t2;
|
||
|
|
if ($[5] !== t1) {
|
||
|
|
t2 = <>{t1}</>;
|
||
|
|
$[5] = t1;
|
||
|
|
$[6] = t2;
|
||
|
|
} else {
|
||
|
|
t2 = $[6];
|
||
|
|
}
|
||
|
|
return t2;
|
||
|
|
}
|
||
|
|
function _temp(t0) {
|
||
|
|
const $ = _c(5);
|
||
|
|
const { i: i, x: x } = t0;
|
||
|
|
let t1;
|
||
|
|
if ($[0] !== i) {
|
||
|
|
t1 = <Baz i={i} />;
|
||
|
|
$[0] = i;
|
||
|
|
$[1] = t1;
|
||
|
|
} else {
|
||
|
|
t1 = $[1];
|
||
|
|
}
|
||
|
|
let t2;
|
||
|
|
if ($[2] !== t1 || $[3] !== x) {
|
||
|
|
t2 = <Bar x={x}>{t1}</Bar>;
|
||
|
|
$[2] = t1;
|
||
|
|
$[3] = x;
|
||
|
|
$[4] = t2;
|
||
|
|
} else {
|
||
|
|
t2 = $[4];
|
||
|
|
}
|
||
|
|
return t2;
|
||
|
|
}
|
||
|
|
|
||
|
|
function Bar(t0) {
|
||
|
|
const $ = _c(3);
|
||
|
|
const { x, children } = t0;
|
||
|
|
let t1;
|
||
|
|
if ($[0] !== children || $[1] !== x) {
|
||
|
|
t1 = (
|
||
|
|
<>
|
||
|
|
{x}
|
||
|
|
{children}
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
$[0] = children;
|
||
|
|
$[1] = x;
|
||
|
|
$[2] = t1;
|
||
|
|
} else {
|
||
|
|
t1 = $[2];
|
||
|
|
}
|
||
|
|
return t1;
|
||
|
|
}
|
||
|
|
|
||
|
|
function Baz(t0) {
|
||
|
|
const { i } = t0;
|
||
|
|
return i;
|
||
|
|
}
|
||
|
|
|
||
|
|
function useX() {
|
||
|
|
return "x";
|
||
|
|
}
|
||
|
|
|
||
|
|
export const FIXTURE_ENTRYPOINT = {
|
||
|
|
fn: Component,
|
||
|
|
params: [{ arr: ["foo", "bar"] }],
|
||
|
|
};
|
||
|
|
|
||
|
|
```
|
||
|
|
|
||
|
|
### Eval output
|
||
|
|
(kind: ok) xfooxbar
|