diff --git a/.changeset/fresh-schools-deliver.md b/.changeset/fresh-schools-deliver.md new file mode 100644 index 0000000000..81a7901c20 --- /dev/null +++ b/.changeset/fresh-schools-deliver.md @@ -0,0 +1,5 @@ +--- +'@builder.io/mitosis': patch +--- + +Fix arrow function expressions in non-on properties diff --git a/packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap b/packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap index 8756b7d8b3..39796b6f66 100644 --- a/packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap @@ -1999,6 +1999,34 @@ Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ " `; +exports[`Alpine.js > jsx > Javascript Test > functionProps 1`] = ` +"

x\\" + x-bind:f1=\\"x => x\\" + x-bind:f2=\\"x => {}\\" + x-bind:f3=\\"function () { + return x; +}\\" + x-bind:f4=\\"function (x) { + return x; +}\\" + x-bind:f5=\\"function (x) { + return; +}\\" + x-bind:f6=\\"function () { + return; +}\\" + x-bind:f7=\\"(a, b, c) => a + b + c\\" +>

+ +" +`; + exports[`Alpine.js > jsx > Javascript Test > getterState 1`] = ` "

@@ -5143,6 +5171,34 @@ Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ " `; +exports[`Alpine.js > jsx > Typescript Test > functionProps 1`] = ` +"

x\\" + x-bind:f1=\\"x => x\\" + x-bind:f2=\\"x => {}\\" + x-bind:f3=\\"function () { + return x; +}\\" + x-bind:f4=\\"function (x) { + return x; +}\\" + x-bind:f5=\\"function (x) { + return; +}\\" + x-bind:f6=\\"function () { + return; +}\\" + x-bind:f7=\\"(a, b, c) => a + b + c\\" +>

+ +" +`; + exports[`Alpine.js > jsx > Typescript Test > getterState 1`] = ` "

