element-vir 26.11.2 → 26.12.0

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

@@ -1,56 +0,0 @@
-import { type CSSResult } from '../lit-exports/base-lit-exports.js';
-import { type CustomElementTagName } from './custom-tag-name.js';
-import { type DeclarativeElementDefinitionOptions } from './definition-options.js';
-import { type CssVarsInitMap } from './properties/css-vars.js';
-import { type EventsInitMap } from './properties/element-events.js';
-import { type PropertyInitMapBase } from './properties/element-properties.js';
-import { type HostClassesInitMap } from './properties/host-classes.js';
-import { type BaseStringName } from './properties/string-names.js';
-import { type StylesCallback } from './properties/styles.js';
-import { type InitCallback, type RenderCallback, type RenderParams } from './render-callback.js';
-/**
- * Initialization for an element-vir declarative element. This defines all the pieces required for
- * rendering the element.
- *
- * @category Internal
- */
-export type DeclarativeElementInit<TagName extends CustomElementTagName, Inputs extends PropertyInitMapBase, State extends PropertyInitMapBase, EventsInit extends EventsInitMap, HostClassKeys extends BaseStringName<TagName>, CssVarKeys extends BaseStringName<TagName>, SlotNames extends ReadonlyArray<string>, TestIds extends ReadonlyArray<string>> = {
-    /**
-     * HTML tag name. This should not be used directly, as interpolating it with the html tagged
-     * template from this package is preferred.
-     */
-    tagName: TagName;
-    /** Static styles. These should not and cannot change. */
-    styles?: CSSResult | StylesCallback<TagName, HostClassKeys, CssVarKeys> | undefined;
-    /** Events that the element can dispatch. (These can be thought of as "outputs".) */
-    events?: EventsInit | undefined;
-    slotNames?: SlotNames | undefined;
-    testIds?: TestIds | undefined;
-    /**
-     * HTML host classes. Values can be callbacks to determine when a host class should be defined,
-     * based on current instance state or inputs, or just false to indicate that the host class will
-     * only be manually set.
-     */
-    hostClasses?: HostClassesInitMap<TagName, HostClassKeys, Inputs, State> | undefined;
-    /**
-     * CSS Vars for the component. Keys of this object should be kebab-case and start with the
-     * element's tag name.
-     *
-     * Values of this object represent the default fallback value for the given CSS var. These are
-     * then passed to the styles property, which must be a callback to take advantage of these.
-     */
-    cssVars?: CssVarsInitMap<TagName, CssVarKeys>;
-    /**
-     * Make sure to define this at the top of your element init object or TypeScript will fail to
-     * infer the element's state type.
-     *
-     * Setup the element's initial state. This is only called once per element instance, before the
-     * first render. The return type of this method becomes the element's state type.
-     */
-    state?: (params: Omit<RenderParams<TagName, Inputs, any, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>, 'state' | 'updateState'>) => Extract<keyof State, keyof HTMLElement> extends never ? Extract<keyof State, keyof Inputs> extends never ? State : `ERROR: Cannot define an element state property that clashes with input properties: ${Extract<keyof State, keyof Inputs> extends string | number | bigint | boolean | null | undefined ? Extract<keyof State, keyof Inputs> : ''}` : `ERROR: Cannot define an element state property that clashes with native HTMLElement properties: ${Extract<keyof State, keyof HTMLElement>}`;
-    /** Called as part of the first render call, before the first render call. */
-    init?: InitCallback<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds> | undefined;
-    render: RenderCallback<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>;
-    cleanup?: InitCallback<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds> | undefined;
-    options?: Partial<DeclarativeElementDefinitionOptions> | undefined;
-};

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

@@ -1 +0,0 @@
-export {};

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

