@qwik-custom-elements/adapter-lit 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Dmitry A. Efimenko
+
+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,90 @@
+# @qwik-custom-elements/adapter-lit
+
+Lit-specific adapter contract and SSR surface for generated Qwik custom-element integration.
+
+## Install
+
+```
+npm install @qwik-custom-elements/adapter-lit
+```
+
+Peer dependencies:
+
+```
+npm install @builder.io/qwik lit
+```
+
+For SSR support, also install the optional peers:
+
+```
+npm install @lit-labs/ssr @lit-labs/ssr-client
+```
+
+## Quickstart
+
+Reference this adapter in your `qwik-custom-elements.config.json`:
+
+```json
+{
+  "projects": [
+    {
+      "id": "my-lit-lib",
+      "adapter": "lit",
+      "adapterPackage": "@qwik-custom-elements/adapter-lit",
+      "source": {
+        "type": "PACKAGE_NAME",
+        "packageName": "my-lit-lib"
+      },
+      "adapterOptions": {
+        "runtime": {
+          "libraryImport": "my-lit-lib"
+        }
+      },
+      "outDir": "./src/generated/lit/csr"
+    }
+  ]
+}
+```
+
+For SSR-capable generation, set `"adapterPackage"` to `"@qwik-custom-elements/adapter-lit/ssr"` and point `"outDir"` to a separate SSR folder.
+
+Run `npx qwik-custom-elements` to generate Qwik wrappers from the Lit component library.
+
+## Support Policy
+
+This package follows semantic versioning. See [COMPATIBILITY.md](../../COMPATIBILITY.md) for tested combinations of adapter-lit, Qwik, Lit, `@lit-labs/ssr`, and Node.js.
+
+Breaking changes always include an explicit `BREAKING` section in the release notes and require an update to `COMPATIBILITY.md` before merging.
+
+## Ownership Boundary
+
+`@qwik-custom-elements/adapter-lit` owns Lit-specific generation behavior.
+
+That ownership includes:
+
+- Lit capability metadata
+- Lit SSR capability probing and SSR-specific output contracts
+- adapter-owned generated barrels, wrapper modules, and any Lit-specific generated helper modules
+- framework-specific output shape decisions that must not live in core
+
+Core may orchestrate the run and pass typed parsed component metadata into the adapter, but core should not shape Lit-generated output directly.
+
+## Current Exports
+
+This package currently exposes:
+
+- `@qwik-custom-elements/adapter-lit`
+  - Lit adapter metadata
+  - SSR capability probe wiring
+- `@qwik-custom-elements/adapter-lit/ssr`
+  - Lit SSR placeholder probe and SSR markup contract
+
+## Current Status
+
+Lit support is still an adapter-contract surface rather than a complete generated-wrapper implementation.
+
+Even so, the architectural boundary is already fixed: when Lit-generated wrappers or helper modules are emitted, they belong to this adapter rather than `@qwik-custom-elements/core`.
+
+## Documentation Expectations
+
+When Lit adapter contracts or generated output ownership change, update this README alongside the system decisions and findings logs.

package/dist/client/index.d.ts

@@ -0,0 +1,3 @@
+export { createLitCSRComponent, renderComponentCsrTag, type LitCSRProps, } from './lit-csr.js';
+export { createLitCSRClientSetup } from './lit-csr-client-setup.js';
+export { createLitSSRClientSetup } from './lit-ssr-client-setup.js';

package/dist/client/index.js

@@ -0,0 +1,3 @@
+export { createLitCSRComponent, renderComponentCsrTag, } from './lit-csr.js';
+export { createLitCSRClientSetup } from './lit-csr-client-setup.js';
+export { createLitSSRClientSetup } from './lit-ssr-client-setup.js';

package/dist/client/lit-csr-client-setup.d.ts

@@ -0,0 +1,11 @@
+import { type QRL } from '@builder.io/qwik';
+/**
+ * Creates a client-side setup hook for Lit CSR components.
+ *
+ * The returned hook registers a `readystatechange` listener that calls the
+ * provided QRL to load and define the custom elements. The setup is idempotent
+ * and runs at most once per page load, tracked via a `globalThis` marker.
+ *
+ * Call the returned hook inside a Qwik component to activate element loading.
+ */
+export declare function createLitCSRClientSetup(importLibraryQrl?: QRL<() => Promise<void>>): () => void;

package/dist/client/lit-csr-client-setup.js

@@ -0,0 +1,58 @@
+import { $, useOnDocument } from '@builder.io/qwik';
+const LIT_CSR_CLIENT_SETUP_DONE = '__qce_lit_csr_client_setup_done__';
+function ensureLitCSRClientSetup(importLibraryQrl) {
+    const markerTarget = globalThis;
+    const existingMarker = markerTarget[LIT_CSR_CLIENT_SETUP_DONE];
+    if (existingMarker === true) {
+        return Promise.resolve();
+    }
+    if (typeof existingMarker === 'object' &&
+        existingMarker !== null &&
+        'then' in existingMarker &&
+        typeof existingMarker.then === 'function') {
+        return existingMarker;
+    }
+    const setupPromise = (async () => {
+        if (importLibraryQrl) {
+            const fn = await importLibraryQrl.resolve();
+            await fn();
+        }
+    })();
+    markerTarget[LIT_CSR_CLIENT_SETUP_DONE] = setupPromise;
+    return setupPromise
+        .then(() => {
+        markerTarget[LIT_CSR_CLIENT_SETUP_DONE] = true;
+    })
+        .catch((error) => {
+        delete markerTarget[LIT_CSR_CLIENT_SETUP_DONE];
+        throw error;
+    });
+}
+async function executeLitCSRClientSetup(importLibraryQrl) {
+    await ensureLitCSRClientSetup(importLibraryQrl).catch((error) => {
+        console.error(error);
+    });
+}
+/**
+ * Creates a client-side setup hook for Lit CSR components.
+ *
+ * The returned hook registers a `readystatechange` listener that calls the
+ * provided QRL to load and define the custom elements. The setup is idempotent
+ * and runs at most once per page load, tracked via a `globalThis` marker.
+ *
+ * Call the returned hook inside a Qwik component to activate element loading.
+ */
+export function createLitCSRClientSetup(importLibraryQrl) {
+    const runSetup$ = $(async () => {
+        await executeLitCSRClientSetup(importLibraryQrl);
+    });
+    const useLitCSRClientSetup = () => {
+        useOnDocument('readystatechange', runSetup$);
+        // Also run immediately when mounted after the document is already past the
+        // loading state (client navigation or dev fast-refresh timing).
+        if (typeof document !== 'undefined' && document.readyState !== 'loading') {
+            void executeLitCSRClientSetup(importLibraryQrl);
+        }
+    };
+    return useLitCSRClientSetup;
+}

