fix: state parser supports string literal keys (#1535)

* fix: string literal can be parsed as state key

* prettierignore

* update snapshots

* update changelog

* add test to note other bug

* fix template

* trigger rebuild

* add support for failing tests

* fix test

* get ci to run again

.changeset/eleven-lies-hope.md

@@ -0,0 +1,5 @@
+---
+'@builder.io/mitosis': patch
+---
+
+state parser supports string literal keys

packages/core/src/__tests__/__snapshots__/alpine.test.ts.snap

@@ -2536,6 +2536,27 @@ exports[`Alpine.js > jsx > Javascript Test > spreadProps 1`] = `
 "
 `;
 
+exports[`Alpine.js > jsx > Javascript Test > string-literal-store 1`] = `
+"<div x-data=\\"stringLiteralStore()\\"><span x-html=\\"foo\\"></span></div>
+<script>
+ document.addEventListener(\\"alpine:init\\", () => {
+ Alpine.data(\\"stringLiteralStore\\", () => ({
+ foo: 123,
+ }));
+ });
+</script>
+"
+`;
+
+exports[`Alpine.js > jsx > Javascript Test > string-literal-store-kebab 1`] = `
+"unknown: Unexpected token, expected \\",\\" (2:60)
+
+ 1 | document.addEventListener('alpine:init', () => {
+> 2 | Alpine.data('stringLiteralStore', () => ({ foo-bar: 123,}))
+ | ^
+ 3 | })"
+`;
+
 exports[`Alpine.js > jsx > Javascript Test > styleClassAndCss 1`] = `
 "<style>
  .div {
@@ -5271,6 +5292,27 @@ exports[`Alpine.js > jsx > Typescript Test > spreadProps 1`] = `
 "
 `;
 
+exports[`Alpine.js > jsx > Typescript Test > string-literal-store 1`] = `
+"<div x-data=\\"stringLiteralStore()\\"><span x-html=\\"foo\\"></span></div>
+<script>
+ document.addEventListener(\\"alpine:init\\", () => {
+ Alpine.data(\\"stringLiteralStore\\", () => ({
+ foo: 123,
+ }));
+ });
+</script>
+"
+`;
+
+exports[`Alpine.js > jsx > Typescript Test > string-literal-store-kebab 1`] = `
+"unknown: Unexpected token, expected \\",\\" (2:60)
+
+ 1 | document.addEventListener('alpine:init', () => {
+> 2 | Alpine.data('stringLiteralStore', () => ({ foo-bar: 123,}))
+ | ^
+ 3 | })"
+`;
+
 exports[`Alpine.js > jsx > Typescript Test > styleClassAndCss 1`] = `
 "<style>
  .div {

packages/core/src/__tests__/__snapshots__/angular.import.test.ts.snap

@@ -5017,6 +5017,99 @@ export class MyComponentModule {}
 "
 `;
 
+exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > string-literal-store 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component } from \\"@angular/core\\";
+
+@Component({
+ selector: \\"string-literal-store, StringLiteralStore\\",
+ template: \`
+ <div>{{foo}}</div>
+ \`,
+ styles: [
+ \`
+ :host {
+ display: contents;
+ }
+ \`,
+ ],
+})
+export default class StringLiteralStore {
+ foo = 123;
+}
+
+@NgModule({
+ declarations: [StringLiteralStore],
+ imports: [CommonModule],
+ exports: [StringLiteralStore],
+})
+export class StringLiteralStoreModule {}
+"
+`;
+
+exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > string-literal-store-kebab 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component } from '@angular/core';
+
+
+
+
+
+
+
+
+
+
+@Component({
+ selector: 'string-literal-store, StringLiteralStore',template: \`
+
+ <div>{{'foo-bar'}}</div>
+
+ \`,styles: [\`:host { display: contents; }\`]
+})
+export default class StringLiteralStore {
+
+
+
+
+
+
+
+
+
+
+
+
+
+ foo-bar= 123
+
+
+
+
+
+
+
+
+
+
+
+
+
+}
+
+@NgModule({
+ declarations: [StringLiteralStore],
+ imports: [CommonModule],
+ exports: [StringLiteralStore],
+
+})
+export class StringLiteralStoreModule {}"
+`;
+
 exports[`Angular with Preserve Imports and File Extensions > jsx > Javascript Test > styleClassAndCss 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";
@@ -10997,6 +11090,99 @@ export class MyComponentModule {}
 "
 `;
 
+exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > string-literal-store 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component } from \\"@angular/core\\";
+
+@Component({
+ selector: \\"string-literal-store, StringLiteralStore\\",
+ template: \`
+ <div>{{foo}}</div>
+ \`,
+ styles: [
+ \`
+ :host {
+ display: contents;
+ }
+ \`,
+ ],
+})
+export default class StringLiteralStore {
+ foo = 123;
+}
+
+@NgModule({
+ declarations: [StringLiteralStore],
+ imports: [CommonModule],
+ exports: [StringLiteralStore],
+})
+export class StringLiteralStoreModule {}
+"
+`;
+
+exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > string-literal-store-kebab 1`] = `
+"import { NgModule } from \\"@angular/core\\";
+import { CommonModule } from \\"@angular/common\\";
+
+import { Component } from '@angular/core';
+
+
+
+
+
+
+
+
+
+
+@Component({
+ selector: 'string-literal-store, StringLiteralStore',template: \`
+
+ <div>{{'foo-bar'}}</div>
+
+ \`,styles: [\`:host { display: contents; }\`]
+})
+export default class StringLiteralStore {
+
+
+
+
+
+
+
+
+
+
+
+
+
+ foo-bar= 123
+
+
+
+
+
+
+
+
+
+
+
+
+
+}
+
+@NgModule({
+ declarations: [StringLiteralStore],
+ imports: [CommonModule],
+ exports: [StringLiteralStore],
+
+})
+export class StringLiteralStoreModule {}"
+`;
+
 exports[`Angular with Preserve Imports and File Extensions > jsx > Typescript Test > styleClassAndCss 1`] = `
 "import { NgModule } from \\"@angular/core\\";
 import { CommonModule } from \\"@angular/common\\";