@stencil/react-output-target/dist/runtime/ssr.d.ts

React output target for @stencil/core components.

import { EventName, Options, ReactWebComponent } from '@lit/react';

type EventNames = Record<string, EventName | string>;
export type SerializeShadowRootOptions = 'declarative-shadow-dom' | 'scoped' | {
    'declarative-shadow-dom'?: string[];
    scoped?: string[];
    default: 'declarative-shadow-dom' | 'scoped';
} | boolean;
/**
 * these types are defined by a Stencil hydrate app so we have to copy the minimal types here
 */
export interface RenderToStringOptions {
    fullDocument?: boolean;
    prettyHtml?: boolean;
    /**
     * Configure how Stencil serializes the components shadow root.
     * - If set to `declarative-shadow-dom` the component will be rendered within a Declarative Shadow DOM.
     * - If set to `scoped` Stencil will render the contents of the shadow root as a `scoped: true` component
     *   and the shadow DOM will be created during client-side hydration.
     * - Alternatively you can mix and match the two by providing an object with `declarative-shadow-dom` and `scoped` keys,
     * the value arrays containing the tag names of the components that should be rendered in that mode.
     *
     * Examples:
     * - `{ 'declarative-shadow-dom': ['my-component-1', 'another-component'], default: 'scoped' }`
     * Render all components as `scoped` apart from `my-component-1` and `another-component`
     * -  `{ 'scoped': ['an-option-component'], default: 'declarative-shadow-dom' }`
     * Render all components within `declarative-shadow-dom` apart from `an-option-component`
     * - `'scoped'` Render all components as `scoped`
     * - `false` disables shadow root serialization
     *
     * *NOTE* `true` has been deprecated in favor of `declarative-shadow-dom` and `scoped`
     * @default 'declarative-shadow-dom'
     */
    serializeShadowRoot?: SerializeShadowRootOptions;
}
type RenderToString = (html: string, options: RenderToStringOptions) => Promise<{
    html: string | null;
}>;
export type HydrateModule = {
    renderToString: RenderToString;
    serializeProperty: (value: any) => string;
};
/**
 * Defines a custom element and creates a React component for server side rendering.
 * @public
 */
export declare const createComponent: <I extends HTMLElement, E extends EventNames = {}>({ hydrateModule, properties, tagName, serializeShadowRoot, ...options }: {
    hydrateModule: Promise<HydrateModule>;
    properties: Record<string, string>;
    tagName: string;
    serializeShadowRoot?: SerializeShadowRootOptions;
} & Options<I, E> & {
    defineCustomElement: () => void;
}) => ReactWebComponent<I, E>;
export {};