package/dist/client/lit-csr-props.d.ts

@@ -0,0 +1 @@
+export declare function updateLitCSRHostProps(host: HTMLElement | undefined, props: Record<string, unknown> | undefined): void;

package/dist/client/lit-csr-props.js

@@ -0,0 +1,17 @@
+const EVENT_PROP_PREFIX = 'on';
+const QRL_PRIVATE_PREFIX = '$';
+function isEventLikeProp(propName) {
+    return (propName.startsWith(EVENT_PROP_PREFIX) ||
+        propName.startsWith(QRL_PRIVATE_PREFIX));
+}
+export function updateLitCSRHostProps(host, props) {
+    if (!host || !props) {
+        return;
+    }
+    for (const [propName, propValue] of Object.entries(props)) {
+        if (isEventLikeProp(propName)) {
+            continue;
+        }
+        host[propName] = propValue;
+    }
+}

package/dist/client/lit-csr.d.ts

@@ -0,0 +1,12 @@
+import { type QRL } from '@builder.io/qwik';
+export declare function renderComponentCsrTag(options?: {
+    tagName?: unknown;
+}): string | null;
+export interface LitCSRProps {
+    tagName: string;
+    props?: Record<string, unknown>;
+    events?: Record<string, QRL<(...args: any[]) => void>>;
+    slots?: string[];
+    [key: string]: unknown;
+}
+export declare function createLitCSRComponent(): import("@builder.io/qwik").Component<LitCSRProps>;

package/dist/client/lit-csr.js

@@ -0,0 +1,140 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@builder.io/qwik/jsx-runtime";
+import { Slot, component$, useSignal, useVisibleTask$, } from '@builder.io/qwik';
+import { updateLitCSRHostProps } from './lit-csr-props.js';
+const EVENT_QRL_IDS = new WeakMap();
+let eventQrlIdCounter = 0;
+const PROP_VALUE_IDS = new WeakMap();
+let propValueIdCounter = 0;
+function createContractError(code, message) {
+    const error = new Error(message);
+    error.code = code;
+    return error;
+}
+export function renderComponentCsrTag(options = {}) {
+    if (options.tagName == null) {
+        return null;
+    }
+    if (typeof options.tagName !== 'string' ||
+        options.tagName.trim().length === 0) {
+        throw createContractError('QCE_LIT_RUNTIME_TAGNAME_INVALID', 'Lit CSR render contract requires options.tagName to be a non-empty string when provided.');
+    }
+    return options.tagName.trim();
+}
+function requireLitTagName(tagName) {
+    const normalizedTagName = renderComponentCsrTag({ tagName });
+    if (normalizedTagName == null) {
+        throw createContractError('QCE_LIT_RUNTIME_TAGNAME_INVALID', 'Lit CSR render contract requires options.tagName to be a non-empty string when provided.');
+    }
+    return normalizedTagName;
+}
+function getEventQrlId(qrl) {
+    if (!qrl || (typeof qrl !== 'object' && typeof qrl !== 'function')) {
+        return -1;
+    }
+    const qrlObject = qrl;
+    const existing = EVENT_QRL_IDS.get(qrlObject);
+    if (existing) {
+        return existing;
+    }
+    const next = ++eventQrlIdCounter;
+    EVENT_QRL_IDS.set(qrlObject, next);
+    return next;
+}
+function getEventEntries(events) {
+    return Object.entries(events ?? {}).filter(([eventName, eventQrl]) => eventName.trim().length > 0 && Boolean(eventQrl));
+}
+function getEventsDependencyKey(events) {
+    return getEventEntries(events)
+        .map(([eventName, eventQrl]) => `${eventName}:${getEventQrlId(eventQrl)}`)
+        .sort()
+        .join('|');
+}
+function getPropValueDependencyKey(value) {
+    if (value == null) {
+        return String(value);
+    }
+    if (typeof value !== 'object' && typeof value !== 'function') {
+        return `${typeof value}:${String(value)}`;
+    }
+    const valueObject = value;
+    const existing = PROP_VALUE_IDS.get(valueObject);
+    if (existing) {
+        return `ref:${existing}`;
+    }
+    const next = ++propValueIdCounter;
+    PROP_VALUE_IDS.set(valueObject, next);
+    return `ref:${next}`;
+}
+function getPropsDependencyKey(props) {
+    return Object.entries(props ?? {})
+        .map(([propName, propValue]) => `${propName}:${getPropValueDependencyKey(propValue)}`)
+        .sort()
+        .join('|');
+}
+export function createLitCSRComponent() {
+    return component$((inputProps) => {
+        const hostRef = useSignal();
+        const { tagName, props, events, slots, ...restProps } = inputProps;
+        const namedSlots = slots ?? [];
+        const normalizedTagName = requireLitTagName(tagName);
+        useVisibleTask$(({ track, cleanup }) => {
+            const host = track(() => hostRef.value);
+            const latestTagName = track(() => inputProps.tagName);
+            track(() => getPropsDependencyKey(props));
+            if (!host) {
+                return;
+            }
+            let disposed = false;
+            cleanup(() => {
+                disposed = true;
+            });
+            updateLitCSRHostProps(host, props);
+            const resolvedTagName = requireLitTagName(latestTagName);
+            void customElements.whenDefined(resolvedTagName).then(() => {
+                if (disposed) {
+                    return;
+                }
+                updateLitCSRHostProps(host, props);
+            });
+        });
+        useVisibleTask$(({ track, cleanup }) => {
+            const host = track(() => hostRef.value);
+            const eventsDependencyKey = track(() => getEventsDependencyKey(events));
+            if (!host) {
+                return;
+            }
+            const eventEntries = getEventEntries(events);
+            if (eventEntries.length === 0 || eventsDependencyKey.length === 0) {
+                return;
+            }
+            let disposed = false;
+            const listeners = [];
+            cleanup(() => {
+                disposed = true;
+                for (const { eventName, listener } of listeners) {
+                    host.removeEventListener(eventName, listener);
+                }
+            });
+            for (const [eventName, eventQrl] of eventEntries) {
+                const listener = (event) => {
+                    const qrl = eventQrl;
+                    const containerEl = host.closest('[q\\:container]');
+                    if (containerEl) {
+                        qrl.$setContainer$?.(containerEl);
+                    }
+                    const result = eventQrl(event, host);
+                    void Promise.resolve(result).catch((error) => {
+                        console.error(error);
+                    });
+                };
+                if (disposed) {
+                    return;
+                }
+                host.addEventListener(eventName, listener);
+                listeners.push({ eventName, listener });
+            }
+        });
+        const ElementTag = normalizedTagName;
+        return (_jsxs(ElementTag, { ref: hostRef, ...restProps, children: [_jsx(Slot, {}), namedSlots.map((name) => (_jsx("span", { slot: name, style: { display: 'contents' }, children: _jsx(Slot, { name: name }) }, name)))] }));
+    });
+}