@@ -1,114 +0,0 @@
-import { type SetRequiredAndNotNull } from '@augment-vir/common';
-import { type EmptyObject, type IsAny, type IsEmptyObject } from 'type-fest';
-import { LitElement, type CSSResult } from '../lit-exports/base-lit-exports.js';
-import { type MinimalDefinitionWithInputs } from '../template-transforms/minimal-element-definition.js';
-import { type CustomElementTagName } from './custom-tag-name.js';
-import { type DeclarativeElementInit } from './declarative-element-init.js';
-import { type DeclarativeElementDefinitionOptions } from './definition-options.js';
-import { type CssVars } from './properties/css-vars.js';
-import { type EventDescriptorMap, type EventsInitMap } from './properties/element-events.js';
-import { type PropertyInitMapBase } from './properties/element-properties.js';
-import { type HostClassNamesMap } from './properties/host-classes.js';
-import { type ObservableListenerMap } from './properties/property-proxy.js';
-import { type BaseStringName, type StringNameMap } from './properties/string-names.js';
-import { type RenderCallback, type RenderParams, type UpdateStateCallback } from './render-callback.js';
-/**
- * The `host` type for a declarative element. This references a declarative element instance's
- * top-level HTML element and always contains a shadow root (wherein the element is rendered).
- *
- * @category Internal
- */
-export type DeclarativeElementHost<TagName extends CustomElementTagName = any, Inputs extends PropertyInitMapBase = any, State extends PropertyInitMapBase = any, EventsInit extends EventsInitMap = any, HostClassKeys extends BaseStringName<TagName> = any, CssVarKeys extends BaseStringName<TagName> = any, SlotNames extends ReadonlyArray<string> = any, TestIds extends ReadonlyArray<string> = any> = SetRequiredAndNotNull<Omit<DeclarativeElement<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>, Exclude<keyof StaticDeclarativeElementProperties<any, any, any, any, any, any, any, any>, keyof HTMLElement>>, 'shadowRoot'>;
-/**
- * The full definition for a declarative element.
- *
- * @category Internal
- */
-export type DeclarativeElementDefinition<TagName extends CustomElementTagName = any, Inputs extends PropertyInitMapBase = any, State extends PropertyInitMapBase = any, EventsInit extends EventsInitMap = any, HostClassKeys extends BaseStringName<TagName> = any, CssVarKeys extends BaseStringName<TagName> = any, SlotNames extends ReadonlyArray<string> = any, TestIds extends ReadonlyArray<string> = any> = (new () => DeclarativeElementHost<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>) & StaticDeclarativeElementProperties<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds> & {
-    InstanceType: DeclarativeElementHost<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>;
-};
-/**
- * Abstract class base for all declarative elements.
- *
- * @category Internal
- */
-export declare abstract class DeclarativeElement<TagName extends CustomElementTagName = any, Inputs extends PropertyInitMapBase = any, State extends PropertyInitMapBase = any, EventsInit extends EventsInitMap = any, HostClassKeys extends BaseStringName<TagName> = any, CssVarKeys extends BaseStringName<TagName> = any, SlotNames extends ReadonlyArray<string> = any, TestIds extends ReadonlyArray<string> = any> extends LitElement {
-    /**
-     * Assign inputs to an element instantiation. Use only on the opening tag.
-     *
-     * @example
-     *
-     * ```ts
-     * import {html} from 'element-vir';
-     *
-     * const myTemplate = html`
-     *     <${MyElement.assign({input1: 'a', input2: 'b'})}></${MyElement}>
-     * `;
-     * ```
-     */
-    static readonly assign: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['assign'];
-    static readonly assignedInputs: PropertyInitMapBase | undefined;
-    static readonly tagName: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['tagName'];
-    static readonly styles: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['styles'];
-    static readonly render: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['render'];
-    static readonly InputsType: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['InputsType'];
-    static readonly StateType: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['StateType'];
-    static readonly UpdateStateType: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['UpdateStateType'];
-    static readonly events: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['events'];
-    static readonly init: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['init'];
-    static readonly elementOptions: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['elementOptions'];
-    static readonly hostClasses: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['hostClasses'];
-    static readonly cssVars: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['cssVars'];
-    static readonly slotNames: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['slotNames'];
-    static readonly testIds: StaticDeclarativeElementProperties<CustomElementTagName, PropertyInitMapBase, PropertyInitMapBase, EventsInitMap, BaseStringName<CustomElementTagName>, BaseStringName<CustomElementTagName>, ReadonlyArray<string>, ReadonlyArray<string>>['testIds'];
-    abstract _lastRenderError: Error | undefined;
-    abstract _internalRenderCount: number;
-    abstract _lastRenderedProps: Readonly<Pick<RenderParams<any, Inputs, State, any, any, any, any, any>, 'inputs' | 'state'>>;
-    /**
-     * Calls all destroy methods on all state properties, if they exist. This is automatically
-     * called whenever the element is detached.
-     */
-    abstract destroy(): void;
-    abstract render(): unknown;
-    abstract readonly instanceState: State;
-    abstract readonly observablePropertyListenerMap: ObservableListenerMap<State & Inputs>;
-    abstract readonly instanceInputs: Inputs;
-    /**
-     * Used to assign inputs to the given element. This can be externally called as an API for
-     * setting inputs on an element reference, though this is discouraged. Inputs should typically
-     * be called using the `.assign()` method on an element definition inside of an HTML template.
-     */
-    abstract assignInputs(inputs: EmptyObject extends Required<Inputs> ? never : Partial<Inputs>): void;
-    /** The element definition for this element instance. */
-    abstract readonly definition: DeclarativeElementDefinition<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>;
-}
-/**
- * The assign inputs method of a declarative element.
- *
- * @category Internal
- */
-export type AssignMethod<TagName extends CustomElementTagName, Inputs extends PropertyInitMapBase> = IsAny<Inputs> extends true ? any : IsEmptyObject<Required<Inputs>> extends true ? (inputsObject: never) => never : (inputsObject: IsEmptyObject<Required<Inputs>> extends true ? never : Inputs) => MinimalDefinitionWithInputs<TagName>;
-/**
- * All static properties on a declarative element. These all come from the element's definition.
- *
- * @category Internal
- */
-export type StaticDeclarativeElementProperties<TagName extends CustomElementTagName, Inputs extends PropertyInitMapBase, State extends PropertyInitMapBase, EventsInit extends EventsInitMap, HostClassKeys extends BaseStringName<TagName>, CssVarKeys extends BaseStringName<TagName>, SlotNames extends ReadonlyArray<string>, TestIds extends ReadonlyArray<string>> = {
-    /** Assign inputs to an element directly on its interpolated tag. */
-    readonly assign: AssignMethod<TagName, Inputs>;
-    assignedInputs: Inputs | undefined;
-    /** Pass through the render callback for direct unit testability */
-    readonly render: RenderCallback<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>;
-    readonly events: EventDescriptorMap<TagName, EventsInit>;
-    readonly slotNames: Readonly<StringNameMap<TagName, 'slot', SlotNames>>;
-    readonly testIds: Readonly<StringNameMap<TagName, 'test-id', TestIds>>;
-    readonly init: DeclarativeElementInit<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>;
-    readonly elementOptions: DeclarativeElementDefinitionOptions;
-    readonly InputsType: Inputs;
-    readonly StateType: Readonly<State>;
-    readonly UpdateStateType: UpdateStateCallback<State>;
-    readonly hostClasses: HostClassNamesMap<string, HostClassKeys>;
-    readonly cssVars: CssVars<TagName, CssVarKeys>;
-    readonly tagName: TagName;
-    readonly styles: CSSResult;
-};

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

