@zcomponent/core 0.0.8 → 0.0.9

package/lib/components/Gamepad.js

@@ -0,0 +1,131 @@
+import { Component } from "../component";
+import { useOnBeforeRender } from "../contexts/canvascontext";
+import { isEditTime, EnvironmentContext } from "../contexts/environmentcontext";
+import { GamepadContext } from "../contexts/gamepadcontext";
+import { Event } from "../event";
+import { Observable } from "../observable";
+/**
+ * @zcomponent
+ */
+export class Gamepad extends Component {
+    constructor(contextManager, props) {
+        super(contextManager, props);
+        /** @zprop */
+        this.onButtonDown = new Event();
+        /** @zprop */
+        this.onButtonUp = new Event();
+        /** @zprop */
+        this.onButtonSouth = new Event();
+        /** @zprop */
+        this.onButtonWest = new Event();
+        /** @zprop */
+        this.onButtonNorth = new Event();
+        /** @zprop */
+        this.onButtonEast = new Event();
+        /** @zprop */
+        this.onButtonShoulderLeft = new Event();
+        /** @zprop */
+        this.onButtonShoulderRight = new Event();
+        /** @zprop */
+        this.onButtonTriggerLeft = new Event();
+        /** @zprop */
+        this.onButtonTriggerRight = new Event();
+        /** @zprop */
+        this.onButtonDLeft = new Event();
+        /** @zprop */
+        this.onButtonDRight = new Event();
+        /** @zprop */
+        this.onButtonDUp = new Event();
+        /** @zprop */
+        this.onButtonDDown = new Event();
+        /** @zprop */
+        this.onButtonSelect = new Event();
+        /** @zprop */
+        this.onButtonStart = new Event();
+        /** @zprop */
+        this.onButtonCenter = new Event();
+        /** @zprop */
+        this.onButtonStickLeft = new Event();
+        /** @zprop */
+        this.onButtonStickRight = new Event();
+        this._indexMapping = [
+            this.onButtonSouth,
+            this.onButtonEast,
+            this.onButtonWest,
+            this.onButtonNorth,
+            this.onButtonShoulderLeft,
+            this.onButtonShoulderRight,
+            this.onButtonTriggerLeft,
+            this.onButtonTriggerRight,
+            this.onButtonSelect,
+            this.onButtonStart,
+            this.onButtonStickLeft,
+            this.onButtonStickRight,
+            this.onButtonDUp,
+            this.onButtonDDown,
+            this.onButtonDLeft,
+            this.onButtonDRight,
+            this.onButtonCenter,
+        ];
+        /**
+         * @zprop
+         */
+        this.controllerIndex = new Observable(undefined);
+        /**
+         * @zprop
+         * @zdefault 0.1
+         */
+        this.analogPressedThreshold = new Observable(0.1);
+        this._downLastFrame = new Map();
+        this._updateRegistration = () => {
+            if (isEditTime(this.contextManager))
+                this.unregister(useOnBeforeRender(this.contextManager), this._update);
+            else
+                this.register(useOnBeforeRender(this.contextManager), this._update);
+        };
+        this._update = () => {
+            if (!this.enabledResolved.value)
+                return;
+            const downEvents = [];
+            const upEvents = [];
+            const context = this.contextManager.get(GamepadContext);
+            context.forGamepadsMatchingIndex(this.controllerIndex.value, gamepad => {
+                const downLastFrame = this._downLastFrame.get(gamepad.index) ?? new Set();
+                this._downLastFrame.set(gamepad.index, downLastFrame);
+                for (let i = 0; i < gamepad.buttons.length; i++) {
+                    const button = gamepad.buttons[i];
+                    const downThisFrame = button.pressed || button.value > this.analogPressedThreshold.value;
+                    if (downThisFrame && !downLastFrame.has(i))
+                        downEvents.push({
+                            button: i,
+                            gamepad: gamepad.index,
+                            pressed: button.pressed,
+                            touched: button.touched,
+                            value: button.value
+                        });
+                    if (!downThisFrame && downLastFrame.has(i))
+                        upEvents.push({
+                            button: i,
+                            gamepad: gamepad.index,
+                            pressed: button.pressed,
+                            touched: button.touched,
+                            value: button.value
+                        });
+                    if (downThisFrame)
+                        downLastFrame.add(i);
+                    else
+                        downLastFrame.delete(i);
+                }
+            });
+            for (const evt of downEvents) {
+                this.onButtonDown.emit(evt);
+                this._indexMapping[evt.button]?.emit(evt);
+            }
+            for (const evt of upEvents) {
+                this.onButtonUp.emit(evt);
+            }
+        };
+        const environment = this.contextManager.get(EnvironmentContext);
+        this.register(environment.editTime, this._updateRegistration);
+    }
+}