package/dist/client/lit-ssr-client-setup.d.ts

@@ -0,0 +1,12 @@
+import { type QRL } from '@builder.io/qwik';
+/**
+ * Creates a client-side setup hook for Lit SSR components.
+ *
+ * The returned hook registers a `readystatechange` listener that:
+ * 1. Loads `@lit-labs/ssr-client/lit-element-hydrate-support.js` first so
+ *    existing Declarative Shadow DOM roots are reused instead of duplicated.
+ * 2. Then calls the provided QRL to load and define the custom elements.
+ *
+ * Call the returned hook inside a Qwik component to activate hydration.
+ */
+export declare function createLitSSRClientSetup(importLibraryQrl?: QRL<() => Promise<void>>): () => void;

package/dist/client/lit-ssr-client-setup.js

@@ -0,0 +1,63 @@
+import { $, useOnDocument } from '@builder.io/qwik';
+const LIT_SSR_CLIENT_SETUP_DONE = '__qce_lit_ssr_client_setup_done__';
+function ensureLitSSRClientSetup(importLibraryQrl) {
+    const markerTarget = globalThis;
+    const existingMarker = markerTarget[LIT_SSR_CLIENT_SETUP_DONE];
+    if (existingMarker === true) {
+        return Promise.resolve();
+    }
+    if (typeof existingMarker === 'object' &&
+        existingMarker !== null &&
+        'then' in existingMarker &&
+        typeof existingMarker.then === 'function') {
+        return existingMarker;
+    }
+    const setupPromise = (async () => {
+        // Must load hydrate-support BEFORE custom elements are defined so that
+        // Lit can reuse the existing Declarative Shadow DOM rather than
+        // re-rendering and producing a duplicate shadow tree.
+        await import('@qwik-custom-elements/adapter-lit/ssr-client');
+        if (importLibraryQrl) {
+            const fn = await importLibraryQrl.resolve();
+            await fn();
+        }
+    })();
+    markerTarget[LIT_SSR_CLIENT_SETUP_DONE] = setupPromise;
+    return setupPromise
+        .then(() => {
+        markerTarget[LIT_SSR_CLIENT_SETUP_DONE] = true;
+    })
+        .catch((error) => {
+        delete markerTarget[LIT_SSR_CLIENT_SETUP_DONE];
+        throw error;
+    });
+}
+async function executeLitSSRClientSetup(importLibraryQrl) {
+    await ensureLitSSRClientSetup(importLibraryQrl).catch((error) => {
+        console.error(error);
+    });
+}
+/**
+ * Creates a client-side setup hook for Lit SSR components.
+ *
+ * The returned hook registers a `readystatechange` listener that:
+ * 1. Loads `@lit-labs/ssr-client/lit-element-hydrate-support.js` first so
+ *    existing Declarative Shadow DOM roots are reused instead of duplicated.
+ * 2. Then calls the provided QRL to load and define the custom elements.
+ *
+ * Call the returned hook inside a Qwik component to activate hydration.
+ */
+export function createLitSSRClientSetup(importLibraryQrl) {
+    const runSetup$ = $(async () => {
+        await executeLitSSRClientSetup(importLibraryQrl);
+    });
+    const useLitSSRClientSetup = () => {
+        useOnDocument('readystatechange', runSetup$);
+        // Also run immediately when mounted after the document is already past the
+        // loading state (client navigation or dev fast-refresh timing).
+        if (typeof document !== 'undefined' && document.readyState !== 'loading') {
+            void executeLitSSRClientSetup(importLibraryQrl);
+        }
+    };
+    return useLitSSRClientSetup;
+}

package/dist/generated-output.d.ts

@@ -0,0 +1,38 @@
+interface CemComponentProp {
+    name: string;
+    type: string;
+    required: boolean;
+}
+interface CemComponentEvent {
+    name: string;
+    type: string;
+}
+interface CemComponentSlot {
+    name: string;
+}
+interface CemComponentDefinition {
+    tagName: string;
+    props: CemComponentProp[];
+    events: CemComponentEvent[];
+    slots: CemComponentSlot[];
+}
+interface CreateGeneratedOutputInput {
+    projectId?: string;
+    libraryName?: string;
+    componentDefinitions?: CemComponentDefinition[];
+    runtimeImports?: {
+        /**
+         * Import specifier for the Lit component library. When provided, the
+         * generated SSR runtime will include this import so custom element classes
+         * are registered before `@lit-labs/ssr` renders them server-side.
+         */
+        libraryImport?: string;
+    };
+    ssrAvailable?: boolean;
+}
+type CreateLitPlannedWritesOptions = CreateGeneratedOutputInput;
+export declare function createLitPlannedWrites({ projectId, libraryName, componentDefinitions, runtimeImports, ssrAvailable, }: CreateLitPlannedWritesOptions): Array<{
+    relativePath: string;
+    content: string;
+}>;
+export {};

package/dist/generated-output.js