@@ -1,36 +0,0 @@
-import { LitElement } from '../lit-exports/base-lit-exports.js';
-/**
- * Abstract class base for all declarative elements.
- *
- * @category Internal
- */
-export class DeclarativeElement extends LitElement {
-    /**
-     * Assign inputs to an element instantiation. Use only on the opening tag.
-     *
-     * @example
-     *
-     * ```ts
-     * import {html} from 'element-vir';
-     *
-     * const myTemplate = html`
-     *     <${MyElement.assign({input1: 'a', input2: 'b'})}></${MyElement}>
-     * `;
-     * ```
-     */
-    static assign;
-    static assignedInputs;
-    static tagName;
-    static styles;
-    static render;
-    static InputsType;
-    static StateType;
-    static UpdateStateType;
-    static events;
-    static init;
-    static elementOptions;
-    static hostClasses;
-    static cssVars;
-    static slotNames;
-    static testIds;
-}

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

@@ -1,41 +0,0 @@
-import { type CustomElementTagName } from './custom-tag-name.js';
-import { type DeclarativeElementInit } from './declarative-element-init.js';
-import { type DeclarativeElementDefinition } from './declarative-element.js';
-import { type EventsInitMap } from './properties/element-events.js';
-import { type PropertyInitMapBase } from './properties/element-properties.js';
-import { type BaseStringName } from './properties/string-names.js';
-/**
- * Verifies that the given `Inputs` type does not clash with built-in HTMLElement properties. This
- * is used within {@link defineElement}.
- *
- * @category Internal
- */
-export type DeclarativeElementInputErrorParams<Inputs extends PropertyInitMapBase> = Extract<keyof Inputs, keyof HTMLElement> extends never ? [] : [
-    'ERROR: Cannot define an element input property that clashes with native HTMLElement properties.'
-];
-/**
- * Defines an element with inputs. Note that this function must be called twice, due to TypeScript
- * type inference limitations.
- *
- * @category Element Definition
- * @example
- *
- * ```ts
- * import {defineElement, html} from 'element-vir';
- *
- * const MyElement = defineElement<{username: string}>()({
- *     tagName: 'my-element',
- *     render({inputs}) {
- *         return html`
- *             <p>hi: ${inputs.username}</p>
- *         `;
- *     },
- * });
- * ```
- */
-export declare function defineElement<Inputs extends PropertyInitMapBase = {}>(
-/**
- * These `errorParams` is present when there are problems with the `Inputs` type. If it is
- * present, the error should be fixed. This should always be empty.
- */
-...errorParams: DeclarativeElementInputErrorParams<Inputs>): <const TagName extends CustomElementTagName, State extends PropertyInitMapBase = {}, EventsInit extends EventsInitMap = {}, const HostClassKeys extends BaseStringName<TagName> = `${TagName}-`, const CssVarKeys extends BaseStringName<TagName> = `${TagName}-`, const SlotNames extends ReadonlyArray<string> = Readonly<[]>, const TestIds extends ReadonlyArray<string> = Readonly<[]>>(initInput: DeclarativeElementInit<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>) => DeclarativeElementDefinition<TagName, Inputs, State, EventsInit, HostClassKeys, CssVarKeys, SlotNames, TestIds>;

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