package/lib/components/LongLoad.d.ts

@@ -7,7 +7,7 @@ export interface LongLoadConstructorProps {
      * @zgrouppriority 10
      * @zdefault 10
      */
-    numberOfLoads: number;
+    numberOfLoads?: number;
     /**
      * The shortest time (in milliseconds) that a given load should take
      * @zprop
@@ -40,6 +40,6 @@ export interface LongLoadConstructorProps {
  * @zicon settings
  * @zgroup Advanced
  */
-export declare class LongLoad extends Component {
-    constructor(props: LongLoadConstructorProps, contextManager: ContextManager);
+export declare class LongLoad extends Component<any, LongLoadConstructorProps> {
+    constructor(contextManager: ContextManager, props: LongLoadConstructorProps);
 }

package/lib/components/LongLoad.js

@@ -7,8 +7,8 @@ import { Component, isDevelopmentBuild, registerLoadable } from "..";
  * @zgroup Advanced
  */
 export class LongLoad extends Component {
-    constructor(props, contextManager) {
-        super(props, contextManager);
+    constructor(contextManager, props) {
+        super(contextManager, props);
         if (!props.runInProduction && !isDevelopmentBuild(contextManager))
             return;
         const minimumLoadTime = props.minimumLoadTime ?? 500;

package/lib/context.d.ts

@@ -1,28 +1,44 @@
-export interface ContextType<T extends {}> {
-    key: string;
-    hasDefault: false;
+export type ContextConstructor<ConstructorProps extends {
+    [id: string]: any;
+} = {
+    [id: string]: any;
+}> = new (contextManager: ContextManager, props: ConstructorProps) => Context<ConstructorProps>;
+type RequiredKeys<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? never : K;
+}[keyof T];
+type ConstructorProps<T> = T extends {
+    new (contextManager: ContextManager, props: infer U): any;
+} ? U : never;
+type ConstructorWithOnlyOptional<T> = RequiredKeys<ConstructorProps<T>> extends never ? T : never;
+type ConstructorWithProps<T extends ContextConstructor = ContextConstructor> = [T, ConstructorParameters<T>[1]];
+type InstancesOfConstructorsWithProps<T extends Array<ConstructorWithProps>> = {
+    [K in keyof T]: InstanceType<T[K][0]>;
+};
+export declare class Context<ConstructorPropsType extends {
+    [id: string]: any;
+} = {}> {
+    contextManager: ContextManager;
+    constructorProps: ConstructorPropsType;
+    disposed: boolean;
+    constructor(contextManager: ContextManager, constructorProps: ConstructorPropsType);
+    dispose(): never;
+    private static callSuperDispose;
 }
-export interface ContextTypeWithDefault<T extends {}, Args extends Array<any> = []> {
-    key: string;
-    hasDefault: true;
-    def: (ctx: ContextManager, ...args: Args) => T;
-}
-export declare function defineContextType<T extends {}>(): ContextType<T>;
-export declare function defineContextType<T extends {}, Args extends Array<any> = []>(def: (ctx: ContextManager, ...args: Args) => T): ContextTypeWithDefault<T, Args>;
 export declare class ContextManager {
     private _byKey;
     private _root;
-    constructor();
-    static create(): ContextManager;
-    static create<T extends {}>(type: ContextType<T>, props: T): ContextManager;
-    static create<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): ContextManager;
-    add<T extends {}>(type: ContextType<T>, obj: T): T;
-    add<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): T;
-    fork<T extends {}>(type: ContextType<T>, obj: T): [ContextManager, T];
-    fork<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): [ContextManager, T];
-    get<T extends {}>(type: ContextType<T>): T | undefined;
-    get<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): T;
-    getExisting<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>): T | undefined;
-    getOrThrow<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>): T;
-    delete<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>): void;
+    static create<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: ConstructorWithOnlyOptional<T>): ContextManager;
+    static create<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: T, props: ConstructorParameters<T>[1]): ContextManager;
+    get<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: ConstructorWithOnlyOptional<T>): InstanceType<T>;
+    get<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: T, props: ConstructorParameters<T>[1]): InstanceType<T>;
+    getExisting<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: T): InstanceType<T> | undefined;
+    getOrThrow<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: T): InstanceType<T>;
+    add<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: ConstructorWithOnlyOptional<T>): InstanceType<T>;
+    add<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: T, props: ConstructorParameters<T>[1]): InstanceType<T>;
+    fork<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: ConstructorWithOnlyOptional<T>): [ContextManager, InstanceType<T>];
+    fork<T extends new (contextManager: ContextManager, props: {}) => any>(ctx: T, props: ConstructorParameters<T>[1]): [ContextManager, InstanceType<T>];
+    forkMultiple<T extends ConstructorWithProps[]>(...ctx: T): [ContextManager, InstancesOfConstructorsWithProps<T>];
+    delete(ctx: ContextConstructor): void;
+    private _keyForContext;
 }