@@ -0,0 +1,226 @@
+export function createLitPlannedWrites({ projectId, libraryName, componentDefinitions, runtimeImports, ssrAvailable, }) {
+    const componentTags = (componentDefinitions ?? []).map((componentDefinition) => componentDefinition.tagName);
+    const plannedWrites = [
+        {
+            relativePath: 'index.ts',
+            content: renderGeneratedIndex(projectId, componentTags, ssrAvailable),
+        },
+    ];
+    if (ssrAvailable === true) {
+        plannedWrites.push({
+            relativePath: 'runtime.ts',
+            content: renderRuntimeBarrelModule(projectId, true),
+        }, {
+            relativePath: 'runtime-ssr.generated.ts',
+            content: renderServerRuntimeModule(projectId, libraryName, runtimeImports?.libraryImport),
+        });
+    }
+    else {
+        plannedWrites.push({
+            relativePath: 'runtime.ts',
+            content: renderRuntimeBarrelModule(projectId, false),
+        }, {
+            relativePath: 'runtime-csr.generated.ts',
+            content: renderClientRuntimeModule(projectId, libraryName, runtimeImports?.libraryImport),
+        });
+    }
+    plannedWrites.push(...componentTags.map((componentTag) => ({
+        relativePath: renderComponentWrapperRelativePath(componentTag, ssrAvailable),
+        content: renderComponentWrapper({
+            projectId,
+            libraryName,
+            componentDefinition: normalizeComponentDefinition(componentTag, (componentDefinitions ?? []).find((definition) => definition.tagName === componentTag)),
+            ssrAvailable,
+        }),
+    })));
+    return plannedWrites;
+}
+function renderGeneratedIndex(projectId, componentTags, ssrAvailable) {
+    const mode = ssrAvailable === true ? 'ssr' : 'csr';
+    const exportLines = componentTags.map((componentTag) => `export { ${toWrapperName(componentTag)} } from './${componentTag}';`);
+    return [
+        `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? 'unknown'}.`,
+        '// Do not edit this file directly. Use a manual extension layer.',
+        '',
+        `export const generatedComponentTags = ${JSON.stringify(componentTags)} as const;`,
+        `export const generatedMode = '${mode}' as const;`,
+        ...exportLines,
+        '',
+    ].join('\n');
+}
+function renderComponentWrapper(input) {
+    const { projectId, libraryName, componentDefinition, ssrAvailable } = input;
+    const { tagName: componentTag } = componentDefinition;
+    const wrapperName = toWrapperName(componentTag);
+    const ssrBridgeName = toBridgeComponentName(libraryName, 'SSR', 'GeneratedLitComponent');
+    const csrBridgeName = toBridgeComponentName(libraryName, 'CSR', 'GeneratedLitCSRComponent');
+    const bridgeName = ssrAvailable === true ? ssrBridgeName : csrBridgeName;
+    const lines = [
+        `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? 'unknown'}.`,
+        '// Do not edit this file directly. Use a manual extension layer.',
+    ];
+    lines.push('', "import { Slot, component$ } from '@builder.io/qwik';");
+    if (componentDefinition.events.length > 0) {
+        lines.push("import type { QRL } from '@builder.io/qwik';");
+    }
+    lines.push(`import { ${bridgeName} } from './runtime';`, '');
+    const propsTypeName = `${wrapperName}Props`;
+    const propLines = componentDefinition.props.map((prop) => {
+        const key = isValidIdentifier(prop.name) ? prop.name : `'${prop.name}'`;
+        const optionalToken = prop.required ? '' : '?';
+        return `  ${key}${optionalToken}: ${prop.type};`;
+    });
+    const eventPropLines = componentDefinition.events.map((event) => `  ${toEventPropName(event.name)}?: QRL<(event: ${event.type}) => void>;`);
+    propLines.push(...eventPropLines, '  [key: string]: unknown;');
+    const slotLines = [
+        '      <Slot />',
+        ...componentDefinition.slots.map((slot) => `      <span q:slot=${JSON.stringify(slot.name)} style={{ display: 'contents' }}>\n        <Slot name=${JSON.stringify(slot.name)} />\n      </span>`),
+    ];
+    const slotListToken = componentDefinition.slots.length > 0
+        ? JSON.stringify(componentDefinition.slots.map((slot) => slot.name))
+        : 'undefined';
+    const splitPropsLines = [
+        '  const isEventBindingKey = (key: string) =>',
+        "    /^on[A-Z].*\\$$/.test(key) || key.includes(':');",
+        '  const eventProps: Record<string, unknown> = {};',
+        '  const elementProps: Record<string, unknown> = {};',
+        '',
+        '  for (const [key, value] of Object.entries(props as Record<string, unknown>)) {',
+        "    if (key === 'children') {",
+        '      continue;',
+        '    }',
+        '',
+        '    if (isEventBindingKey(key)) {',
+        '      eventProps[key] = value;',
+        '      continue;',
+        '    }',
+        '',
+        '    elementProps[key] = value;',
+        '  }',
+    ];
+    const mappedEventLines = componentDefinition.events.length > 0
+        ? [
+            '',
+            `  const mappedEventPropKeys = new Set(${JSON.stringify(componentDefinition.events.map((event) => toEventPropName(event.name)))});`,
+            '  const passthroughEventProps = Object.fromEntries(',
+            '    Object.entries(eventProps).filter(',
+            '      ([key]) => !mappedEventPropKeys.has(key),',
+            '    ),',
+            '  );',
+            '',
+            '  const events: Record<string, QRL<(...args: any[]) => void>> = {};',
+            ...componentDefinition.events.map((event) => `  if (props.${toEventPropName(event.name)}) { events['${event.name}'] = props.${toEventPropName(event.name)}; }`),
+            '  const mappedEvents = Object.keys(events).length > 0 ? events : undefined;',
+        ]
+        : [
+            '',
+            '  const passthroughEventProps = eventProps;',
+            '  const mappedEvents = undefined;',
+        ];
+    lines.push(`export interface ${propsTypeName} {`, ...propLines, '}', '', `export const ${wrapperName} = component$<${propsTypeName}>((props) => {`, ...splitPropsLines, ...mappedEventLines, '', '  return (', `    <${bridgeName}`, `      tagName=${JSON.stringify(componentTag)}`, '      props={elementProps}', '      events={mappedEvents}', `      slots={${slotListToken}}`, '      {...passthroughEventProps}', '    >', ...slotLines, `    </${bridgeName}>`, '  );', '});');
+    lines.push('');
+    return lines.join('\n');
+}
+function renderComponentWrapperRelativePath(componentTag, _ssrAvailable) {
+    return `${componentTag}.tsx`;
+}
+function renderRuntimeBarrelModule(projectId, ssrAvailable) {
+    const runtimeExportLine = ssrAvailable
+        ? "export * from './runtime-ssr.generated';"
+        : "export * from './runtime-csr.generated';";
+    return [
+        `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? 'unknown'}.`,
+        '// Do not edit this file directly. Use a manual extension layer.',
+        '',
+        runtimeExportLine,
+        '',
+    ].join('\n');
+}
+function renderClientRuntimeModule(projectId, libraryName, libraryImport) {
+    const csrBridgeName = toBridgeComponentName(libraryName, 'CSR', 'GeneratedLitCSRComponent');
+    const clientSetupName = toCsrClientSetupHookName(libraryName);
+    const hasLibraryImport = libraryImport !== undefined && libraryImport.trim().length > 0;
+    const lines = [
+        `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? 'unknown'}.`,
+        '// Do not edit this file directly. Use a manual extension layer.',
+        '',
+    ];
+    if (hasLibraryImport) {
+        lines.push("import { $ } from '@builder.io/qwik';");
+        lines.push(`import { createLitCSRClientSetup, createLitCSRComponent } from '@qwik-custom-elements/adapter-lit/client';`);
+    }
+    else {
+        lines.push("import { createLitCSRComponent } from '@qwik-custom-elements/adapter-lit/client';");
+    }
+    if (hasLibraryImport) {
+        lines.push('', `const importLibrary = async (): Promise<void> => {`, `  await import('${libraryImport}');`, `};`, `const importLibraryQrl = $(importLibrary);`, `export const ${clientSetupName} = createLitCSRClientSetup(importLibraryQrl);`);
+    }
+    lines.push('', `export const ${csrBridgeName} = createLitCSRComponent();`, '');
+    return lines.join('\n');
+}
+function renderServerRuntimeModule(projectId, libraryName, libraryImport) {
+    const ssrBridgeName = toBridgeComponentName(libraryName, 'SSR', 'GeneratedLitComponent');
+    const clientSetupName = toClientSetupHookName(libraryName);
+    const hasLibraryImport = libraryImport !== undefined && libraryImport.trim().length > 0;
+    const lines = [
+        `// Generated by @qwik-custom-elements/core. Project: ${projectId ?? 'unknown'}.`,
+        '// Do not edit this file directly. Use a manual extension layer.',
+        '',
+    ];
+    if (hasLibraryImport) {
+        lines.push("import { $ } from '@builder.io/qwik';");
+        lines.push("import { createLitSSRClientSetup } from '@qwik-custom-elements/adapter-lit/client';");
+    }
+    lines.push("import { createLitSSRComponent } from '@qwik-custom-elements/adapter-lit/ssr';");
+    if (hasLibraryImport) {
+        lines.push(`// Register Lit element classes for server-side rendering.`, `import '${libraryImport}';`, '', `const importLibrary = async (): Promise<void> => {`, `  await import('${libraryImport}');`, `};`, `const importLibraryQrl = $(importLibrary);`, `export const ${clientSetupName} = createLitSSRClientSetup(importLibraryQrl);`);
+    }
+    lines.push('', `export const ${ssrBridgeName} = createLitSSRComponent();`, '');
+    return lines.join('\n');
+}
+function toClientSetupHookName(libraryName) {
+    if (!libraryName || libraryName.trim().length === 0) {
+        return 'useLitSSRClientSetup';
+    }
+    return `use${toPascalCase(libraryName)}SSRClientSetup`;
+}
+function toCsrClientSetupHookName(libraryName) {
+    if (!libraryName || libraryName.trim().length === 0) {
+        return 'useLitCSRClientSetup';
+    }
+    return `use${toPascalCase(libraryName)}CSRClientSetup`;
+}
+function toPascalCase(name) {
+    return name
+        .split(/[-_]/)
+        .filter((p) => p.length > 0)
+        .map((part) => `${part.charAt(0).toUpperCase()}${part.slice(1)}`)
+        .join('');
+}
+function isValidIdentifier(value) {
+    return /^[A-Za-z_$][A-Za-z0-9_$]*$/.test(value);
+}
+function toEventPropName(eventName) {
+    return `on${toPascalCase(eventName)}$`;
+}
+function normalizeComponentDefinition(componentTag, input) {
+    return {
+        tagName: input?.tagName ?? componentTag,
+        props: input?.props ?? [],
+        events: input?.events ?? [],
+        slots: input?.slots ?? [],
+    };
+}
+function toBridgeComponentName(libraryName, mode, fallback) {
+    if (!libraryName || libraryName.trim().length === 0) {
+        return fallback;
+    }
+    return `${toPascalCase(libraryName)}${mode}BridgeComponent`;
+}
+function toWrapperName(componentTag) {
+    const parts = componentTag.split('-').filter((part) => part.length > 0);
+    const normalizedName = parts
+        .map((part) => `${part.charAt(0).toUpperCase()}${part.slice(1)}`)
+        .join('');
+    return `Qwik${normalizedName}`;
+}