@@ -1,248 +0,0 @@
-/* eslint-disable @typescript-eslint/no-empty-object-type */
-import { assert, check } from '@augment-vir/assert';
-import { ensureErrorAndPrependMessage, extractErrorMessage, getObjectTypedKeys, kebabCaseToCamelCase, } from '@augment-vir/common';
-import { defineCssVars } from 'lit-css-vars';
-import { css } from '../template-transforms/vir-css/vir-css.js';
-import { DeclarativeElement, } from './declarative-element.js';
-import { defaultDeclarativeElementDefinitionOptions, } from './definition-options.js';
-import { assignInputs } from './properties/assign-inputs.js';
-import { createEventDescriptorMap, } from './properties/element-events.js';
-import { createHostClassNamesMap } from './properties/host-classes.js';
-import { bindReactiveProperty, createElementPropertyProxy } from './properties/property-proxy.js';
-import { assertValidStringNames, createStringNameMap, } from './properties/string-names.js';
-import { applyHostClasses, createStylesCallbackInput } from './properties/styles.js';
-import { createRenderParams } from './render-callback.js';
-/**
- * Defines an element with inputs. Note that this function must be called twice, due to TypeScript
- * type inference limitations.
- *
- * @category Element Definition
- * @example
- *
- * ```ts
- * import {defineElement, html} from 'element-vir';
- *
- * const MyElement = defineElement<{username: string}>()({
- *     tagName: 'my-element',
- *     render({inputs}) {
- *         return html`
- *             <p>hi: ${inputs.username}</p>
- *         `;
- *     },
- * });
- * ```
- */
-export function defineElement(
-/**
- * These `errorParams` is present when there are problems with the `Inputs` type. If it is
- * present, the error should be fixed. This should always be empty.
- */
-...errorParams) {
-    assert.isEmpty(errorParams);
-    return (initInput) => {
-        const init = initInput;
-        if (!check.isObject(init)) {
-            throw new TypeError('Cannot define element with non-object init: ${init}');
-        }
-        return internalDefineElement({
-            ...init,
-            options: {
-                ...init.options,
-            },
-        });
-    };
-}
-function internalDefineElement(init) {
-    if (!check.isObject(init)) {
-        throw new TypeError('Cannot define element with non-object init: ${init}');
-    }
-    if (!check.isString(init.tagName)) {
-        throw new TypeError('Missing valid tagName (expected a string).');
-    }
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-    if (!init.render || typeof init.render === 'string') {
-        throw new Error(`Failed to define element '${init.tagName}': render is not a function`);
-    }
-    const elementOptions = {
-        ...defaultDeclarativeElementDefinitionOptions,
-        ...init.options,
-    };
-    const eventsMap = createEventDescriptorMap(init.tagName, init.events);
-    const hostClassNames = createHostClassNamesMap(init.hostClasses);
-    if (init.hostClasses) {
-        assertValidStringNames(init.tagName, init.hostClasses);
-    }
-    if (init.cssVars) {
-        assertValidStringNames(init.tagName, init.cssVars);
-    }
-    /**
-     * As casts here are to prevent defineCssVars from complaining that our CSS var names are too
-     * generic or the names not being in kebab-case. (Which, in this line of code, are indeed true
-     * errors. However, this is for internal types only and the user will actually see much more
-     * specific types externally.)
-     */
-    const cssVars = (init.cssVars ? defineCssVars(init.cssVars) : {});
-    const slotNamesMap = createStringNameMap(init.tagName, 'slot', init.slotNames);
-    const testIdsMap = createStringNameMap(init.tagName, 'test-id', init.testIds);
-    const calculatedStyles = typeof init.styles === 'function'
-        ? init.styles(createStylesCallbackInput({ hostClassNames, cssVars }))
-        : init.styles || css ``;
-    const typedRenderCallback = init.render;
-    function typedAssignCallback(...[inputs]) {
-        const wrappedDefinition = {
-            _elementVirIsMinimalDefinitionWithInputs: true,
-            definition: anonymousClass,
-            inputs,
-        };
-        return wrappedDefinition;
-    }
-    const anonymousClass = class extends DeclarativeElement {
-        static elementOptions = elementOptions;
-        static tagName = init.tagName;
-        static styles = calculatedStyles;
-        _lastRenderError = undefined;
-        _internalRenderCount = 0;
-        createRenderParams() {
-            return createRenderParams({
-                element: this,
-                eventsMap,
-                cssVars,
-                slotNamesMap,
-                testIdsMap,
-            });
-        }
-        static assign = typedAssignCallback;
-        static events = eventsMap;
-        static render = typedRenderCallback;
-        static hostClasses = hostClassNames;
-        static cssVars = cssVars;
-        static init = init;
-        static slotNames = slotNamesMap;
-        static testIds = testIdsMap;
-        get InstanceType() {
-            throw new Error(`'InstanceType' was called on ${init.tagName} as a value but it is only a type.`);
-        }
-        static get InputsType() {
-            throw new Error(`'InputsType' was called on ${init.tagName} as a value but it is only a type.`);
-        }
-        static get StateType() {
-            throw new Error(`'StateType' was called on ${init.tagName} as a value but it is only a type.`);
-        }
-        static get UpdateStateType() {
-            throw new Error(`'UpdateStateType' was called on ${init.tagName} as a value but it is only a type.`);
-        }
-        _initCalled = false;
-        _stateCalled = false;
-        _hasRendered = false;
-        _lastRenderedProps = undefined;
-        render() {
-            this._internalRenderCount++;
-            try {
-                this._hasRendered = true;
-                const renderParams = this.createRenderParams();
-                if (!this._stateCalled && init.state) {
-                    this._stateCalled = true;
-                    const stateInit = init.state(renderParams);
-                    if (stateInit instanceof Promise) {
-                        throw new TypeError('init cannot be asynchronous');
-                    }
-                    getObjectTypedKeys(stateInit).forEach((stateKey) => {
-                        bindReactiveProperty(this, stateKey);
-                        this.instanceState[stateKey] = stateInit[stateKey];
-                    });
-                }
-                if (!this._initCalled && init.init) {
-                    this._initCalled = true;
-                    if (init.init(renderParams) instanceof Promise) {
-                        throw new TypeError('init cannot be asynchronous');
-                    }
-                }
-                const renderResult = typedRenderCallback(renderParams);
-                if (renderResult instanceof Promise) {
-                    throw new TypeError('render cannot be asynchronous');
-                }
-                applyHostClasses({
-                    host: renderParams.host,
-                    hostClassesInit: init.hostClasses,
-                    hostClassNames,
-                    state: renderParams.state,
-                    inputs: renderParams.inputs,
-                });
-                this._lastRenderedProps = {
-                    inputs: { ...renderParams.inputs },
-                    state: { ...renderParams.state },
-                };
-                return renderResult;
-            }
-            catch (caught) {
-                const error = ensureErrorAndPrependMessage(caught, `Failed to render ${init.tagName}`);
-                console.error(error);
-                this._lastRenderError = error;
-                void elementOptions.errorHandler?.(error);
-                return extractErrorMessage(error);
-            }
-        }
-        connectedCallback() {
-            super.connectedCallback();
-            if (this._hasRendered && !this._initCalled && init.init) {
-                this._initCalled = true;
-                const renderParams = this.createRenderParams();
-                if (init.init(renderParams) instanceof Promise) {
-                    throw new TypeError(`init in '${init.tagName}' cannot be asynchronous`);
-                }
-            }
-        }
-        destroy() {
-            Object.values(this.instanceState).forEach((stateValue) => {
-                if (check.hasKey(stateValue, 'destroy') && check.isFunction(stateValue.destroy)) {
-                    stateValue.destroy();
-                }
-            });
-        }
-        disconnectedCallback() {
-            super.disconnectedCallback();
-            if (init.cleanup) {
-                const renderParams = this.createRenderParams();
-                if (init.cleanup(renderParams) instanceof Promise) {
-                    throw new TypeError(`cleanup in '${init.tagName}' cannot be asynchronous`);
-                }
-            }
-            this.destroy();
-            this._initCalled = false;
-            this._stateCalled = false;
-        }
-        // this is set below in Object.defineProperties
-        definition = {};
-        assignInputs(inputs) {
-            assignInputs(this, inputs);
-        }
-        observablePropertyListenerMap = {};
-        instanceInputs = createElementPropertyProxy(this, false);
-        instanceState = createElementPropertyProxy(this, !elementOptions.allowPolymorphicState);
-        constructor() {
-            super();
-            this.definition = anonymousClass;
-        }
-    };
-    Object.defineProperties(anonymousClass, {
-        name: {
-            value: kebabCaseToCamelCase(init.tagName, {
-                capitalizeFirstLetter: true,
-            }),
-            writable: true,
-        },
-    });
-    /**
-     * `window` will be `undefined` in Node.js and we want to be able to import these files into
-     * Node.js.
-     */
-    if (globalThis.window) {
-        if (globalThis.window.customElements.get(init.tagName)) {
-            console.warn(`Tried to define custom element '${init.tagName}' but it is already defined.`);
-        }
-        else {
-            globalThis.window.customElements.define(init.tagName, anonymousClass);
-        }
-    }
-    return anonymousClass;
-}

