diff options
Diffstat (limited to 'packages/integrations/lit')
-rw-r--r-- | packages/integrations/lit/.gitignore | 1 | ||||
-rw-r--r-- | packages/integrations/lit/CHANGELOG.md | 306 | ||||
-rw-r--r-- | packages/integrations/lit/README.md | 38 | ||||
-rw-r--r-- | packages/integrations/lit/client-shim.js | 16 | ||||
-rw-r--r-- | packages/integrations/lit/client-shim.min.js | 85 | ||||
-rw-r--r-- | packages/integrations/lit/hydration-support.js | 2 | ||||
-rw-r--r-- | packages/integrations/lit/package.json | 73 | ||||
-rw-r--r-- | packages/integrations/lit/server-shim.js | 35 | ||||
-rw-r--r-- | packages/integrations/lit/server.d.ts | 2 | ||||
-rw-r--r-- | packages/integrations/lit/server.js | 118 | ||||
-rw-r--r-- | packages/integrations/lit/src/client.ts | 72 | ||||
-rw-r--r-- | packages/integrations/lit/src/index.ts | 67 | ||||
-rw-r--r-- | packages/integrations/lit/test/sass.test.js | 15 | ||||
-rw-r--r-- | packages/integrations/lit/test/server.test.js | 134 | ||||
-rw-r--r-- | packages/integrations/lit/tsconfig.json | 7 |
15 files changed, 0 insertions, 971 deletions
diff --git a/packages/integrations/lit/.gitignore b/packages/integrations/lit/.gitignore deleted file mode 100644 index 40b878db5..000000000 --- a/packages/integrations/lit/.gitignore +++ /dev/null @@ -1 +0,0 @@ -node_modules/
\ No newline at end of file diff --git a/packages/integrations/lit/CHANGELOG.md b/packages/integrations/lit/CHANGELOG.md deleted file mode 100644 index 0aa8f4f71..000000000 --- a/packages/integrations/lit/CHANGELOG.md +++ /dev/null @@ -1,306 +0,0 @@ -# @astrojs/lit - -## 4.3.0 - -### Minor Changes - -- [#11234](https://github.com/withastro/astro/pull/11234) [`4385bf7`](https://github.com/withastro/astro/commit/4385bf7a4dc9c65bff53a30c660f7a909fcabfc9) Thanks [@ematipico](https://github.com/ematipico)! - Adds a new function called `addServerRenderer` to the Container API. Use this function to manually store renderers inside the instance of your container. - - This new function should be preferred when using the Container API in environments like on-demand pages: - - ```ts - import type { APIRoute } from 'astro'; - import { experimental_AstroContainer } from 'astro/container'; - import reactRenderer from '@astrojs/react/server.js'; - import vueRenderer from '@astrojs/vue/server.js'; - import ReactComponent from '../components/button.jsx'; - import VueComponent from '../components/button.vue'; - - // MDX runtime is contained inside the Astro core - import mdxRenderer from 'astro/jsx/server.js'; - - // In case you need to import a custom renderer - import customRenderer from '../renderers/customRenderer.js'; - - export const GET: APIRoute = async (ctx) => { - const container = await experimental_AstroContainer.create(); - container.addServerRenderer({ renderer: reactRenderer }); - container.addServerRenderer({ renderer: vueRenderer }); - container.addServerRenderer({ renderer: customRenderer }); - // You can pass a custom name too - container.addServerRenderer({ - name: 'customRenderer', - renderer: customRenderer, - }); - const vueComponent = await container.renderToString(VueComponent); - return await container.renderToResponse(Component); - }; - ``` - -## 4.2.0 - -### Minor Changes - -- [#11144](https://github.com/withastro/astro/pull/11144) [`803dd80`](https://github.com/withastro/astro/commit/803dd8061df02138b4928442bcb76e77dcf6f5e7) Thanks [@ematipico](https://github.com/ematipico)! - The integration now exposes a function called `getContainerRenderer`, that can be used inside the Container APIs to load the relative renderer. - - ```js - import { experimental_AstroContainer as AstroContainer } from 'astro/container'; - import ReactWrapper from '../src/components/ReactWrapper.astro'; - import { loadRenderers } from 'astro:container'; - import { getContainerRenderer } from '@astrojs/react'; - - test('ReactWrapper with react renderer', async () => { - const renderers = await loadRenderers([getContainerRenderer()]); - const container = await AstroContainer.create({ - renderers, - }); - const result = await container.renderToString(ReactWrapper); - - expect(result).toContain('Counter'); - expect(result).toContain('Count: <!-- -->5'); - }); - ``` - -## 4.1.0 - -### Minor Changes - -- [#11164](https://github.com/withastro/astro/pull/11164) [`cf9b2ff`](https://github.com/withastro/astro/commit/cf9b2ff7967c4287ab26ec65fc4bb2eed525a235) Thanks [@scottnath](https://github.com/scottnath)! - Removes deprecated `template` attribute and replaces deprecated domparser function - -## 4.0.1 - -### Patch Changes - -- [#9479](https://github.com/withastro/astro/pull/9479) [`1baf0b0d3cbd0564954c2366a7278794fad6726e`](https://github.com/withastro/astro/commit/1baf0b0d3cbd0564954c2366a7278794fad6726e) Thanks [@sarah11918](https://github.com/sarah11918)! - Updates README - -## 4.0.0 - -### Major Changes - -- [#8822](https://github.com/withastro/astro/pull/8822) [`b0a71946f`](https://github.com/withastro/astro/commit/b0a71946f4320d4e76f31e990fe5821f823f0e12) Thanks [@Geoffrey-Pliez](https://github.com/Geoffrey-Pliez)! - Upgrade to Lit 3.0 - -## 3.0.3 - -### Patch Changes - -- [#9018](https://github.com/withastro/astro/pull/9018) [`23c9a30ad`](https://github.com/withastro/astro/commit/23c9a30ad859398d62a013d639b5b2716b583331) Thanks [@augustjk](https://github.com/augustjk)! - Fix hydration ordering of nested custom elements. Child components will now wait for their parents to hydrate before hydrating themselves. - -## 3.0.2 - -### Patch Changes - -- [#8826](https://github.com/withastro/astro/pull/8826) [`754c40f6e`](https://github.com/withastro/astro/commit/754c40f6ed941a61362d221915568c04ae85d6ad) Thanks [@lilnasy](https://github.com/lilnasy)! - Fixed an issue where an incompatible version of lit was installed. - -## 3.0.1 - -### Patch Changes - -- [#8737](https://github.com/withastro/astro/pull/8737) [`6f60da805`](https://github.com/withastro/astro/commit/6f60da805e0014bc50dd07bef972e91c73560c3c) Thanks [@ematipico](https://github.com/ematipico)! - Add provenance statement when publishing the library from CI - -## 3.0.0 - -### Major Changes - -- [#8188](https://github.com/withastro/astro/pull/8188) [`d0679a666`](https://github.com/withastro/astro/commit/d0679a666f37da0fca396d42b9b32bbb25d29312) Thanks [@ematipico](https://github.com/ematipico)! - Remove support for Node 16. The lowest supported version by Astro and all integrations is now v18.14.1. As a reminder, Node 16 will be deprecated on the 11th September 2023. - -- [#8179](https://github.com/withastro/astro/pull/8179) [`6011d52d3`](https://github.com/withastro/astro/commit/6011d52d38e43c3e3d52bc3bc41a60e36061b7b7) Thanks [@matthewp](https://github.com/matthewp)! - Astro 3.0 Release Candidate - -## 3.0.0-rc.1 - -### Major Changes - -- [#8179](https://github.com/withastro/astro/pull/8179) [`6011d52d3`](https://github.com/withastro/astro/commit/6011d52d38e43c3e3d52bc3bc41a60e36061b7b7) Thanks [@matthewp](https://github.com/matthewp)! - Astro 3.0 Release Candidate - -## 3.0.0-beta.0 - -### Major Changes - -- [`1eae2e3f7`](https://github.com/withastro/astro/commit/1eae2e3f7d693c9dfe91c8ccfbe606d32bf2fb81) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Remove support for Node 16. The lowest supported version by Astro and all integrations is now v18.14.1. As a reminder, Node 16 will be deprecated on the 11th September 2023. - -## 2.1.1 - -### Patch Changes - -- [#7985](https://github.com/withastro/astro/pull/7985) [`ec06dd9bb`](https://github.com/withastro/astro/commit/ec06dd9bbb29cc38e891517fbf884cb7083b3240) Thanks [@delucis](https://github.com/delucis)! - Fix formatting in Lit README - -## 2.1.0 - -### Minor Changes - -- [#7373](https://github.com/withastro/astro/pull/7373) [`0986a44dd`](https://github.com/withastro/astro/commit/0986a44ddd2b48edbe318f6fceb7f4ce4670ce05) Thanks [@matthewp](https://github.com/matthewp)! - Upgrade lit dependencies - -## 2.0.2 - -### Patch Changes - -- [#7104](https://github.com/withastro/astro/pull/7104) [`826e02890`](https://github.com/withastro/astro/commit/826e0289005f645b902375b98d5549c6a95ccafa) Thanks [@bluwy](https://github.com/bluwy)! - Specify `"files"` field to only publish necessary files - -## 2.0.1 - -### Patch Changes - -- [#6752](https://github.com/withastro/astro/pull/6752) [`c7eb0d431`](https://github.com/withastro/astro/commit/c7eb0d431032edc5d4af72726d84e1c52ef36575) Thanks [@augustjk](https://github.com/augustjk)! - Provide `renderInfo` when rendering Lit components. Fixes issue with rendering nested components. - -## 2.0.0 - -### Major Changes - -- [#6681](https://github.com/withastro/astro/pull/6681) [`4b077318f`](https://github.com/withastro/astro/commit/4b077318fbc21c4350cc21c380d96b54d302759c) Thanks [@e111077](https://github.com/e111077)! - Update to use `@lit-labs/ssr@^3` - **[BREAKING]** DOM shim required for Lit SSR has been greatly reduced. `window`, `document`, and other objects are no longer available in global. Most SSR-ready component code should not be affected but, if so, they can be fixed with optional chaining or by using the `isServer` environment checker from the `lit` package. See [lit.dev docs on authoring components for SSR].(https://lit.dev/docs/ssr/authoring/#browser-only-code) - **[BREAKING]** Adds compatibility with `lit@2.7.0` hydration behavior. Do not update if you're using `lit@2.6.1` or lower. - Includes support for template[shadowrootmode] support. - -## 1.3.0 - -### Minor Changes - -- [#6213](https://github.com/withastro/astro/pull/6213) [`afbbc4d5b`](https://github.com/withastro/astro/commit/afbbc4d5bfafc1779bac00b41c2a1cb1c90f2808) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Updated compilation settings to disable downlevelling for Node 14 - -## 1.2.1 - -### Patch Changes - -- [#6351](https://github.com/withastro/astro/pull/6351) [`26bf12ef3`](https://github.com/withastro/astro/commit/26bf12ef3c7ab874a23ac753f841f7bb329c9361) Thanks [@hrmcdonald](https://github.com/hrmcdonald)! - Render DSD attributes based on `shadowRootOptions` - -## 1.2.0 - -### Minor Changes - -- [#6111](https://github.com/withastro/astro/pull/6111) [`ec38a8921`](https://github.com/withastro/astro/commit/ec38a8921f02a275949abcababe1b8afdf8184a2) Thanks [@e111077](https://github.com/e111077)! - Implement client:only functionality in Lit and add lit to the client:only warning - -## 1.1.2 - -### Patch Changes - -- [#6080](https://github.com/withastro/astro/pull/6080) [`0db220415`](https://github.com/withastro/astro/commit/0db22041531d981a813a07f4c4e00cfb7ebddd51) Thanks [@e111077](https://github.com/e111077)! - Fixes Lit hydration not having the same reactive values as server (losing state upon hydration) - -- [#6055](https://github.com/withastro/astro/pull/6055) [`2567aa48b`](https://github.com/withastro/astro/commit/2567aa48bba8751cf7e10429555f1e85830c9169) Thanks [@e111077](https://github.com/e111077)! - Add forwards compatibility for streaming Declarative Shadow DOM - -## 1.1.1 - -### Patch Changes - -- [#5478](https://github.com/withastro/astro/pull/5478) [`1c7eef308`](https://github.com/withastro/astro/commit/1c7eef308e808aa5ed4662b53e67ec8d1b814d1f) Thanks [@nemo0](https://github.com/nemo0)! - Update READMEs for consistency - -## 1.1.0 - -### Minor Changes - -- [#5782](https://github.com/withastro/astro/pull/5782) [`1f92d64ea`](https://github.com/withastro/astro/commit/1f92d64ea35c03fec43aff64eaf704dc5a9eb30a) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Only shim fetch if not already present - -- [#5791](https://github.com/withastro/astro/pull/5791) [`f7aa1ec25`](https://github.com/withastro/astro/commit/f7aa1ec25d1584f7abd421903fbef66b1c050e2a) Thanks [@ba55ie](https://github.com/ba55ie)! - Fix Lit slotted content - -## 1.0.2 - -### Patch Changes - -- [#5782](https://github.com/withastro/astro/pull/5782) [`1f92d64ea`](https://github.com/withastro/astro/commit/1f92d64ea35c03fec43aff64eaf704dc5a9eb30a) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Only shim fetch if not already present - -- [#5776](https://github.com/withastro/astro/pull/5776) [`6a31433ed`](https://github.com/withastro/astro/commit/6a31433ed79c7f84fd3ce602005b42ad95007d84) & [#5791](https://github.com/withastro/astro/pull/5791) [`f7aa1ec25`](https://github.com/withastro/astro/commit/f7aa1ec25d1584f7abd421903fbef66b1c050e2a) Thanks [@ba55ie](https://github.com/ba55ie)! - Fix Lit slotted content - -## 1.0.2-beta.0 - -<details> -<summary>See changes in 1.0.2-beta.0</summary> - -### Patch Changes - -- [#5782](https://github.com/withastro/astro/pull/5782) [`1f92d64ea`](https://github.com/withastro/astro/commit/1f92d64ea35c03fec43aff64eaf704dc5a9eb30a) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Only shim fetch if not already present - -- [#5791](https://github.com/withastro/astro/pull/5791) [`f7aa1ec25`](https://github.com/withastro/astro/commit/f7aa1ec25d1584f7abd421903fbef66b1c050e2a) Thanks [@ba55ie](https://github.com/ba55ie)! - Fix Lit slotted content - -</details> - -## 1.0.1 - -### Patch Changes - -- [#4503](https://github.com/withastro/astro/pull/4503) [`1222ab954`](https://github.com/withastro/astro/commit/1222ab9540d17e4e7e811240b8a2a039acc333cb) Thanks [@matthewp](https://github.com/matthewp)! - Allow using Lit's decorators - -## 1.0.0 - -### Major Changes - -- [`04ad44563`](https://github.com/withastro/astro/commit/04ad445632c67bdd60c1704e1e0dcbcaa27b9308) - > Astro v1.0 is out! Read the [official announcement post](https://astro.build/blog/astro-1/). - - **No breaking changes**. This package is now officially stable and compatible with `astro@1.0.0`! - -## 0.3.2 - -### Patch Changes - -- [#4009](https://github.com/withastro/astro/pull/4009) [`01ba07d8f`](https://github.com/withastro/astro/commit/01ba07d8fa7eb67530b47b8530d65906f1aebf6e) Thanks [@matthewp](https://github.com/matthewp)! - Fixes Lit compat with Vite 3.0.1 - -## 0.3.1 - -### Patch Changes - -- [#3854](https://github.com/withastro/astro/pull/3854) [`b012ee55`](https://github.com/withastro/astro/commit/b012ee55b107dea0730286263b27d83e530fad5d) Thanks [@bholmesdev](https://github.com/bholmesdev)! - [astro add] Support adapters and third party packages - -## 0.3.0 - -### Minor Changes - -- [#3652](https://github.com/withastro/astro/pull/3652) [`7373d61c`](https://github.com/withastro/astro/commit/7373d61cdcaedd64bf5fd60521b157cfa4343558) Thanks [@natemoo-re](https://github.com/natemoo-re)! - Adds support for passing named slots from `.astro` => Lit components. - - All slots are treated as Light DOM content. - -## 0.2.0 - -### Minor Changes - -- [#3625](https://github.com/withastro/astro/pull/3625) [`f5afaf24`](https://github.com/withastro/astro/commit/f5afaf24984ee7d4d6e908a7eeed17f5ca18c61e) Thanks [@matthewp](https://github.com/matthewp)! - Conform to Constructor based rendering - - This changes `@astrojs/lit` to conform to the way rendering happens in all other frameworks. Instead of using the tag name `<my-element client:load>` you use the imported constructor function, `<MyElement client:load>` like you would do with any other framework. - - Support for `tag-name` syntax had to be removed due to the fact that it was a runtime feature that was not statically analyzable. To improve build performance, we have removed all runtime based component discovery. Using the imported Constructor name allows Astro to discover what components need to be built and bundled for production without ever running your file. - -## 0.1.5 - -### Patch Changes - -- [#3511](https://github.com/withastro/astro/pull/3511) [`2fedb974`](https://github.com/withastro/astro/commit/2fedb974899b37a8d9ddabc476764a6d35d1e446) Thanks [@natemoo-re](https://github.com/natemoo-re)! - Patch Lit's server shim to allow for `sass` compatibility - -## 0.1.4 - -### Patch Changes - -- [#3484](https://github.com/withastro/astro/pull/3484) [`55820fa7`](https://github.com/withastro/astro/commit/55820fa784d6d4f66a45092321a47c8ce9de5546) Thanks [@matthewp](https://github.com/matthewp)! - Wait for DOMCOntentLoaded to polyfill in Lit - -## 0.1.3 - -### Patch Changes - -- [#3375](https://github.com/withastro/astro/pull/3375) [`fe61e469`](https://github.com/withastro/astro/commit/fe61e469b243c27781112499f151782baf9004a4) Thanks [@jdvivar](https://github.com/jdvivar)! - Added tests and fix a small edge case for when you call render with no props/attrs - -## 0.1.2 - -### Patch Changes - -- [#3164](https://github.com/withastro/astro/pull/3164) [`e85b16e2`](https://github.com/withastro/astro/commit/e85b16e2b3d846333f542139c82640de19bfd2f5) Thanks [@matthewp](https://github.com/matthewp)! - Fixes lit when running in SSR - -## 0.1.1 - -### Patch Changes - -- [`815d62f1`](https://github.com/withastro/astro/commit/815d62f151a36fef7d09590d4962ca71bda61b32) Thanks [@FredKSchott](https://github.com/FredKSchott)! - no changes. - -## 0.1.0 - -### Minor Changes - -- [#2979](https://github.com/withastro/astro/pull/2979) [`9d7a4b59`](https://github.com/withastro/astro/commit/9d7a4b59b53f8cb274266f5036d1cef841750252) Thanks [@FredKSchott](https://github.com/FredKSchott)! - Welcome to the Astro v1.0.0 Beta! Read the [official announcement](https://astro.build/blog/astro-1-beta-release/) for more details. - -## 0.0.2 - -### Patch Changes - -- [#2885](https://github.com/withastro/astro/pull/2885) [`6b004363`](https://github.com/withastro/astro/commit/6b004363f99f27e581d1e2d53a2ebff39d7afb8a) Thanks [@bholmesdev](https://github.com/bholmesdev)! - Add README across Astro built-in integrations - -* [#2847](https://github.com/withastro/astro/pull/2847) [`3b621f7a`](https://github.com/withastro/astro/commit/3b621f7a613b45983b090794fa7c015f23ed6140) Thanks [@tony-sull](https://github.com/tony-sull)! - Adds keywords to the official integrations to support discoverability on Astro's Integrations site - -## 0.0.2-next.0 - -### Patch Changes - -- [#2847](https://github.com/withastro/astro/pull/2847) [`3b621f7a`](https://github.com/withastro/astro/commit/3b621f7a613b45983b090794fa7c015f23ed6140) Thanks [@tony-sull](https://github.com/tony-sull)! - Adds keywords to the official integrations to support discoverability on Astro's Integrations site diff --git a/packages/integrations/lit/README.md b/packages/integrations/lit/README.md deleted file mode 100644 index 5d0acb5ed..000000000 --- a/packages/integrations/lit/README.md +++ /dev/null @@ -1,38 +0,0 @@ -# @astrojs/lit đŸ”¥ - -This **[Astro integration][astro-integration]** enables server-side rendering and client-side hydration for your [Lit](https://lit.dev/) custom elements. - -## Documentation - -Read the [`@astrojs/lit` docs][docs] - -## Support - -- Get help in the [Astro Discord][discord]. Post questions in our `#support` forum, or visit our dedicated `#dev` channel to discuss current development and more! - -- Check our [Astro Integration Documentation][astro-integration] for more on integrations. - -- Submit bug reports and feature requests as [GitHub issues][issues]. - -## Contributing - -This package is maintained by Astro's Core team. You're welcome to submit an issue or PR! These links will help you get started: - -- [Contributor Manual][contributing] -- [Code of Conduct][coc] -- [Community Guide][community] - -## License - -MIT - -Copyright (c) 2023–present [Astro][astro] - -[astro]: https://astro.build/ -[docs]: https://docs.astro.build/en/guides/integrations-guide/lit/ -[contributing]: https://github.com/withastro/astro/blob/main/CONTRIBUTING.md -[coc]: https://github.com/withastro/.github/blob/main/CODE_OF_CONDUCT.md -[community]: https://github.com/withastro/.github/blob/main/COMMUNITY_GUIDE.md -[discord]: https://astro.build/chat/ -[issues]: https://github.com/withastro/astro/issues -[astro-integration]: https://docs.astro.build/en/guides/integrations-guide/ diff --git a/packages/integrations/lit/client-shim.js b/packages/integrations/lit/client-shim.js deleted file mode 100644 index c28ee5edf..000000000 --- a/packages/integrations/lit/client-shim.js +++ /dev/null @@ -1,16 +0,0 @@ -async function polyfill() { - const { hydrateShadowRoots } = await import( - '@webcomponents/template-shadowroot/template-shadowroot.js' - ); - window.addEventListener('DOMContentLoaded', () => hydrateShadowRoots(document.body), { - once: true, - }); -} - -const polyfillCheckEl = Document.parseHTMLUnsafe( - `<p><template shadowrootmode="open"></template></p>`, -).querySelector('p'); - -if (!polyfillCheckEl?.shadowRoot) { - polyfill(); -} diff --git a/packages/integrations/lit/client-shim.min.js b/packages/integrations/lit/client-shim.min.js deleted file mode 100644 index 0ec44c3fa..000000000 --- a/packages/integrations/lit/client-shim.min.js +++ /dev/null @@ -1,85 +0,0 @@ -/** @license Copyright 2020 Google LLC (BSD-3-Clause) */ -/** Bundled JS generated from "@astrojs/lit/client-shim.js" */ -var N = Object.defineProperty; -var i = (t, n) => () => (t && (n = t((t = 0))), n); -var b = (t, n) => { - for (var a in n) N(t, a, { get: n[a], enumerable: !0 }); -}; -function s() { - if (d === void 0) { - let t = document.createElement('div'); - (t.innerHTML = '<div><template shadowrootmode="open"></template></div>'), - (d = !!t.firstElementChild.shadowRoot); - } - return d; -} -var d, - m = i(() => {}); -var p, - c, - f, - u = i(() => { - (p = (t) => t.parentElement === null), - (c = (t) => t.tagName === 'TEMPLATE'), - (f = (t) => t.nodeType === Node.ELEMENT_NODE); - }); -var h, - E = i(() => { - m(); - u(); - h = (t) => { - var n; - if (s()) return; - let a = [], - e = t.firstElementChild; - for (; e !== t && e !== null; ) - if (c(e)) a.push(e), (e = e.content); - else if (e.firstElementChild !== null) e = e.firstElementChild; - else if (f(e) && e.nextElementSibling !== null) e = e.nextElementSibling; - else { - let o; - for (; e !== t && e !== null; ) - if (p(e)) { - o = a.pop(); - let r = o.parentElement, - l = o.getAttribute('shadowroot'); - if (((e = o), l === 'open' || l === 'closed')) { - let y = o.hasAttribute('shadowrootdelegatesfocus'); - try { - r.attachShadow({ mode: l, delegatesFocus: y }).append(o.content); - } catch {} - } else o = void 0; - } else { - let r = e.nextElementSibling; - if (r != null) { - (e = r), o !== void 0 && o.parentElement.removeChild(o); - break; - } - let l = - (n = e.parentElement) === null || n === void 0 ? void 0 : n.nextElementSibling; - if (l != null) { - (e = l), o !== void 0 && o.parentElement.removeChild(o); - break; - } - (e = e.parentElement), o !== void 0 && (o.parentElement.removeChild(o), (o = void 0)); - } - } - }; - }); -var w = i(() => { - E(); -}); -var v = {}; -b(v, { hasNativeDeclarativeShadowRoots: () => s, hydrateShadowRoots: () => h }); -var S = i(() => { - m(); - w(); -}); -async function g() { - let { hydrateShadowRoots: t } = await Promise.resolve().then(() => (S(), v)); - window.addEventListener('DOMContentLoaded', () => t(document.body), { once: true }); -} -var x = Document.parseHTMLUnsafe( - '<p><template shadowrootmode="open"></template></p>', -).querySelector('p'); -(!x || !x.shadowRoot) && g(); diff --git a/packages/integrations/lit/hydration-support.js b/packages/integrations/lit/hydration-support.js deleted file mode 100644 index 0f367ae0b..000000000 --- a/packages/integrations/lit/hydration-support.js +++ /dev/null @@ -1,2 +0,0 @@ -// @ts-check -import '@lit-labs/ssr-client/lit-element-hydrate-support.js'; diff --git a/packages/integrations/lit/package.json b/packages/integrations/lit/package.json deleted file mode 100644 index 95af7feac..000000000 --- a/packages/integrations/lit/package.json +++ /dev/null @@ -1,73 +0,0 @@ -{ - "name": "@astrojs/lit", - "version": "4.3.0", - "description": "Use Lit components within Astro", - "type": "module", - "types": "./dist/index.d.ts", - "author": "withastro", - "license": "MIT", - "repository": { - "type": "git", - "url": "https://github.com/withastro/astro.git", - "directory": "packages/integrations/lit" - }, - "keywords": [ - "astro-integration", - "astro-component", - "renderer", - "lit" - ], - "bugs": "https://github.com/withastro/astro/issues", - "homepage": "https://docs.astro.build/en/guides/integrations-guide/lit/", - "exports": { - ".": "./dist/index.js", - "./server.js": { - "default": "./server.js", - "types": "./server.d.ts" - }, - "./client-shim.js": "./client-shim.js", - "./dist/client.js": "./dist/client.js", - "./hydration-support.js": "./hydration-support.js", - "./package.json": "./package.json" - }, - "files": [ - "dist", - "client-shim.js", - "client-shim.min.js", - "hydration-support.js", - "server.js", - "server.d.ts", - "server-shim.js" - ], - "scripts": { - "build": "astro-scripts build \"src/**/*.ts\" && tsc", - "build:ci": "astro-scripts build \"src/**/*.ts\"", - "dev": "astro-scripts dev \"src/**/*.ts\"", - "test": "astro-scripts test \"test/**/*.test.js\"" - }, - "dependencies": { - "@lit-labs/ssr": "^3.2.2", - "@lit-labs/ssr-client": "^1.1.7", - "@lit-labs/ssr-dom-shim": "^1.2.1", - "parse5": "^7.2.1" - }, - "overrides": { - "@lit-labs/ssr": { - "@lit-labs/ssr-client": "1.1.7" - } - }, - "devDependencies": { - "astro": "workspace:*", - "astro-scripts": "workspace:*", - "cheerio": "1.0.0", - "lit": "^3.2.1", - "sass": "^1.80.4" - }, - "peerDependencies": { - "@webcomponents/template-shadowroot": "^0.2.1", - "lit": "^3.1.0" - }, - "publishConfig": { - "provenance": true - } -} diff --git a/packages/integrations/lit/server-shim.js b/packages/integrations/lit/server-shim.js deleted file mode 100644 index d777382f2..000000000 --- a/packages/integrations/lit/server-shim.js +++ /dev/null @@ -1,35 +0,0 @@ -import { customElements as litCE, HTMLElement as litShimHTMLElement } from '@lit-labs/ssr-dom-shim'; - -// Something at build time injects document.currentScript = undefined instead of -// document.currentScript = null. This causes Sass build to fail because it -// seems to be expecting `=== null`. This set to `undefined` doesn't seem to be -// caused by Lit and only happens at build / test time, but not in dev or -// preview time. -if (globalThis.document) { - document.currentScript = null; -} - -if (globalThis.HTMLElement) { - // Seems Astro's Element shim does nothing when `.setAttribute` is called - // and subsequently `.getAttribute` is called. Causes Lit to not SSR attrs - globalThis.HTMLElement = litShimHTMLElement; -} - -// Astro seems to have a DOM shim and the only real difference that we need out -// of the Lit DOM shim is that the Lit DOM shim reads -// `HTMLElement.observedAttributes` which is meant to trigger -// `ReactiveElement.finalize()`. So this is the only thing we will re-shim since -// Lit will try to respect other global DOM shims. -globalThis.customElements = litCE; - -const litCeDefine = customElements.define; - -// We need to patch customElements.define to keep track of the tagName on the -// class itself so that we can transform JSX custom element class definition to -// a DSD string on the server, because there is no way to get the tagName from a -// CE class otherwise. Not an issue on client:only because the browser supports -// appending a class instance directly to the DOM. -customElements.define = function (tagName, Ctr) { - Ctr[Symbol.for('tagName')] = tagName; - return litCeDefine.call(this, tagName, Ctr); -}; diff --git a/packages/integrations/lit/server.d.ts b/packages/integrations/lit/server.d.ts deleted file mode 100644 index bb2f29556..000000000 --- a/packages/integrations/lit/server.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -import type { NamedSSRLoadedRendererValue } from 'astro'; -export default NamedSSRLoadedRendererValue; diff --git a/packages/integrations/lit/server.js b/packages/integrations/lit/server.js deleted file mode 100644 index d1da3c6c9..000000000 --- a/packages/integrations/lit/server.js +++ /dev/null @@ -1,118 +0,0 @@ -// Separate import from the rest so it doesn't get re-organized after other imports -import './server-shim.js'; - -import { LitElementRenderer } from '@lit-labs/ssr/lib/lit-element-renderer.js'; -import * as parse5 from 'parse5'; - -function isCustomElementTag(name) { - return typeof name === 'string' && name.includes('-'); -} - -function getCustomElementConstructor(name) { - if (typeof customElements !== 'undefined' && isCustomElementTag(name)) { - return customElements.get(name) || null; - } else if (typeof name === 'function') { - return name; - } - return null; -} - -async function isLitElement(Component) { - const Ctr = getCustomElementConstructor(Component); - return !!Ctr?._$litElement$; -} - -async function check(Component) { - // Lit doesn't support getting a tagName from a Constructor at this time. - // So this must be a string at the moment. - return !!(await isLitElement(Component)); -} - -function* render(Component, attrs, slots) { - let tagName = Component; - if (typeof tagName !== 'string') { - tagName = Component[Symbol.for('tagName')]; - } - const instance = new LitElementRenderer(tagName); - - // LitElementRenderer creates a new element instance, so copy over. - const Ctr = getCustomElementConstructor(tagName); - let shouldDeferHydration = false; - - if (attrs) { - for (let [name, value] of Object.entries(attrs)) { - const isReactiveProperty = name in Ctr.prototype; - const isReflectedReactiveProperty = Ctr.elementProperties.get(name)?.reflect; - - // Only defer hydration if we are setting a reactive property that cannot - // be reflected / serialized as a property. - shouldDeferHydration ||= isReactiveProperty && !isReflectedReactiveProperty; - - if (isReactiveProperty) { - instance.setProperty(name, value); - } else { - instance.setAttribute(name, value); - } - } - } - - instance.connectedCallback(); - - yield `<${tagName}${shouldDeferHydration ? ' defer-hydration' : ''}`; - yield* instance.renderAttributes(); - yield `>`; - const shadowContents = instance.renderShadow({ - elementRenderers: [LitElementRenderer], - customElementInstanceStack: [instance], - customElementHostStack: [instance], - deferHydration: false, - }); - if (shadowContents !== undefined) { - const { mode = 'open', delegatesFocus } = instance.shadowRootOptions ?? {}; - // `delegatesFocus` is intentionally allowed to coerce to boolean to - // match web platform behavior. - const delegatesfocusAttr = delegatesFocus ? ' shadowrootdelegatesfocus' : ''; - yield `<template shadowroot="${mode}" shadowrootmode="${mode}"${delegatesfocusAttr}>`; - yield* shadowContents; - yield '</template>'; - } - if (slots) { - for (let [slot, value = ''] of Object.entries(slots)) { - if (slot !== 'default' && value) { - // Parse the value as a concatenated string - const fragment = parse5.parseFragment(`${value}`); - - // Add the missing slot attribute to child Element nodes - for (const node of fragment.childNodes) { - if (node.tagName && !node.attrs.some(({ name }) => name === 'slot')) { - node.attrs.push({ name: 'slot', value: slot }); - } - } - - value = parse5.serialize(fragment); - } - - yield value; - } - } - yield `</${tagName}>`; -} - -async function renderToStaticMarkup(Component, props, slots) { - let tagName = Component; - - let out = ''; - for (let chunk of render(tagName, props, slots)) { - out += chunk; - } - - return { - html: out, - }; -} - -export default { - name: '@astrojs/lit', - check, - renderToStaticMarkup, -}; diff --git a/packages/integrations/lit/src/client.ts b/packages/integrations/lit/src/client.ts deleted file mode 100644 index 9a573d8ee..000000000 --- a/packages/integrations/lit/src/client.ts +++ /dev/null @@ -1,72 +0,0 @@ -/** - * Adds the appropriate slot attribute to each top-level node in the given HTML - * string. - * - * @example - * addSlotAttrsToHtmlString('foo', '<div>bar</div><div>baz</div>'); - * // '<div slot="foo">bar</div><div slot="foo">baz</div>' - * - * @param slotName Name of slot to apply to HTML string. - * @param html Stringified HTML that should be projected into the given slotname. - * @returns A stringified HTML string with the slot attribute applied to each top-level node. - */ -const addSlotAttrsToHtmlString = (slotName: string, html: string) => { - const templ = document.createElement('template'); - templ.innerHTML = html; - Array.from(templ.content.children).forEach((node) => { - node.setAttribute('slot', slotName); - }); - return templ.innerHTML; -}; - -export default (element: HTMLElement) => - async ( - Component: any, - props: Record<string, any>, - { default: defaultChildren, ...slotted }: { default: string; [slotName: string]: string }, - ) => { - // Get the LitElement element instance. - let component = element.children[0]; - // Check if hydration model is client:only - const isClientOnly = element.getAttribute('client') === 'only'; - - // We need to attach the element and it's children to the DOM since it's not - // SSR'd. - if (isClientOnly) { - component = new Component(); - - const otherSlottedChildren = Object.entries(slotted) - .map(([slotName, htmlStr]) => addSlotAttrsToHtmlString(slotName, htmlStr)) - .join(''); - - // defaultChildren can actually be undefined, but TS will complain if we - // type it as so, make sure we don't render undefined. - component.innerHTML = `${defaultChildren ?? ''}${otherSlottedChildren}`; - element.appendChild(component); - - // Set props bound to non-reactive properties as attributes. - for (let [name, value] of Object.entries(props)) { - if (!(name in Component.prototype)) { - component.setAttribute(name, value); - } - } - } - - // If there is no deferral of hydration, then all reactive properties are - // already serialized as reflected attributes, or no reactive props were set - // Alternatively, if hydration is client:only proceed to set props. - if (!component || !(component.hasAttribute('defer-hydration') || isClientOnly)) { - return; - } - - // Set properties on the LitElement instance for resuming hydration. - for (let [name, value] of Object.entries(props)) { - // Check if reactive property or class property. - if (name in Component.prototype) { - (component as any)[name] = value; - } - } - - // Tell LitElement to resume hydration. - component.removeAttribute('defer-hydration'); - }; diff --git a/packages/integrations/lit/src/index.ts b/packages/integrations/lit/src/index.ts deleted file mode 100644 index 94a6d683a..000000000 --- a/packages/integrations/lit/src/index.ts +++ /dev/null @@ -1,67 +0,0 @@ -import { readFileSync } from 'node:fs'; -import type { AstroIntegration, ContainerRenderer } from 'astro'; - -function getViteConfiguration() { - return { - optimizeDeps: { - include: [ - '@astrojs/lit/dist/client.js', - '@astrojs/lit/client-shim.js', - '@astrojs/lit/hydration-support.js', - '@webcomponents/template-shadowroot/template-shadowroot.js', - '@lit-labs/ssr-client/lit-element-hydrate-support.js', - ], - exclude: ['@astrojs/lit/server.js'], - }, - ssr: { - external: ['lit-element', '@lit-labs/ssr', '@astrojs/lit', 'lit/decorators.js'], - }, - }; -} - -export function getContainerRenderer(): ContainerRenderer { - return { - name: '@astrojs/lit', - serverEntrypoint: '@astrojs/lit/server.js', - }; -} - -export default function (): AstroIntegration { - return { - name: '@astrojs/lit', - hooks: { - 'astro:config:setup': ({ updateConfig, addRenderer, injectScript }) => { - // Inject the necessary polyfills on every page (inlined for speed). - injectScript( - 'head-inline', - readFileSync(new URL('../client-shim.min.js', import.meta.url), { encoding: 'utf-8' }), - ); - // Inject the hydration code, before a component is hydrated. - injectScript('before-hydration', `import '@astrojs/lit/hydration-support.js';`); - // Add the lit renderer so that Astro can understand lit components. - addRenderer({ - name: '@astrojs/lit', - serverEntrypoint: '@astrojs/lit/server.js', - clientEntrypoint: '@astrojs/lit/dist/client.js', - }); - // Update the vite configuration. - updateConfig({ - vite: getViteConfiguration(), - }); - }, - 'astro:build:setup': ({ vite, target }) => { - if (target === 'server') { - if (!vite.ssr) { - vite.ssr = {}; - } - if (!vite.ssr.noExternal) { - vite.ssr.noExternal = []; - } - if (Array.isArray(vite.ssr.noExternal)) { - vite.ssr.noExternal.push('lit'); - } - } - }, - }, - }; -} diff --git a/packages/integrations/lit/test/sass.test.js b/packages/integrations/lit/test/sass.test.js deleted file mode 100644 index a6cbfae8b..000000000 --- a/packages/integrations/lit/test/sass.test.js +++ /dev/null @@ -1,15 +0,0 @@ -import * as assert from 'node:assert/strict'; -import { describe, it } from 'node:test'; - -describe('check', () => { - it('should be able to load sass', async () => { - let error = null; - try { - await import(new URL('../server-shim.js', import.meta.url)); - await import('sass'); - } catch (e) { - error = e; - } - assert.equal(error, null); - }); -}); diff --git a/packages/integrations/lit/test/server.test.js b/packages/integrations/lit/test/server.test.js deleted file mode 100644 index bcecef2f6..000000000 --- a/packages/integrations/lit/test/server.test.js +++ /dev/null @@ -1,134 +0,0 @@ -import * as assert from 'node:assert/strict'; -import { describe, it } from 'node:test'; -import * as cheerio from 'cheerio'; -import { LitElement, html } from 'lit'; -// Must come after lit import because @lit/reactive-element defines -// globalThis.customElements which the server shim expects to be defined. -import server from '../server.js'; - -const { check, renderToStaticMarkup } = server; - -describe('check', () => { - it('should be false with no component', async () => { - assert.equal(await check(), false); - }); - - it('should be false with a registered non-lit component', async () => { - const tagName = 'non-lit-component'; - // Lit no longer shims HTMLElement globally, so we need to do it ourselves. - if (!globalThis.HTMLElement) { - globalThis.HTMLElement = class {}; - } - customElements.define(tagName, class TestComponent extends HTMLElement {}); - assert.equal(await check(tagName), false); - }); - - it('should be true with a registered lit component', async () => { - const tagName = 'lit-component'; - customElements.define(tagName, class extends LitElement {}); - assert.equal(await check(tagName), true); - }); -}); - -describe('renderToStaticMarkup', () => { - it('should throw error if trying to render an unregistered component', async () => { - const tagName = 'non-registrered-component'; - try { - await renderToStaticMarkup(tagName); - } catch (e) { - assert.equal(e instanceof TypeError, true); - } - }); - - it('should render empty component with default markup', async () => { - const tagName = 'nothing-component'; - customElements.define(tagName, class extends LitElement {}); - const render = await renderToStaticMarkup(tagName); - assert.deepEqual(render, { - html: `<${tagName}><template shadowroot="open" shadowrootmode="open"><!--lit-part--><!--/lit-part--></template></${tagName}>`, - }); - }); - - it('should render component with default markup', async () => { - const tagName = 'simple-component'; - customElements.define( - tagName, - class extends LitElement { - render() { - return html`<p>hola</p>`; - } - }, - ); - const render = await renderToStaticMarkup(tagName); - const $ = cheerio.load(render.html); - assert.equal($(`${tagName} template`).html().includes('<p>hola</p>'), true); - }); - - it('should render component with properties and attributes', async () => { - const tagName = 'props-and-attrs-component'; - const attr1 = 'test'; - const prop1 = 'Daniel'; - customElements.define( - tagName, - class extends LitElement { - static properties = { - prop1: { type: String }, - }; - - constructor() { - super(); - this.prop1 = 'someone'; - } - - render() { - return html`<p>Hello ${this.prop1}</p>`; - } - }, - ); - const render = await renderToStaticMarkup(tagName, { prop1, attr1 }); - const $ = cheerio.load(render.html); - assert.equal($(tagName).attr('attr1'), attr1); - assert.equal($(`${tagName} template`).text().includes(`Hello ${prop1}`), true); - }); - - it('should render nested components', async () => { - const tagName = 'parent-component'; - const childTagName = 'child-component'; - customElements.define( - childTagName, - class extends LitElement { - render() { - return html`<p>child</p>`; - } - }, - ); - customElements.define( - tagName, - class extends LitElement { - render() { - return html`<child-component></child-component>`; - } - }, - ); - const render = await renderToStaticMarkup(tagName); - const $ = cheerio.load(render.html); - assert.equal($(`${tagName} template`).text().includes('child'), true); - // Child component should have `defer-hydration` attribute so it'll only - // hydrate after the parent hydrates - assert.equal($(childTagName).attr('defer-hydration'), ''); - }); - - it('should render DSD attributes based on shadowRootOptions', async () => { - const tagName = 'shadow-root-options-component'; - customElements.define( - tagName, - class extends LitElement { - static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true }; - }, - ); - const render = await renderToStaticMarkup(tagName); - assert.deepEqual(render, { - html: `<${tagName}><template shadowroot=\"open\" shadowrootmode=\"open\" shadowrootdelegatesfocus><!--lit-part--><!--/lit-part--></template></${tagName}>`, - }); - }); -}); diff --git a/packages/integrations/lit/tsconfig.json b/packages/integrations/lit/tsconfig.json deleted file mode 100644 index 1504b4b6d..000000000 --- a/packages/integrations/lit/tsconfig.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "extends": "../../../tsconfig.base.json", - "include": ["src"], - "compilerOptions": { - "outDir": "./dist" - } -} |