element-vir 18.0.0 → 19.0.0

package/README.md

@@ -637,7 +637,7 @@ export const MyWithRenderIf = defineElement<{shouldRender: boolean}>()({
 
 ### `asyncProp`
 
-Use `renderAsync` or `isRenderReady` in conjunction with `asyncProp` to seamlessly render and update element state based on async values:
+Use `renderAsync` or `isResolved` in conjunction with `asyncProp` to seamlessly render and update element state based on async values:
 
 <!-- example-link: src/readme-examples/my-with-async-prop.element.ts -->
 

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

@@ -47,7 +47,7 @@ export interface StaticDeclarativeElementProperties<TagName extends CustomElemen
     assignedInputs: Inputs | undefined;
     /** Pass through the render callback for direct unit testability */
     readonly renderCallback: RenderCallback<TagName, Inputs, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutputGeneric>;
-    readonly events: EventDescriptorMap<EventsInit>;
+    readonly events: EventDescriptorMap<TagName, EventsInit>;
     readonly stateInitStatic: ElementPropertyDescriptorMap<StateInit>;
     readonly init: RequiredBy<DeclarativeElementInit<TagName, Inputs, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutputGeneric>, 'stateInitStatic' | 'events'>;
     readonly inputsType: Inputs;

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

@@ -2,7 +2,7 @@ var __setFunctionName = (this && this.__setFunctionName) || function (f, name, p
     if (typeof name === "symbol") name = name.description ? "[".concat(name.description, "]") : "";
     return Object.defineProperty(f, "name", { configurable: true, value: prefix ? "".concat(prefix, " ", name) : name });
 };
-import { ensureError, getObjectTypedKeys, kebabCaseToCamelCase, } from '@augment-vir/common';
+import { ensureErrorAndPrependMessage, extractErrorMessage, getObjectTypedKeys, kebabCaseToCamelCase, } from '@augment-vir/common';
 import { defineCssVars } from 'lit-css-vars';
 import { css } from '../template-transforms/vir-css/vir-css';
 import { DeclarativeElement, } from './declarative-element';
@@ -10,7 +10,7 @@ import { IgnoreInputsNotBeenSetBeforeWarningSymbol, defaultDeclarativeElementDef
 import { hasDeclarativeElementParent } from './has-declarative-element-parent';
 import { assignInputs } from './properties/assign-inputs';
 import { assertValidCssProperties } from './properties/css-properties';
-import { createEventDescriptorMap } from './properties/element-events';
+import { createEventDescriptorMap, } from './properties/element-events';
 import { bindReactiveProperty, createElementUpdaterProxy } from './properties/element-updater-proxy';
 import { createHostClassNamesMap } from './properties/host-classes';
 import { applyHostClasses, hostClassNamesToStylesInput } from './properties/styles';
@@ -101,10 +101,9 @@ export function defineElementNoInputs(initInput) {
                     return renderResult;
                 }
                 catch (caught) {
-                    const error = ensureError(caught);
-                    error.message = `Failed to render '${initInput.tagName}': ${error.message}`;
+                    const error = ensureErrorAndPrependMessage(caught, `Failed to render ${initInput.tagName}`);
                     this._lastRenderError = error;
-                    throw error;
+                    return extractErrorMessage(error);
                 }
             }
             connectedCallback() {

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

@@ -1,5 +1,4 @@
-import { AsyncDirective } from 'lit/async-directive.js';
-import { PartInfo } from 'lit/directive.js';
+import { AsyncDirective, PartInfo } from '../../lit-exports';
 import { ElementDefinitionWithInputsType } from './assign.directive';
 export type CleanupCallback<T> = (oldValue: T) => void;
 /**

package/dist/declarative-element/directives/assign-with-clean-up.directive.js

@@ -1,6 +1,4 @@
-import { AsyncDirective } from 'lit/async-directive.js';
-import { directive } from 'lit/directive.js';
-import { noChange } from '../../lit-exports';
+import { AsyncDirective, directive, noChange } from '../../lit-exports';
 import { assignInputs } from '../properties/assign-inputs';
 import { extractElement } from './directive-helpers';
 /**

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

@@ -1,4 +1,4 @@
-import { DirectiveResult } from 'lit/directive.js';
+import { DirectiveResult } from '../../lit-exports';
 import { PropertyInitMapBase } from '../properties/element-properties';
 export type ElementDefinitionWithInputsType<InputsType extends PropertyInitMapBase = PropertyInitMapBase> = {
     inputsType: InputsType;

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

@@ -1,5 +1,4 @@
-import { directive, Directive } from 'lit/directive.js';
-import { noChange } from '../../lit-exports';
+import { directive, Directive, noChange } from '../../lit-exports';
 import { assignInputs } from '../properties/assign-inputs';
 import { extractElement } from './directive-helpers';
 /**

package/dist/declarative-element/directives/create-attribute-directive.d.ts

@@ -1,4 +1,4 @@
-import { PartInfo } from 'lit/directive.js';
+import { PartInfo } from '../../lit-exports';
 export declare function createAttributeDirective(attributeName: string): {
     attributeSelector(attributeValue: string): string;
     attributeDirective(attributeValue: string): import("lit-html/directive").DirectiveResult<{

package/dist/declarative-element/directives/create-attribute-directive.js

@@ -1,5 +1,4 @@
-import { directive, Directive } from 'lit/directive.js';
-import { noChange } from '../../lit-exports';
+import { directive, Directive, noChange } from '../../lit-exports';
 import { extractElement } from './directive-helpers';
 export function createAttributeDirective(attributeName) {
     const newDirective = directive(

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

@@ -1,4 +1,4 @@
-import { ElementPartInfo, PartInfo } from 'lit/directive.js';
+import { ElementPartInfo, PartInfo } from '../../lit-exports';
 /** For some reason these aren't defined in lit's types already. */
 export type ExtraPartInfoProperties = {
     element: Element;

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

@@ -1,4 +1,4 @@
-import { PartType } from 'lit/directive.js';
+import { PartType } from '../../lit-exports';
 export function extractElement(partInfo, directiveName) {
     assertIsElementPartInfo(partInfo, directiveName);
     const element = partInfo.element;

package/dist/declarative-element/directives/is-resolved.directive.d.ts

@@ -0,0 +1,4 @@
+import { AsyncPropValue } from './async-prop';
+export declare function isResolved<Value extends AsyncPropValue<any>>(asyncPropInput: Value): asyncPropInput is Exclude<Value, Promise<any>>;
+export declare function isError(asyncPropInput: unknown): asyncPropInput is Error;
+export declare function resolvedOrUndefined<Value extends AsyncPropValue<any>>(asyncPropInput: Value): Exclude<Value, Promise<any>> | undefined;

package/dist/declarative-element/directives/is-resolved.directive.js

@@ -0,0 +1,15 @@
+import { isPromiseLike } from '@augment-vir/common';
+export function isResolved(asyncPropInput) {
+    return !isPromiseLike(asyncPropInput);
+}
+export function isError(asyncPropInput) {
+    return asyncPropInput instanceof Error;
+}
+export function resolvedOrUndefined(asyncPropInput) {
+    if (isResolved(asyncPropInput)) {
+        return asyncPropInput;
+    }
+    else {
+        return undefined;
+    }
+}

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

@@ -1,4 +1,4 @@
-import { DirectiveResult } from 'lit/directive.js';
+import { DirectiveResult } from '../../lit-exports';
 import { DefinedTypedEvent, TypedEvent } from '../../typed-event/typed-event';
 /**
  * Listen to events. These can be native DOM events (use a string for the inputType argument) or

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

@@ -1,5 +1,4 @@
-import { directive, Directive } from 'lit/directive.js';
-import { noChange } from '../../lit-exports';
+import { directive, Directive, noChange } from '../../lit-exports';
 import { extractElement } from './directive-helpers';
 export function listen(eventType, listener) {
     return listenDirective(eventType, listener);

package/dist/declarative-element/directives/on-dom-created.directive.d.ts

@@ -1,4 +1,4 @@
-import { PartInfo } from 'lit/directive.js';
+import { PartInfo } from '../../lit-exports';
 export type OnDomCreatedCallback = (element: Element) => void;
 /** Only fires once, when the element has been created. */
 export declare const onDomCreated: (callback: OnDomCreatedCallback) => import("lit-html/directive").DirectiveResult<{

package/dist/declarative-element/directives/on-dom-created.directive.js

@@ -1,4 +1,4 @@
-import { directive, Directive } from 'lit/directive.js';
+import { directive, Directive } from '../../lit-exports';
 import { assertIsElementPartInfo } from './directive-helpers';
 const directiveName = 'onDomCreated';
 /** Only fires once, when the element has been created. */

package/dist/declarative-element/directives/on-resize.directive.d.ts

@@ -1,4 +1,4 @@
-import { PartInfo } from 'lit/directive.js';
+import { PartInfo } from '../../lit-exports';
 export type OnResizeCallback = (
 /** Only these two properties are supported in all major modern browsers */
 size: Readonly<Pick<ResizeObserverEntry, 'target' | 'contentRect'>>, element: Element) => void;

package/dist/declarative-element/directives/on-resize.directive.js

@@ -1,4 +1,4 @@
-import { directive, Directive } from 'lit/directive.js';
+import { directive, Directive } from '../../lit-exports';
 import { assertIsElementPartInfo } from './directive-helpers';
 const directiveName = 'onResize';
 export const onResize = directive(

package/dist/declarative-element/directives/render-if.directive.js

@@ -1,5 +1,4 @@
-import { when } from 'lit/directives/when.js';
-const notSetSymbol = Symbol('not set');
+import { when } from '../../lit-exports';
 export function renderIf(condition, ifTrue, ifFalse) {
     return when(condition, () => ifTrue, () => ifFalse);
 }

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

@@ -3,9 +3,9 @@ import { CustomElementTagName } from '../custom-tag-name';
 export type EventsInitMap = Record<string, DefinedTypedEventNameDefinition<any>>;
 export declare function defineElementEvent<EventDetailGeneric>(): DefinedTypedEventNameDefinition<EventDetailGeneric>;
 export type EventInitMapEventDetailExtractor<EventTypeNameGeneric extends keyof EventsInitGeneric, EventsInitGeneric extends EventsInitMap> = EventsInitGeneric[EventTypeNameGeneric] extends DefinedTypedEventNameDefinition<infer R> ? R : never;
-export type EventDescriptorMap<EventsInitGeneric extends EventsInitMap> = {
-    [CurrentEventTypeName in keyof EventsInitGeneric]: DefinedTypedEvent<CurrentEventTypeName extends string ? CurrentEventTypeName : never, EventInitMapEventDetailExtractor<CurrentEventTypeName, EventsInitGeneric>>;
+export type EventDescriptorMap<TagName extends CustomElementTagName, EventsInitGeneric extends EventsInitMap> = {
+    [CurrentEventTypeName in keyof EventsInitGeneric]: DefinedTypedEvent<CurrentEventTypeName extends string ? `${TagName}-${CurrentEventTypeName}` : never, EventInitMapEventDetailExtractor<CurrentEventTypeName, EventsInitGeneric>>;
 };
 export type EventObjectEventDetailExtractor<EventObjectGeneric extends DefinedTypedEvent<any, any>> = EventObjectGeneric extends DefinedTypedEvent<string, infer R> ? R : never;
 export type ElementEventDetailExtractor<ElementEventGeneric extends TypedEvent<any, any>> = ElementEventGeneric extends TypedEvent<string, infer R> ? R : never;
-export declare function createEventDescriptorMap<EventsInitGeneric extends EventsInitMap>(tagName: CustomElementTagName, eventsInit: EventsInitGeneric | undefined): EventDescriptorMap<EventsInitGeneric>;
+export declare function createEventDescriptorMap<TagName extends CustomElementTagName, EventsInitGeneric extends EventsInitMap>(tagName: CustomElementTagName, eventsInit: EventsInitGeneric | undefined): EventDescriptorMap<TagName, EventsInitGeneric>;

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

@@ -20,7 +20,7 @@ export function createEventDescriptorMap(tagName, eventsInit) {
         const eventObject = defineTypedEvent()([
             tagName,
             currentElementEventKey,
-        ].join('_'));
+        ].join('-'));
         accum[currentElementEventKey] = eventObject;
         return accum;
     }, {});

package/dist/declarative-element/properties/element-updater-proxy.js

@@ -1,4 +1,4 @@
-import { property } from 'lit/decorators.js';
+import { property } from '../../lit-exports';
 import { isElementVirStateSetup } from './element-vir-state-setup';
 import { isObservableProp } from './observable-prop/observable-prop';
 /** Binds the given property key as a reactive property on the given element. */

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

@@ -11,9 +11,9 @@ export type UpdateStateCallback<StateInit extends PropertyInitMapBase> = <const
 export type RenderParams<TagName extends CustomElementTagName, Inputs extends PropertyInitMapBase, StateInit extends PropertyInitMapBase, EventsInit extends EventsInitMap, HostClassKeys extends BaseCssPropertyName<TagName>, CssVarKeys extends BaseCssPropertyName<TagName>> = {
     state: Readonly<FlattenElementVirStateSetup<StateInit>>;
     updateState: UpdateStateCallback<StateInit>;
-    events: EventDescriptorMap<EventsInit>;
+    events: EventDescriptorMap<TagName, EventsInit>;
     host: DeclarativeElementHost<TagName, Inputs, StateInit, EventsInit, HostClassKeys, CssVarKeys>;
     dispatch: <EventTypeName extends keyof EventsInit>(event: TypedEvent<EventTypeName extends string ? EventTypeName : never, EventInitMapEventDetailExtractor<EventTypeName, EventsInit>> | Event) => boolean;
     inputs: Readonly<Inputs>;
 };
-export declare function createRenderParams<TagName extends CustomElementTagName, Inputs extends PropertyInitMapBase, StateInit extends PropertyInitMapBase, EventsInit extends EventsInitMap, HostClassKeys extends BaseCssPropertyName<TagName>, CssVarKeys extends BaseCssPropertyName<TagName>, RenderOutput>(element: DeclarativeElement<TagName, Inputs, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutput>, eventsMap: EventDescriptorMap<EventsInit>): RenderParams<TagName, Inputs, StateInit, EventsInit, HostClassKeys, CssVarKeys>;
+export declare function createRenderParams<TagName extends CustomElementTagName, Inputs extends PropertyInitMapBase, StateInit extends PropertyInitMapBase, EventsInit extends EventsInitMap, HostClassKeys extends BaseCssPropertyName<TagName>, CssVarKeys extends BaseCssPropertyName<TagName>, RenderOutput>(element: DeclarativeElement<TagName, Inputs, StateInit, EventsInit, HostClassKeys, CssVarKeys, RenderOutput>, eventsMap: EventDescriptorMap<TagName, EventsInit>): RenderParams<TagName, Inputs, StateInit, EventsInit, HostClassKeys, CssVarKeys>;

package/dist/index.d.ts

@@ -9,7 +9,7 @@ export * from './declarative-element/directives/assign.directive';
 export * from './declarative-element/directives/async-prop';
 export * from './declarative-element/directives/create-attribute-directive';
 export * from './declarative-element/directives/directive-helpers';
-export * from './declarative-element/directives/is-render-ready.directive';
+export * from './declarative-element/directives/is-resolved.directive';
 export * from './declarative-element/directives/listen.directive';
 export * from './declarative-element/directives/on-dom-created.directive';
 export * from './declarative-element/directives/on-resize.directive';

package/dist/index.js

@@ -8,7 +8,7 @@ export * from './declarative-element/directives/assign.directive';
 export * from './declarative-element/directives/async-prop';
 export * from './declarative-element/directives/create-attribute-directive';
 export * from './declarative-element/directives/directive-helpers';
-export * from './declarative-element/directives/is-render-ready.directive';
+export * from './declarative-element/directives/is-resolved.directive';
 export * from './declarative-element/directives/listen.directive';
 export * from './declarative-element/directives/on-dom-created.directive';
 export * from './declarative-element/directives/on-resize.directive';

package/dist/lit-exports.d.ts

@@ -1,5 +1,7 @@
 export { LitElement, noChange, svg, unsafeCSS } from 'lit';
 export type { CSSResult, CSSResultGroup, CompiledTemplate, CompiledTemplateResult, HTMLTemplateResult, SVGTemplateResult, TemplateResult, } from 'lit';
+export * from 'lit/async-directive.js';
+export * from 'lit/decorators.js';
 export * from 'lit/directive.js';
 export * from 'lit/directives/async-append.js';
 export * from 'lit/directives/async-replace.js';

package/dist/lit-exports.js

@@ -1,4 +1,6 @@
 export { LitElement, noChange, svg, unsafeCSS } from 'lit';
+export * from 'lit/async-directive.js';
+export * from 'lit/decorators.js';
 export * from 'lit/directive.js';
 export * from 'lit/directives/async-append.js';
 export * from 'lit/directives/async-replace.js';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "element-vir",
-    "version": "18.0.0",
+    "version": "19.0.0",
     "keywords": [
         "custom",
         "web",
@@ -40,7 +40,7 @@
         "test:types": "tsc --noEmit"
     },
     "dependencies": {
-        "@augment-vir/common": "^22.1.0",
+        "@augment-vir/common": "^22.1.1",
         "date-vir": "^5.0.0",
         "lit": "^3.1.0",
         "lit-css-vars": "^3.0.7",
@@ -49,8 +49,8 @@
         "run-time-assertions": "^0.2.1"
     },
     "devDependencies": {
-        "@augment-vir/browser-testing": "^22.1.0",
-        "@augment-vir/node-js": "^22.1.0",
+        "@augment-vir/browser-testing": "^22.1.1",
+        "@augment-vir/node-js": "^22.1.1",
         "@istanbuljs/nyc-config-typescript": "^1.0.2",
         "@open-wc/testing": "^4.0.0",
         "@types/chai": "^4.3.11",
@@ -62,11 +62,11 @@
         "@web/test-runner-visual-regression": "^0.9.0",
         "ansi-colors": "^4.1.3",
         "concurrently": "^8.2.2",
-        "cspell": "^8.1.3",
+        "cspell": "^8.2.1",
         "dependency-cruiser": "^15.5.0",
-        "element-book": "^10.1.9",
+        "element-book": "^10.1.10",
         "element-vir": "file:./",
-        "esbuild": "^0.19.9",
+        "esbuild": "^0.19.10",
         "istanbul-smart-text-reporter": "^1.1.3",
         "markdown-code-example-inserter": "^0.3.3",
         "mocha-spec-reporter-with-file-names": "^0.0.3",
@@ -84,8 +84,8 @@
         "type-fest": "^4.8.3",
         "typedoc": "^0.25.4",
         "typescript": "~5.2.2",
-        "vira": "^2.5.4",
-        "virmator": "^11.1.4",
+        "vira": "^2.5.5",
+        "virmator": "^11.1.5",
         "vite": "^4.5.0",
         "vite-tsconfig-paths": "^4.2.2"
     },

package/dist/declarative-element/directives/is-render-ready.directive.d.ts

@@ -1,4 +0,0 @@
-import { AsyncPropValue } from './async-prop';
-export declare function isRenderReady<T>(asyncPropInput: AsyncPropValue<T>): asyncPropInput is Awaited<T>;
-export declare function isResolved<T>(asyncPropInput: AsyncPropValue<T>): asyncPropInput is Exclude<AsyncPropValue<T>, Promise<T>>;
-export declare function readyOrUndefined<T>(asyncPropInput: AsyncPropValue<T>): Awaited<T> | undefined;

package/dist/declarative-element/directives/is-render-ready.directive.js

@@ -1,28 +0,0 @@
-import { isPromiseLike } from '@augment-vir/common';
-export function isRenderReady(asyncPropInput) {
-    if (asyncPropInput instanceof Error) {
-        return false;
-    }
-    else if (isPromiseLike(asyncPropInput)) {
-        return false;
-    }
-    else {
-        return true;
-    }
-}
-export function isResolved(asyncPropInput) {
-    if (isPromiseLike(asyncPropInput)) {
-        return false;
-    }
-    else {
-        return true;
-    }
-}
-export function readyOrUndefined(asyncPropInput) {
-    if (isRenderReady(asyncPropInput)) {
-        return asyncPropInput;
-    }
-    else {
-        return undefined;
-    }
-}