diff --git a/.changeset/beige-students-chew.md b/.changeset/beige-students-chew.md new file mode 100644 index 000000000000..25353dc1ddec --- /dev/null +++ b/.changeset/beige-students-chew.md @@ -0,0 +1,5 @@ +--- +'@astrojs/lit': patch +--- + +Allow using Lit's decorators diff --git a/packages/astro/test/fixtures/lit-element/src/components/my-element.js b/packages/astro/test/fixtures/lit-element/src/components/my-element.ts similarity index 89% rename from packages/astro/test/fixtures/lit-element/src/components/my-element.js rename to packages/astro/test/fixtures/lit-element/src/components/my-element.ts index e946924cf7ff..c4c1b92b408f 100644 --- a/packages/astro/test/fixtures/lit-element/src/components/my-element.js +++ b/packages/astro/test/fixtures/lit-element/src/components/my-element.ts @@ -1,8 +1,12 @@ import { LitElement, html } from 'lit'; +import { customElement, property } from 'lit/decorators.js'; +@customElement('my-element') export class MyElement extends LitElement { + @property({ type: Boolean }) + bool = 0; + static properties = { - bool: {type: Boolean}, str: {type: String, attribute: 'str-attr'}, obj: {type: Object}, reflectedBool: {type: Boolean, reflect: true}, @@ -36,5 +40,3 @@ export class MyElement extends LitElement { `; } } - -customElements.define('my-element', MyElement); diff --git a/packages/astro/test/fixtures/lit-element/tsconfig.json b/packages/astro/test/fixtures/lit-element/tsconfig.json new file mode 100644 index 000000000000..f79d7bdca151 --- /dev/null +++ b/packages/astro/test/fixtures/lit-element/tsconfig.json @@ -0,0 +1,3 @@ +{ + "experimentalDecorators": true +} diff --git a/packages/integrations/lit/src/index.ts b/packages/integrations/lit/src/index.ts index fa96a4687ddb..5b428ef8d9f4 100644 --- a/packages/integrations/lit/src/index.ts +++ b/packages/integrations/lit/src/index.ts @@ -13,7 +13,7 @@ function getViteConfiguration() { exclude: ['@astrojs/lit/server.js'], }, ssr: { - external: ['lit-element', '@lit-labs/ssr', '@astrojs/lit'], + external: ['lit-element', '@lit-labs/ssr', '@astrojs/lit', 'lit/decorators.js'], }, }; }