diff --git a/packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap index 09a330ab4b..73b091d2ee 100644 --- a/packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap @@ -4747,6 +4747,53 @@ export class FigmaButtonModule {} " `; +exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; @@ -12771,6 +12818,57 @@ export class FigmaButtonModule {} " `; +exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; diff --git a/packages/core/src/__tests__/__snapshots__/angular.mapper.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.mapper.test.ts.snap index 0960cd223b..d3a4822396 100644 --- a/packages/core/src/__tests__/__snapshots__/angular.mapper.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/angular.mapper.test.ts.snap @@ -4819,6 +4819,54 @@ export class FigmaButtonModule {} " `; +exports[`Angular with Import Mapper Tests > jsx > Javascript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], + bootstrap: [SomeOtherComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with Import Mapper Tests > jsx > Javascript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; @@ -12973,6 +13021,58 @@ export class FigmaButtonModule {} " `; +exports[`Angular with Import Mapper Tests > jsx > Typescript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], + bootstrap: [SomeOtherComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with Import Mapper Tests > jsx > Typescript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; diff --git a/packages/core/src/__tests__/__snapshots__/angular.state.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.state.test.ts.snap index 824024fc5c..3a6cc3bfcb 100644 --- a/packages/core/src/__tests__/__snapshots__/angular.state.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/angular.state.test.ts.snap @@ -4921,6 +4921,97 @@ export class FigmaButtonModule {} " `; +exports[`Angular with manually creating and handling class properties as bindings (more stable) > jsx > Javascript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f2]=\\"node_1_p\\" + [attr.f3]=\\"node_2_p\\" + [attr.f4]=\\"node_3_p\\" + [attr.f5]=\\"node_4_p\\" + [attr.f6]=\\"node_5_p\\" + [attr.f7]=\\"node_6_p\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent { + node_0_p = null; + node_1_p = null; + node_2_p = null; + node_3_p = null; + node_4_p = null; + node_5_p = null; + node_6_p = null; + + ngOnInit() { + this.node_0_p = () => x; + + this.node_1_p = (x) => {}; + + this.node_2_p = function () { + return x; + }; + + this.node_3_p = function (x) { + return x; + }; + + this.node_4_p = function (x) { + return; + }; + + this.node_5_p = function () { + return; + }; + + this.node_6_p = (a, b, c) => a + b + c; + } + + ngOnChanges(changes) { + if (typeof window !== \\"undefined\\") { + this.node_0_p = () => x; + this.node_1_p = (x) => {}; + this.node_2_p = function () { + return x; + }; + this.node_3_p = function (x) { + return x; + }; + this.node_4_p = function (x) { + return; + }; + this.node_5_p = function () { + return; + }; + this.node_6_p = (a, b, c) => a + b + c; + } + } +} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with manually creating and handling class properties as bindings (more stable) > jsx > Javascript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; @@ -13222,6 +13313,101 @@ export class FigmaButtonModule {} " `; +exports[`Angular with manually creating and handling class properties as bindings (more stable) > jsx > Typescript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component, SimpleChanges } from \\"@angular/core\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f2]=\\"node_1_p\\" + [attr.f3]=\\"node_2_p\\" + [attr.f4]=\\"node_3_p\\" + [attr.f5]=\\"node_4_p\\" + [attr.f6]=\\"node_5_p\\" + [attr.f7]=\\"node_6_p\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent { + node_0_p = null; + node_1_p = null; + node_2_p = null; + node_3_p = null; + node_4_p = null; + node_5_p = null; + node_6_p = null; + + ngOnInit() { + this.node_0_p = () => x; + + this.node_1_p = (x) => {}; + + this.node_2_p = function () { + return x; + }; + + this.node_3_p = function (x) { + return x; + }; + + this.node_4_p = function (x) { + return; + }; + + this.node_5_p = function () { + return; + }; + + this.node_6_p = (a, b, c) => a + b + c; + } + + ngOnChanges(changes: SimpleChanges) { + if (typeof window !== \\"undefined\\") { + this.node_0_p = () => x; + this.node_1_p = (x) => {}; + this.node_2_p = function () { + return x; + }; + this.node_3_p = function (x) { + return x; + }; + this.node_4_p = function (x) { + return; + }; + this.node_5_p = function () { + return; + }; + this.node_6_p = (a, b, c) => a + b + c; + } + } +} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with manually creating and handling class properties as bindings (more stable) > jsx > Typescript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; diff --git a/packages/core/src/__tests__/__snapshots__/angular.styles.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.styles.test.ts.snap index fbce483fb8..ef7692cd00 100644 --- a/packages/core/src/__tests__/__snapshots__/angular.styles.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/angular.styles.test.ts.snap @@ -4295,6 +4295,46 @@ export class FigmaButtonModule {} " `; +exports[`Angular with visuallyIgnoreHostElement = false > jsx > Javascript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with visuallyIgnoreHostElement = false > jsx > Javascript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; @@ -11485,6 +11525,50 @@ export class FigmaButtonModule {} " `; +exports[`Angular with visuallyIgnoreHostElement = false > jsx > Typescript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + exports[`Angular with visuallyIgnoreHostElement = false > jsx > Typescript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; diff --git a/packages/core/src/__tests__/__snapshots__/angular.test.ts.snap b/packages/core/src/__tests__/__snapshots__/angular.test.ts.snap index 290d3eefb3..cf20abe907 100644 --- a/packages/core/src/__tests__/__snapshots__/angular.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/angular.test.ts.snap @@ -8982,6 +8982,93 @@ export default class FigmaButton { " `; +exports[`Angular > jsx > Javascript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + +exports[`Angular > jsx > Javascript Test > functionProps 2`] = ` +"import { Component } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], + standalone: true, + imports: [CommonModule], +}) +export default class MyBasicComponent {} +" +`; + exports[`Angular > jsx > Javascript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; @@ -24088,6 +24175,101 @@ export default class FigmaButton { " `; +exports[`Angular > jsx > Typescript Test > functionProps 1`] = ` +"import { NgModule } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +import { Component } from \\"@angular/core\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], +}) +export default class MyBasicComponent {} + +@NgModule({ + declarations: [MyBasicComponent], + imports: [CommonModule], + exports: [MyBasicComponent], +}) +export class MyBasicComponentModule {} +" +`; + +exports[`Angular > jsx > Typescript Test > functionProps 2`] = ` +"import { Component } from \\"@angular/core\\"; +import { CommonModule } from \\"@angular/common\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@Component({ + selector: \\"my-basic-component\\", + template: \` +

x\\" + [attr.f1]=\\"x => x\\" + [attr.f2]=\\"x => {}\\" + [attr.f3]=\\"function () { + return x; + }\\" + [attr.f4]=\\"function (x) { + return x; + }\\" + [attr.f5]=\\"function (x) { + return; + }\\" + [attr.f6]=\\"function () { + return; + }\\" + [attr.f7]=\\"(a, b, c) => a + b + c\\" + >

+ \`, + styles: [ + \` + :host { + display: contents; + } + \`, + ], + standalone: true, + imports: [CommonModule], +}) +export default class MyBasicComponent {} +" +`; + exports[`Angular > jsx > Typescript Test > getterState 1`] = ` "import { NgModule } from \\"@angular/core\\"; import { CommonModule } from \\"@angular/common\\"; diff --git a/packages/core/src/__tests__/__snapshots__/html.test.ts.snap b/packages/core/src/__tests__/__snapshots__/html.test.ts.snap index 05d5faf4d4..62e6eada1c 100644 --- a/packages/core/src/__tests__/__snapshots__/html.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/html.test.ts.snap @@ -5058,6 +5058,69 @@ Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ " `; +exports[`Html > jsx > Javascript Test > functionProps 1`] = ` +"

+ +" +`; + exports[`Html > jsx > Javascript Test > getterState 1`] = ` "

@@ -12924,6 +12987,69 @@ Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ " `; +exports[`Html > jsx > Typescript Test > functionProps 1`] = ` +"

+ +" +`; + exports[`Html > jsx > Typescript Test > getterState 1`] = ` "

diff --git a/packages/core/src/__tests__/__snapshots__/liquid.test.ts.snap b/packages/core/src/__tests__/__snapshots__/liquid.test.ts.snap index acb9a0504b..4e20bf9b04 100644 --- a/packages/core/src/__tests__/__snapshots__/liquid.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/liquid.test.ts.snap @@ -649,6 +649,11 @@ Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ " `; +exports[`Liquid > jsx > Javascript Test > functionProps 1`] = ` +"

+" +`; + exports[`Liquid > jsx > Javascript Test > getterState 1`] = ` "

{{foo2}}

@@ -1678,6 +1683,11 @@ Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ " `; +exports[`Liquid > jsx > Typescript Test > functionProps 1`] = ` +"

+" +`; + exports[`Liquid > jsx > Typescript Test > getterState 1`] = ` "

{{foo2}}

diff --git a/packages/core/src/__tests__/__snapshots__/lit.test.ts.snap b/packages/core/src/__tests__/__snapshots__/lit.test.ts.snap index 0cc0ae50c1..64c0974def 100644 --- a/packages/core/src/__tests__/__snapshots__/lit.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/lit.test.ts.snap @@ -2907,6 +2907,36 @@ export default class FigmaButton extends LitElement { " `; +exports[`Lit > jsx > Javascript Test > functionProps 1`] = ` +"import { LitElement, html, css } from \\"lit\\"; +import { customElement, property, state, query } from \\"lit/decorators.js\\"; + +@customElement(\\"my-basic-component\\") +export default class MyBasicComponent extends LitElement { + createRenderRoot() { + return this; + } + + render() { + return html\` + +

x} .f1=\${(x) => x} .f2=\${( + x + ) => {}} .f3=\${function () { + return x; + }} .f4=\${function (x) { + return x; + }} .f5=\${function (x) { + return; + }} .f6=\${function () { + return; + }} .f7=\${(a, b, c) => a + b + c} >

+ \`; + } +} +" +`; + exports[`Lit > jsx > Javascript Test > getterState 1`] = ` "import { LitElement, html, css } from \\"lit\\"; import { customElement, property, state, query } from \\"lit/decorators.js\\"; @@ -7951,6 +7981,40 @@ export default class FigmaButton extends LitElement { " `; +exports[`Lit > jsx > Typescript Test > functionProps 1`] = ` +"import { LitElement, html, css } from \\"lit\\"; +import { customElement, property, state, query } from \\"lit/decorators.js\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@customElement(\\"my-basic-component\\") +export default class MyBasicComponent extends LitElement { + createRenderRoot() { + return this; + } + + render() { + return html\` + +

x} .f1=\${(x) => x} .f2=\${( + x + ) => {}} .f3=\${function () { + return x; + }} .f4=\${function (x) { + return x; + }} .f5=\${function (x) { + return; + }} .f6=\${function () { + return; + }} .f7=\${(a, b, c) => a + b + c} >

+ \`; + } +} +" +`; + exports[`Lit > jsx > Typescript Test > getterState 1`] = ` "import { LitElement, html, css } from \\"lit\\"; import { customElement, property, state, query } from \\"lit/decorators.js\\"; diff --git a/packages/core/src/__tests__/__snapshots__/marko.test.ts.snap b/packages/core/src/__tests__/__snapshots__/marko.test.ts.snap index 03983857c0..fa70a0625e 100644 --- a/packages/core/src/__tests__/__snapshots__/marko.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/marko.test.ts.snap @@ -271,7 +271,7 @@ exports[`Marko > jsx > Javascript Test > Basic Outputs Meta 1`] = ` useMetadata: {\\"outputs\\":[\\"onMessage\\",\\"onEvent\\"],\\"baz\\":\\"metadata inside component\\"} */ - + class { onCreate(input) { this.state = { name: \\"PatrickJS\\" }; @@ -1538,7 +1538,7 @@ exports[`Marko > jsx > Javascript Test > basicForwardRefMetadata 1`] = ` useMetadata: {\\"forwardRef\\":\\"inputRef\\"} */ - + class { onCreate(input) { this.state = { name: \\"PatrickJS\\" }; @@ -1597,7 +1597,7 @@ exports[`Marko > jsx > Javascript Test > basicRefAttributePassing 1`] = ` useMetadata: {\\"attributePassing\\":{\\"enabled\\":true}} */ - + class { get buttonRef() { return this.getEl(\\"buttonRef\\"); @@ -1613,7 +1613,7 @@ exports[`Marko > jsx > Javascript Test > basicRefAttributePassingCustomRef 1`] = useMetadata: {\\"attributePassing\\":{\\"enabled\\":true,\\"customRef\\":\\"buttonRef\\"}} */ - + class { get buttonRef() { return this.getEl(\\"buttonRef\\"); @@ -1710,7 +1710,7 @@ exports[`Marko > jsx > Javascript Test > complexMeta 1`] = ` useMetadata: {\\"x\\":\\"y\\",\\"asdf\\":{\\"stringValue\\":\\"d\\",\\"booleanValue\\":true,\\"numberValue\\":1,\\"innerObject\\":{\\"stringValue\\":\\"inner\\",\\"numberValue\\":2,\\"booleanValue\\":false},\\"spreadStringValue\\":\\"f\\"}} */ - + class {}
" @@ -1841,7 +1841,7 @@ exports[`Marko > jsx > Javascript Test > figmaMeta 1`] = ` useMetadata: {\\"figma\\":{\\"name\\":\\"def-button-beta-outlined\\",\\"url\\":\\"https://www.figma.com/xxx\\",\\"props\\":{\\"iconSmall\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Small\\"},\\"iconMedium\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Medium\\"},\\"label\\":{\\"type\\":\\"string\\",\\"key\\":\\"✏️ Label\\"},\\"icon\\":{\\"type\\":\\"boolean\\",\\"key\\":\\"👁️ Icon\\",\\"value\\":{\\"false\\":false,\\"true\\":\\"placeholder\\"}},\\"interactiveState\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Interactive State\\",\\"value\\":{\\"(Def) Enabled\\":false,\\"Hovered\\":false,\\"Pressed\\":false,\\"Focused\\":false,\\"Disabled\\":\\"true\\"}},\\"size\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Size\\",\\"value\\":{\\"(Def) Medium\\":false,\\"Small\\":\\"small\\"}},\\"width\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Width\\",\\"value\\":{\\"(Def) Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ - + class {} " `; +exports[`Marko > jsx > Javascript Test > functionProps 1`] = ` +"class {} + +

x) + f1=(x => x) + f2=(x => {}) + f3=(function () { + return x; +}) + f4=(function (x) { + return x; +}) + f5=(function (x) { + return; +}) + f6=(function () { + return; +}) + f7=((a, b, c) => a + b + c) +>

" +`; + exports[`Marko > jsx > Javascript Test > getterState 1`] = ` "class { get foo2() { @@ -3043,7 +3066,7 @@ exports[`Marko > jsx > Typescript Test > Basic Outputs Meta 1`] = ` useMetadata: {\\"outputs\\":[\\"onMessage\\",\\"onEvent\\"],\\"baz\\":\\"metadata inside component\\"} */ - + class { onCreate(input) { this.state = { name: \\"PatrickJS\\" }; @@ -4321,7 +4344,7 @@ exports[`Marko > jsx > Typescript Test > basicForwardRefMetadata 1`] = ` useMetadata: {\\"forwardRef\\":\\"inputRef\\"} */ - + class { onCreate(input) { this.state = { name: \\"PatrickJS\\" }; @@ -4380,7 +4403,7 @@ exports[`Marko > jsx > Typescript Test > basicRefAttributePassing 1`] = ` useMetadata: {\\"attributePassing\\":{\\"enabled\\":true}} */ - + class { get buttonRef() { return this.getEl(\\"buttonRef\\"); @@ -4396,7 +4419,7 @@ exports[`Marko > jsx > Typescript Test > basicRefAttributePassingCustomRef 1`] = useMetadata: {\\"attributePassing\\":{\\"enabled\\":true,\\"customRef\\":\\"buttonRef\\"}} */ - + class { get buttonRef() { return this.getEl(\\"buttonRef\\"); @@ -4495,7 +4518,7 @@ exports[`Marko > jsx > Typescript Test > complexMeta 1`] = ` useMetadata: {\\"x\\":\\"y\\",\\"asdf\\":{\\"stringValue\\":\\"d\\",\\"booleanValue\\":true,\\"numberValue\\":1,\\"innerObject\\":{\\"stringValue\\":\\"inner\\",\\"numberValue\\":2,\\"booleanValue\\":false},\\"spreadStringValue\\":\\"f\\"}} */ - + class {}
" @@ -4626,7 +4649,7 @@ exports[`Marko > jsx > Typescript Test > figmaMeta 1`] = ` useMetadata: {\\"figma\\":{\\"name\\":\\"def-button-beta-outlined\\",\\"url\\":\\"https://www.figma.com/xxx\\",\\"props\\":{\\"iconSmall\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Small\\"},\\"iconMedium\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Medium\\"},\\"label\\":{\\"type\\":\\"string\\",\\"key\\":\\"✏️ Label\\"},\\"icon\\":{\\"type\\":\\"boolean\\",\\"key\\":\\"👁️ Icon\\",\\"value\\":{\\"false\\":false,\\"true\\":\\"placeholder\\"}},\\"interactiveState\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Interactive State\\",\\"value\\":{\\"(Def) Enabled\\":false,\\"Hovered\\":false,\\"Pressed\\":false,\\"Focused\\":false,\\"Disabled\\":\\"true\\"}},\\"size\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Size\\",\\"value\\":{\\"(Def) Medium\\":false,\\"Small\\":\\"small\\"}},\\"width\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Width\\",\\"value\\":{\\"(Def) Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ - + class {} " `; +exports[`Marko > jsx > Typescript Test > functionProps 1`] = ` +"class {} + +

x) + f1=(x => x) + f2=(x => {}) + f3=(function () { + return x; +}) + f4=(function (x) { + return x; +}) + f5=(function (x) { + return; +}) + f6=(function () { + return; +}) + f7=((a, b, c) => a + b + c) +>

" +`; + exports[`Marko > jsx > Typescript Test > getterState 1`] = ` "class { get foo2() { diff --git a/packages/core/src/__tests__/__snapshots__/mitosis.test.ts.snap b/packages/core/src/__tests__/__snapshots__/mitosis.test.ts.snap index 4aa68280ec..8cafb2f9eb 100644 --- a/packages/core/src/__tests__/__snapshots__/mitosis.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/mitosis.test.ts.snap @@ -2079,6 +2079,32 @@ export default function FigmaButton(props) { " `; +exports[`Mitosis, format: legacy (native loops and conditionals) > jsx > Javascript Test > functionProps 1`] = ` +"export default function MyBasicComponent(props) { + return [ +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + />, + ]; +} +" +`; + exports[`Mitosis, format: legacy (native loops and conditionals) > jsx > Javascript Test > getterState 1`] = ` "import { useStore } from \\"@builder.io/mitosis\\"; @@ -5527,6 +5553,36 @@ export default function FigmaButton(props) { " `; +exports[`Mitosis, format: legacy (native loops and conditionals) > jsx > Typescript Test > functionProps 1`] = ` +"export interface MyBasicComponentProps { + id: string; +} + +export default function MyBasicComponent(props) { + return [ +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + />, + ]; +} +" +`; + exports[`Mitosis, format: legacy (native loops and conditionals) > jsx > Typescript Test > getterState 1`] = ` "import { useStore } from \\"@builder.io/mitosis\\"; @@ -9520,6 +9576,32 @@ export default function FigmaButton(props) { " `; +exports[`Mitosis, format: legacy > jsx > Javascript Test > functionProps 1`] = ` +"export default function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} +" +`; + exports[`Mitosis, format: legacy > jsx > Javascript Test > getterState 1`] = ` "import { useStore } from \\"@builder.io/mitosis\\"; @@ -13031,6 +13113,36 @@ export default function FigmaButton(props) { " `; +exports[`Mitosis, format: legacy > jsx > Typescript Test > functionProps 1`] = ` +"export interface MyBasicComponentProps { + id: string; +} + +export default function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} +" +`; + exports[`Mitosis, format: legacy > jsx > Typescript Test > getterState 1`] = ` "import { useStore } from \\"@builder.io/mitosis\\"; @@ -17296,6 +17408,36 @@ export default FigmaButton; " `; +exports[`Mitosis, format: react > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`Mitosis, format: react > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; @@ -21046,6 +21188,36 @@ export default FigmaButton; " `; +exports[`Mitosis, format: react > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`Mitosis, format: react > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; diff --git a/packages/core/src/__tests__/__snapshots__/parse-jsx.test.ts.snap b/packages/core/src/__tests__/__snapshots__/parse-jsx.test.ts.snap index c95b662b0e..390d0b6f45 100644 --- a/packages/core/src/__tests__/__snapshots__/parse-jsx.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/parse-jsx.test.ts.snap @@ -8026,6 +8026,88 @@ exports[`Parse JSX > Javascript > figmaMeta 1`] = ` } `; +exports[`Parse JSX > Javascript > functionProps 1`] = ` +{ + "@type": "@builder.io/mitosis/component", + "children": [ + { + "@type": "@builder.io/mitosis/node", + "bindings": { + "f": { + "bindingType": "expression", + "code": "() => x", + "type": "single", + }, + "f1": { + "bindingType": "expression", + "code": "x => x", + "type": "single", + }, + "f2": { + "bindingType": "expression", + "code": "x => {}", + "type": "single", + }, + "f3": { + "bindingType": "expression", + "code": "function () { + return x; +}", + "type": "single", + }, + "f4": { + "bindingType": "expression", + "code": "function (x) { + return x; +}", + "type": "single", + }, + "f5": { + "bindingType": "expression", + "code": "function (x) { + return; +}", + "type": "single", + }, + "f6": { + "bindingType": "expression", + "code": "function () { + return; +}", + "type": "single", + }, + "f7": { + "bindingType": "expression", + "code": "(a, b, c) => a + b + c", + "type": "single", + }, + }, + "children": [], + "meta": {}, + "name": "p", + "properties": {}, + "scope": {}, + }, + ], + "context": { + "get": {}, + "set": {}, + }, + "exports": {}, + "hooks": { + "onEvent": [], + "onMount": [], + }, + "imports": [], + "inputs": [], + "meta": {}, + "name": "MyBasicComponent", + "refs": {}, + "state": {}, + "subComponents": [], +} +`; + exports[`Parse JSX > Javascript > getterState 1`] = ` { "@type": "@builder.io/mitosis/component", @@ -21553,6 +21635,94 @@ exports[`Parse JSX > Typescript > figmaMeta 1`] = ` } `; +exports[`Parse JSX > Typescript > functionProps 1`] = ` +{ + "@type": "@builder.io/mitosis/component", + "children": [ + { + "@type": "@builder.io/mitosis/node", + "bindings": { + "f": { + "bindingType": "expression", + "code": "() => x", + "type": "single", + }, + "f1": { + "bindingType": "expression", + "code": "x => x", + "type": "single", + }, + "f2": { + "bindingType": "expression", + "code": "x => {}", + "type": "single", + }, + "f3": { + "bindingType": "expression", + "code": "function () { + return x; +}", + "type": "single", + }, + "f4": { + "bindingType": "expression", + "code": "function (x) { + return x; +}", + "type": "single", + }, + "f5": { + "bindingType": "expression", + "code": "function (x) { + return; +}", + "type": "single", + }, + "f6": { + "bindingType": "expression", + "code": "function () { + return; +}", + "type": "single", + }, + "f7": { + "bindingType": "expression", + "code": "(a, b, c) => a + b + c", + "type": "single", + }, + }, + "children": [], + "meta": {}, + "name": "p", + "properties": {}, + "scope": {}, + }, + ], + "context": { + "get": {}, + "set": {}, + }, + "exports": {}, + "hooks": { + "onEvent": [], + "onMount": [], + }, + "imports": [], + "inputs": [], + "meta": {}, + "name": "MyBasicComponent", + "propsTypeRef": "MyBasicComponentProps", + "refs": {}, + "state": {}, + "subComponents": [], + "types": [ + "export interface MyBasicComponentProps { + id: string; +}", + ], +} +`; + exports[`Parse JSX > Typescript > getterState 1`] = ` { "@type": "@builder.io/mitosis/component", diff --git a/packages/core/src/__tests__/__snapshots__/preact.test.ts.snap b/packages/core/src/__tests__/__snapshots__/preact.test.ts.snap index 2f2329165b..7ca3f3d306 100644 --- a/packages/core/src/__tests__/__snapshots__/preact.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/preact.test.ts.snap @@ -2316,6 +2316,37 @@ export default FigmaButton; " `; +exports[`Preact > jsx > Javascript Test > functionProps 1`] = ` +"/** @jsx h */ +import { h, Fragment } from \\"preact\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`Preact > jsx > Javascript Test > getterState 1`] = ` "/** @jsx h */ import { h, Fragment } from \\"preact\\"; @@ -6430,6 +6461,41 @@ export default FigmaButton; " `; +exports[`Preact > jsx > Typescript Test > functionProps 1`] = ` +"/** @jsx h */ +import { h, Fragment } from \\"preact\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`Preact > jsx > Typescript Test > getterState 1`] = ` "/** @jsx h */ import { h, Fragment } from \\"preact\\"; diff --git a/packages/core/src/__tests__/__snapshots__/qwik.test.ts.snap b/packages/core/src/__tests__/__snapshots__/qwik.test.ts.snap index fae5404a38..fbc1a34656 100644 --- a/packages/core/src/__tests__/__snapshots__/qwik.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/qwik.test.ts.snap @@ -1989,7 +1989,7 @@ exports[`qwik > jsx > Javascript Test > Basic Outputs Meta 1`] = ` useMetadata: {\\"outputs\\":[\\"onMessage\\",\\"onEvent\\"],\\"baz\\":\\"metadata inside component\\"} */ - + import { Fragment, component$, @@ -3711,7 +3711,7 @@ exports[`qwik > jsx > Javascript Test > basicForwardRefMetadata 1`] = ` useMetadata: {\\"forwardRef\\":\\"inputRef\\"} */ - + import { $, Fragment, @@ -3754,7 +3754,7 @@ exports[`qwik > jsx > Javascript Test > basicRefAttributePassing 1`] = ` useMetadata: {\\"attributePassing\\":{\\"enabled\\":true}} */ - + import { Fragment, component$, h, useSignal } from \\"@builder.io/qwik\\"; export const BasicRefAttributePassingComponent = component$((props) => { @@ -3773,7 +3773,7 @@ exports[`qwik > jsx > Javascript Test > basicRefAttributePassingCustomRef 1`] = useMetadata: {\\"attributePassing\\":{\\"enabled\\":true,\\"customRef\\":\\"buttonRef\\"}} */ - + import { Fragment, component$, h, useSignal } from \\"@builder.io/qwik\\"; export const BasicRefAttributePassingCustomRefComponent = component$( @@ -3931,7 +3931,7 @@ exports[`qwik > jsx > Javascript Test > complexMeta 1`] = ` useMetadata: {\\"x\\":\\"y\\",\\"asdf\\":{\\"stringValue\\":\\"d\\",\\"booleanValue\\":true,\\"numberValue\\":1,\\"innerObject\\":{\\"stringValue\\":\\"inner\\",\\"numberValue\\":2,\\"booleanValue\\":false},\\"spreadStringValue\\":\\"f\\"}} */ - + import { Fragment, component$, h } from \\"@builder.io/qwik\\"; export const ComplexMetaRaw = component$((props) => { @@ -4108,7 +4108,7 @@ exports[`qwik > jsx > Javascript Test > figmaMeta 1`] = ` useMetadata: {\\"figma\\":{\\"name\\":\\"def-button-beta-outlined\\",\\"url\\":\\"https://www.figma.com/xxx\\",\\"props\\":{\\"iconSmall\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Small\\"},\\"iconMedium\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Medium\\"},\\"label\\":{\\"type\\":\\"string\\",\\"key\\":\\"✏️ Label\\"},\\"icon\\":{\\"type\\":\\"boolean\\",\\"key\\":\\"👁️ Icon\\",\\"value\\":{\\"false\\":false,\\"true\\":\\"placeholder\\"}},\\"interactiveState\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Interactive State\\",\\"value\\":{\\"(Def) Enabled\\":false,\\"Hovered\\":false,\\"Pressed\\":false,\\"Focused\\":false,\\"Disabled\\":\\"true\\"}},\\"size\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Size\\",\\"value\\":{\\"(Def) Medium\\":false,\\"Small\\":\\"small\\"}},\\"width\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Width\\",\\"value\\":{\\"(Def) Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ - + import { Fragment, component$, h } from \\"@builder.io/qwik\\"; export const FigmaButton = component$((props) => { @@ -4128,6 +4128,35 @@ export default FigmaButton; " `; +exports[`qwik > jsx > Javascript Test > functionProps 1`] = ` +"SyntaxError: Identifier expected. (5:98) + 3 | export const MyBasicComponent=component$((props)=>{ + 4 | +> 5 | return (

{() => x})()} f1={(()=>{x => x})()} f2={(()=>{x => {}})()} f3={(()=>{function () { + | ^ + 6 | return x; + 7 | }})()} f4={(()=>{function (x) { + 8 | return x; +======================================================================== +import{Fragment,component$,h}from\\"@builder.io/qwik\\"; + +export const MyBasicComponent=component$((props)=>{ + +return (

{() => x})()} f1={(()=>{x => x})()} f2={(()=>{x => {}})()} f3={(()=>{function () { + return x; +}})()} f4={(()=>{function (x) { + return x; +}})()} f5={(()=>{function (x) { + return; +}})()} f6={(()=>{function () { + return; +}})()} f7={(()=>{(a, b, c) => a + b + c})()}>

)}); + +export default MyBasicComponent; + +========================================================================" +`; + exports[`qwik > jsx > Javascript Test > getterState 1`] = ` "import { Fragment, component$, h, useComputed$ } from \\"@builder.io/qwik\\"; @@ -5768,7 +5797,7 @@ exports[`qwik > jsx > Typescript Test > Basic Outputs Meta 1`] = ` useMetadata: {\\"outputs\\":[\\"onMessage\\",\\"onEvent\\"],\\"baz\\":\\"metadata inside component\\"} */ - + import { Fragment, component$, @@ -7723,7 +7752,7 @@ exports[`qwik > jsx > Typescript Test > basicForwardRefMetadata 1`] = ` useMetadata: {\\"forwardRef\\":\\"inputRef\\"} */ - + import { $, Fragment, @@ -7770,7 +7799,7 @@ exports[`qwik > jsx > Typescript Test > basicRefAttributePassing 1`] = ` useMetadata: {\\"attributePassing\\":{\\"enabled\\":true}} */ - + import { Fragment, component$, h, useSignal } from \\"@builder.io/qwik\\"; export const BasicRefAttributePassingComponent = component$((props: any) => { @@ -7789,7 +7818,7 @@ exports[`qwik > jsx > Typescript Test > basicRefAttributePassingCustomRef 1`] = useMetadata: {\\"attributePassing\\":{\\"enabled\\":true,\\"customRef\\":\\"buttonRef\\"}} */ - + import { Fragment, component$, h, useSignal } from \\"@builder.io/qwik\\"; export const BasicRefAttributePassingCustomRefComponent = component$( @@ -7953,7 +7982,7 @@ exports[`qwik > jsx > Typescript Test > complexMeta 1`] = ` useMetadata: {\\"x\\":\\"y\\",\\"asdf\\":{\\"stringValue\\":\\"d\\",\\"booleanValue\\":true,\\"numberValue\\":1,\\"innerObject\\":{\\"stringValue\\":\\"inner\\",\\"numberValue\\":2,\\"booleanValue\\":false},\\"spreadStringValue\\":\\"f\\"}} */ - + import { Fragment, component$, h } from \\"@builder.io/qwik\\"; export const ComplexMetaRaw = component$((props: any) => { @@ -8149,7 +8178,7 @@ exports[`qwik > jsx > Typescript Test > figmaMeta 1`] = ` useMetadata: {\\"figma\\":{\\"name\\":\\"def-button-beta-outlined\\",\\"url\\":\\"https://www.figma.com/xxx\\",\\"props\\":{\\"iconSmall\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Small\\"},\\"iconMedium\\":{\\"type\\":\\"instance\\",\\"key\\":\\"📍 Icon Medium\\"},\\"label\\":{\\"type\\":\\"string\\",\\"key\\":\\"✏️ Label\\"},\\"icon\\":{\\"type\\":\\"boolean\\",\\"key\\":\\"👁️ Icon\\",\\"value\\":{\\"false\\":false,\\"true\\":\\"placeholder\\"}},\\"interactiveState\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Interactive State\\",\\"value\\":{\\"(Def) Enabled\\":false,\\"Hovered\\":false,\\"Pressed\\":false,\\"Focused\\":false,\\"Disabled\\":\\"true\\"}},\\"size\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Size\\",\\"value\\":{\\"(Def) Medium\\":false,\\"Small\\":\\"small\\"}},\\"width\\":{\\"type\\":\\"enum\\",\\"key\\":\\"Width\\",\\"value\\":{\\"(Def) Auto Width\\":false,\\"Full Width\\":\\"full\\"}}}}} */ - + import { Fragment, component$, h } from \\"@builder.io/qwik\\"; export const FigmaButton = component$((props: any) => { @@ -8169,6 +8198,38 @@ export default FigmaButton; " `; +exports[`qwik > jsx > Typescript Test > functionProps 1`] = ` +"SyntaxError: Identifier expected. (8:98) + 6 | export const MyBasicComponent=component$((props:MyBasicComponentProps)=>{ + 7 | +> 8 | return (

{() => x})()} f1={(()=>{x => x})()} f2={(()=>{x => {}})()} f3={(()=>{function () { + | ^ + 9 | return x; + 10 | }})()} f4={(()=>{function (x) { + 11 | return x; +======================================================================== +import{Fragment,component$,h}from\\"@builder.io/qwik\\"; + +export interface MyBasicComponentProps { + id: string; +} +export const MyBasicComponent=component$((props:MyBasicComponentProps)=>{ + +return (

{() => x})()} f1={(()=>{x => x})()} f2={(()=>{x => {}})()} f3={(()=>{function () { + return x; +}})()} f4={(()=>{function (x) { + return x; +}})()} f5={(()=>{function (x) { + return; +}})()} f6={(()=>{function () { + return; +}})()} f7={(()=>{(a, b, c) => a + b + c})()}>

)}); + +export default MyBasicComponent; + +========================================================================" +`; + exports[`qwik > jsx > Typescript Test > getterState 1`] = ` "import { Fragment, component$, h, useComputed$ } from \\"@builder.io/qwik\\"; diff --git a/packages/core/src/__tests__/__snapshots__/react-native.test.ts.snap b/packages/core/src/__tests__/__snapshots__/react-native.test.ts.snap index a6a8acbaea..2a74ddbb7a 100644 --- a/packages/core/src/__tests__/__snapshots__/react-native.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/react-native.test.ts.snap @@ -3147,6 +3147,49 @@ export default FigmaButton; " `; +exports[`React Native > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; +import { + FlatList, + ScrollView, + View, + StyleSheet, + Image, + Text, + Pressable, + TextInput, + TouchableOpacity, + Button, + Linking, +} from \\"react-native\\"; + +function MyBasicComponent(props) { + return ( + x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React Native > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { @@ -8824,6 +8867,53 @@ export default FigmaButton; " `; +exports[`React Native > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; +import { + FlatList, + ScrollView, + View, + StyleSheet, + Image, + Text, + Pressable, + TextInput, + TouchableOpacity, + Button, + Linking, +} from \\"react-native\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( + x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React Native > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { diff --git a/packages/core/src/__tests__/__snapshots__/react-state-builder.test.ts.snap b/packages/core/src/__tests__/__snapshots__/react-state-builder.test.ts.snap index aaaf6a6af0..cb82441429 100644 --- a/packages/core/src/__tests__/__snapshots__/react-state-builder.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/react-state-builder.test.ts.snap @@ -2343,6 +2343,38 @@ export default FigmaButton; " `; +exports[`React - stateType: builder > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + const state = useBuilderState({}); + + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: builder > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; @@ -6442,6 +6474,42 @@ export default FigmaButton; " `; +exports[`React - stateType: builder > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + const state = useBuilderState({}); + + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: builder > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; diff --git a/packages/core/src/__tests__/__snapshots__/react-state-mobx.test.ts.snap b/packages/core/src/__tests__/__snapshots__/react-state-mobx.test.ts.snap index 5505482da5..6687b05077 100644 --- a/packages/core/src/__tests__/__snapshots__/react-state-mobx.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/react-state-mobx.test.ts.snap @@ -2400,6 +2400,37 @@ export default observedFigmaButton; " `; +exports[`React - stateType: mobx > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +const observedMyBasicComponent = observer(MyBasicComponent); +export default observedMyBasicComponent; +" +`; + exports[`React - stateType: mobx > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { useLocalObservable, observer } from \\"mobx-react-lite\\"; @@ -6537,6 +6568,41 @@ export default observedFigmaButton; " `; +exports[`React - stateType: mobx > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +const observedMyBasicComponent = observer(MyBasicComponent); +export default observedMyBasicComponent; +" +`; + exports[`React - stateType: mobx > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { useLocalObservable, observer } from \\"mobx-react-lite\\"; diff --git a/packages/core/src/__tests__/__snapshots__/react-state-solid.test.ts.snap b/packages/core/src/__tests__/__snapshots__/react-state-solid.test.ts.snap index d248447f0b..e197bb0f96 100644 --- a/packages/core/src/__tests__/__snapshots__/react-state-solid.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/react-state-solid.test.ts.snap @@ -2320,6 +2320,36 @@ export default FigmaButton; " `; +exports[`React - stateType: solid > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: solid > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { useMutable } from \\"react-solid-state\\"; @@ -6326,6 +6356,40 @@ export default FigmaButton; " `; +exports[`React - stateType: solid > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: solid > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { useMutable } from \\"react-solid-state\\"; diff --git a/packages/core/src/__tests__/__snapshots__/react-state-valtio.test.ts.snap b/packages/core/src/__tests__/__snapshots__/react-state-valtio.test.ts.snap index 6a126a1ca1..04c79c204d 100644 --- a/packages/core/src/__tests__/__snapshots__/react-state-valtio.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/react-state-valtio.test.ts.snap @@ -2323,6 +2323,36 @@ export default FigmaButton; " `; +exports[`React - stateType: valtio > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: valtio > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { useLocalProxy } from \\"valtio/utils\\"; @@ -6332,6 +6362,40 @@ export default FigmaButton; " `; +exports[`React - stateType: valtio > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: valtio > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; import { useLocalProxy } from \\"valtio/utils\\"; diff --git a/packages/core/src/__tests__/__snapshots__/react-state-variables.test.ts.snap b/packages/core/src/__tests__/__snapshots__/react-state-variables.test.ts.snap index d727f0e108..846cc148ed 100644 --- a/packages/core/src/__tests__/__snapshots__/react-state-variables.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/react-state-variables.test.ts.snap @@ -1744,6 +1744,36 @@ export default FigmaButton; " `; +exports[`React - stateType: variables > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: variables > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; @@ -4847,6 +4877,40 @@ export default FigmaButton; " `; +exports[`React - stateType: variables > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: variables > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; diff --git a/packages/core/src/__tests__/__snapshots__/react.test.ts.snap b/packages/core/src/__tests__/__snapshots__/react.test.ts.snap index 3e732de3f5..166f66e18e 100644 --- a/packages/core/src/__tests__/__snapshots__/react.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/react.test.ts.snap @@ -2297,6 +2297,36 @@ export default FigmaButton; " `; +exports[`React - stateType: useState > jsx > Javascript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: useState > jsx > Javascript Test > getterState 1`] = ` "import * as React from \\"react\\"; @@ -6306,6 +6336,40 @@ export default FigmaButton; " `; +exports[`React - stateType: useState > jsx > Typescript Test > functionProps 1`] = ` +"import * as React from \\"react\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`React - stateType: useState > jsx > Typescript Test > getterState 1`] = ` "import * as React from \\"react\\"; diff --git a/packages/core/src/__tests__/__snapshots__/rsc.test.ts.snap b/packages/core/src/__tests__/__snapshots__/rsc.test.ts.snap index eedd1cf857..b269f4aa74 100644 --- a/packages/core/src/__tests__/__snapshots__/rsc.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/rsc.test.ts.snap @@ -2399,6 +2399,41 @@ export default FigmaButton; " `; +exports[`RSC > jsx > Javascript Test > functionProps 1`] = ` +"/** + useMetadata: + {\\"rsc\\":{\\"componentType\\":\\"server\\"}} + */ + +import * as React from \\"react\\"; + +function MyBasicComponent(props) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`RSC > jsx > Javascript Test > getterState 1`] = ` "/** useMetadata: @@ -6392,6 +6427,45 @@ export default FigmaButton; " `; +exports[`RSC > jsx > Typescript Test > functionProps 1`] = ` +"/** + useMetadata: + {\\"rsc\\":{\\"componentType\\":\\"server\\"}} + */ + +import * as React from \\"react\\"; + +export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + /> + ); +} + +export default MyBasicComponent; +" +`; + exports[`RSC > jsx > Typescript Test > getterState 1`] = ` "/** useMetadata: diff --git a/packages/core/src/__tests__/__snapshots__/solid.test.ts.snap b/packages/core/src/__tests__/__snapshots__/solid.test.ts.snap index d1dd402cc3..841242352a 100644 --- a/packages/core/src/__tests__/__snapshots__/solid.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/solid.test.ts.snap @@ -5066,6 +5066,66 @@ export default FigmaButton; " `; +exports[`Solid > jsx > Javascript Test > functionProps 1`] = ` +"function MyBasicComponent(props) { + return ( + <> +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + >

+ + ); +} + +export default MyBasicComponent; +" +`; + +exports[`Solid > jsx > Javascript Test > functionProps 2`] = ` +"function MyBasicComponent(props) { + return ( + <> +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + >

+ + ); +} + +export default MyBasicComponent; +" +`; + exports[`Solid > jsx > Javascript Test > getterState 1`] = ` "import { createSignal, createMemo } from \\"solid-js\\"; @@ -13726,6 +13786,74 @@ export default FigmaButton; " `; +exports[`Solid > jsx > Typescript Test > functionProps 1`] = ` +"export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( + <> +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + >

+ + ); +} + +export default MyBasicComponent; +" +`; + +exports[`Solid > jsx > Typescript Test > functionProps 2`] = ` +"export interface MyBasicComponentProps { + id: string; +} + +function MyBasicComponent(props: MyBasicComponentProps) { + return ( + <> +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + >

+ + ); +} + +export default MyBasicComponent; +" +`; + exports[`Solid > jsx > Typescript Test > getterState 1`] = ` "import { createSignal, createMemo } from \\"solid-js\\"; diff --git a/packages/core/src/__tests__/__snapshots__/stencil.test.ts.snap b/packages/core/src/__tests__/__snapshots__/stencil.test.ts.snap index 72627f12dd..69b918cfe5 100644 --- a/packages/core/src/__tests__/__snapshots__/stencil.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/stencil.test.ts.snap @@ -2898,6 +2898,41 @@ export class FigmaButton { " `; +exports[`Stencil > jsx > Javascript Test > functionProps 1`] = ` +"import { Component, h, Fragment } from \\"@stencil/core\\"; + +@Component({ + tag: \\"my-basic-component\\", +}) +export class MyBasicComponent { + componentDidLoad() {} + + render() { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + >

+ ); + } +} +" +`; + exports[`Stencil > jsx > Javascript Test > getterState 1`] = ` "import { Component, h, Fragment, Prop } from \\"@stencil/core\\"; @@ -7518,6 +7553,45 @@ export class FigmaButton { " `; +exports[`Stencil > jsx > Typescript Test > functionProps 1`] = ` +"import { Component, h, Fragment } from \\"@stencil/core\\"; + +export interface MyBasicComponentProps { + id: string; +} + +@Component({ + tag: \\"my-basic-component\\", +}) +export class MyBasicComponent { + componentDidLoad() {} + + render() { + return ( +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} + >

+ ); + } +} +" +`; + exports[`Stencil > jsx > Typescript Test > getterState 1`] = ` "import { Component, h, Fragment, Prop } from \\"@stencil/core\\"; diff --git a/packages/core/src/__tests__/__snapshots__/svelte.test.ts.snap b/packages/core/src/__tests__/__snapshots__/svelte.test.ts.snap index cace9f6825..567db7bf2e 100644 --- a/packages/core/src/__tests__/__snapshots__/svelte.test.ts.snap +++ b/packages/core/src/__tests__/__snapshots__/svelte.test.ts.snap @@ -228,7 +228,7 @@ exports[`Svelte > jsx > Javascript Test > Basic Outputs Meta 1`] = ` useMetadata: {\\"outputs\\":[\\"onMessage\\",\\"onEvent\\"],\\"baz\\":\\"metadata inside component\\"} */ - + + + + +

x} + f1={(x) => x} + f2={(x) => {}} + f3={function () { + return x; + }} + f4={function (x) { + return x; + }} + f5={function (x) { + return; + }} + f6={function () { + return; + }} + f7={(a, b, c) => a + b + c} +/>" +`; + exports[`Svelte > jsx > Typescript Test > getterState 1`] = ` "" `; +exports[`Vue > jsx > Javascript Test > functionProps 1`] = ` +"" +`; + exports[`Vue > jsx > Javascript Test > getterState 1`] = ` "