package/dist/declarative-element/definition-options.js

@@ -1,9 +0,0 @@
-/**
- * Default values for {@link DeclarativeElementDefinitionOptions}.
- *
- * @internal
- */
-export const defaultDeclarativeElementDefinitionOptions = {
-    allowPolymorphicState: false,
-    errorHandler: undefined,
-};

package/dist/declarative-element/directives/assign.directive.d.ts

@@ -1,24 +0,0 @@
-import { type EmptyObject } from 'type-fest';
-import { type DirectiveResult } from '../../lit-exports/all-lit-exports.js';
-import { type PropertyInitMapBase } from '../properties/element-properties.js';
-export type ElementDefinitionWithInputsType<InputsType extends PropertyInitMapBase = PropertyInitMapBase> = {
-    InputsType: InputsType;
-};
-/**
- * Assign an object matching an element's inputs to its inputs.
- *
- * @deprecated Instead of using this directive, assign inputs directly on the element's
- *   interpolation opening tag interpolation.
- * @example Html`<${MyElement} ${assign(MyElement, {value: 1})}>...` should be
- * html`<${MyElement.assign({value: 1})}>...`
- */
-export declare function assign<const SpecificDeclarativeElement extends ElementDefinitionWithInputsType>(declarativeElement: SpecificDeclarativeElement, inputsObject: EmptyObject extends Required<SpecificDeclarativeElement['InputsType']> ? never : SpecificDeclarativeElement['InputsType']): DirectiveResult;
-/**
- * Assign an object matching an element's inputs to its inputs.
- *
- * @deprecated Instead of using this directive, assign inputs directly on the element's
- *   interpolation opening tag interpolation.
- * @example Html`<${MyElement} ${assign(MyElement, {value: 1})}>...` should be
- * html`<${MyElement.assign({value: 1})}>...`
- */
-export declare function assign<const SpecificDeclarativeElement extends ElementDefinitionWithInputsType, const SpecificInput extends SpecificDeclarativeElement['InputsType']>(inputsObject: SpecificInput extends typeof HTMLElement ? never : SpecificInput): DirectiveResult;