package/dist/index.d.ts

@@ -0,0 +1,46 @@
+export declare const metadata: {
+    adapterId: string;
+    supportedSourceTypes: string[];
+    supportsSsrProbe: boolean;
+    ssrRuntimeSubpath: string;
+};
+interface ResolveRuntimeImportsInput {
+    source: {
+        type: 'CEM' | 'PACKAGE_NAME';
+        packageName?: string;
+    };
+    adapterOptions?: Record<string, unknown>;
+}
+export declare function resolveRuntimeImports({ source, adapterOptions, }: ResolveRuntimeImportsInput): Promise<{
+    libraryImport?: string;
+}>;
+export declare function probeSSR(): Promise<{
+    available: boolean;
+}>;
+export declare function createGeneratedOutput(input: {
+    projectId?: string;
+    libraryName?: string;
+    componentDefinitions?: Array<{
+        tagName: string;
+        props: Array<{
+            name: string;
+            type: string;
+            required: boolean;
+        }>;
+        events: Array<{
+            name: string;
+            type: string;
+        }>;
+        slots: Array<{
+            name: string;
+        }>;
+    }>;
+    runtimeImports?: {
+        libraryImport?: string;
+    };
+    ssrAvailable?: boolean;
+}): Array<{
+    relativePath: string;
+    content: string;
+}>;
+export {};

package/dist/index.js

@@ -0,0 +1,34 @@
+import { createLitPlannedWrites } from './generated-output.js';
+export const metadata = {
+    adapterId: 'lit',
+    supportedSourceTypes: ['CEM', 'PACKAGE_NAME'],
+    supportsSsrProbe: true,
+    ssrRuntimeSubpath: './ssr',
+};
+export async function resolveRuntimeImports({ source, adapterOptions, }) {
+    const runtime = typeof adapterOptions?.runtime === 'object' &&
+        adapterOptions.runtime !== null &&
+        !Array.isArray(adapterOptions.runtime)
+        ? adapterOptions.runtime
+        : undefined;
+    const libraryImportOverride = typeof runtime?.libraryImport === 'string' &&
+        runtime.libraryImport.trim().length > 0
+        ? runtime.libraryImport
+        : undefined;
+    if (source.type === 'CEM') {
+        return libraryImportOverride != null
+            ? { libraryImport: libraryImportOverride }
+            : {};
+    }
+    const packageName = source.packageName;
+    if (typeof packageName !== 'string' || packageName.trim().length === 0) {
+        return {};
+    }
+    return { libraryImport: libraryImportOverride ?? packageName };
+}
+export async function probeSSR() {
+    return { available: false };
+}
+export function createGeneratedOutput(input) {
+    return createLitPlannedWrites(input);
+}

