@ecopages/lit 0.2.0-alpha.1

package/CHANGELOG.md

@@ -0,0 +1,21 @@
+# Changelog
+
+All notable changes to `@ecopages/lit` are documented here.
+
+> **Note:** Changelog tracking begins at version `0.2.0`. Changes prior to this release are not recorded here but are available in the git history.
+
+## [UNRELEASED] — TBD
+
+### Features
+
+- Aligned Lit renderer with full orchestration mode — removed legacy rendering path (`fc07bdb0`).
+- Integration updated to work with the new lazy dependency map and global injector rendering mode.
+
+### Refactoring
+
+- Ambient module declarations cleaned up (`5f46ecc5`).
+- Updated test suite for esbuild adapter and Node.js runtime compatibility (`31a44458`).
+
+### Tests
+
+- Updated integration tests to the new orchestration model.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024-present Andrea Zanenghi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,28 @@
+# Ecopages Lit Integration Plugin
+
+The `@ecopages/lit` package enables the integration of [Lit](https://lit.dev/), a powerful library for building fast, lightweight web components. This integration is optimized for use alongside `@ecopages/kitajs`, facilitating the use of Lit within a proper HTML template engine context provided by Kita. This combination allows developers to leverage the best of both worlds: the component-based architecture of Lit and the JSX template capabilities of Kita, enhancing the development of dynamic and interactive web pages.
+
+## Install
+
+```bash
+bunx jsr add @ecopages/lit
+```
+
+## Usage
+
+For effective utilization of Lit in your Ecopages projects, it is recommended to use it in conjunction with Kita. This ensures a seamless development experience, allowing you to incorporate Lit components within JSX templates effortlessly. Configure your project to include both `@ecopages/lit` and `@ecopages/kitajs` as follows:
+
+```ts
+import { ConfigBuilder } from '@ecopages/core';
+import { kitajsPlugin } from '@ecopages/kitajs';
+import { litPlugin } from '@ecopages/lit';
+
+const config = await new ConfigBuilder()
+	.setBaseUrl(import.meta.env.ECOPAGES_BASE_URL)
+	.setIntegrations([kitajsPlugin(), litPlugin()])
+	.build();
+
+export default config;
+```
+
+Adopting this setup empowers developers to fully exploit Lit's capabilities within the Ecopages framework, paving the way for the creation of rich, interactive web components.

package/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@ecopages/lit",
+  "version": "0.2.0-alpha.1",
+  "description": "Ecopages lit integration",
+  "keywords": [
+    "ecopages",
+    "lit",
+    "plugin"
+  ],
+  "license": "MIT",
+  "main": "./src/lit.plugin.js",
+  "types": "./src/lit.plugin.d.ts",
+  "type": "module",
+  "exports": {
+    ".": {
+      "default": "./src/lit.plugin.js",
+      "types": "./src/lit.plugin.d.ts"
+    },
+    "./styled-mixin": {
+      "default": "./src/styled-mixin.js",
+      "types": "./src/styled-mixin.d.ts"
+    },
+    "./styled-mixin.ts": {
+      "default": "./src/styled-mixin.js",
+      "types": "./src/styled-mixin.d.ts"
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ecopages/ecopages.git",
+    "directory": "packages/integrations/lit"
+  },
+  "peerDependencies": {
+    "@ecopages/core": "0.2.0-alpha.1",
+    "@lit-labs/ssr": "^3.3.0",
+    "@lit-labs/ssr-client": "^1.1.7",
+    "lit": "^3.2.1"
+  }
+}

package/src/console.d.ts

@@ -0,0 +1,5 @@
+declare const originalConsoleWarn: {
+    (...data: any[]): void;
+    (...data: any[]): void;
+    (message?: any, ...optionalParams: any[]): void;
+};

package/src/console.js

@@ -0,0 +1,9 @@
+const originalConsoleWarn = console.warn;
+console.warn = (...messages) => {
+  if (messages.some(
+    (message) => typeof message === "string" && message.includes("'CustomElementRegistry' already has")
+  )) {
+    return;
+  }
+  originalConsoleWarn.apply(console, messages);
+};

package/src/console.ts

@@ -0,0 +1,19 @@
+const originalConsoleWarn = console.warn;
+
+/**
+ * Suppresses the warning about CustomElementRegistry already being defined in ssr-dom-shim by lit
+ * https://github.com/lit/lit/blob/bd881370b83d366f7654dd510731242a68949a20/packages/labs/ssr-dom-shim/src/index.ts#L140
+ * Complete Error Log:
+ * 'CustomElementRegistry' already has "lit-counter" defined. This may have been caused by live reload or hot module replacement in which case it can be safely ignored.
+ * Make sure to test your application with a production build as repeat registrations will throw in production.
+ */
+console.warn = (...messages: any[]) => {
+	if (
+		messages.some(
+			(message) => typeof message === 'string' && message.includes("'CustomElementRegistry' already has"),
+		)
+	) {
+		return;
+	}
+	originalConsoleWarn.apply(console, messages);
+};

package/src/lit-element-hydrate.d.ts

@@ -0,0 +1 @@
+export declare const litElementHydrateScript = "var k=globalThis,y=k.trustedTypes,p=y?y.createPolicy(\"lit-html\",{createHTML:(q)=>q}):void 0;var P=`lit$${Math.random().toFixed(9).slice(2)}$`,v=\"?\"+P,Kq=`<${v}>`,x=document,C=()=>x.createComment(\"\"),S=(q)=>q===null||typeof q!=\"object\"&&typeof q!=\"function\",L=Array.isArray,h=(q)=>L(q)||typeof q?.[Symbol.iterator]==\"function\";var U=/<(?:(!--|\\/[^a-zA-Z])|(\\/?[a-zA-Z][^>\\s]*)|(\\/?$))/g,m=/-->/g,a=/>/g,$=/>|[ \\t\\n\\f\\r](?:([^\\s\"'>=\\/]+)([ \\t\\n\\f\\r]*=[ \\t\\n\\f\\r]*(?:[^ \\t\\n\\f\\r\"'\\`<>=]|(\"|')|))|$)/g,c=/'/g,l=/\"/g,r=/^(?:script|style|textarea|title)$/i,M=(q)=>(D,...F)=>({_$litType$:q,strings:D,values:F}),Aq=M(1),Pq=M(2),Vq=M(3),V=Symbol.for(\"lit-noChange\"),B=Symbol.for(\"lit-nothing\"),n=new WeakMap,w=x.createTreeWalker(x,129);function o(q,D){if(!L(q)||!q.hasOwnProperty(\"raw\"))throw Error(\"invalid template strings array\");return p!==void 0?p.createHTML(D):D}var e=(q,D)=>{let F=q.length-1,J=[],G,O=D===2?\"<svg>\":D===3?\"<math>\":\"\",K=U;for(let W=0;W<F;W++){let Q=q[W],Y,X,b=-1,A=0;while(A<Q.length&&(K.lastIndex=A,X=K.exec(Q),X!==null))A=K.lastIndex,K===U?X[1]===\"!--\"?K=m:X[1]!==void 0?K=a:X[2]!==void 0?(r.test(X[2])&&(G=RegExp(\"</\"+X[2],\"g\")),K=$):X[3]!==void 0&&(K=$):K===$?X[0]===\">\"?(K=G??U,b=-1):X[1]===void 0?b=-2:(b=K.lastIndex-X[2].length,Y=X[1],K=X[3]===void 0?$:X[3]==='\"'?l:c):K===l||K===c?K=$:K===m||K===a?K=U:(K=$,G=void 0);const _=K===$&&q[W+1].startsWith(\"/>\")?\" \":\"\";O+=K===U?Q+Kq:b>=0?(J.push(Y),Q.slice(0,b)+\"$lit$\"+Q.slice(b)+P+_):Q+P+(b===-2?W:_)}return[o(q,O+(q[F]||\"<?>\")+(D===2?\"</svg>\":D===3?\"</math>\":\"\")),J]};class g{constructor({strings:q,_$litType$:D},F){let J;this.parts=[];let G=0,O=0,K=q.length-1,W=this.parts,[Q,Y]=e(q,D);if(this.el=g.createElement(Q,F),w.currentNode=this.el.content,D===2||D===3){const X=this.el.content.firstChild;X.replaceWith(...X.childNodes)}while((J=w.nextNode())!==null&&W.length<K){if(J.nodeType===1){if(J.hasAttributes())for(const X of J.getAttributeNames())if(X.endsWith(\"$lit$\")){const b=Y[O++],A=J.getAttribute(X).split(P),_=/([.?@])?(.*)/.exec(b);W.push({type:1,index:G,name:_[2],strings:A,ctor:_[1]===\".\"?R:_[1]===\"?\"?E:_[1]===\"@\"?d:I}),J.removeAttribute(X)}else X.startsWith(P)&&(W.push({type:6,index:G}),J.removeAttribute(X));if(r.test(J.tagName)){const X=J.textContent.split(P),b=X.length-1;if(b>0){J.textContent=y?y.emptyScript:\"\";for(let A=0;A<b;A++)J.append(X[A],C()),w.nextNode(),W.push({type:2,index:++G});J.append(X[b],C())}}}else if(J.nodeType===8)if(J.data===v)W.push({type:2,index:G});else{let X=-1;while((X=J.data.indexOf(P,X+1))!==-1)W.push({type:7,index:G}),X+=P.length-1}G++}}static createElement(q,D){const F=x.createElement(\"template\");return F.innerHTML=q,F}}function z(q,D,F=q,J){if(D===V)return D;let G=J!==void 0?F._$Co?.[J]:F._$Cl,O=S(D)?void 0:D._$litDirective$;return G?.constructor!==O&&(G?._$AO?.(!1),O===void 0?G=void 0:(G=new O(q),G._$AT(q,F,J)),J!==void 0?(F._$Co??=[])[J]=G:F._$Cl=G),G!==void 0&&(D=z(q,G._$AS(q,D.values),G,J)),D}class j{constructor(q,D){this._$AV=[],this._$AN=void 0,this._$AD=q,this._$AM=D}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(q){const{el:{content:D},parts:F}=this._$AD,J=(q?.creationScope??x).importNode(D,!0);w.currentNode=J;let G=w.nextNode(),O=0,K=0,W=F[0];while(W!==void 0){if(O===W.index){let Q;W.type===2?Q=new H(G,G.nextSibling,this,q):W.type===1?Q=new W.ctor(G,W.name,W.strings,this,q):W.type===6&&(Q=new f(G,this,q)),this._$AV.push(Q),W=F[++K]}O!==W?.index&&(G=w.nextNode(),O++)}return w.currentNode=x,J}p(q){let D=0;for(const F of this._$AV)F!==void 0&&(F.strings!==void 0?(F._$AI(q,F,D),D+=F.strings.length-2):F._$AI(q[D])),D++}}class H{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(q,D,F,J){this.type=2,this._$AH=B,this._$AN=void 0,this._$AA=q,this._$AB=D,this._$AM=F,this.options=J,this._$Cv=J?.isConnected??!0}get parentNode(){let q=this._$AA.parentNode,D=this._$AM;return D!==void 0&&q?.nodeType===11&&(q=D.parentNode),q}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(q,D=this){q=z(this,q,D),S(q)?q===B||q==null||q===\"\"?(this._$AH!==B&&this._$AR(),this._$AH=B):q!==this._$AH&&q!==V&&this._(q):q._$litType$!==void 0?this.$(q):q.nodeType!==void 0?this.T(q):h(q)?this.k(q):this._(q)}O(q){return this._$AA.parentNode.insertBefore(q,this._$AB)}T(q){this._$AH!==q&&(this._$AR(),this._$AH=this.O(q))}_(q){this._$AH!==B&&S(this._$AH)?this._$AA.nextSibling.data=q:this.T(x.createTextNode(q)),this._$AH=q}$(q){const{values:D,_$litType$:F}=q,J=typeof F==\"number\"?this._$AC(q):(F.el===void 0&&(F.el=g.createElement(o(F.h,F.h[0]),this.options)),F);if(this._$AH?._$AD===J)this._$AH.p(D);else{const G=new j(J,this),O=G.u(this.options);G.p(D),this.T(O),this._$AH=G}}_$AC(q){let D=n.get(q.strings);return D===void 0&&n.set(q.strings,D=new g(q)),D}k(q){L(this._$AH)||(this._$AH=[],this._$AR());let D=this._$AH,F,J=0;for(const G of q)J===D.length?D.push(F=new H(this.O(C()),this.O(C()),this,this.options)):F=D[J],F._$AI(G),J++;J<D.length&&(this._$AR(F&&F._$AB.nextSibling,J),D.length=J)}_$AR(q=this._$AA.nextSibling,D){for(this._$AP?.(!1,!0,D);q&&q!==this._$AB;){const F=q.nextSibling;q.remove(),q=F}}setConnected(q){this._$AM===void 0&&(this._$Cv=q,this._$AP?.(q))}}class I{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(q,D,F,J,G){this.type=1,this._$AH=B,this._$AN=void 0,this.element=q,this.name=D,this._$AM=J,this.options=G,F.length>2||F[0]!==\"\"||F[1]!==\"\"?(this._$AH=Array(F.length-1).fill(new String),this.strings=F):this._$AH=B}_$AI(q,D=this,F,J){let G=this.strings,O=!1;if(G===void 0)q=z(this,q,D,0),O=!S(q)||q!==this._$AH&&q!==V,O&&(this._$AH=q);else{let K=q,W,Q;for(q=G[0],W=0;W<G.length-1;W++)Q=z(this,K[F+W],D,W),Q===V&&(Q=this._$AH[W]),O||=!S(Q)||Q!==this._$AH[W],Q===B?q=B:q!==B&&(q+=(Q??\"\")+G[W+1]),this._$AH[W]=Q}O&&!J&&this.j(q)}j(q){q===B?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,q??\"\")}}class R extends I{constructor(){super(...arguments),this.type=3}j(q){this.element[this.name]=q===B?void 0:q}}class E extends I{constructor(){super(...arguments),this.type=4}j(q){this.element.toggleAttribute(this.name,!!q&&q!==B)}}class d extends I{constructor(q,D,F,J,G){super(q,D,F,J,G),this.type=5}_$AI(q,D=this){if((q=z(this,q,D,0)??B)===V)return;const F=this._$AH,J=q===B&&F!==B||q.capture!==F.capture||q.once!==F.once||q.passive!==F.passive,G=q!==B&&(F===B||J);J&&this.element.removeEventListener(this.name,this,F),G&&this.element.addEventListener(this.name,this,q),this._$AH=q}handleEvent(q){typeof this._$AH==\"function\"?this._$AH.call(this.options?.host??this.element,q):this._$AH.handleEvent(q)}}class f{constructor(q,D,F){this.element=q,this.type=6,this._$AN=void 0,this._$AM=D,this.options=F}get _$AU(){return this._$AM._$AU}_$AI(q){z(this,q)}}var Z={M:\"$lit$\",P,A:v,C:1,L:e,R:j,D:h,V:z,I:H,H:I,N:E,U:d,B:R,F:f},Oq=k.litHtmlPolyfillSupport;Oq?.(g,H),(k.litHtmlVersions??=[]).push(\"3.2.1\");var i=(q,D,F)=>{let J=F?.renderBefore??D,G=J._$litPart$;if(G===void 0){const O=F?.renderBefore??null;J._$litPart$=G=new H(D.insertBefore(C(),O),O,void 0,F??{})}return G._$AI(q),G};var u=null,s={boundAttributeSuffix:Z.M,marker:Z.P,markerMatch:Z.A,HTML_RESULT:Z.C,getTemplateHtml:Z.L,overrideDirectiveResolve:(q,D)=>class extends q{_$AS(F,J){return D(this,J)}},patchDirectiveResolve:(q,D)=>{if(q.prototype._$AS!==D){u??=q.prototype._$AS.name;for(let F=q.prototype;F!==Object.prototype;F=Object.getPrototypeOf(F))if(F.hasOwnProperty(u))return void(F[u]=D);throw Error(\"Internal error: It is possible that both dev mode and production mode Lit was mixed together during SSR. Please comment on the issue: https://github.com/lit/lit/issues/4527\")}},setDirectiveClass(q,D){q._$litDirective$=D},getAttributePartCommittedValue:(q,D,F)=>{let J=V;return q.j=(G)=>J=G,q._$AI(D,q,F),J},connectedDisconnectable:(q)=>({...q,_$AU:!0}),resolveDirective:Z.V,AttributePart:Z.H,PropertyPart:Z.B,BooleanAttributePart:Z.N,EventPart:Z.U,ElementPart:Z.F,TemplateInstance:Z.R,isIterable:Z.D,ChildPart:Z.I};var T={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6};var t=(q)=>q===null||typeof q!=\"object\"&&typeof q!=\"function\";var qq=(q,D)=>D===void 0?q?._$litType$!==void 0:q?._$litType$===D,Dq=(q)=>q?._$litType$?.h!=null;var Fq=(q)=>q.strings===void 0;var{TemplateInstance:Qq,isIterable:Wq,resolveDirective:Gq,ChildPart:N,ElementPart:Xq}=s,Jq=(q,D,F={})=>{if(D._$litPart$!==void 0)throw Error(\"container already contains a live render\");let J,G,O,K=[],W=document.createTreeWalker(D,NodeFilter.SHOW_COMMENT),Q;while((Q=W.nextNode())!==null){const Y=Q.data;if(Y.startsWith(\"lit-part\")){if(K.length===0&&J!==void 0)throw Error(`There must be only one root part per container. Found a part marker (${Q}) when we already have a root part marker (${G})`);O=Yq(q,Q,K,F),J===void 0&&(J=O),G??=Q}else if(Y.startsWith(\"lit-node\"))Zq(Q,K,F);else if(Y.startsWith(\"/lit-part\")){if(K.length===1&&O!==J)throw Error(\"internal error\");O=Bq(Q,O,K)}}if(J===void 0){const Y=D instanceof ShadowRoot?\"{container.host.localName}'s shadow root\":D instanceof DocumentFragment?\"DocumentFragment\":D.localName;console.error(`There should be exactly one root part in a render container, but we didn't find any in ${Y}.`)}D._$litPart$=J},Yq=(q,D,F,J)=>{let G,O;if(F.length===0)O=new N(D,null,void 0,J),G=q;else{const K=F[F.length-1];if(K.type===\"template-instance\")O=new N(D,null,K.instance,J),K.instance._$AV.push(O),G=K.result.values[K.instancePartIndex++],K.templatePartIndex++;else if(K.type===\"iterable\"){O=new N(D,null,K.part,J);const W=K.iterator.next();if(W.done)throw G=void 0,K.done=!0,Error(\"Unhandled shorter than expected iterable\");G=W.value,K.part._$AH.push(O)}else O=new N(D,null,K.part,J)}if(G=Gq(O,G),G===V)F.push({part:O,type:\"leaf\"});else if(t(G))F.push({part:O,type:\"leaf\"}),O._$AH=G;else if(qq(G)){if(Dq(G))throw Error(\"compiled templates are not supported\");const K=\"lit-part \"+bq(G);if(D.data!==K)throw Error(\"Hydration value mismatch: Unexpected TemplateResult rendered to part\");{const W=N.prototype._$AC(G),Q=new Qq(W,O);F.push({type:\"template-instance\",instance:Q,part:O,templatePartIndex:0,instancePartIndex:0,result:G}),O._$AH=Q}}else Wq(G)?(F.push({part:O,type:\"iterable\",value:G,iterator:G[Symbol.iterator](),done:!1}),O._$AH=[]):(F.push({part:O,type:\"leaf\"}),O._$AH=G??\"\");return O},Bq=(q,D,F)=>{if(D===void 0)throw Error(\"unbalanced part marker\");D._$AB=q;const J=F.pop();if(J.type===\"iterable\"&&!J.iterator.next().done)throw Error(\"unexpected longer than expected iterable\");if(F.length>0)return F[F.length-1].part},Zq=(q,D,F)=>{const J=/lit-node (\\d+)/.exec(q.data),G=Number.parseInt(J[1]),O=q.nextElementSibling;if(O===null)throw Error(\"could not find node for attribute parts\");O.removeAttribute(\"defer-hydration\");const K=D[D.length-1];if(K.type!==\"template-instance\")throw Error(\"Hydration value mismatch: Primitive found where TemplateResult expected. This usually occurs due to conditional rendering that resulted in a different value or template being rendered between the server and client.\");{const W=K.instance;for(;;){const Q=W._$AD.parts[K.templatePartIndex];if(Q===void 0||Q.type!==T.ATTRIBUTE&&Q.type!==T.ELEMENT||Q.index!==G)break;if(Q.type===T.ATTRIBUTE){const Y=new Q.ctor(O,Q.name,Q.strings,K.instance,F),X=Fq(Y)?K.result.values[K.instancePartIndex]:K.result.values,b=!(Y.type===T.EVENT||Y.type===T.PROPERTY);Y._$AI(X,Y,K.instancePartIndex,b),K.instancePartIndex+=Q.strings.length-1,W._$AV.push(Y)}else{const Y=new Xq(O,K.instance,F);Gq(Y,K.result.values[K.instancePartIndex++]),W._$AV.push(Y)}K.templatePartIndex++}}},bq=(q)=>{const D=new Uint32Array(2).fill(5381);for(const J of q.strings)for(let G=0;G<J.length;G++)D[G%2]=33*D[G%2]^J.charCodeAt(G);const F=String.fromCharCode(...new Uint8Array(D.buffer));return btoa(F)};globalThis.litElementHydrateSupport=({LitElement:q})=>{const D=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(q),\"observedAttributes\").get;Object.defineProperty(q,\"observedAttributes\",{get(){return[...D.call(this),\"defer-hydration\"]}});const F=q.prototype.attributeChangedCallback;q.prototype.attributeChangedCallback=function(K,W,Q){K===\"defer-hydration\"&&Q===null&&J.call(this),F.call(this,K,W,Q)};const J=q.prototype.connectedCallback;q.prototype.connectedCallback=function(){this.hasAttribute(\"defer-hydration\")||J.call(this)};const G=q.prototype.createRenderRoot;q.prototype.createRenderRoot=function(){return this.shadowRoot?(this._$AG=!0,this.shadowRoot):G.call(this)};const O=Object.getPrototypeOf(q.prototype).update;q.prototype.update=function(K){const W=this.render();if(O.call(this,K),this._$AG){this._$AG=!1;for(let Q=0;Q<this.attributes.length;Q++){const Y=this.attributes[Q];if(Y.name.startsWith(\"hydrate-internals-\")){const X=Y.name.slice(18);this.removeAttribute(X),this.removeAttribute(Y.name)}}Jq(W,this.renderRoot,this.renderOptions)}else i(W,this.renderRoot,this.renderOptions)}};";

package/src/lit-element-hydrate.js

@@ -0,0 +1,4 @@
+const litElementHydrateScript = 'var k=globalThis,y=k.trustedTypes,p=y?y.createPolicy("lit-html",{createHTML:(q)=>q}):void 0;var P=`lit$${Math.random().toFixed(9).slice(2)}$`,v="?"+P,Kq=`<${v}>`,x=document,C=()=>x.createComment(""),S=(q)=>q===null||typeof q!="object"&&typeof q!="function",L=Array.isArray,h=(q)=>L(q)||typeof q?.[Symbol.iterator]=="function";var U=/<(?:(!--|\\/[^a-zA-Z])|(\\/?[a-zA-Z][^>\\s]*)|(\\/?$))/g,m=/-->/g,a=/>/g,$=/>|[ \\t\\n\\f\\r](?:([^\\s"\'>=\\/]+)([ \\t\\n\\f\\r]*=[ \\t\\n\\f\\r]*(?:[^ \\t\\n\\f\\r"\'\\`<>=]|("|\')|))|$)/g,c=/\'/g,l=/"/g,r=/^(?:script|style|textarea|title)$/i,M=(q)=>(D,...F)=>({_$litType$:q,strings:D,values:F}),Aq=M(1),Pq=M(2),Vq=M(3),V=Symbol.for("lit-noChange"),B=Symbol.for("lit-nothing"),n=new WeakMap,w=x.createTreeWalker(x,129);function o(q,D){if(!L(q)||!q.hasOwnProperty("raw"))throw Error("invalid template strings array");return p!==void 0?p.createHTML(D):D}var e=(q,D)=>{let F=q.length-1,J=[],G,O=D===2?"<svg>":D===3?"<math>":"",K=U;for(let W=0;W<F;W++){let Q=q[W],Y,X,b=-1,A=0;while(A<Q.length&&(K.lastIndex=A,X=K.exec(Q),X!==null))A=K.lastIndex,K===U?X[1]==="!--"?K=m:X[1]!==void 0?K=a:X[2]!==void 0?(r.test(X[2])&&(G=RegExp("</"+X[2],"g")),K=$):X[3]!==void 0&&(K=$):K===$?X[0]===">"?(K=G??U,b=-1):X[1]===void 0?b=-2:(b=K.lastIndex-X[2].length,Y=X[1],K=X[3]===void 0?$:X[3]===\'"\'?l:c):K===l||K===c?K=$:K===m||K===a?K=U:(K=$,G=void 0);const _=K===$&&q[W+1].startsWith("/>")?" ":"";O+=K===U?Q+Kq:b>=0?(J.push(Y),Q.slice(0,b)+"$lit$"+Q.slice(b)+P+_):Q+P+(b===-2?W:_)}return[o(q,O+(q[F]||"<?>")+(D===2?"</svg>":D===3?"</math>":"")),J]};class g{constructor({strings:q,_$litType$:D},F){let J;this.parts=[];let G=0,O=0,K=q.length-1,W=this.parts,[Q,Y]=e(q,D);if(this.el=g.createElement(Q,F),w.currentNode=this.el.content,D===2||D===3){const X=this.el.content.firstChild;X.replaceWith(...X.childNodes)}while((J=w.nextNode())!==null&&W.length<K){if(J.nodeType===1){if(J.hasAttributes())for(const X of J.getAttributeNames())if(X.endsWith("$lit$")){const b=Y[O++],A=J.getAttribute(X).split(P),_=/([.?@])?(.*)/.exec(b);W.push({type:1,index:G,name:_[2],strings:A,ctor:_[1]==="."?R:_[1]==="?"?E:_[1]==="@"?d:I}),J.removeAttribute(X)}else X.startsWith(P)&&(W.push({type:6,index:G}),J.removeAttribute(X));if(r.test(J.tagName)){const X=J.textContent.split(P),b=X.length-1;if(b>0){J.textContent=y?y.emptyScript:"";for(let A=0;A<b;A++)J.append(X[A],C()),w.nextNode(),W.push({type:2,index:++G});J.append(X[b],C())}}}else if(J.nodeType===8)if(J.data===v)W.push({type:2,index:G});else{let X=-1;while((X=J.data.indexOf(P,X+1))!==-1)W.push({type:7,index:G}),X+=P.length-1}G++}}static createElement(q,D){const F=x.createElement("template");return F.innerHTML=q,F}}function z(q,D,F=q,J){if(D===V)return D;let G=J!==void 0?F._$Co?.[J]:F._$Cl,O=S(D)?void 0:D._$litDirective$;return G?.constructor!==O&&(G?._$AO?.(!1),O===void 0?G=void 0:(G=new O(q),G._$AT(q,F,J)),J!==void 0?(F._$Co??=[])[J]=G:F._$Cl=G),G!==void 0&&(D=z(q,G._$AS(q,D.values),G,J)),D}class j{constructor(q,D){this._$AV=[],this._$AN=void 0,this._$AD=q,this._$AM=D}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(q){const{el:{content:D},parts:F}=this._$AD,J=(q?.creationScope??x).importNode(D,!0);w.currentNode=J;let G=w.nextNode(),O=0,K=0,W=F[0];while(W!==void 0){if(O===W.index){let Q;W.type===2?Q=new H(G,G.nextSibling,this,q):W.type===1?Q=new W.ctor(G,W.name,W.strings,this,q):W.type===6&&(Q=new f(G,this,q)),this._$AV.push(Q),W=F[++K]}O!==W?.index&&(G=w.nextNode(),O++)}return w.currentNode=x,J}p(q){let D=0;for(const F of this._$AV)F!==void 0&&(F.strings!==void 0?(F._$AI(q,F,D),D+=F.strings.length-2):F._$AI(q[D])),D++}}class H{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(q,D,F,J){this.type=2,this._$AH=B,this._$AN=void 0,this._$AA=q,this._$AB=D,this._$AM=F,this.options=J,this._$Cv=J?.isConnected??!0}get parentNode(){let q=this._$AA.parentNode,D=this._$AM;return D!==void 0&&q?.nodeType===11&&(q=D.parentNode),q}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(q,D=this){q=z(this,q,D),S(q)?q===B||q==null||q===""?(this._$AH!==B&&this._$AR(),this._$AH=B):q!==this._$AH&&q!==V&&this._(q):q._$litType$!==void 0?this.$(q):q.nodeType!==void 0?this.T(q):h(q)?this.k(q):this._(q)}O(q){return this._$AA.parentNode.insertBefore(q,this._$AB)}T(q){this._$AH!==q&&(this._$AR(),this._$AH=this.O(q))}_(q){this._$AH!==B&&S(this._$AH)?this._$AA.nextSibling.data=q:this.T(x.createTextNode(q)),this._$AH=q}$(q){const{values:D,_$litType$:F}=q,J=typeof F=="number"?this._$AC(q):(F.el===void 0&&(F.el=g.createElement(o(F.h,F.h[0]),this.options)),F);if(this._$AH?._$AD===J)this._$AH.p(D);else{const G=new j(J,this),O=G.u(this.options);G.p(D),this.T(O),this._$AH=G}}_$AC(q){let D=n.get(q.strings);return D===void 0&&n.set(q.strings,D=new g(q)),D}k(q){L(this._$AH)||(this._$AH=[],this._$AR());let D=this._$AH,F,J=0;for(const G of q)J===D.length?D.push(F=new H(this.O(C()),this.O(C()),this,this.options)):F=D[J],F._$AI(G),J++;J<D.length&&(this._$AR(F&&F._$AB.nextSibling,J),D.length=J)}_$AR(q=this._$AA.nextSibling,D){for(this._$AP?.(!1,!0,D);q&&q!==this._$AB;){const F=q.nextSibling;q.remove(),q=F}}setConnected(q){this._$AM===void 0&&(this._$Cv=q,this._$AP?.(q))}}class I{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(q,D,F,J,G){this.type=1,this._$AH=B,this._$AN=void 0,this.element=q,this.name=D,this._$AM=J,this.options=G,F.length>2||F[0]!==""||F[1]!==""?(this._$AH=Array(F.length-1).fill(new String),this.strings=F):this._$AH=B}_$AI(q,D=this,F,J){let G=this.strings,O=!1;if(G===void 0)q=z(this,q,D,0),O=!S(q)||q!==this._$AH&&q!==V,O&&(this._$AH=q);else{let K=q,W,Q;for(q=G[0],W=0;W<G.length-1;W++)Q=z(this,K[F+W],D,W),Q===V&&(Q=this._$AH[W]),O||=!S(Q)||Q!==this._$AH[W],Q===B?q=B:q!==B&&(q+=(Q??"")+G[W+1]),this._$AH[W]=Q}O&&!J&&this.j(q)}j(q){q===B?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,q??"")}}class R extends I{constructor(){super(...arguments),this.type=3}j(q){this.element[this.name]=q===B?void 0:q}}class E extends I{constructor(){super(...arguments),this.type=4}j(q){this.element.toggleAttribute(this.name,!!q&&q!==B)}}class d extends I{constructor(q,D,F,J,G){super(q,D,F,J,G),this.type=5}_$AI(q,D=this){if((q=z(this,q,D,0)??B)===V)return;const F=this._$AH,J=q===B&&F!==B||q.capture!==F.capture||q.once!==F.once||q.passive!==F.passive,G=q!==B&&(F===B||J);J&&this.element.removeEventListener(this.name,this,F),G&&this.element.addEventListener(this.name,this,q),this._$AH=q}handleEvent(q){typeof this._$AH=="function"?this._$AH.call(this.options?.host??this.element,q):this._$AH.handleEvent(q)}}class f{constructor(q,D,F){this.element=q,this.type=6,this._$AN=void 0,this._$AM=D,this.options=F}get _$AU(){return this._$AM._$AU}_$AI(q){z(this,q)}}var Z={M:"$lit$",P,A:v,C:1,L:e,R:j,D:h,V:z,I:H,H:I,N:E,U:d,B:R,F:f},Oq=k.litHtmlPolyfillSupport;Oq?.(g,H),(k.litHtmlVersions??=[]).push("3.2.1");var i=(q,D,F)=>{let J=F?.renderBefore??D,G=J._$litPart$;if(G===void 0){const O=F?.renderBefore??null;J._$litPart$=G=new H(D.insertBefore(C(),O),O,void 0,F??{})}return G._$AI(q),G};var u=null,s={boundAttributeSuffix:Z.M,marker:Z.P,markerMatch:Z.A,HTML_RESULT:Z.C,getTemplateHtml:Z.L,overrideDirectiveResolve:(q,D)=>class extends q{_$AS(F,J){return D(this,J)}},patchDirectiveResolve:(q,D)=>{if(q.prototype._$AS!==D){u??=q.prototype._$AS.name;for(let F=q.prototype;F!==Object.prototype;F=Object.getPrototypeOf(F))if(F.hasOwnProperty(u))return void(F[u]=D);throw Error("Internal error: It is possible that both dev mode and production mode Lit was mixed together during SSR. Please comment on the issue: https://github.com/lit/lit/issues/4527")}},setDirectiveClass(q,D){q._$litDirective$=D},getAttributePartCommittedValue:(q,D,F)=>{let J=V;return q.j=(G)=>J=G,q._$AI(D,q,F),J},connectedDisconnectable:(q)=>({...q,_$AU:!0}),resolveDirective:Z.V,AttributePart:Z.H,PropertyPart:Z.B,BooleanAttributePart:Z.N,EventPart:Z.U,ElementPart:Z.F,TemplateInstance:Z.R,isIterable:Z.D,ChildPart:Z.I};var T={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6};var t=(q)=>q===null||typeof q!="object"&&typeof q!="function";var qq=(q,D)=>D===void 0?q?._$litType$!==void 0:q?._$litType$===D,Dq=(q)=>q?._$litType$?.h!=null;var Fq=(q)=>q.strings===void 0;var{TemplateInstance:Qq,isIterable:Wq,resolveDirective:Gq,ChildPart:N,ElementPart:Xq}=s,Jq=(q,D,F={})=>{if(D._$litPart$!==void 0)throw Error("container already contains a live render");let J,G,O,K=[],W=document.createTreeWalker(D,NodeFilter.SHOW_COMMENT),Q;while((Q=W.nextNode())!==null){const Y=Q.data;if(Y.startsWith("lit-part")){if(K.length===0&&J!==void 0)throw Error(`There must be only one root part per container. Found a part marker (${Q}) when we already have a root part marker (${G})`);O=Yq(q,Q,K,F),J===void 0&&(J=O),G??=Q}else if(Y.startsWith("lit-node"))Zq(Q,K,F);else if(Y.startsWith("/lit-part")){if(K.length===1&&O!==J)throw Error("internal error");O=Bq(Q,O,K)}}if(J===void 0){const Y=D instanceof ShadowRoot?"{container.host.localName}\'s shadow root":D instanceof DocumentFragment?"DocumentFragment":D.localName;console.error(`There should be exactly one root part in a render container, but we didn\'t find any in ${Y}.`)}D._$litPart$=J},Yq=(q,D,F,J)=>{let G,O;if(F.length===0)O=new N(D,null,void 0,J),G=q;else{const K=F[F.length-1];if(K.type==="template-instance")O=new N(D,null,K.instance,J),K.instance._$AV.push(O),G=K.result.values[K.instancePartIndex++],K.templatePartIndex++;else if(K.type==="iterable"){O=new N(D,null,K.part,J);const W=K.iterator.next();if(W.done)throw G=void 0,K.done=!0,Error("Unhandled shorter than expected iterable");G=W.value,K.part._$AH.push(O)}else O=new N(D,null,K.part,J)}if(G=Gq(O,G),G===V)F.push({part:O,type:"leaf"});else if(t(G))F.push({part:O,type:"leaf"}),O._$AH=G;else if(qq(G)){if(Dq(G))throw Error("compiled templates are not supported");const K="lit-part "+bq(G);if(D.data!==K)throw Error("Hydration value mismatch: Unexpected TemplateResult rendered to part");{const W=N.prototype._$AC(G),Q=new Qq(W,O);F.push({type:"template-instance",instance:Q,part:O,templatePartIndex:0,instancePartIndex:0,result:G}),O._$AH=Q}}else Wq(G)?(F.push({part:O,type:"iterable",value:G,iterator:G[Symbol.iterator](),done:!1}),O._$AH=[]):(F.push({part:O,type:"leaf"}),O._$AH=G??"");return O},Bq=(q,D,F)=>{if(D===void 0)throw Error("unbalanced part marker");D._$AB=q;const J=F.pop();if(J.type==="iterable"&&!J.iterator.next().done)throw Error("unexpected longer than expected iterable");if(F.length>0)return F[F.length-1].part},Zq=(q,D,F)=>{const J=/lit-node (\\d+)/.exec(q.data),G=Number.parseInt(J[1]),O=q.nextElementSibling;if(O===null)throw Error("could not find node for attribute parts");O.removeAttribute("defer-hydration");const K=D[D.length-1];if(K.type!=="template-instance")throw Error("Hydration value mismatch: Primitive found where TemplateResult expected. This usually occurs due to conditional rendering that resulted in a different value or template being rendered between the server and client.");{const W=K.instance;for(;;){const Q=W._$AD.parts[K.templatePartIndex];if(Q===void 0||Q.type!==T.ATTRIBUTE&&Q.type!==T.ELEMENT||Q.index!==G)break;if(Q.type===T.ATTRIBUTE){const Y=new Q.ctor(O,Q.name,Q.strings,K.instance,F),X=Fq(Y)?K.result.values[K.instancePartIndex]:K.result.values,b=!(Y.type===T.EVENT||Y.type===T.PROPERTY);Y._$AI(X,Y,K.instancePartIndex,b),K.instancePartIndex+=Q.strings.length-1,W._$AV.push(Y)}else{const Y=new Xq(O,K.instance,F);Gq(Y,K.result.values[K.instancePartIndex++]),W._$AV.push(Y)}K.templatePartIndex++}}},bq=(q)=>{const D=new Uint32Array(2).fill(5381);for(const J of q.strings)for(let G=0;G<J.length;G++)D[G%2]=33*D[G%2]^J.charCodeAt(G);const F=String.fromCharCode(...new Uint8Array(D.buffer));return btoa(F)};globalThis.litElementHydrateSupport=({LitElement:q})=>{const D=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(q),"observedAttributes").get;Object.defineProperty(q,"observedAttributes",{get(){return[...D.call(this),"defer-hydration"]}});const F=q.prototype.attributeChangedCallback;q.prototype.attributeChangedCallback=function(K,W,Q){K==="defer-hydration"&&Q===null&&J.call(this),F.call(this,K,W,Q)};const J=q.prototype.connectedCallback;q.prototype.connectedCallback=function(){this.hasAttribute("defer-hydration")||J.call(this)};const G=q.prototype.createRenderRoot;q.prototype.createRenderRoot=function(){return this.shadowRoot?(this._$AG=!0,this.shadowRoot):G.call(this)};const O=Object.getPrototypeOf(q.prototype).update;q.prototype.update=function(K){const W=this.render();if(O.call(this,K),this._$AG){this._$AG=!1;for(let Q=0;Q<this.attributes.length;Q++){const Y=this.attributes[Q];if(Y.name.startsWith("hydrate-internals-")){const X=Y.name.slice(18);this.removeAttribute(X),this.removeAttribute(Y.name)}}Jq(W,this.renderRoot,this.renderOptions)}else i(W,this.renderRoot,this.renderOptions)}};';
+export {
+  litElementHydrateScript
+};

package/src/lit-element-hydrate.ts

@@ -0,0 +1,2 @@
+export const litElementHydrateScript =
+	'var k=globalThis,y=k.trustedTypes,p=y?y.createPolicy("lit-html",{createHTML:(q)=>q}):void 0;var P=`lit$${Math.random().toFixed(9).slice(2)}$`,v="?"+P,Kq=`<${v}>`,x=document,C=()=>x.createComment(""),S=(q)=>q===null||typeof q!="object"&&typeof q!="function",L=Array.isArray,h=(q)=>L(q)||typeof q?.[Symbol.iterator]=="function";var U=/<(?:(!--|\\/[^a-zA-Z])|(\\/?[a-zA-Z][^>\\s]*)|(\\/?$))/g,m=/-->/g,a=/>/g,$=/>|[ \\t\\n\\f\\r](?:([^\\s"\'>=\\/]+)([ \\t\\n\\f\\r]*=[ \\t\\n\\f\\r]*(?:[^ \\t\\n\\f\\r"\'\\`<>=]|("|\')|))|$)/g,c=/\'/g,l=/"/g,r=/^(?:script|style|textarea|title)$/i,M=(q)=>(D,...F)=>({_$litType$:q,strings:D,values:F}),Aq=M(1),Pq=M(2),Vq=M(3),V=Symbol.for("lit-noChange"),B=Symbol.for("lit-nothing"),n=new WeakMap,w=x.createTreeWalker(x,129);function o(q,D){if(!L(q)||!q.hasOwnProperty("raw"))throw Error("invalid template strings array");return p!==void 0?p.createHTML(D):D}var e=(q,D)=>{let F=q.length-1,J=[],G,O=D===2?"<svg>":D===3?"<math>":"",K=U;for(let W=0;W<F;W++){let Q=q[W],Y,X,b=-1,A=0;while(A<Q.length&&(K.lastIndex=A,X=K.exec(Q),X!==null))A=K.lastIndex,K===U?X[1]==="!--"?K=m:X[1]!==void 0?K=a:X[2]!==void 0?(r.test(X[2])&&(G=RegExp("</"+X[2],"g")),K=$):X[3]!==void 0&&(K=$):K===$?X[0]===">"?(K=G??U,b=-1):X[1]===void 0?b=-2:(b=K.lastIndex-X[2].length,Y=X[1],K=X[3]===void 0?$:X[3]===\'"\'?l:c):K===l||K===c?K=$:K===m||K===a?K=U:(K=$,G=void 0);const _=K===$&&q[W+1].startsWith("/>")?" ":"";O+=K===U?Q+Kq:b>=0?(J.push(Y),Q.slice(0,b)+"$lit$"+Q.slice(b)+P+_):Q+P+(b===-2?W:_)}return[o(q,O+(q[F]||"<?>")+(D===2?"</svg>":D===3?"</math>":"")),J]};class g{constructor({strings:q,_$litType$:D},F){let J;this.parts=[];let G=0,O=0,K=q.length-1,W=this.parts,[Q,Y]=e(q,D);if(this.el=g.createElement(Q,F),w.currentNode=this.el.content,D===2||D===3){const X=this.el.content.firstChild;X.replaceWith(...X.childNodes)}while((J=w.nextNode())!==null&&W.length<K){if(J.nodeType===1){if(J.hasAttributes())for(const X of J.getAttributeNames())if(X.endsWith("$lit$")){const b=Y[O++],A=J.getAttribute(X).split(P),_=/([.?@])?(.*)/.exec(b);W.push({type:1,index:G,name:_[2],strings:A,ctor:_[1]==="."?R:_[1]==="?"?E:_[1]==="@"?d:I}),J.removeAttribute(X)}else X.startsWith(P)&&(W.push({type:6,index:G}),J.removeAttribute(X));if(r.test(J.tagName)){const X=J.textContent.split(P),b=X.length-1;if(b>0){J.textContent=y?y.emptyScript:"";for(let A=0;A<b;A++)J.append(X[A],C()),w.nextNode(),W.push({type:2,index:++G});J.append(X[b],C())}}}else if(J.nodeType===8)if(J.data===v)W.push({type:2,index:G});else{let X=-1;while((X=J.data.indexOf(P,X+1))!==-1)W.push({type:7,index:G}),X+=P.length-1}G++}}static createElement(q,D){const F=x.createElement("template");return F.innerHTML=q,F}}function z(q,D,F=q,J){if(D===V)return D;let G=J!==void 0?F._$Co?.[J]:F._$Cl,O=S(D)?void 0:D._$litDirective$;return G?.constructor!==O&&(G?._$AO?.(!1),O===void 0?G=void 0:(G=new O(q),G._$AT(q,F,J)),J!==void 0?(F._$Co??=[])[J]=G:F._$Cl=G),G!==void 0&&(D=z(q,G._$AS(q,D.values),G,J)),D}class j{constructor(q,D){this._$AV=[],this._$AN=void 0,this._$AD=q,this._$AM=D}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(q){const{el:{content:D},parts:F}=this._$AD,J=(q?.creationScope??x).importNode(D,!0);w.currentNode=J;let G=w.nextNode(),O=0,K=0,W=F[0];while(W!==void 0){if(O===W.index){let Q;W.type===2?Q=new H(G,G.nextSibling,this,q):W.type===1?Q=new W.ctor(G,W.name,W.strings,this,q):W.type===6&&(Q=new f(G,this,q)),this._$AV.push(Q),W=F[++K]}O!==W?.index&&(G=w.nextNode(),O++)}return w.currentNode=x,J}p(q){let D=0;for(const F of this._$AV)F!==void 0&&(F.strings!==void 0?(F._$AI(q,F,D),D+=F.strings.length-2):F._$AI(q[D])),D++}}class H{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(q,D,F,J){this.type=2,this._$AH=B,this._$AN=void 0,this._$AA=q,this._$AB=D,this._$AM=F,this.options=J,this._$Cv=J?.isConnected??!0}get parentNode(){let q=this._$AA.parentNode,D=this._$AM;return D!==void 0&&q?.nodeType===11&&(q=D.parentNode),q}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(q,D=this){q=z(this,q,D),S(q)?q===B||q==null||q===""?(this._$AH!==B&&this._$AR(),this._$AH=B):q!==this._$AH&&q!==V&&this._(q):q._$litType$!==void 0?this.$(q):q.nodeType!==void 0?this.T(q):h(q)?this.k(q):this._(q)}O(q){return this._$AA.parentNode.insertBefore(q,this._$AB)}T(q){this._$AH!==q&&(this._$AR(),this._$AH=this.O(q))}_(q){this._$AH!==B&&S(this._$AH)?this._$AA.nextSibling.data=q:this.T(x.createTextNode(q)),this._$AH=q}$(q){const{values:D,_$litType$:F}=q,J=typeof F=="number"?this._$AC(q):(F.el===void 0&&(F.el=g.createElement(o(F.h,F.h[0]),this.options)),F);if(this._$AH?._$AD===J)this._$AH.p(D);else{const G=new j(J,this),O=G.u(this.options);G.p(D),this.T(O),this._$AH=G}}_$AC(q){let D=n.get(q.strings);return D===void 0&&n.set(q.strings,D=new g(q)),D}k(q){L(this._$AH)||(this._$AH=[],this._$AR());let D=this._$AH,F,J=0;for(const G of q)J===D.length?D.push(F=new H(this.O(C()),this.O(C()),this,this.options)):F=D[J],F._$AI(G),J++;J<D.length&&(this._$AR(F&&F._$AB.nextSibling,J),D.length=J)}_$AR(q=this._$AA.nextSibling,D){for(this._$AP?.(!1,!0,D);q&&q!==this._$AB;){const F=q.nextSibling;q.remove(),q=F}}setConnected(q){this._$AM===void 0&&(this._$Cv=q,this._$AP?.(q))}}class I{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(q,D,F,J,G){this.type=1,this._$AH=B,this._$AN=void 0,this.element=q,this.name=D,this._$AM=J,this.options=G,F.length>2||F[0]!==""||F[1]!==""?(this._$AH=Array(F.length-1).fill(new String),this.strings=F):this._$AH=B}_$AI(q,D=this,F,J){let G=this.strings,O=!1;if(G===void 0)q=z(this,q,D,0),O=!S(q)||q!==this._$AH&&q!==V,O&&(this._$AH=q);else{let K=q,W,Q;for(q=G[0],W=0;W<G.length-1;W++)Q=z(this,K[F+W],D,W),Q===V&&(Q=this._$AH[W]),O||=!S(Q)||Q!==this._$AH[W],Q===B?q=B:q!==B&&(q+=(Q??"")+G[W+1]),this._$AH[W]=Q}O&&!J&&this.j(q)}j(q){q===B?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,q??"")}}class R extends I{constructor(){super(...arguments),this.type=3}j(q){this.element[this.name]=q===B?void 0:q}}class E extends I{constructor(){super(...arguments),this.type=4}j(q){this.element.toggleAttribute(this.name,!!q&&q!==B)}}class d extends I{constructor(q,D,F,J,G){super(q,D,F,J,G),this.type=5}_$AI(q,D=this){if((q=z(this,q,D,0)??B)===V)return;const F=this._$AH,J=q===B&&F!==B||q.capture!==F.capture||q.once!==F.once||q.passive!==F.passive,G=q!==B&&(F===B||J);J&&this.element.removeEventListener(this.name,this,F),G&&this.element.addEventListener(this.name,this,q),this._$AH=q}handleEvent(q){typeof this._$AH=="function"?this._$AH.call(this.options?.host??this.element,q):this._$AH.handleEvent(q)}}class f{constructor(q,D,F){this.element=q,this.type=6,this._$AN=void 0,this._$AM=D,this.options=F}get _$AU(){return this._$AM._$AU}_$AI(q){z(this,q)}}var Z={M:"$lit$",P,A:v,C:1,L:e,R:j,D:h,V:z,I:H,H:I,N:E,U:d,B:R,F:f},Oq=k.litHtmlPolyfillSupport;Oq?.(g,H),(k.litHtmlVersions??=[]).push("3.2.1");var i=(q,D,F)=>{let J=F?.renderBefore??D,G=J._$litPart$;if(G===void 0){const O=F?.renderBefore??null;J._$litPart$=G=new H(D.insertBefore(C(),O),O,void 0,F??{})}return G._$AI(q),G};var u=null,s={boundAttributeSuffix:Z.M,marker:Z.P,markerMatch:Z.A,HTML_RESULT:Z.C,getTemplateHtml:Z.L,overrideDirectiveResolve:(q,D)=>class extends q{_$AS(F,J){return D(this,J)}},patchDirectiveResolve:(q,D)=>{if(q.prototype._$AS!==D){u??=q.prototype._$AS.name;for(let F=q.prototype;F!==Object.prototype;F=Object.getPrototypeOf(F))if(F.hasOwnProperty(u))return void(F[u]=D);throw Error("Internal error: It is possible that both dev mode and production mode Lit was mixed together during SSR. Please comment on the issue: https://github.com/lit/lit/issues/4527")}},setDirectiveClass(q,D){q._$litDirective$=D},getAttributePartCommittedValue:(q,D,F)=>{let J=V;return q.j=(G)=>J=G,q._$AI(D,q,F),J},connectedDisconnectable:(q)=>({...q,_$AU:!0}),resolveDirective:Z.V,AttributePart:Z.H,PropertyPart:Z.B,BooleanAttributePart:Z.N,EventPart:Z.U,ElementPart:Z.F,TemplateInstance:Z.R,isIterable:Z.D,ChildPart:Z.I};var T={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6};var t=(q)=>q===null||typeof q!="object"&&typeof q!="function";var qq=(q,D)=>D===void 0?q?._$litType$!==void 0:q?._$litType$===D,Dq=(q)=>q?._$litType$?.h!=null;var Fq=(q)=>q.strings===void 0;var{TemplateInstance:Qq,isIterable:Wq,resolveDirective:Gq,ChildPart:N,ElementPart:Xq}=s,Jq=(q,D,F={})=>{if(D._$litPart$!==void 0)throw Error("container already contains a live render");let J,G,O,K=[],W=document.createTreeWalker(D,NodeFilter.SHOW_COMMENT),Q;while((Q=W.nextNode())!==null){const Y=Q.data;if(Y.startsWith("lit-part")){if(K.length===0&&J!==void 0)throw Error(`There must be only one root part per container. Found a part marker (${Q}) when we already have a root part marker (${G})`);O=Yq(q,Q,K,F),J===void 0&&(J=O),G??=Q}else if(Y.startsWith("lit-node"))Zq(Q,K,F);else if(Y.startsWith("/lit-part")){if(K.length===1&&O!==J)throw Error("internal error");O=Bq(Q,O,K)}}if(J===void 0){const Y=D instanceof ShadowRoot?"{container.host.localName}\'s shadow root":D instanceof DocumentFragment?"DocumentFragment":D.localName;console.error(`There should be exactly one root part in a render container, but we didn\'t find any in ${Y}.`)}D._$litPart$=J},Yq=(q,D,F,J)=>{let G,O;if(F.length===0)O=new N(D,null,void 0,J),G=q;else{const K=F[F.length-1];if(K.type==="template-instance")O=new N(D,null,K.instance,J),K.instance._$AV.push(O),G=K.result.values[K.instancePartIndex++],K.templatePartIndex++;else if(K.type==="iterable"){O=new N(D,null,K.part,J);const W=K.iterator.next();if(W.done)throw G=void 0,K.done=!0,Error("Unhandled shorter than expected iterable");G=W.value,K.part._$AH.push(O)}else O=new N(D,null,K.part,J)}if(G=Gq(O,G),G===V)F.push({part:O,type:"leaf"});else if(t(G))F.push({part:O,type:"leaf"}),O._$AH=G;else if(qq(G)){if(Dq(G))throw Error("compiled templates are not supported");const K="lit-part "+bq(G);if(D.data!==K)throw Error("Hydration value mismatch: Unexpected TemplateResult rendered to part");{const W=N.prototype._$AC(G),Q=new Qq(W,O);F.push({type:"template-instance",instance:Q,part:O,templatePartIndex:0,instancePartIndex:0,result:G}),O._$AH=Q}}else Wq(G)?(F.push({part:O,type:"iterable",value:G,iterator:G[Symbol.iterator](),done:!1}),O._$AH=[]):(F.push({part:O,type:"leaf"}),O._$AH=G??"");return O},Bq=(q,D,F)=>{if(D===void 0)throw Error("unbalanced part marker");D._$AB=q;const J=F.pop();if(J.type==="iterable"&&!J.iterator.next().done)throw Error("unexpected longer than expected iterable");if(F.length>0)return F[F.length-1].part},Zq=(q,D,F)=>{const J=/lit-node (\\d+)/.exec(q.data),G=Number.parseInt(J[1]),O=q.nextElementSibling;if(O===null)throw Error("could not find node for attribute parts");O.removeAttribute("defer-hydration");const K=D[D.length-1];if(K.type!=="template-instance")throw Error("Hydration value mismatch: Primitive found where TemplateResult expected. This usually occurs due to conditional rendering that resulted in a different value or template being rendered between the server and client.");{const W=K.instance;for(;;){const Q=W._$AD.parts[K.templatePartIndex];if(Q===void 0||Q.type!==T.ATTRIBUTE&&Q.type!==T.ELEMENT||Q.index!==G)break;if(Q.type===T.ATTRIBUTE){const Y=new Q.ctor(O,Q.name,Q.strings,K.instance,F),X=Fq(Y)?K.result.values[K.instancePartIndex]:K.result.values,b=!(Y.type===T.EVENT||Y.type===T.PROPERTY);Y._$AI(X,Y,K.instancePartIndex,b),K.instancePartIndex+=Q.strings.length-1,W._$AV.push(Y)}else{const Y=new Xq(O,K.instance,F);Gq(Y,K.result.values[K.instancePartIndex++]),W._$AV.push(Y)}K.templatePartIndex++}}},bq=(q)=>{const D=new Uint32Array(2).fill(5381);for(const J of q.strings)for(let G=0;G<J.length;G++)D[G%2]=33*D[G%2]^J.charCodeAt(G);const F=String.fromCharCode(...new Uint8Array(D.buffer));return btoa(F)};globalThis.litElementHydrateSupport=({LitElement:q})=>{const D=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(q),"observedAttributes").get;Object.defineProperty(q,"observedAttributes",{get(){return[...D.call(this),"defer-hydration"]}});const F=q.prototype.attributeChangedCallback;q.prototype.attributeChangedCallback=function(K,W,Q){K==="defer-hydration"&&Q===null&&J.call(this),F.call(this,K,W,Q)};const J=q.prototype.connectedCallback;q.prototype.connectedCallback=function(){this.hasAttribute("defer-hydration")||J.call(this)};const G=q.prototype.createRenderRoot;q.prototype.createRenderRoot=function(){return this.shadowRoot?(this._$AG=!0,this.shadowRoot):G.call(this)};const O=Object.getPrototypeOf(q.prototype).update;q.prototype.update=function(K){const W=this.render();if(O.call(this,K),this._$AG){this._$AG=!1;for(let Q=0;Q<this.attributes.length;Q++){const Y=this.attributes[Q];if(Y.name.startsWith("hydrate-internals-")){const X=Y.name.slice(18);this.removeAttribute(X),this.removeAttribute(Y.name)}}Jq(W,this.renderRoot,this.renderOptions)}else i(W,this.renderRoot,this.renderOptions)}};';

package/src/lit-renderer.d.ts

@@ -0,0 +1,47 @@
+/**
+ * This module contains the Lit renderer
+ * @module
+ */
+import type { ComponentRenderInput, ComponentRenderResult, EcoComponent, EcoPagesElement, IntegrationRendererRenderOptions, RouteRendererBody } from '@ecopages/core';
+import { IntegrationRenderer, type RenderToResponseContext } from '@ecopages/core/route-renderer/integration-renderer';
+/**
+ * A renderer for the Lit integration.
+ */
+export declare class LitRenderer extends IntegrationRenderer<EcoPagesElement> {
+    name: string;
+    /**
+     * Renders a Lit component boundary for component-level orchestration.
+     *
+     * Includes component-scoped dependency assets when declared.
+     */
+    renderComponent(input: ComponentRenderInput): Promise<ComponentRenderResult>;
+    private readonly ssrLazyPreloader;
+    /**
+     * Detects preload failures that are expected for browser-only modules.
+     *
+     * These errors are treated as non-fatal during SSR preload because some
+     * lazy client scripts intentionally depend on browser globals.
+     */
+    protected isExpectedSsrPreloadError(error: unknown): boolean;
+    /**
+     * Collects lazy script file paths eligible for SSR preloading.
+     *
+     * Only per-entry lazy script dependencies with `ssr: true` are collected.
+     * File-backed entries are required (`src` must be present);
+     * inline content lazy entries are intentionally skipped.
+     */
+    protected collectSsrPreloadScripts(components: Array<EcoComponent | undefined>): string[];
+    /**
+     * Preloads SSR-eligible lazy scripts to register custom elements before render.
+     */
+    protected preloadSsrLazyScripts(components: Array<EcoComponent | undefined>): Promise<void>;
+    /**
+     * Resolves the concrete JS entrypoint used for SSR preloading.
+     *
+     * Scripts are passed through the asset pipeline so preload imports can use
+     * the same processed output shape as runtime dependencies.
+     */
+    protected resolveSsrPreloadEntrypoint(scriptPath: string): Promise<string | null>;
+    render({ params, query, props, locals, metadata, Page, Layout, HtmlTemplate, }: IntegrationRendererRenderOptions): Promise<RouteRendererBody>;
+    renderToResponse<P = Record<string, unknown>>(view: EcoComponent<P>, props: P, ctx: RenderToResponseContext): Promise<Response>;
+}

package/src/lit-renderer.js

@@ -0,0 +1,155 @@
+import { IntegrationRenderer } from "@ecopages/core/route-renderer/integration-renderer";
+import { render } from "@lit-labs/ssr";
+import { RenderResultReadable } from "@lit-labs/ssr/lib/render-result-readable.js";
+import { unsafeHTML } from "lit/directives/unsafe-html.js";
+import { LitSsrLazyPreloader } from "./lit-ssr-lazy-preloader.js";
+import { PLUGIN_NAME } from "./lit.plugin.js";
+class LitRenderer extends IntegrationRenderer {
+  name = PLUGIN_NAME;
+  /**
+   * Renders a Lit component boundary for component-level orchestration.
+   *
+   * Includes component-scoped dependency assets when declared.
+   */
+  async renderComponent(input) {
+    const component = input.component;
+    const props = input.children === void 0 ? input.props : { ...input.props, children: input.children };
+    const content = await component(props);
+    const html = String(content);
+    const hasDependencies = Boolean(input.component.config?.dependencies);
+    const canResolveAssets = typeof this.assetProcessingService?.processDependencies === "function";
+    const assets = hasDependencies && canResolveAssets ? await this.processComponentDependencies([input.component]) : void 0;
+    return {
+      html,
+      canAttachAttributes: true,
+      rootTag: this.getRootTagName(html),
+      integrationName: this.name,
+      assets
+    };
+  }
+  ssrLazyPreloader = new LitSsrLazyPreloader({
+    resolveDependencyPath: this.resolveDependencyPath.bind(this),
+    processDependencies: this.assetProcessingService?.processDependencies?.bind(this.assetProcessingService)
+  });
+  /**
+   * Detects preload failures that are expected for browser-only modules.
+   *
+   * These errors are treated as non-fatal during SSR preload because some
+   * lazy client scripts intentionally depend on browser globals.
+   */
+  isExpectedSsrPreloadError(error) {
+    return this.ssrLazyPreloader.isExpectedSsrPreloadError(error);
+  }
+  /**
+   * Collects lazy script file paths eligible for SSR preloading.
+   *
+   * Only per-entry lazy script dependencies with `ssr: true` are collected.
+   * File-backed entries are required (`src` must be present);
+   * inline content lazy entries are intentionally skipped.
+   */
+  collectSsrPreloadScripts(components) {
+    return this.ssrLazyPreloader.collectSsrPreloadScripts(components);
+  }
+  /**
+   * Preloads SSR-eligible lazy scripts to register custom elements before render.
+   */
+  async preloadSsrLazyScripts(components) {
+    await this.ssrLazyPreloader.preloadSsrLazyScripts(components);
+  }
+  /**
+   * Resolves the concrete JS entrypoint used for SSR preloading.
+   *
+   * Scripts are passed through the asset pipeline so preload imports can use
+   * the same processed output shape as runtime dependencies.
+   */
+  async resolveSsrPreloadEntrypoint(scriptPath) {
+    return this.ssrLazyPreloader.resolveSsrPreloadEntrypoint(scriptPath);
+  }
+  async render({
+    params,
+    query,
+    props,
+    locals,
+    metadata,
+    Page,
+    Layout,
+    HtmlTemplate
+  }) {
+    try {
+      await this.preloadSsrLazyScripts([Page, Layout]);
+      const pageContent = await Page({ params, query, ...props, locals });
+      const children = Layout ? await Layout(
+        {
+          children: pageContent,
+          locals
+        }
+      ) : pageContent;
+      const template = await HtmlTemplate({
+        metadata,
+        children: "<--content-->",
+        pageProps: props || {}
+      });
+      const [templateStart, templateEnd] = template.split("<--content-->");
+      const DOC_TYPE = this.DOC_TYPE;
+      function* streamBody() {
+        yield DOC_TYPE;
+        yield templateStart;
+        yield* render(unsafeHTML(children));
+        yield templateEnd;
+      }
+      return new RenderResultReadable(streamBody());
+    } catch (error) {
+      throw this.createRenderError("Error rendering page", error);
+    }
+  }
+  async renderToResponse(view, props, ctx) {
+    try {
+      const viewConfig = view.config;
+      const Layout = viewConfig?.layout;
+      await this.preloadSsrLazyScripts([view, Layout]);
+      const viewFn = view;
+      const pageContent = await viewFn(props);
+      if (ctx.partial) {
+        function* streamBody2() {
+          yield* render(unsafeHTML(pageContent));
+        }
+        const readable = new RenderResultReadable(streamBody2());
+        return this.createHtmlResponse(readable, ctx);
+      }
+      const DOC_TYPE = this.DOC_TYPE;
+      const children = Layout ? await Layout({ children: pageContent }) : pageContent;
+      const HtmlTemplate = await this.getHtmlTemplate();
+      const metadata = view.metadata ? await view.metadata({
+        params: {},
+        query: {},
+        props,
+        appConfig: this.appConfig
+      }) : this.appConfig.defaultMetadata;
+      await this.prepareViewDependencies(view, Layout);
+      const template = await HtmlTemplate({
+        metadata,
+        children: "<--content-->",
+        pageProps: props
+      });
+      const [templateStart, templateEnd] = template.split("<--content-->");
+      function* streamBody() {
+        yield DOC_TYPE;
+        yield templateStart;
+        yield* render(unsafeHTML(children));
+        yield templateEnd;
+      }
+      const stream = new RenderResultReadable(streamBody());
+      const transformedResponse = await this.htmlTransformer.transform(
+        new Response(stream, {
+          headers: { "Content-Type": "text/html" }
+        })
+      );
+      return this.createHtmlResponse(transformedResponse.body, ctx);
+    } catch (error) {
+      throw this.createRenderError("Error rendering view", error);
+    }
+  }
+}
+export {
+  LitRenderer
+};

package/src/lit-renderer.ts

@@ -0,0 +1,210 @@
+/**
+ * This module contains the Lit renderer
+ * @module
+ */
+
+import type {
+	ComponentRenderInput,
+	ComponentRenderResult,
+	EcoComponent,
+	EcoPagesElement,
+	IntegrationRendererRenderOptions,
+	PageMetadataProps,
+	RouteRendererBody,
+} from '@ecopages/core';
+import { IntegrationRenderer, type RenderToResponseContext } from '@ecopages/core/route-renderer/integration-renderer';
+import { render } from '@lit-labs/ssr';
+import { RenderResultReadable } from '@lit-labs/ssr/lib/render-result-readable.js';
+import { unsafeHTML } from 'lit/directives/unsafe-html.js';
+import { LitSsrLazyPreloader } from './lit-ssr-lazy-preloader.ts';
+import { PLUGIN_NAME } from './lit.plugin.ts';
+
+/**
+ * A renderer for the Lit integration.
+ */
+export class LitRenderer extends IntegrationRenderer<EcoPagesElement> {
+	override name = PLUGIN_NAME;
+
+	/**
+	 * Renders a Lit component boundary for component-level orchestration.
+	 *
+	 * Includes component-scoped dependency assets when declared.
+	 */
+	override async renderComponent(input: ComponentRenderInput): Promise<ComponentRenderResult> {
+		const component = input.component as (
+			props: Record<string, unknown>,
+		) => Promise<EcoPagesElement> | EcoPagesElement;
+		const props = input.children === undefined ? input.props : { ...input.props, children: input.children };
+		const content = await component(props);
+		const html = String(content);
+		const hasDependencies = Boolean(input.component.config?.dependencies);
+		const canResolveAssets = typeof this.assetProcessingService?.processDependencies === 'function';
+		const assets =
+			hasDependencies && canResolveAssets
+				? await this.processComponentDependencies([input.component])
+				: undefined;
+
+		return {
+			html,
+			canAttachAttributes: true,
+			rootTag: this.getRootTagName(html),
+			integrationName: this.name,
+			assets,
+		};
+	}
+
+	private readonly ssrLazyPreloader = new LitSsrLazyPreloader({
+		resolveDependencyPath: this.resolveDependencyPath.bind(this),
+		processDependencies: this.assetProcessingService?.processDependencies?.bind(this.assetProcessingService),
+	});
+
+	/**
+	 * Detects preload failures that are expected for browser-only modules.
+	 *
+	 * These errors are treated as non-fatal during SSR preload because some
+	 * lazy client scripts intentionally depend on browser globals.
+	 */
+	protected isExpectedSsrPreloadError(error: unknown): boolean {
+		return this.ssrLazyPreloader.isExpectedSsrPreloadError(error);
+	}
+
+	/**
+	 * Collects lazy script file paths eligible for SSR preloading.
+	 *
+	 * Only per-entry lazy script dependencies with `ssr: true` are collected.
+	 * File-backed entries are required (`src` must be present);
+	 * inline content lazy entries are intentionally skipped.
+	 */
+	protected collectSsrPreloadScripts(components: Array<EcoComponent | undefined>): string[] {
+		return this.ssrLazyPreloader.collectSsrPreloadScripts(components);
+	}
+
+	/**
+	 * Preloads SSR-eligible lazy scripts to register custom elements before render.
+	 */
+	protected async preloadSsrLazyScripts(components: Array<EcoComponent | undefined>): Promise<void> {
+		await this.ssrLazyPreloader.preloadSsrLazyScripts(components);
+	}
+
+	/**
+	 * Resolves the concrete JS entrypoint used for SSR preloading.
+	 *
+	 * Scripts are passed through the asset pipeline so preload imports can use
+	 * the same processed output shape as runtime dependencies.
+	 */
+	protected async resolveSsrPreloadEntrypoint(scriptPath: string): Promise<string | null> {
+		return this.ssrLazyPreloader.resolveSsrPreloadEntrypoint(scriptPath);
+	}
+
+	async render({
+		params,
+		query,
+		props,
+		locals,
+		metadata,
+		Page,
+		Layout,
+		HtmlTemplate,
+	}: IntegrationRendererRenderOptions): Promise<RouteRendererBody> {
+		try {
+			await this.preloadSsrLazyScripts([Page, Layout]);
+
+			const pageContent = await Page({ params, query, ...props, locals });
+			const children = Layout
+				? await (Layout as (props: { children: EcoPagesElement } & Record<string, unknown>) => EcoPagesElement)(
+						{
+							children: pageContent,
+							locals,
+						},
+					)
+				: pageContent;
+
+			const template = (await HtmlTemplate({
+				metadata,
+				children: '<--content-->',
+				pageProps: props || {},
+			})) as string;
+
+			const [templateStart, templateEnd] = template.split('<--content-->');
+
+			const DOC_TYPE = this.DOC_TYPE;
+
+			function* streamBody() {
+				yield DOC_TYPE;
+				yield templateStart;
+				yield* render(unsafeHTML(children));
+				yield templateEnd;
+			}
+
+			return new RenderResultReadable(streamBody());
+		} catch (error) {
+			throw this.createRenderError('Error rendering page', error);
+		}
+	}
+
+	async renderToResponse<P = Record<string, unknown>>(
+		view: EcoComponent<P>,
+		props: P,
+		ctx: RenderToResponseContext,
+	): Promise<Response> {
+		try {
+			const viewConfig = view.config;
+			const Layout = viewConfig?.layout as
+				| ((props: { children: EcoPagesElement } & Record<string, unknown>) => EcoPagesElement)
+				| undefined;
+
+			await this.preloadSsrLazyScripts([view as unknown as EcoComponent, Layout as unknown as EcoComponent]);
+
+			const viewFn = view as (props: P) => Promise<EcoPagesElement>;
+			const pageContent = await viewFn(props);
+
+			if (ctx.partial) {
+				function* streamBody() {
+					yield* render(unsafeHTML(pageContent));
+				}
+				const readable = new RenderResultReadable(streamBody());
+				return this.createHtmlResponse(readable as unknown as BodyInit, ctx);
+			}
+
+			const DOC_TYPE = this.DOC_TYPE;
+			const children = Layout ? await Layout({ children: pageContent }) : pageContent;
+
+			const HtmlTemplate = await this.getHtmlTemplate();
+			const metadata: PageMetadataProps = view.metadata
+				? await view.metadata({
+						params: {},
+						query: {},
+						props: props as Record<string, unknown>,
+						appConfig: this.appConfig,
+					})
+				: this.appConfig.defaultMetadata;
+
+			await this.prepareViewDependencies(view, Layout as EcoComponent | undefined);
+
+			const template = (await HtmlTemplate({
+				metadata,
+				children: '<--content-->',
+				pageProps: props as Record<string, unknown>,
+			})) as string;
+
+			const [templateStart, templateEnd] = template.split('<--content-->');
+
+			function* streamBody() {
+				yield DOC_TYPE;
+				yield templateStart;
+				yield* render(unsafeHTML(children));
+				yield templateEnd;
+			}
+			const stream = new RenderResultReadable(streamBody());
+			const transformedResponse = await this.htmlTransformer.transform(
+				new Response(stream as any, {
+					headers: { 'Content-Type': 'text/html' },
+				}),
+			);
+
+			return this.createHtmlResponse(transformedResponse.body as BodyInit, ctx);
+		} catch (error) {
+			throw this.createRenderError('Error rendering view', error);
+		}
+	}
+}

package/src/lit-ssr-lazy-preloader.d.ts

@@ -0,0 +1,41 @@
+import type { EcoComponent } from '@ecopages/core';
+import type { AssetDefinition } from '@ecopages/core/services/asset-processing-service';
+type ProcessDependencies = (dependencies: AssetDefinition[], integrationName: string) => Promise<Array<{
+    filepath?: string;
+}>>;
+export interface LitSsrLazyPreloaderOptions {
+    resolveDependencyPath: (componentDir: string, sourcePath: string) => string;
+    processDependencies?: ProcessDependencies;
+}
+/**
+ * Encapsulates SSR lazy script preload behavior for Lit components.
+ *
+ * Collects `dependencies.scripts` lazy entries with `ssr: true`, resolves the
+ * processed entrypoint through the asset pipeline, and imports the module so
+ * custom elements are registered before SSR rendering.
+ */
+export declare class LitSsrLazyPreloader {
+    private readonly resolveDependencyPath;
+    private readonly processDependencies?;
+    private readonly ssrPreloadedScripts;
+    private readonly ssrPreloadFailedScripts;
+    private readonly ssrPreloadEntrypointCache;
+    constructor({ resolveDependencyPath, processDependencies }: LitSsrLazyPreloaderOptions);
+    /**
+     * Detects preload failures that are expected for browser-only modules.
+     */
+    isExpectedSsrPreloadError(error: unknown): boolean;
+    /**
+     * Collects lazy script file paths eligible for SSR preloading.
+     */
+    collectSsrPreloadScripts(components: Array<EcoComponent | undefined>): string[];
+    /**
+     * Preloads SSR-eligible lazy scripts to register custom elements before render.
+     */
+    preloadSsrLazyScripts(components: Array<EcoComponent | undefined>): Promise<void>;
+    /**
+     * Resolves the concrete JS entrypoint used for SSR preloading.
+     */
+    resolveSsrPreloadEntrypoint(scriptPath: string): Promise<string | null>;
+}
+export {};

package/src/lit-ssr-lazy-preloader.js

@@ -0,0 +1,149 @@
+import { AssetFactory } from "@ecopages/core/services/asset-processing-service";
+import path from "node:path";
+import { pathToFileURL } from "node:url";
+class LitSsrLazyPreloader {
+  resolveDependencyPath;
+  processDependencies;
+  ssrPreloadedScripts = /* @__PURE__ */ new Set();
+  ssrPreloadFailedScripts = /* @__PURE__ */ new Set();
+  ssrPreloadEntrypointCache = /* @__PURE__ */ new Map();
+  constructor({ resolveDependencyPath, processDependencies }) {
+    this.resolveDependencyPath = resolveDependencyPath;
+    this.processDependencies = processDependencies;
+  }
+  /**
+   * Detects preload failures that are expected for browser-only modules.
+   */
+  isExpectedSsrPreloadError(error) {
+    const errorMessage = error instanceof Error ? error.message : String(error);
+    const errorCode = typeof error === "object" && error !== null && "code" in error ? String(error.code ?? "") : "";
+    if (errorCode === "ERR_UNKNOWN_FILE_EXTENSION") {
+      return true;
+    }
+    return errorMessage.includes(`reading 'Element'`) || errorMessage.includes("window is not defined") || errorMessage.includes("document is not defined") || errorMessage.includes("navigator is not defined");
+  }
+  /**
+   * Collects lazy script file paths eligible for SSR preloading.
+   */
+  collectSsrPreloadScripts(components) {
+    const scriptPaths = /* @__PURE__ */ new Set();
+    const visitedConfigs = /* @__PURE__ */ new Set();
+    const collect = (component) => {
+      const config = component?.config;
+      if (!config || visitedConfigs.has(config)) {
+        return;
+      }
+      visitedConfigs.add(config);
+      const scriptEntries = config.dependencies?.scripts ?? [];
+      const componentFile = config.__eco?.file;
+      if (componentFile) {
+        const componentDir = path.dirname(componentFile);
+        for (const script of scriptEntries) {
+          if (typeof script === "string") {
+            continue;
+          }
+          if (!script.lazy || script.ssr !== true) {
+            continue;
+          }
+          if (!script.src) {
+            continue;
+          }
+          scriptPaths.add(this.resolveDependencyPath(componentDir, script.src));
+        }
+      }
+      if (config.layout) {
+        collect(config.layout);
+      }
+      for (const nestedComponent of config.dependencies?.components || []) {
+        collect(nestedComponent);
+      }
+    };
+    for (const component of components) {
+      collect(component);
+    }
+    return Array.from(scriptPaths);
+  }
+  /**
+   * Preloads SSR-eligible lazy scripts to register custom elements before render.
+   */
+  async preloadSsrLazyScripts(components) {
+    const scripts = this.collectSsrPreloadScripts(components);
+    if (scripts.length === 0) {
+      return;
+    }
+    await Promise.all(
+      scripts.filter((scriptPath) => {
+        if (this.ssrPreloadedScripts.has(scriptPath)) {
+          return false;
+        }
+        if (this.ssrPreloadFailedScripts.has(scriptPath)) {
+          return false;
+        }
+        return true;
+      }).map(async (scriptPath) => {
+        const preloadEntrypoint = await this.resolveSsrPreloadEntrypoint(scriptPath);
+        if (!preloadEntrypoint) {
+          this.ssrPreloadFailedScripts.add(scriptPath);
+          return;
+        }
+        try {
+          await import(pathToFileURL(preloadEntrypoint).href);
+          this.ssrPreloadedScripts.add(scriptPath);
+        } catch (error) {
+          this.ssrPreloadFailedScripts.add(scriptPath);
+          if (this.isExpectedSsrPreloadError(error)) {
+            if (process.env.ECOPAGES_DEBUG === "true") {
+              console.warn(
+                `[ecopages][lit] Skipping SSR preload for browser-only lazy script: ${scriptPath}`
+              );
+            }
+            return;
+          }
+          console.warn(`[ecopages][lit] Failed to preload lazy SSR script: ${scriptPath}`, error);
+        }
+      })
+    );
+  }
+  /**
+   * Resolves the concrete JS entrypoint used for SSR preloading.
+   */
+  async resolveSsrPreloadEntrypoint(scriptPath) {
+    const cachedEntrypoint = this.ssrPreloadEntrypointCache.get(scriptPath);
+    if (cachedEntrypoint) {
+      return cachedEntrypoint;
+    }
+    if (!this.processDependencies) {
+      return scriptPath;
+    }
+    try {
+      const processed = await this.processDependencies(
+        [
+          AssetFactory.createInlineFileScript({
+            filepath: scriptPath,
+            position: "head",
+            bundle: true,
+            attributes: {
+              type: "module",
+              defer: ""
+            }
+          })
+        ],
+        `lit-ssr-preload:${scriptPath}`
+      );
+      const entrypoint = processed[0]?.filepath;
+      if (!entrypoint) {
+        return scriptPath;
+      }
+      this.ssrPreloadEntrypointCache.set(scriptPath, entrypoint);
+      return entrypoint;
+    } catch (error) {
+      if (process.env.ECOPAGES_DEBUG === "true") {
+        console.warn(`[ecopages][lit] Failed to resolve SSR preload entrypoint for: ${scriptPath}`, error);
+      }
+      return scriptPath;
+    }
+  }
+}
+export {
+  LitSsrLazyPreloader
+};

package/src/lit-ssr-lazy-preloader.ts

@@ -0,0 +1,202 @@
+import type { EcoComponent, EcoComponentConfig } from '@ecopages/core';
+import { AssetFactory } from '@ecopages/core/services/asset-processing-service';
+import type { AssetDefinition } from '@ecopages/core/services/asset-processing-service';
+import path from 'node:path';
+import { pathToFileURL } from 'node:url';
+
+type ProcessDependencies = (
+	dependencies: AssetDefinition[],
+	integrationName: string,
+) => Promise<Array<{ filepath?: string }>>;
+
+export interface LitSsrLazyPreloaderOptions {
+	resolveDependencyPath: (componentDir: string, sourcePath: string) => string;
+	processDependencies?: ProcessDependencies;
+}
+
+/**
+ * Encapsulates SSR lazy script preload behavior for Lit components.
+ *
+ * Collects `dependencies.scripts` lazy entries with `ssr: true`, resolves the
+ * processed entrypoint through the asset pipeline, and imports the module so
+ * custom elements are registered before SSR rendering.
+ */
+export class LitSsrLazyPreloader {
+	private readonly resolveDependencyPath: (componentDir: string, sourcePath: string) => string;
+	private readonly processDependencies?: ProcessDependencies;
+	private readonly ssrPreloadedScripts = new Set<string>();
+	private readonly ssrPreloadFailedScripts = new Set<string>();
+	private readonly ssrPreloadEntrypointCache = new Map<string, string>();
+
+	constructor({ resolveDependencyPath, processDependencies }: LitSsrLazyPreloaderOptions) {
+		this.resolveDependencyPath = resolveDependencyPath;
+		this.processDependencies = processDependencies;
+	}
+
+	/**
+	 * Detects preload failures that are expected for browser-only modules.
+	 */
+	isExpectedSsrPreloadError(error: unknown): boolean {
+		const errorMessage = error instanceof Error ? error.message : String(error);
+		const errorCode =
+			typeof error === 'object' && error !== null && 'code' in error
+				? String((error as { code?: unknown }).code ?? '')
+				: '';
+
+		if (errorCode === 'ERR_UNKNOWN_FILE_EXTENSION') {
+			return true;
+		}
+
+		return (
+			errorMessage.includes(`reading 'Element'`) ||
+			errorMessage.includes('window is not defined') ||
+			errorMessage.includes('document is not defined') ||
+			errorMessage.includes('navigator is not defined')
+		);
+	}
+
+	/**
+	 * Collects lazy script file paths eligible for SSR preloading.
+	 */
+	collectSsrPreloadScripts(components: Array<EcoComponent | undefined>): string[] {
+		const scriptPaths = new Set<string>();
+		const visitedConfigs = new Set<EcoComponentConfig>();
+
+		const collect = (component?: EcoComponent) => {
+			const config = component?.config;
+			if (!config || visitedConfigs.has(config)) {
+				return;
+			}
+
+			visitedConfigs.add(config);
+
+			const scriptEntries = config.dependencies?.scripts ?? [];
+			const componentFile = config.__eco?.file;
+
+			if (componentFile) {
+				const componentDir = path.dirname(componentFile);
+				for (const script of scriptEntries) {
+					if (typeof script === 'string') {
+						continue;
+					}
+
+					if (!script.lazy || script.ssr !== true) {
+						continue;
+					}
+
+					if (!script.src) {
+						continue;
+					}
+
+					scriptPaths.add(this.resolveDependencyPath(componentDir, script.src));
+				}
+			}
+
+			if (config.layout) {
+				collect(config.layout);
+			}
+
+			for (const nestedComponent of config.dependencies?.components || []) {
+				collect(nestedComponent);
+			}
+		};
+
+		for (const component of components) {
+			collect(component);
+		}
+
+		return Array.from(scriptPaths);
+	}
+
+	/**
+	 * Preloads SSR-eligible lazy scripts to register custom elements before render.
+	 */
+	async preloadSsrLazyScripts(components: Array<EcoComponent | undefined>): Promise<void> {
+		const scripts = this.collectSsrPreloadScripts(components);
+		if (scripts.length === 0) {
+			return;
+		}
+
+		await Promise.all(
+			scripts
+				.filter((scriptPath) => {
+					if (this.ssrPreloadedScripts.has(scriptPath)) {
+						return false;
+					}
+					if (this.ssrPreloadFailedScripts.has(scriptPath)) {
+						return false;
+					}
+					return true;
+				})
+				.map(async (scriptPath) => {
+					const preloadEntrypoint = await this.resolveSsrPreloadEntrypoint(scriptPath);
+					if (!preloadEntrypoint) {
+						this.ssrPreloadFailedScripts.add(scriptPath);
+						return;
+					}
+
+					try {
+						await import(pathToFileURL(preloadEntrypoint).href);
+						this.ssrPreloadedScripts.add(scriptPath);
+					} catch (error) {
+						this.ssrPreloadFailedScripts.add(scriptPath);
+
+						if (this.isExpectedSsrPreloadError(error)) {
+							if (process.env.ECOPAGES_DEBUG === 'true') {
+								console.warn(
+									`[ecopages][lit] Skipping SSR preload for browser-only lazy script: ${scriptPath}`,
+								);
+							}
+							return;
+						}
+
+						console.warn(`[ecopages][lit] Failed to preload lazy SSR script: ${scriptPath}`, error);
+					}
+				}),
+		);
+	}
+
+	/**
+	 * Resolves the concrete JS entrypoint used for SSR preloading.
+	 */
+	async resolveSsrPreloadEntrypoint(scriptPath: string): Promise<string | null> {
+		const cachedEntrypoint = this.ssrPreloadEntrypointCache.get(scriptPath);
+		if (cachedEntrypoint) {
+			return cachedEntrypoint;
+		}
+
+		if (!this.processDependencies) {
+			return scriptPath;
+		}
+
+		try {
+			const processed = await this.processDependencies(
+				[
+					AssetFactory.createInlineFileScript({
+						filepath: scriptPath,
+						position: 'head',
+						bundle: true,
+						attributes: {
+							type: 'module',
+							defer: '',
+						},
+					}),
+				],
+				`lit-ssr-preload:${scriptPath}`,
+			);
+
+			const entrypoint = processed[0]?.filepath;
+			if (!entrypoint) {
+				return scriptPath;
+			}
+
+			this.ssrPreloadEntrypointCache.set(scriptPath, entrypoint);
+			return entrypoint;
+		} catch (error) {
+			if (process.env.ECOPAGES_DEBUG === 'true') {
+				console.warn(`[ecopages][lit] Failed to resolve SSR preload entrypoint for: ${scriptPath}`, error);
+			}
+			return scriptPath;
+		}
+	}
+}

package/src/lit.plugin.d.ts

@@ -0,0 +1,28 @@
+/**
+ * This module contains the Lit plugin
+ * @module
+ */
+import '@lit-labs/ssr/lib/install-global-dom-shim.js';
+import './console';
+import { IntegrationPlugin, type IntegrationPluginConfig } from '@ecopages/core/plugins/integration-plugin';
+import { type AssetDefinition } from '@ecopages/core/services/asset-processing-service';
+import { LitRenderer } from './lit-renderer.js';
+/**
+ * The name of the Lit plugin
+ */
+export declare const PLUGIN_NAME = "lit";
+/**
+ * The Lit plugin class
+ * This plugin provides support for Lit components in Ecopages
+ */
+export declare class LitPlugin extends IntegrationPlugin {
+    renderer: typeof LitRenderer;
+    constructor(options?: Omit<IntegrationPluginConfig, 'name'>);
+    getDependencies(): AssetDefinition[];
+}
+/**
+ * Factory function to create a Lit plugin instance
+ * @param options Configuration options for the Lit plugin
+ * @returns A new LitPlugin instance
+ */
+export declare function litPlugin(options?: Omit<IntegrationPluginConfig, 'name'>): LitPlugin;

package/src/lit.plugin.js

@@ -0,0 +1,52 @@
+import "@lit-labs/ssr/lib/install-global-dom-shim.js";
+import "./console";
+import { IntegrationPlugin } from "@ecopages/core/plugins/integration-plugin";
+import { AssetFactory } from "@ecopages/core/services/asset-processing-service";
+import { litElementHydrateScript } from "./lit-element-hydrate.js";
+import { LitRenderer } from "./lit-renderer.js";
+const PLUGIN_NAME = "lit";
+class LitPlugin extends IntegrationPlugin {
+  renderer = LitRenderer;
+  constructor(options) {
+    super({
+      name: PLUGIN_NAME,
+      extensions: [".lit.tsx"],
+      staticBuildStep: "fetch",
+      ...options
+    });
+    this.integrationDependencies.unshift(...this.getDependencies());
+  }
+  getDependencies() {
+    return [
+      /**
+       * BUG ALERT
+       * Due to an issue appeared in Bun 1.2.2, we need to use a workaround to import the hydrate script.
+       * This is a temporary solution until the issue is resolved.
+       * The litElementHydrateScript is the same file built on Bun 1.1.45.
+       * https://github.com/oven-sh/bun/issues/17180
+       *
+       * AssetFactory.createNodeModuleScript({
+       *    position: 'head',
+       *    importPath: '@lit-labs/ssr-client/lit-element-hydrate-support.js'
+       * })
+       */
+      AssetFactory.createInlineContentScript({
+        position: "head",
+        content: litElementHydrateScript,
+        bundle: false,
+        attributes: {
+          "data-eco-rerun": "true",
+          "data-eco-script-id": "lit-hydrate-support"
+        }
+      })
+    ];
+  }
+}
+function litPlugin(options) {
+  return new LitPlugin(options);
+}
+export {
+  LitPlugin,
+  PLUGIN_NAME,
+  litPlugin
+};

package/src/lit.plugin.ts

@@ -0,0 +1,70 @@
+/**
+ * This module contains the Lit plugin
+ * @module
+ */
+
+import '@lit-labs/ssr/lib/install-global-dom-shim.js';
+import './console';
+import { IntegrationPlugin, type IntegrationPluginConfig } from '@ecopages/core/plugins/integration-plugin';
+import { type AssetDefinition, AssetFactory } from '@ecopages/core/services/asset-processing-service';
+import { litElementHydrateScript } from './lit-element-hydrate.ts';
+import { LitRenderer } from './lit-renderer.ts';
+
+/**
+ * The name of the Lit plugin
+ */
+export const PLUGIN_NAME = 'lit';
+
+/**
+ * The Lit plugin class
+ * This plugin provides support for Lit components in Ecopages
+ */
+export class LitPlugin extends IntegrationPlugin {
+	renderer = LitRenderer;
+
+	constructor(options?: Omit<IntegrationPluginConfig, 'name'>) {
+		super({
+			name: PLUGIN_NAME,
+			extensions: ['.lit.tsx'],
+			staticBuildStep: 'fetch',
+			...options,
+		});
+
+		this.integrationDependencies.unshift(...this.getDependencies());
+	}
+
+	getDependencies(): AssetDefinition[] {
+		return [
+			/**
+			 * BUG ALERT
+			 * Due to an issue appeared in Bun 1.2.2, we need to use a workaround to import the hydrate script.
+			 * This is a temporary solution until the issue is resolved.
+			 * The litElementHydrateScript is the same file built on Bun 1.1.45.
+			 * https://github.com/oven-sh/bun/issues/17180
+			 *
+			 * AssetFactory.createNodeModuleScript({
+			 *    position: 'head',
+			 *    importPath: '@lit-labs/ssr-client/lit-element-hydrate-support.js'
+			 * })
+			 */
+			AssetFactory.createInlineContentScript({
+				position: 'head',
+				content: litElementHydrateScript,
+				bundle: false,
+				attributes: {
+					'data-eco-rerun': 'true',
+					'data-eco-script-id': 'lit-hydrate-support',
+				},
+			}),
+		];
+	}
+}
+
+/**
+ * Factory function to create a Lit plugin instance
+ * @param options Configuration options for the Lit plugin
+ * @returns A new LitPlugin instance
+ */
+export function litPlugin(options?: Omit<IntegrationPluginConfig, 'name'>): LitPlugin {
+	return new LitPlugin(options);
+}

package/src/styled-mixin.d.ts

@@ -0,0 +1,15 @@
+/**
+ * This module contains StyledMixin
+ * It is used to add styles to a LitElement
+ * @module
+ */
+import { type LitElement } from 'lit';
+type Constructor<T> = new (...args: any[]) => T;
+/**
+ * A mixin to add styles to a LitElement
+ * @param superClass - The class to mix into
+ * @param css - The styles to add
+ * @returns The class with the styles added
+ */
+export declare const StyledMixin: <T extends Constructor<LitElement>>(superClass: T, css?: string[]) => Constructor<LitElement> & T;
+export {};

package/src/styled-mixin.js

@@ -0,0 +1,13 @@
+import { unsafeCSS } from "lit";
+const StyledMixin = (superClass, css = []) => {
+  class StyledMixinClass extends superClass {
+    static styles = [
+      superClass.styles ?? [],
+      ...css.map((styles) => unsafeCSS(styles))
+    ];
+  }
+  return StyledMixinClass;
+};
+export {
+  StyledMixin
+};

package/src/styled-mixin.ts

@@ -0,0 +1,27 @@
+/**
+ * This module contains StyledMixin
+ * It is used to add styles to a LitElement
+ * @module
+ */
+import { type LitElement, unsafeCSS } from 'lit';
+
+type Constructor<T> = new (...args: any[]) => T;
+
+/**
+ * A mixin to add styles to a LitElement
+ * @param superClass - The class to mix into
+ * @param css - The styles to add
+ * @returns The class with the styles added
+ */
+export const StyledMixin = <T extends Constructor<LitElement>>(
+	superClass: T,
+	css: string[] = [],
+): Constructor<LitElement> & T => {
+	class StyledMixinClass extends superClass {
+		static styles = [
+			(superClass as unknown as typeof LitElement).styles ?? [],
+			...css.map((styles) => unsafeCSS(styles)),
+		];
+	}
+	return StyledMixinClass as Constructor<LitElement> & T;
+};