package/dist/declarative-element/directives/assign.directive.js

@@ -1,34 +0,0 @@
-import { directive, Directive, noChange, } from '../../lit-exports/all-lit-exports.js';
-import { assignInputs } from '../properties/assign-inputs.js';
-import { extractElement } from './directive-helpers.js';
-/**
- * Assign an object matching an element's inputs to its inputs.
- *
- * @deprecated Instead of using this directive, assign inputs directly on the element's
- *   interpolation opening tag interpolation.
- * @example Html`<${MyElement} ${assign(MyElement, {value: 1})}>...` should be
- * html`<${MyElement.assign({value: 1})}>...`
- */
-export function assign(declarativeElementOrInputs, inputsObject) {
-    /**
-     * The directive generics (in listenDirective) are not strong enough to maintain their values.
-     * Thus, the directive call is wrapped in this function.
-     */
-    if (inputsObject) {
-        return assignDirective(declarativeElementOrInputs, inputsObject);
-    }
-    else {
-        return assignDirective(undefined, declarativeElementOrInputs);
-    }
-}
-const assignDirective = directive(class extends Directive {
-    element;
-    constructor(partInfo) {
-        super(partInfo);
-        this.element = extractElement(partInfo, 'assign');
-    }
-    render(elementDefinition, inputsObject) {
-        assignInputs(this.element, inputsObject);
-        return noChange;
-    }
-});