package/dist/ssr/index.d.ts

@@ -0,0 +1,66 @@
+import '@lit-labs/ssr-client/lit-element-hydrate-support.js';
+import { createLitSSRComponent } from './lit-ssr.js';
+export declare const metadata: {
+    adapterId: string;
+    supportedSourceTypes: string[];
+    supportsSsrProbe: boolean;
+    ssrRuntimeSubpath: string;
+};
+interface ValidateProjectInput {
+    source: {
+        type: 'CEM' | 'PACKAGE_NAME';
+        packageName?: string;
+    };
+    adapterOptions?: Record<string, unknown>;
+}
+interface ResolveRuntimeImportsInput extends ValidateProjectInput {
+    runtimeResolution?: {
+        resolveImportSpecifier?: (specifier: string, packageRoot?: string) => string;
+        resolveSourcePackageRoot?: (packageName: string) => string;
+    };
+}
+interface ProbeSsrInput {
+    runtimeImports?: {
+        libraryImport?: unknown;
+    };
+}
+export type { LitSSRProps } from './lit-ssr.js';
+export declare function validateProject({ source, adapterOptions, }: ValidateProjectInput): void;
+export declare function resolveRuntimeImports({ source, adapterOptions, runtimeResolution, }: ResolveRuntimeImportsInput): Promise<{
+    libraryImport?: string;
+}>;
+export declare function probeSSR(_input?: ProbeSsrInput): Promise<{
+    available: boolean;
+}>;
+export declare function renderComponentSsrHtml(options?: {
+    tagName?: unknown;
+    props?: Record<string, unknown>;
+}): string | null;
+export type LitGeneratedSsrComponent = ReturnType<typeof createLitSSRComponent>;
+export { createLitSSRComponent };
+export declare function createGeneratedOutput(input: {
+    projectId?: string;
+    libraryName?: string;
+    componentDefinitions?: Array<{
+        tagName: string;
+        props: Array<{
+            name: string;
+            type: string;
+            required: boolean;
+        }>;
+        events: Array<{
+            name: string;
+            type: string;
+        }>;
+        slots: Array<{
+            name: string;
+        }>;
+    }>;
+    runtimeImports?: {
+        libraryImport?: string;
+    };
+    ssrAvailable?: boolean;
+}): Array<{
+    relativePath: string;
+    content: string;
+}>;

package/dist/ssr/index.js

@@ -0,0 +1,103 @@
+import '@lit-labs/ssr-client/lit-element-hydrate-support.js';
+import { createLitPlannedWrites } from '../generated-output.js';
+import { createLitSSRComponent } from './lit-ssr.js';
+export const metadata = {
+    adapterId: 'lit',
+    supportedSourceTypes: ['CEM', 'PACKAGE_NAME'],
+    supportsSsrProbe: true,
+    ssrRuntimeSubpath: './ssr',
+};
+export function validateProject({ source, adapterOptions, }) {
+    const runtime = isRecord(adapterOptions?.runtime)
+        ? adapterOptions.runtime
+        : undefined;
+    validateOptionalRuntimeOverride(runtime, 'libraryImport', 'QCE_LIT_RUNTIME_LIBRARY_IMPORT_OVERRIDE_INVALID', `Lit ${source.type} projects must provide a non-empty adapterOptions.runtime.libraryImport override when the override is set.`);
+}
+export async function resolveRuntimeImports({ source, adapterOptions, runtimeResolution, }) {
+    const runtime = isRecord(adapterOptions?.runtime)
+        ? adapterOptions.runtime
+        : undefined;
+    const libraryImportOverride = validateOptionalRuntimeOverride(runtime, 'libraryImport', 'QCE_LIT_RUNTIME_LIBRARY_IMPORT_OVERRIDE_INVALID', `Lit ${source.type} projects must provide a non-empty adapterOptions.runtime.libraryImport override when the override is set.`);
+    if (source.type === 'CEM') {
+        return libraryImportOverride != null
+            ? { libraryImport: libraryImportOverride }
+            : {};
+    }
+    const packageName = source.packageName;
+    if (typeof packageName !== 'string' || packageName.trim().length === 0) {
+        throw createContractError('QCE_LIT_RUNTIME_LIBRARY_IMPORT_REQUIRED', 'Lit PACKAGE_NAME projects must provide source.packageName or adapterOptions.runtime.libraryImport.');
+    }
+    const rawLibraryImport = libraryImportOverride ?? packageName;
+    const libraryImport = runtimeResolution?.resolveImportSpecifier != null
+        ? runtimeResolution.resolveImportSpecifier(rawLibraryImport, runtimeResolution.resolveSourcePackageRoot?.(packageName))
+        : rawLibraryImport;
+    return { libraryImport };
+}
+export async function probeSSR(_input = {}) {
+    // SSR is available whenever the Lit SSR adapter subpath can be loaded.
+    // @lit-labs/ssr-client/lit-element-hydrate-support.js is imported at module
+    // load time above — if this module resolves, the hydration infrastructure is
+    // ready. libraryImport is optional and only affects whether the library is
+    // pre-registered before server rendering.
+    return { available: true };
+}
+export function renderComponentSsrHtml(options = {}) {
+    // Keep fallback and hard-failure deterministic for contract tests.
+    if (options.tagName == null) {
+        return null;
+    }
+    if (typeof options.tagName !== 'string' ||
+        options.tagName.trim().length === 0) {
+        throw createContractError('QCE_LIT_RUNTIME_TAGNAME_INVALID', 'Lit SSR render contract requires options.tagName to be a non-empty string when provided.');
+    }
+    const tagName = options.tagName.trim();
+    const serializedProps = serializePropsForHtml(options.props ?? {});
+    const openingTag = serializedProps.length
+        ? `<${tagName} ${serializedProps}>`
+        : `<${tagName}>`;
+    return `${openingTag}</${tagName}>`;
+}
+export { createLitSSRComponent };
+function isRecord(value) {
+    return typeof value === 'object' && value !== null && !Array.isArray(value);
+}
+function isNonEmptyString(value) {
+    return typeof value === 'string' && value.trim().length > 0;
+}
+function validateOptionalRuntimeOverride(runtime, field, errorCode, errorMessage) {
+    if (!isRecord(runtime) || !(field in runtime)) {
+        return undefined;
+    }
+    const value = runtime[field];
+    if (!isNonEmptyString(value)) {
+        throw createContractError(errorCode, errorMessage);
+    }
+    return value;
+}
+function createContractError(code, message) {
+    const error = new Error(message);
+    error.code = code;
+    return error;
+}
+export function createGeneratedOutput(input) {
+    return createLitPlannedWrites(input);
+}
+function serializePropsForHtml(props) {
+    return Object.entries(props)
+        .filter(([key, value]) => key.trim().length > 0 && isSerializableValue(value))
+        .map(([key, value]) => {
+        if (value === true) {
+            return key;
+        }
+        return `${key}=${JSON.stringify(String(value))}`;
+    })
+        .join(' ');
+}
+function isSerializableValue(value) {
+    if (value == null) {
+        return false;
+    }
+    return (typeof value === 'string' ||
+        typeof value === 'number' ||
+        typeof value === 'boolean');
+}

