element-vir 12.2.0 → 12.3.0

package/dist/built-in-lit-types.d.ts

@@ -0,0 +1,2 @@
+export { svg } from 'lit';
+export type { CompiledTemplate, CompiledTemplateResult, HTMLTemplateResult, SVGTemplateResult, TemplateResult, } from 'lit';

package/dist/built-in-lit-types.js

@@ -0,0 +1 @@
+export { svg } from 'lit';

package/dist/declarative-element/declarative-element-init.d.ts

@@ -9,7 +9,7 @@ import { HostClassesInitMap } from './properties/host-classes';
 import { StylesCallback } from './properties/styles';
 import { InitCallback, RenderCallback } from './render-callback';
 export type CustomElementTagName = `${string}-${string}`;
-export type DeclarativeElementInit<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitMaybeAsyncGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeysGeneric extends string, CssVarKeysGeneric extends string, RenderOutputGeneric> = {
+export type DeclarativeElementInit<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitMaybeAsyncGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeysGeneric extends string, CssVarKeysGeneric extends string, RenderOutputGeneric, InputsDefinerFunction extends ((input: any) => any) | undefined> = {
     /**
      * HTML tag name. This should not be used directly, as interpolating it with the html tagged
      * template from this package is preferred.
@@ -39,8 +39,9 @@ export type DeclarativeElementInit<TagNameGeneric extends CustomElementTagName,
      */
     cssVars?: CssVarsInitMap<CssVarKeysGeneric>;
     /** Called as part of the first renderCallback call, before the first renderCallback call. */
-    initCallback?: InitCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric>;
-    renderCallback: RequireNonVoidReturn<RenderOutputGeneric, RenderCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric>>;
-    cleanupCallback?: InitCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric>;
+    initCallback?: InitCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, InputsDefinerFunction>;
+    renderCallback: RequireNonVoidReturn<RenderOutputGeneric, RenderCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric, InputsDefinerFunction>>;
+    cleanupCallback?: InitCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, InputsDefinerFunction>;
     options?: Partial<DeclarativeElementDefinitionOptions> | undefined;
+    inputsDefiner?: undefined | InputsDefinerFunction;
 };

package/dist/declarative-element/declarative-element.d.ts

@@ -7,24 +7,30 @@ import { EventDescriptorMap, EventsInitMap } from './properties/element-events';
 import { ElementPropertyDescriptorMap, PropertyInitMapBase } from './properties/element-properties';
 import { HostClassNamesMap } from './properties/host-classes';
 import { RenderCallback, RenderParams } from './render-callback';
-export type HostInstanceType<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitMaybeAsyncGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string> = RequiredAndNotNullBy<DeclarativeElement<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, any>, 'shadowRoot'>;
-export type DeclarativeElementDefinition<TagNameGeneric extends CustomElementTagName = any, InputsGeneric extends PropertyInitMapBase = any, StateInitMaybeAsyncGeneric extends PropertyInitMapBase = any, EventsInitGeneric extends EventsInitMap = any, HostClassKeys extends string = string, CssVarKeys extends string = string, RenderOutputGeneric = any> = (new () => HostInstanceType<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys>) & StaticDeclarativeElementProperties<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric> & {
-    instanceType: HostInstanceType<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys>;
+export type HostInstanceType<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitMaybeAsyncGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string, InputsDefinerFunction extends ((input: any) => any) | undefined = undefined> = RequiredAndNotNullBy<DeclarativeElement<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, 
+/**
+ * Intentionally do not have a generic parameter for RenderOutputGeneric here so that
+ * HostInstanceType is vague enough that it can actually be used.
+ */
+any, InputsDefinerFunction>, 'shadowRoot'>;
+export type DeclarativeElementDefinition<TagNameGeneric extends CustomElementTagName = any, InputsGeneric extends PropertyInitMapBase = any, StateInitMaybeAsyncGeneric extends PropertyInitMapBase = any, EventsInitGeneric extends EventsInitMap = any, HostClassKeys extends string = string, CssVarKeys extends string = string, RenderOutputGeneric = any, InputsDefinerFunction extends ((input: any) => any) | undefined = undefined> = (new () => HostInstanceType<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, InputsDefinerFunction>) & StaticDeclarativeElementProperties<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction> & {
+    instanceType: HostInstanceType<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, InputsDefinerFunction>;
 };
-export declare abstract class DeclarativeElement<TagNameGeneric extends CustomElementTagName = any, InputsGeneric extends PropertyInitMapBase = any, StateInitMaybeAsyncGeneric extends PropertyInitMapBase = any, EventsInitGeneric extends EventsInitMap = any, HostClassKeys extends string = string, CssVarKeys extends string = string, RenderOutputGeneric = any> extends LitElement {
-    static readonly tagName: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['tagName'];
-    static readonly styles: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['styles'];
-    static readonly isStrictInstance: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['isStrictInstance'];
-    static readonly renderCallback: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['renderCallback'];
-    static readonly inputsType: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['inputsType'];
-    static readonly stateType: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['stateType'];
-    static readonly events: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['events'];
-    static readonly stateInit: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['stateInit'];
-    static readonly init: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['init'];
-    static readonly hostClasses: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['hostClasses'];
-    static readonly cssVarNames: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['cssVarNames'];
-    static readonly cssVarValues: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown>['cssVarValues'];
-    abstract lastRenderedProps: Pick<RenderParams<any, InputsGeneric, StateInitMaybeAsyncGeneric, any, any, any>, 'inputs' | 'state'>;
+export declare abstract class DeclarativeElement<TagNameGeneric extends CustomElementTagName = any, InputsGeneric extends PropertyInitMapBase = any, StateInitMaybeAsyncGeneric extends PropertyInitMapBase = any, EventsInitGeneric extends EventsInitMap = any, HostClassKeys extends string = string, CssVarKeys extends string = string, RenderOutputGeneric = any, InputsDefinerFunction extends ((input: any) => any) | undefined = any> extends LitElement {
+    static readonly tagName: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['tagName'];
+    static readonly styles: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['styles'];
+    static readonly isStrictInstance: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['isStrictInstance'];
+    static readonly renderCallback: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['renderCallback'];
+    static readonly defineInputs: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['defineInputs'];
+    static readonly inputsType: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['inputsType'];
+    static readonly stateType: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['stateType'];
+    static readonly events: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['events'];
+    static readonly stateInit: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['stateInit'];
+    static readonly init: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['init'];
+    static readonly hostClasses: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['hostClasses'];
+    static readonly cssVarNames: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['cssVarNames'];
+    static readonly cssVarValues: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, string, string, unknown, any>['cssVarValues'];
+    abstract lastRenderedProps: Pick<RenderParams<any, InputsGeneric, StateInitMaybeAsyncGeneric, any, any, any, any>, 'inputs' | 'state'>;
     abstract render(): unknown;
     abstract readonly instanceState: MaybeAsyncStateToSync<StateInitMaybeAsyncGeneric>;
     abstract readonly asyncStateHandlerMap: AsyncStateHandlerMap<StateInitMaybeAsyncGeneric>;
@@ -32,17 +38,18 @@ export declare abstract class DeclarativeElement<TagNameGeneric extends CustomEl
     abstract assignInputs(inputs: {} extends Required<InputsGeneric> ? never : Partial<InputsGeneric>): void;
     abstract haveInputsBeenSet: boolean;
     abstract markInputsAsHavingBeenSet(): void;
-    abstract readonly definition: DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric>;
+    abstract readonly definition: DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction>;
 }
-export interface StaticDeclarativeElementProperties<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitMaybeAsyncGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string, RenderOutputGeneric> {
+export interface StaticDeclarativeElementProperties<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitMaybeAsyncGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string, RenderOutputGeneric, InputsDefinerFunction extends ((input: any) => any) | undefined> {
     /** Pass through the render callback for direct unit testability */
-    readonly renderCallback: RenderCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric>;
+    readonly renderCallback: RenderCallback<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction>;
+    readonly defineInputs: InputsDefinerFunction;
     events: EventDescriptorMap<EventsInitGeneric>;
     stateInit: ElementPropertyDescriptorMap<StateInitMaybeAsyncGeneric>;
-    init: RequiredBy<DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric>, 'stateInit' | 'events'>;
+    init: RequiredBy<DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction>, 'stateInit' | 'events'>;
     inputsType: InputsGeneric;
     stateType: MaybeAsyncStateToSync<StateInitMaybeAsyncGeneric>;
-    isStrictInstance: (element: unknown) => element is DeclarativeElement<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric>;
+    isStrictInstance: (element: unknown) => element is DeclarativeElement<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction>;
     hostClasses: HostClassNamesMap<string, HostClassKeys>;
     cssVarNames: CssVarNameOrValueMap<CssVarKeys>;
     cssVarValues: CssVarNameOrValueMap<CssVarKeys>;

package/dist/declarative-element/define-element-no-inputs.d.ts

@@ -2,4 +2,4 @@ import { DeclarativeElementDefinition } from './declarative-element';
 import { CustomElementTagName, DeclarativeElementInit } from './declarative-element-init';
 import { EventsInitMap } from './properties/element-events';
 import { PropertyInitMapBase } from './properties/element-properties';
-export declare function defineElementNoInputs<TagNameGeneric extends CustomElementTagName = '-', InputsGeneric extends PropertyInitMapBase = {}, StateInitMaybeAsyncGeneric extends PropertyInitMapBase = {}, EventsInitGeneric extends EventsInitMap = {}, HostClassKeys extends string = '', CssVarKeys extends string = '', RenderOutputGeneric = any>(initInput: DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric>): DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric>;
+export declare function defineElementNoInputs<TagNameGeneric extends CustomElementTagName = '-', InputsGeneric extends PropertyInitMapBase = {}, StateInitMaybeAsyncGeneric extends PropertyInitMapBase = {}, EventsInitGeneric extends EventsInitMap = {}, HostClassKeys extends string = '', CssVarKeys extends string = '', RenderOutputGeneric = any, InputsDefinerFunction extends ((input: any) => any) | undefined = undefined>(initInput: DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction>): DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitMaybeAsyncGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction>;

package/dist/declarative-element/define-element-no-inputs.js

@@ -34,6 +34,8 @@ export function defineElementNoInputs(initInput) {
         ? initInput.styles(hostClassNamesToStylesInput({ hostClassNames, cssVarNames, cssVarValues }))
         : initInput.styles || css ``;
     const typedRenderCallback = initInput.renderCallback;
+    const typedDefineInputs = initInput.inputsDefiner ??
+        ((inputs) => inputs);
     const anonymousClass = (_a = class extends DeclarativeElement {
             createRenderParams() {
                 return createRenderParams(this, eventsMap);
@@ -132,6 +134,7 @@ export function defineElementNoInputs(initInput) {
         _a.isStrictInstance = () => false,
         _a.events = eventsMap,
         _a.renderCallback = typedRenderCallback,
+        _a.defineInputs = typedDefineInputs,
         _a.hostClasses = hostClassNames,
         _a.cssVarNames = cssVarNames,
         _a.stateInit = initInput.stateInit,

package/dist/declarative-element/define-element.d.ts

@@ -1,5 +1,8 @@
 import { DeclarativeElementDefinition } from './declarative-element';
-import { DeclarativeElementInit } from './declarative-element-init';
+import { CustomElementTagName, DeclarativeElementInit } from './declarative-element-init';
 import { EventsInitMap } from './properties/element-events';
 import { PropertyInitMapBase } from './properties/element-properties';
-export declare function defineElement<InputsGeneric extends PropertyInitMapBase = {}>(): <TagNameGeneric extends `${string}-${string}`, StateInitGeneric extends PropertyInitMapBase = {}, EventsInitGeneric extends EventsInitMap = {}, HostClassKeysGeneric extends string = "", CssVarKeysGeneric extends string = "", RenderOutputGeneric = any>(initInput: DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric>) => DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric>;
+type ElementDefiner<InputsGeneric extends PropertyInitMapBase, InputsDefinerFunction extends ((input: any) => any) | undefined> = <TagNameGeneric extends CustomElementTagName, StateInitGeneric extends PropertyInitMapBase = {}, EventsInitGeneric extends EventsInitMap = {}, HostClassKeysGeneric extends string = '', CssVarKeysGeneric extends string = '', RenderOutputGeneric = any>(initInput: DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric, InputsDefinerFunction>) => DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric, InputsDefinerFunction>;
+export declare function defineElement<InputsGeneric extends PropertyInitMapBase = {}>(): ElementDefiner<InputsGeneric, undefined>;
+export declare function defineElement<InputsDefinerFunction extends (input: any) => any>(inputsDefinerFunction: InputsDefinerFunction): ElementDefiner<ReturnType<InputsDefinerFunction>, InputsDefinerFunction>;
+export {};

package/dist/declarative-element/define-element.js

@@ -1,13 +1,14 @@
 import { defineElementNoInputs } from './define-element-no-inputs';
 import { IgnoreInputsNotBeenSetBeforeRenderWarningSymbol } from './definition-options';
-export function defineElement() {
+export function defineElement(inputsDefinerFunction) {
     return (initInput) => {
         return defineElementNoInputs({
             ...initInput,
             options: {
+                ...initInput.options,
                 [IgnoreInputsNotBeenSetBeforeRenderWarningSymbol]: false,
             },
-            ...initInput.options,
+            inputsDefiner: inputsDefinerFunction,
         });
     };
 }

package/dist/declarative-element/render-callback.d.ts

@@ -4,15 +4,15 @@ import { CustomElementTagName } from './declarative-element-init';
 import { AsyncStateInputs, MaybeAsyncStateToSync } from './properties/async-state';
 import { EventDescriptorMap, EventInitMapEventDetailExtractor, EventsInitMap } from './properties/element-events';
 import { PropertyInitMapBase } from './properties/element-properties';
-export type RenderCallback<TagNameGeneric extends CustomElementTagName = any, InputsGeneric extends PropertyInitMapBase = any, StateGeneric extends PropertyInitMapBase = any, EventsInitGeneric extends EventsInitMap = any, HostClassKeys extends string = any, CssVarKeys extends string = any, RenderOutputGeneric = any> = (params: RenderParams<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys>) => RenderOutputGeneric;
-export type InitCallback<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string> = (params: RenderParams<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys>) => void;
+export type RenderCallback<TagNameGeneric extends CustomElementTagName = any, InputsGeneric extends PropertyInitMapBase = any, StateGeneric extends PropertyInitMapBase = any, EventsInitGeneric extends EventsInitMap = any, HostClassKeys extends string = any, CssVarKeys extends string = any, RenderOutputGeneric = any, InputsDefinerFunction extends ((input: any) => any) | undefined = any> = (params: RenderParams<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, InputsDefinerFunction>) => RenderOutputGeneric;
+export type InitCallback<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string, InputsDefinerFunction extends ((input: any) => any) | undefined> = (params: RenderParams<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, InputsDefinerFunction>) => void;
 export type UpdateStateCallback<StateGeneric extends PropertyInitMapBase> = (newState: Partial<AsyncStateInputs<StateGeneric>>) => void;
-export type RenderParams<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string> = {
+export type RenderParams<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateInitGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string, InputsDefinerFunction extends ((input: any) => any) | undefined> = {
     state: Readonly<MaybeAsyncStateToSync<StateInitGeneric>>;
     updateState: UpdateStateCallback<StateInitGeneric>;
     events: EventDescriptorMap<EventsInitGeneric>;
-    host: HostInstanceType<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys>;
+    host: HostInstanceType<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, InputsDefinerFunction>;
     dispatch: <EventTypeNameGeneric extends keyof EventsInitGeneric>(event: TypedEvent<EventTypeNameGeneric extends string ? EventTypeNameGeneric : never, EventInitMapEventDetailExtractor<EventTypeNameGeneric, EventsInitGeneric>> | Event) => boolean;
     inputs: InputsGeneric;
 };
-export declare function createRenderParams<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string, RenderOutputGeneric>(element: DeclarativeElement<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric>, eventsMap: EventDescriptorMap<EventsInitGeneric>): RenderParams<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys>;
+export declare function createRenderParams<TagNameGeneric extends CustomElementTagName, InputsGeneric extends PropertyInitMapBase, StateGeneric extends PropertyInitMapBase, EventsInitGeneric extends EventsInitMap, HostClassKeys extends string, CssVarKeys extends string, RenderOutputGeneric, InputsDefinerFunction extends ((input: any) => any) | undefined>(element: DeclarativeElement<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, RenderOutputGeneric, InputsDefinerFunction>, eventsMap: EventDescriptorMap<EventsInitGeneric>): RenderParams<TagNameGeneric, InputsGeneric, StateGeneric, EventsInitGeneric, HostClassKeys, CssVarKeys, InputsDefinerFunction>;

package/dist/declarative-element/utilities/template-string.d.ts

@@ -0,0 +1,5 @@
+import type { TemplateResult } from 'lit';
+import type { unsafeHTML, unsafeSVG } from '../../built-in-lit-directives';
+export declare function templateToString(template: TemplateResult | ReturnType<typeof unsafeSVG> | ReturnType<typeof unsafeHTML> | {
+    templateString: string;
+}): string;

package/dist/declarative-element/utilities/template-string.js

@@ -0,0 +1,39 @@
+import { collapseWhiteSpace } from '@augment-vir/common';
+export function templateToString(template) {
+    if ('templateString' in template) {
+        return template.templateString;
+    }
+    const { strings, values } = template;
+    if ((!strings || !strings?.length) && (!values || !values.length)) {
+        return '';
+    }
+    const valueList = [
+        ...(values || []),
+        '', // this last empty string is so it's easier to deal with indexes
+    ];
+    const stringsList = strings ?? [''];
+    const all = stringsList.map((stringValue, index) => {
+        const value = extractValue(stringValue, valueList[index]);
+        return `${stringValue}${value}`;
+    });
+    return collapseWhiteSpace(all.join(''));
+}
+function extractValue(previousString, value) {
+    if (value._$litType$ != undefined || value._$litDirective$ != undefined) {
+        // nested templates
+        return templateToString(value);
+    }
+    else if (Array.isArray(value)) {
+        // array of strings or templates.
+        const values = value.map((innerValue) => templateToString(innerValue));
+        return values.join('');
+    }
+    else {
+        if (previousString.endsWith('=')) {
+            return `"${value}"`;
+        }
+        else {
+            return value;
+        }
+    }
+}

package/dist/declarative-element/wrap-define-element.d.ts

@@ -1,10 +1,10 @@
 import { PartialAndNullable } from '@augment-vir/common';
 import { CustomElementTagName, DeclarativeElementInit, EventsInitMap, PropertyInitMapBase } from '..';
-export type WrapDefineElementOptions<TagNameRequirementGeneric extends CustomElementTagName = CustomElementTagName, InputsRequirementGeneric extends PropertyInitMapBase = {}, StateInitRequirementGeneric extends PropertyInitMapBase = {}, EventsInitRequirementGeneric extends EventsInitMap = {}, HostClassKeysRequirementGeneric extends string = '', CssVarKeysRequirementGeneric extends string = '', RenderOutputGeneric = any> = PartialAndNullable<{
-    assertInputs: (inputInit: DeclarativeElementInit<TagNameRequirementGeneric, InputsRequirementGeneric, StateInitRequirementGeneric, EventsInitRequirementGeneric, HostClassKeysRequirementGeneric, CssVarKeysRequirementGeneric, RenderOutputGeneric>) => void;
-    transformInputs: (inputInit: DeclarativeElementInit<TagNameRequirementGeneric, InputsRequirementGeneric, StateInitRequirementGeneric, EventsInitRequirementGeneric, HostClassKeysRequirementGeneric, CssVarKeysRequirementGeneric, RenderOutputGeneric>) => DeclarativeElementInit<TagNameRequirementGeneric, InputsRequirementGeneric, StateInitRequirementGeneric, EventsInitRequirementGeneric, HostClassKeysRequirementGeneric, CssVarKeysRequirementGeneric, RenderOutputGeneric>;
+export type WrapDefineElementOptions<TagNameRequirementGeneric extends CustomElementTagName = CustomElementTagName, InputsRequirementGeneric extends PropertyInitMapBase = {}, StateInitRequirementGeneric extends PropertyInitMapBase = {}, EventsInitRequirementGeneric extends EventsInitMap = {}, HostClassKeysRequirementGeneric extends string = '', CssVarKeysRequirementGeneric extends string = '', RenderOutputRequirementGeneric = any, InputsDefinerFunctionRequirementGeneric extends ((input: any) => any) | undefined = undefined> = PartialAndNullable<{
+    assertInputs: (inputInit: DeclarativeElementInit<TagNameRequirementGeneric, InputsRequirementGeneric, StateInitRequirementGeneric, EventsInitRequirementGeneric, HostClassKeysRequirementGeneric, CssVarKeysRequirementGeneric, RenderOutputRequirementGeneric, InputsDefinerFunctionRequirementGeneric>) => void;
+    transformInputs: (inputInit: DeclarativeElementInit<TagNameRequirementGeneric, InputsRequirementGeneric, StateInitRequirementGeneric, EventsInitRequirementGeneric, HostClassKeysRequirementGeneric, CssVarKeysRequirementGeneric, RenderOutputRequirementGeneric, InputsDefinerFunctionRequirementGeneric>) => DeclarativeElementInit<TagNameRequirementGeneric, InputsRequirementGeneric, StateInitRequirementGeneric, EventsInitRequirementGeneric, HostClassKeysRequirementGeneric, CssVarKeysRequirementGeneric, RenderOutputRequirementGeneric, InputsDefinerFunctionRequirementGeneric>;
 }>;
-export declare function wrapDefineElement<TagNameRequirementGeneric extends CustomElementTagName = CustomElementTagName, InputsRequirementGeneric extends PropertyInitMapBase = {}, StateInitRequirementGeneric extends PropertyInitMapBase = {}, EventsInitRequirementGeneric extends EventsInitMap = {}, HostClassKeysRequirementGeneric extends string = string, CssVarKeysRequirementGeneric extends string = string, RenderOutputRequirementGeneric = any>(options?: WrapDefineElementOptions | undefined): {
-    defineElement: <InputsGeneric extends InputsRequirementGeneric>() => <TagNameGeneric extends TagNameRequirementGeneric, StateInitGeneric extends StateInitRequirementGeneric, EventsInitGeneric extends EventsInitRequirementGeneric, HostClassKeysGeneric extends HostClassKeysRequirementGeneric, CssVarKeysGeneric extends CssVarKeysRequirementGeneric, RenderOutputGeneric extends RenderOutputRequirementGeneric>(inputs: DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric>) => import("./declarative-element").DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric>;
-    defineElementNoInputs: <TagNameGeneric_1 extends TagNameRequirementGeneric, InputsGeneric_1 extends InputsRequirementGeneric, StateInitGeneric_1 extends StateInitRequirementGeneric, EventsInitGeneric_1 extends EventsInitRequirementGeneric, HostClassKeysGeneric_1 extends HostClassKeysRequirementGeneric, CssVarKeysGeneric_1 extends CssVarKeysRequirementGeneric, RenderOutputGeneric_1 extends RenderOutputRequirementGeneric>(inputs: DeclarativeElementInit<TagNameGeneric_1, InputsGeneric_1, StateInitGeneric_1, EventsInitGeneric_1, HostClassKeysGeneric_1, CssVarKeysGeneric_1, RenderOutputGeneric_1>) => import("./declarative-element").DeclarativeElementDefinition<TagNameGeneric_1, InputsGeneric_1, StateInitGeneric_1, EventsInitGeneric_1, HostClassKeysGeneric_1, CssVarKeysGeneric_1, RenderOutputGeneric_1>;
+export declare function wrapDefineElement<TagNameRequirementGeneric extends CustomElementTagName = CustomElementTagName, InputsRequirementGeneric extends PropertyInitMapBase = {}, StateInitRequirementGeneric extends PropertyInitMapBase = {}, EventsInitRequirementGeneric extends EventsInitMap = {}, HostClassKeysRequirementGeneric extends string = string, CssVarKeysRequirementGeneric extends string = string, RenderOutputRequirementGeneric = any, InputsDefinerFunctionRequirementGeneric extends ((input: any) => any) | undefined = undefined>(options?: WrapDefineElementOptions | undefined): {
+    defineElement: <InputsGeneric extends InputsRequirementGeneric>() => <TagNameGeneric extends TagNameRequirementGeneric, StateInitGeneric extends StateInitRequirementGeneric, EventsInitGeneric extends EventsInitRequirementGeneric, HostClassKeysGeneric extends HostClassKeysRequirementGeneric, CssVarKeysGeneric extends CssVarKeysRequirementGeneric, RenderOutputGeneric extends RenderOutputRequirementGeneric, InputsDefinerFunctionGeneric extends InputsDefinerFunctionRequirementGeneric>(inputs: DeclarativeElementInit<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric, InputsDefinerFunctionGeneric>) => import("./declarative-element").DeclarativeElementDefinition<TagNameGeneric, InputsGeneric, StateInitGeneric, EventsInitGeneric, HostClassKeysGeneric, CssVarKeysGeneric, RenderOutputGeneric, undefined>;
+    defineElementNoInputs: <TagNameGeneric_1 extends TagNameRequirementGeneric, InputsGeneric_1 extends InputsRequirementGeneric, StateInitGeneric_1 extends StateInitRequirementGeneric, EventsInitGeneric_1 extends EventsInitRequirementGeneric, HostClassKeysGeneric_1 extends HostClassKeysRequirementGeneric, CssVarKeysGeneric_1 extends CssVarKeysRequirementGeneric, RenderOutputGeneric_1 extends RenderOutputRequirementGeneric, InputsDefinerFunctionGeneric_1 extends InputsDefinerFunctionRequirementGeneric>(inputs: DeclarativeElementInit<TagNameGeneric_1, InputsGeneric_1, StateInitGeneric_1, EventsInitGeneric_1, HostClassKeysGeneric_1, CssVarKeysGeneric_1, RenderOutputGeneric_1, InputsDefinerFunctionGeneric_1>) => import("./declarative-element").DeclarativeElementDefinition<TagNameGeneric_1, InputsGeneric_1, StateInitGeneric_1, EventsInitGeneric_1, HostClassKeysGeneric_1, CssVarKeysGeneric_1, RenderOutputGeneric_1, InputsDefinerFunctionGeneric_1>;
 };

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export * from './built-in-lit-directives';
+export * from './built-in-lit-types';
 export * from './declarative-element/declarative-element';
 export * from './declarative-element/declarative-element-init';
 export * from './declarative-element/define-element';
@@ -21,6 +22,7 @@ export * from './declarative-element/properties/host-classes';
 export * from './declarative-element/properties/styles';
 export * from './declarative-element/properties/tag-name';
 export * from './declarative-element/render-callback';
+export * from './declarative-element/utilities/template-string';
 export * from './declarative-element/wrap-define-element';
 export { requireAllCustomElementsToBeDeclarativeElements } from './require-declarative-element';
 export * from './template-transforms/vir-css/vir-css';

package/dist/index.js

@@ -1,4 +1,5 @@
 export * from './built-in-lit-directives';
+export * from './built-in-lit-types';
 export * from './declarative-element/declarative-element';
 export * from './declarative-element/declarative-element-init';
 export * from './declarative-element/define-element';
@@ -20,6 +21,7 @@ export * from './declarative-element/properties/host-classes';
 export * from './declarative-element/properties/styles';
 export * from './declarative-element/properties/tag-name';
 export * from './declarative-element/render-callback';
+export * from './declarative-element/utilities/template-string';
 export * from './declarative-element/wrap-define-element';
 export { requireAllCustomElementsToBeDeclarativeElements } from './require-declarative-element';
 export * from './template-transforms/vir-css/vir-css';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "element-vir",
-    "version": "12.2.0",
+    "version": "12.3.0",
     "keywords": [
         "custom",
         "web",
@@ -73,8 +73,8 @@
         "ts-node": "^10.9.1",
         "type-fest": "^3.9.0",
         "typescript": "^5.0.4",
-        "virmator": "^6.4.4",
-        "vite": "^4.3.2",
+        "virmator": "^6.5.0",
+        "vite": "^4.3.3",
         "vite-tsconfig-paths": "^4.2.0"
     }
 }