package/dist/declarative-element/directives/async-prop.d.ts

@@ -1,61 +0,0 @@
-import { type Overwrite } from '@augment-vir/common';
-import { CallbackObservable, type AsyncValue, type CallbackObservableInit } from 'observavir';
-export type { AsyncValue } from 'observavir';
-/**
- * Class for constructing async props. Do not use this directly as its internal types won't be
- * inferred correctly. Instead use {@link asyncProp} an async prop or {@link AsyncProp} for types.
- *
- * @category Internal
- */
-export declare class InternalAsyncPropClass<Value, Params> extends CallbackObservable<Value, Params> {
-    /**
-     * Checks if the current `.value` has resolved (meaning the Promise has settled and it was not
-     * rejected). This type guards the current instance's `.value` property.
-     */
-    isResolved(): this is Overwrite<this, {
-        value: Exclude<AsyncValue<Value>, Promise<any> | Error>;
-    }>;
-    /**
-     * Checks if the current `.value` has settled (meaning it is either a rejection error or a
-     * resolved value). This type guards the current instance's `.value` property.
-     */
-    isSettled(): this is Overwrite<this, {
-        value: Exclude<AsyncValue<Value>, Promise<any>>;
-    }>;
-    /**
-     * Checks if the current `.value` has not settled yet settled (meaning it is still an unsettled
-     * Promise). This type guards the current instance's `.value` property.
-     */
-    isWaiting(): this is Overwrite<this, {
-        value: Extract<AsyncValue<Value>, Promise<any>>;
-    }>;
-    /**
-     * Checks if the current `.value` is a rejection error. This type guards the current instance's
-     * `.value` property.
-     */
-    isError(): this is Overwrite<this, {
-        value: Extract<AsyncValue<Value>, Error>;
-    }>;
-    /**
-     * Checks if the current `.value` is resolved (and not an error) or still waiting. This type
-     * guards the current instance's `.value` property.
-     */
-    isNotError(): this is Overwrite<this, {
-        value: Exclude<AsyncValue<Value>, Error>;
-    }>;
-}
-/**
- * An async property created by {@link asyncProp} for use within declarative elements. Do not use
- * this directly as its internal types won't be inferred correctly.
- *
- * @category Internal
- */
-export type AsyncProp<Value, Params> = Omit<InternalAsyncPropClass<Value, Params>, 
-/** Hide these properties to make the `AsyncProp` interface much simpler. */
-'dispatch' | 'equalityCheck' | 'getListenerCount' | 'updateCallback' | 'removeListener' | 'removeAllListeners' | 'listenToEvent' | 'listen' | 'resolvedValue'>;
-/**
- * Create an async prop for a declarative element's state.
- *
- * @category Async
- */
-export declare function asyncProp<Value, Params = void>(init?: CallbackObservableInit<Value, Params>): AsyncProp<Value, Params>;