package/dist/ssr/lit-ssr.d.ts

@@ -0,0 +1,22 @@
+import { type QRL } from '@builder.io/qwik';
+export interface LitSSRProps {
+    tagName: string;
+    props?: Record<string, unknown>;
+    /**
+     * Optional custom-event names exposed by the Lit element.
+     * Keys are native event names; values are Qwik QRL handlers.
+     */
+    events?: Record<string, QRL<(...args: any[]) => void>>;
+    /**
+     * Named slot names exposed by the Lit element (not including the default slot).
+     */
+    slots?: string[];
+    [key: string]: unknown;
+}
+/**
+ * Creates a Qwik component that renders a Lit custom element with SSR support.
+ * On the server, uses `@lit-labs/ssr` to render the element with its shadow DOM
+ * as declarative shadow DOM (DSD). On the client, the element self-hydrates and
+ * Qwik wires props and events.
+ */
+export declare function createLitSSRComponent(): import("@builder.io/qwik").Component<LitSSRProps>;

package/dist/ssr/lit-ssr.js

@@ -0,0 +1,171 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@builder.io/qwik/jsx-runtime";
+import { $, component$, isBrowser, isServer, Slot, SSRRaw, SSRStream, useId, useOnDocument, useSignal, useTask$, } from '@builder.io/qwik';
+import { updateLitCSRHostProps } from '../client/lit-csr-props.js';
+const EVENT_QRL_IDS = new WeakMap();
+let eventQrlIdCounter = 0;
+function getEventQrlId(qrl) {
+    if (!qrl || (typeof qrl !== 'object' && typeof qrl !== 'function')) {
+        return -1;
+    }
+    const qrlObj = qrl;
+    const existing = EVENT_QRL_IDS.get(qrlObj);
+    if (existing) {
+        return existing;
+    }
+    const next = ++eventQrlIdCounter;
+    EVENT_QRL_IDS.set(qrlObj, next);
+    return next;
+}
+function getEventEntries(events) {
+    return Object.entries(events ?? {}).filter(([eventName, eventQrl]) => eventName.trim().length > 0 && Boolean(eventQrl));
+}
+function getEventsDependencyKey(events) {
+    return getEventEntries(events)
+        .map(([eventName, eventQrl]) => `${eventName}:${getEventQrlId(eventQrl)}`)
+        .sort()
+        .join('|');
+}
+function getWrapperElement(wrapperId) {
+    if (!isBrowser)
+        return undefined;
+    return (document.querySelector(`[data-lit-wrapper-id="${wrapperId}"]`) ?? undefined);
+}
+function getLitElement(wrapper, tagName) {
+    return wrapper?.querySelector(tagName) ?? undefined;
+}
+function serializePropsToAttributes(props) {
+    return Object.entries(props)
+        .filter(([key, value]) => key.trim().length > 0 && isSerializableAttributeValue(value))
+        .map(([key, value]) => {
+        if (value === true) {
+            return key;
+        }
+        return `${key}=${JSON.stringify(String(value))}`;
+    })
+        .join(' ');
+}
+function isSerializableAttributeValue(value) {
+    if (value == null) {
+        return false;
+    }
+    return (typeof value === 'string' ||
+        typeof value === 'number' ||
+        typeof value === 'boolean');
+}
+/**
+ * Creates a Qwik component that renders a Lit custom element with SSR support.
+ * On the server, uses `@lit-labs/ssr` to render the element with its shadow DOM
+ * as declarative shadow DOM (DSD). On the client, the element self-hydrates and
+ * Qwik wires props and events.
+ */
+export function createLitSSRComponent() {
+    return component$(({ tagName, props, events, slots, ...restProps }) => {
+        const wrapperRef = useSignal(undefined);
+        const wrapperId = useId();
+        const clientReady = useSignal(false);
+        const namedSlots = slots ?? [];
+        useOnDocument('qinit', $(() => {
+            clientReady.value = true;
+        }));
+        // Sync props to the Lit element on the client whenever they change.
+        useTask$(({ track }) => {
+            const trackedProps = track(() => props);
+            if (!isBrowser)
+                return;
+            const wrapper = getWrapperElement(wrapperId) ?? wrapperRef.value;
+            const litEl = getLitElement(wrapper, tagName);
+            updateLitCSRHostProps(litEl, trackedProps);
+        });
+        // Wire event listeners after the client is ready (post-qinit).
+        useTask$(({ cleanup, track }) => {
+            const ready = track(() => clientReady.value);
+            const eventsDependencyKey = track(() => getEventsDependencyKey(events));
+            if (!isBrowser || !ready)
+                return;
+            const wrapper = getWrapperElement(wrapperId) ?? wrapperRef.value;
+            const litEl = getLitElement(wrapper, tagName);
+            const eventEntries = getEventEntries(events);
+            if (!litEl ||
+                eventEntries.length === 0 ||
+                eventsDependencyKey.length === 0) {
+                return;
+            }
+            let disposed = false;
+            const listeners = [];
+            cleanup(() => {
+                disposed = true;
+                for (const { eventName, listener } of listeners) {
+                    litEl.removeEventListener(eventName, listener);
+                }
+            });
+            for (const [eventName, eventQrl] of eventEntries) {
+                const listener = (event) => {
+                    const qrl = eventQrl;
+                    const containerEl = litEl.closest('[q\\:container]');
+                    if (containerEl) {
+                        qrl.$setContainer$?.(containerEl);
+                    }
+                    void Promise.resolve(eventQrl(event, litEl)).catch(console.error);
+                };
+                if (disposed)
+                    return;
+                litEl.addEventListener(eventName, listener);
+                listeners.push({ eventName, listener });
+            }
+        });
+        if (isServer) {
+            return (_jsx("div", { ref: wrapperRef, "data-lit-wrapper-id": wrapperId, style: { display: 'contents' }, ...restProps, children: _jsx(SSRStream, { children: async function* () {
+                        // Dynamic imports ensure these server-only packages are not
+                        // bundled into client code.
+                        const { render } = await import('@lit-labs/ssr');
+                        const { html } = await import('lit');
+                        const propsHtml = serializePropsToAttributes(props ?? {});
+                        const staticTemplate = propsHtml
+                            ? `<${tagName} ${propsHtml}></${tagName}>`
+                            : `<${tagName}></${tagName}>`;
+                        // Build a TemplateResult from a static string so @lit-labs/ssr
+                        // can invoke registered element renderers and produce DSD.
+                        // unsafeHTML() bypasses element renderer lookup; calling html()
+                        // directly with a static-strings array does not.
+                        const strings = Object.assign([staticTemplate], {
+                            raw: [staticTemplate],
+                        });
+                        // Collect the full SSR output from @lit-labs/ssr.
+                        let fullHtml = '';
+                        for (const chunk of render(html(strings))) {
+                            fullHtml += String(chunk);
+                        }
+                        // Inject Qwik slot content as light-DOM children of the element
+                        // (before the closing tag) so the shadow DOM <slot> outlets
+                        // can pick them up after client hydration.
+                        const closingTag = `</${tagName}>`;
+                        const closingTagIdx = fullHtml.lastIndexOf(closingTag);
+                        if (closingTagIdx === -1) {
+                            // No closing tag found — emit as-is and append slot content.
+                            yield _jsx(SSRRaw, { data: fullHtml });
+                            yield _jsx(Slot, {});
+                            for (const slotName of namedSlots) {
+                                yield (_jsx("span", { slot: slotName, style: { display: 'contents' }, children: _jsx(Slot, { name: slotName }) }));
+                            }
+                        }
+                        else {
+                            // Emit everything before the closing tag.
+                            yield _jsx(SSRRaw, { data: fullHtml.slice(0, closingTagIdx) });
+                            // Project default and named slot content.
+                            yield _jsx(Slot, {});
+                            for (const slotName of namedSlots) {
+                                yield (_jsx("span", { slot: slotName, style: { display: 'contents' }, children: _jsx(Slot, { name: slotName }) }));
+                            }
+                            // Emit the closing tag.
+                            yield _jsx(SSRRaw, { data: closingTag });
+                        }
+                    } }) }));
+        }
+        const HostTag = tagName;
+        // Client path: the Lit element is already present in the DOM from SSR and
+        // will self-hydrate using the declarative shadow DOM. Render the same host
+        // custom element shape as SSR so Qwik reconciliation keeps slot content
+        // inside the element across signal-driven rerenders.
+        return (_jsx("div", { ref: wrapperRef, "data-lit-wrapper-id": wrapperId, style: { display: 'contents' }, ...restProps, children: _jsxs(HostTag, { children: [_jsx(Slot, {}), namedSlots.map((name) => (_jsx("span", { slot: name, style: { display: 'contents' }, children: _jsx(Slot, { name: name }) }, name)))] }) }));
+    });
+}