+export {};

package/lib/context.js

@@ -1,65 +1,154 @@
 let _nextContextKey = 1;
-export function defineContextType(def) {
-    _nextContextKey++;
-    if (def) {
-        return {
-            key: _nextContextKey.toString(),
-            hasDefault: def !== undefined,
-            def,
-        };
+export class Context {
+    constructor(contextManager, constructorProps) {
+        this.contextManager = contextManager;
+        this.constructorProps = constructorProps;
+        this.disposed = false;
+    }
+    dispose() {
+        this.disposed = true;
+        return undefined;
     }
-    else
-        return {
-            key: _nextContextKey.toString(),
-            hasDefault: false
-        };
 }
+Context.callSuperDispose = Symbol('Calling super.dispose() is mandatory');
+const keysByType = new Map();
 export class ContextManager {
     constructor() {
         this._byKey = {};
         this._root = this;
     }
-    static create(type, ...args) {
-        const ctx = new ContextManager();
-        if (type) {
-            if (type.hasDefault)
-                ctx.add(type, ...args);
-            else
-                ctx.add(type, args[0]);
-        }
-        return ctx;
+    static create(ctx, props) {
+        const ret = new ContextManager();
+        ret.add(ctx, props ?? {});
+        return ret;
+    }
+    get(ctx, props) {
+        const key = this._keyForContext(ctx);
+        const entry = this._byKey[key];
+        if (!entry)
+            return this.add(ctx, props);
+        return entry ?? this.add(ctx, props);
+    }
+    getExisting(ctx) {
+        const key = this._keyForContext(ctx);
+        return this._byKey[key];
+    }
+    getOrThrow(ctx) {
+        const entry = this.getExisting(ctx);
+        if (!entry)
+            throw new Error("Required context not present");
+        return entry;
     }
-    add(type, ...args) {
-        const root = this._root;
-        const t = type.hasDefault ? type.def(root, ...args) : args[0];
-        root._byKey[type.key] = t;
-        return t;
+    add(ctx, props) {
+        const key = this._keyForContext(ctx);
+        const ret = new ctx(this, props ?? {});
+        this._root._byKey[key] = ret;
+        return ret;
     }
-    fork(type, ...args) {
+    fork(ctx, props) {
         const ret = new ContextManager();
         ret._root = this._root;
         ret._byKey = Object.create(this._byKey);
-        const t = type.hasDefault ? type.def(ret, ...args) : args[0];
-        ret._byKey[type.key] = t;
-        return [ret, t];
+        const key = this._keyForContext(ctx);
+        const instance = new ctx(this, props ?? {});
+        this._byKey[key] = instance;
+        return [ret, instance];
     }
-    get(type, ...args) {
-        let entry = this._byKey[type.key];
-        if (!entry && type.hasDefault) {
-            entry = this.add(type, ...args);
+    forkMultiple(...ctx) {
+        const ret = new ContextManager();
+        ret._root = this._root;
+        ret._byKey = Object.create(this._byKey);
+        const instances = [];
+        for (const entry of ctx) {
+            const key = this._keyForContext(entry[0]);
+            const instance = new entry[0](ret, entry[1]);
+            ret._byKey[key] = instance;
+            instances.push(instance);
         }
-        return entry;
+        return [ret, instances];
     }
-    getExisting(type) {
-        return this._byKey[type.key];
+    delete(ctx) {
+        const key = this._keyForContext(ctx);
+        const existing = this._byKey[key];
+        existing?.dispose();
+        delete this._byKey[key];
     }
-    getOrThrow(type) {
-        const res = this._byKey[type.key];
-        if (!res)
-            throw new Error("Required context not present");
-        return res;
-    }
-    delete(type) {
-        delete this._byKey[type.key];
+    _keyForContext(ctx) {
+        let key = keysByType.get(ctx);
+        if (key === undefined) {
+            key = _nextContextKey++;
+            keysByType.set(ctx, key);
+        }
+        return key;
     }
 }
+// export function defineContextType<T extends {}>(): ContextType<T>;
+// export function defineContextType<T extends {}, Args extends Array<any> = []>(def: (ctx: ContextManager, ...args: Args) => T): ContextTypeWithDefault<T, Args>;
+// export function defineContextType<T extends {}, Args extends Array<any> = []>(def?: (ctx: ContextManager, ...args: Args) => T): ContextType<T> | ContextTypeWithDefault<T, Args> {
+// 	_nextContextKey++;
+// 	if (def) {
+// 		return {
+// 			key: _nextContextKey.toString(),
+// 			hasDefault: def !== undefined,
+// 			def,
+// 		}
+// 	} else return {
+// 		key: _nextContextKey.toString(),
+// 		hasDefault: false
+// 	}
+// }
+// export class ContextManager {
+// 	private _byKey: { [id: string]: unknown | undefined } = {};
+// 	private _root: ContextManager = this;
+// 	constructor() {
+// 	}
+// 	static create(): ContextManager;
+// 	static create<T extends {}>(type: ContextType<T>, props: T): ContextManager;
+// 	static create<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): ContextManager;
+// 	static create<T extends {}, Args extends Array<any>>(type?: ContextType<T> | ContextTypeWithDefault<T, Args>, ...args: Args): ContextManager {
+// 		const ctx = new ContextManager();
+// 		if (type) {
+// 			if (type.hasDefault) ctx.add(type, ...args);
+// 			else ctx.add(type, args[0]);
+// 		}
+// 		return ctx;
+// 	}
+// 	add<T extends {}>(type: ContextType<T>, obj: T): T;
+// 	add<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): T;
+// 	add<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>, ...args: Args): T {
+// 		const root = this._root;
+// 		const t = type.hasDefault ? type.def(root, ...args) : args[0] as T;
+// 		root._byKey[type.key] = t;
+// 		return t;
+// 	}
+// 	fork<T extends {}>(type: ContextType<T>, obj: T): [ContextManager, T];
+// 	fork<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): [ContextManager, T];
+// 	fork<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>, ...args: Args): [ContextManager, T] {
+// 		const ret = new ContextManager();
+// 		ret._root = this._root;
+// 		ret._byKey = Object.create(this._byKey);
+// 		const t = type.hasDefault ? type.def(ret, ...args) : args[0] as T;
+// 		ret._byKey[type.key] = t;
+// 		return [ret, t];
+// 	}
+// 	get<T extends {}>(type: ContextType<T>): T | undefined;
+// 	get<T extends {}, Args extends Array<any>>(type: ContextTypeWithDefault<T, Args>, ...args: Args): T;
+// 	get<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>, ...args: Args): T | undefined {
+// 		let entry = this._byKey[type.key] as T | undefined;
+// 		if (!entry && type.hasDefault) {
+// 			entry = this.add(type, ...args);
+// 		}
+// 		return entry;
+// 	}
+// 	getExisting<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>): T | undefined {
+// 		return this._byKey[type.key] as T | undefined;
+// 	}
+// 	getOrThrow<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>): T {
+// 		const res = this._byKey[type.key] as T | undefined;
+// 		if (!res) throw new Error("Required context not present");
+// 		return res;
+// 	}
+// 	delete<T extends {}, Args extends Array<any>>(type: ContextType<T> | ContextTypeWithDefault<T, Args>) {
+// 		delete this._byKey[type.key];
+// 	}
+// }

package/lib/contexts/analyticscontext.d.ts

@@ -1,9 +1,8 @@
-import { ContextManager } from '../context';
+import { ContextManager, Context } from '../context';
 import { Event } from '../event';
-export interface AnalyticsContext {
+export declare class AnalyticsContext extends Context {
     onEvent: Event<[string, any]>;
-    logEvent: (name: string, params?: any) => void;
+    logEvent(name: string, params?: any): void;
 }
-export declare const AnalyticsContext: import("../context").ContextTypeWithDefault<AnalyticsContext, []>;
 export declare function logEvent(mgr: ContextManager, name: string, params?: any): void;
 export declare function useAnalyticsOnEvent(mgr: ContextManager): Event<[string, any]>;

package/lib/contexts/analyticscontext.js

@@ -1,14 +1,14 @@
-import { defineContextType } from '../context';
+import { Context } from '../context';
 import { Event } from '../event';
-export const AnalyticsContext = defineContextType((ctx) => {
-    const onEvent = new Event();
-    return {
-        onEvent,
-        logEvent: (name, params) => {
-            onEvent.emit(name, params);
-        }
-    };
-});
+export class AnalyticsContext extends Context {
+    constructor() {
+        super(...arguments);
+        this.onEvent = new Event();
+    }
+    logEvent(name, params) {
+        this.onEvent.emit(name, params);
+    }
+}
 export function logEvent(mgr, name, params) {
     return mgr.get(AnalyticsContext).logEvent(name, params);
 }

package/lib/contexts/canvascontext.d.ts

@@ -1,19 +1,22 @@
-import { ContextManager } from '../context';
+import { ContextManager, Context } from '../context';
 import { Event } from '../event';
 import { Observable } from '../observable';
-export interface CanvasContext {
-    canvas: HTMLCanvasElement;
+export interface CanvasContextOptions {
+    canvas?: HTMLCanvasElement;
+    overlay?: HTMLDivElement;
+}
+export declare class CanvasContext extends Context {
+    constructorProps: CanvasContextOptions;
     onBeforeRender: Event<[number]>;
     onAfterRender: Event<[number]>;
-    size: Observable<[number, number]>;
-    dispose: () => void;
+    canvas: HTMLCanvasElement;
     overlayDefault: HTMLDivElement;
     overlay: Observable<HTMLDivElement>;
+    size: Observable<[number, number]>;
+    private _resizeObserver;
+    constructor(contextManager: ContextManager, constructorProps: CanvasContextOptions);
+    dispose(): never;
 }
-export interface CanvasContextOptions {
-    overlay: HTMLDivElement;
-}
-export declare const CanvasContext: import("../context").ContextTypeWithDefault<CanvasContext, [canvas?: HTMLCanvasElement | undefined, options?: CanvasContextOptions | undefined]>;
 export declare enum HorizontalAlignment {
     'left' = "left",
     'center' = "center",

package/lib/contexts/canvascontext.js

@@ -1,58 +1,63 @@
-import { defineContextType } from '../context';
+import { Context } from '../context';
 import { Event } from '../event';
 import { Observable } from '../observable';
-export const CanvasContext = defineContextType((ctx, canvas, options) => {
-    if (!canvas) {
-        canvas = document.createElement("canvas");
-        canvas.style.position = "fixed";
-        canvas.style.top = "0px";
-        canvas.style.left = "0px";
-        canvas.style.width = "100%";
-        canvas.style.height = "100%";
-        canvas.style.touchAction = "none";
-        document.body.append(canvas);
-    }
-    const overlayDefault = options?.overlay ?? document.createElement('div');
-    overlayDefault.id = 'zcomponent-overlay';
-    if (!options?.overlay) {
-        document.body.append(overlayDefault);
-    }
-    const size = new Observable([canvas.clientWidth, canvas.clientHeight]);
-    const resizeObserver = new ResizeObserver(entries => {
-        for (const entry of entries) {
-            if (entry.target !== canvas)
-                continue;
-            size.value = [entry.contentRect.width, entry.contentRect.height];
+export class CanvasContext extends Context {
+    constructor(contextManager, constructorProps) {
+        super(contextManager, constructorProps);
+        this.constructorProps = constructorProps;
+        this.onBeforeRender = new Event();
+        this.onAfterRender = new Event();
+        this._resizeObserver = new ResizeObserver(entries => {
+            for (const entry of entries) {
+                if (entry.target !== this.canvas)
+                    continue;
+                this.size.value = [entry.contentRect.width, entry.contentRect.height];
+            }
+        });
+        if (!constructorProps.canvas) {
+            this.canvas = document.createElement("canvas");
+            this.canvas.style.position = "fixed";
+            this.canvas.style.top = "0px";
+            this.canvas.style.left = "0px";
+            this.canvas.style.width = "100%";
+            this.canvas.style.height = "100%";
+            this.canvas.style.touchAction = "none";
+            document.body.append(this.canvas);
+        }
+        else {
+            this.canvas = constructorProps.canvas;
         }
-    });
-    resizeObserver.observe(canvas);
-    const onBeforeRender = new Event();
-    let lastRect;
-    onBeforeRender.bindfn(() => {
-        const rect = canvas.getBoundingClientRect();
-        if (lastRect && lastRect.top === rect.top && lastRect.left === rect.left && lastRect.width === rect.width && lastRect.height === rect.height)
-            return;
-        overlayDefault.style.top = rect.top.toString() + 'px';
-        overlayDefault.style.left = rect.left.toString() + 'px';
-        overlayDefault.style.width = rect.width.toString() + 'px';
-        overlayDefault.style.height = rect.height.toString() + 'px';
-        lastRect = rect;
-    });
-    const onAfterRender = new Event();
-    return {
-        canvas,
-        onBeforeRender,
-        onAfterRender,
-        size,
-        overlayDefault,
-        overlay: new Observable(overlayDefault, undefined, false),
-        dispose: () => {
-            onBeforeRender.clear();
-            onAfterRender.clear();
-            resizeObserver.disconnect();
+        this.overlayDefault = constructorProps.overlay ?? document.createElement('div');
+        this.overlayDefault.id = 'zcomponent-overlay';
+        if (!constructorProps.overlay) {
+            document.body.append(this.overlayDefault);
         }
-    };
-});
+        this.overlay = new Observable(this.overlayDefault, undefined, false);
+        this.size = new Observable([this.canvas.clientWidth, this.canvas.clientHeight]);
+        this._resizeObserver.observe(this.canvas);
+        let lastRect;
+        this.onBeforeRender.bindfn(() => {
+            const rect = this.canvas.getBoundingClientRect();
+            if (lastRect && lastRect.top === rect.top && lastRect.left === rect.left && lastRect.width === rect.width && lastRect.height === rect.height)
+                return;
+            this.overlayDefault.style.top = rect.top.toString() + 'px';
+            this.overlayDefault.style.left = rect.left.toString() + 'px';
+            this.overlayDefault.style.width = rect.width.toString() + 'px';
+            this.overlayDefault.style.height = rect.height.toString() + 'px';
+            lastRect = rect;
+        });
+    }
+    dispose() {
+        this.onBeforeRender.clear();
+        this.onAfterRender.clear();
+        this._resizeObserver.disconnect();
+        if (!this.constructorProps.canvas)
+            this.canvas.remove();
+        if (!this.constructorProps.overlay)
+            this.overlayDefault.remove();
+        return super.dispose();
+    }
+}
 export var HorizontalAlignment;
 (function (HorizontalAlignment) {
     HorizontalAlignment["left"] = "left";

package/lib/contexts/cookieconsentcontext.d.ts

@@ -1,4 +1,4 @@
-import { ContextManager } from '../context';
+import { ContextManager, Context } from '../context';
 import { Observable } from '../observable';
 export declare enum Status {
     "unknown" = "unknown",
@@ -15,18 +15,17 @@ export interface Vendor {
     description: string;
     privacyPolicyUrl: string;
 }
-export interface CookieConsentContext {
-    status: Observable<Status>;
-    functionalCookies: Observable<ConsentStatus>;
-    performanceCookies: Observable<ConsentStatus>;
-    marketingCookies: Observable<ConsentStatus>;
+export declare class CookieConsentContext extends Context {
+    status: Observable<Status, never>;
+    functionalCookies: Observable<ConsentStatus, never>;
+    performanceCookies: Observable<ConsentStatus, never>;
+    marketingCookies: Observable<ConsentStatus, never>;
+    showSettings: Observable<(() => void) | undefined, never>;
     performanceVendors: Vendor[];
     marketingVendors: Vendor[];
-    registerPerformanceVendor: (v: Vendor) => void;
-    registerMarketingVendor: (v: Vendor) => void;
-    showSettings: Observable<(() => void) | undefined>;
+    registerPerformanceVendor(v: Vendor): void;
+    registerMarketingVendor(v: Vendor): void;
 }
-export declare const CookieConsentContext: import("../context").ContextTypeWithDefault<CookieConsentContext, []>;
 export declare function useCookieConsentFunctional(mgr: ContextManager): Observable<ConsentStatus, never>;
 export declare function useCookieConsentPerformance(mgr: ContextManager): Observable<ConsentStatus, never>;
 export declare function useCookieConsentMarketing(mgr: ContextManager): Observable<ConsentStatus, never>;