package/dist/ssr-client.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Client-side Lit SSR hydration support.
+ *
+ * Import this module (or ensure it is evaluated) **before** any Lit custom
+ * elements are defined via `customElements.define()`. It patches `LitElement`
+ * so that elements whose shadow root was already created from a Declarative
+ * Shadow DOM (DSD) template — produced by `@lit-labs/ssr` on the server — are
+ * hydrated in place rather than being re-rendered from scratch.
+ *
+ * Without this patch, Lit's first `performUpdate()` call appends a fresh render
+ * tree alongside the existing DSD content, producing a duplicate shadow DOM
+ * (e.g., two `.de-alert` divs visible to the user).
+ */
+import '@lit-labs/ssr-client/lit-element-hydrate-support.js';

package/dist/ssr-client.js

@@ -0,0 +1,14 @@
+/**
+ * Client-side Lit SSR hydration support.
+ *
+ * Import this module (or ensure it is evaluated) **before** any Lit custom
+ * elements are defined via `customElements.define()`. It patches `LitElement`
+ * so that elements whose shadow root was already created from a Declarative
+ * Shadow DOM (DSD) template — produced by `@lit-labs/ssr` on the server — are
+ * hydrated in place rather than being re-rendered from scratch.
+ *
+ * Without this patch, Lit's first `performUpdate()` call appends a fresh render
+ * tree alongside the existing DSD content, producing a duplicate shadow DOM
+ * (e.g., two `.de-alert` divs visible to the user).
+ */
+import '@lit-labs/ssr-client/lit-element-hydrate-support.js';

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@qwik-custom-elements/adapter-lit",
+  "version": "1.0.0",
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./client": {
+      "types": "./dist/client/index.d.ts",
+      "import": "./dist/client/index.js"
+    },
+    "./ssr": {
+      "types": "./dist/ssr/index.d.ts",
+      "import": "./dist/ssr/index.js"
+    },
+    "./ssr-client": {
+      "types": "./dist/ssr-client.d.ts",
+      "import": "./dist/ssr-client.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "@builder.io/qwik": "^1.19.2",
+    "@lit-labs/ssr": ">=4.0.0",
+    "@lit-labs/ssr-client": ">=1.1.0",
+    "lit": ">=3.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@lit-labs/ssr": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@builder.io/qwik": "^1.19.2",
+    "@lit-labs/ssr": "^4.0.0",
+    "@lit-labs/ssr-client": "^1.1.8",
+    "lit": "^3.3.2",
+    "typescript": "^5.9.3",
+    "vitest": "^3.2.4"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json",
+    "check-types": "tsc -p tsconfig.build.json --noEmit && tsc -p tsconfig.test.json --noEmit",
+    "dev": "tsc -p tsconfig.build.json --watch",
+    "format": "prettier --write . --config ../../.prettierrc.json --ignore-path ../../.prettierignore",
+    "format:check": "prettier --check . --config ../../.prettierrc.json --ignore-path ../../.prettierignore",
+    "lint": "eslint \"**/*.{js,mjs,cjs,ts,mts,cts,tsx}\" --no-error-on-unmatched-pattern",
+    "e2e": "node -e \"console.log('adapter-lit e2e noop')\"",
+    "test": "vitest run"
+  }
+}