@playcanvas/web-components 0.8.1 → 0.9.0

package/dist/app.d.ts

@@ -22,10 +22,13 @@ declare class AppElement extends AsyncElement {
     private _hasPointerListeners;
     private _hoveredEntity;
     private _pointerHandlers;
+    private _app;
     /**
-     * The PlayCanvas application instance.
+     * The PlayCanvas application instance. Available once the element is ready — await
+     * {@link whenReady} or the element's `ready()` promise before accessing it.
+     * @returns The application instance.
      */
-    app: AppBase | null;
+    get app(): AppBase;
     /**
      * Creates a new AppElement instance.
      *
@@ -113,4 +116,9 @@ declare class AppElement extends AsyncElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-app': AppElement;
+    }
+}
 export { AppElement };

package/dist/asset.d.ts

@@ -1,16 +1,26 @@
 import { Asset } from 'playcanvas';
+import { AsyncElement } from './async-element';
 /**
  * The AssetElement interface provides properties and methods for manipulating
  * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-asset/ | `<pc-asset>`} elements.
  * The AssetElement interface also inherits the properties and methods of the
  * {@link HTMLElement} interface.
+ *
+ * The element becomes ready once the containing application has started and the asset is in the
+ * state declared by the markup: loaded for preloaded assets (even if loading failed — check the
+ * asset's `resource`), or registered and awaiting a load for `lazy` assets. Elements inserted
+ * while the application is running are created and registered on insertion, and begin loading
+ * immediately unless `lazy`. A `pc-asset` must be a direct child of `pc-app` — elements placed
+ * elsewhere, or with an unsupported asset type, never become ready.
  */
-declare class AssetElement extends HTMLElement {
+declare class AssetElement extends AsyncElement {
     private _lazy;
     /**
-     * The asset that is loaded.
+     * The asset that is loaded. Available once the element is ready — await
+     * {@link whenReady} or the element's `ready()` promise before accessing it.
      */
     asset: Asset | null;
+    connectedCallback(): Promise<void>;
     disconnectedCallback(): void;
     createAsset(): void;
     /**
@@ -34,6 +44,11 @@ declare class AssetElement extends HTMLElement {
     get lazy(): boolean;
     static get(id: string): Asset | null | undefined;
     static get observedAttributes(): string[];
-    attributeChangedCallback(name: string, _oldValue: string, _newValue: string): void;
+    attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-asset': AssetElement;
+    }
 }
 export { AssetElement };

package/dist/async-element.d.ts

@@ -11,14 +11,61 @@ declare class AsyncElement extends HTMLElement {
     get closestApp(): AppElement;
     get closestEntity(): EntityElement;
     /**
-     * Called when the element is fully initialized and ready.
-     * Subclasses should call this when they're ready.
+     * Called when the element is fully initialized and ready. Subclasses should call this when
+     * they're ready. Resolves the ready promise and dispatches a bubbling, composed `ready`
+     * event.
      */
     protected _onReady(): void;
     /**
-     * Returns a promise that resolves with this element when it's ready.
+     * Returns a promise that resolves with this element when it's ready. This is the low-level
+     * primitive underlying {@link whenReady}, which is the recommended way to wait for elements.
      * @returns A promise that resolves with this element when it's ready.
      */
     ready(): Promise<this>;
 }
-export { AsyncElement };
+/**
+ * A union of the tag names of all elements that initialize asynchronously (i.e. elements whose
+ * classes extend {@link AsyncElement}).
+ */
+type AsyncElementTagName = {
+    [K in keyof HTMLElementTagNameMap]: HTMLElementTagNameMap[K] extends AsyncElement ? K : never;
+}[keyof HTMLElementTagNameMap];
+/**
+ * Waits for the first element matching the given tag name to be fully initialized. Note that the
+ * promise never settles if the element cannot finish initializing (for example, a `<pc-script>`
+ * that is not a direct child of `<pc-scripts>`). A component element outside a `<pc-entity>` is
+ * the exception: it still becomes ready, but its `component` is `null`. Either way, a misplaced
+ * element logs a warning naming the parent it requires.
+ * @param target - The tag name of the element to wait for (e.g. `'pc-app'`).
+ * @returns A promise that resolves with the element once it's ready.
+ * @example
+ * const { app } = await whenReady('pc-app');
+ */
+declare function whenReady<K extends AsyncElementTagName>(target: K): Promise<HTMLElementTagNameMap[K]>;
+/**
+ * Waits for the given element to be fully initialized. Note that the promise never settles if
+ * the element cannot finish initializing (for example, an element that is never added to the
+ * document).
+ * @param target - The element to wait for.
+ * @returns A promise that resolves with the element once it's ready.
+ * @example
+ * const appElement = document.createElement('pc-app');
+ * document.body.appendChild(appElement);
+ * const { app } = await whenReady(appElement);
+ */
+declare function whenReady<T extends AsyncElement>(target: T): Promise<T>;
+/**
+ * Waits for the first element matching the given CSS selector to be fully initialized. Note that
+ * the promise never settles if the element cannot finish initializing (for example, a `<pc-script>`
+ * that is not a direct child of `<pc-scripts>`). A component element outside a `<pc-entity>` is
+ * the exception: it still becomes ready, but its `component` is `null`. Either way, a misplaced
+ * element logs a warning naming the parent it requires.
+ * @param target - A CSS selector matching the element to wait for (e.g. `'#my-app'`).
+ * @returns A promise that resolves with the element once it's ready.
+ * @example
+ * // In TypeScript, supply the element type when using an arbitrary selector
+ * const { entity } = await whenReady<EntityElement>('pc-entity[name="camera"]');
+ */
+declare function whenReady<T extends AsyncElement = AsyncElement, S extends string = string>(target: S extends Exclude<keyof HTMLElementTagNameMap, AsyncElementTagName> ? never : S): Promise<T>;
+export { AsyncElement, whenReady };
+export type { AsyncElementTagName };

package/dist/components/button-component.d.ts

@@ -30,7 +30,7 @@ declare class ButtonComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas button component.
      * @returns The button component.
      */
-    get component(): ButtonComponent | null;
+    get component(): ButtonComponent;
     /**
      * Sets whether the button is active and responds to input.
      * @param value - Whether the button is active.
@@ -63,15 +63,16 @@ declare class ButtonComponentElement extends ComponentElement {
      */
     get hitPadding(): Vec4;
     /**
-     * Sets how the button reacts to being hovered/pressed. Can be `tint` (0) or `sprite` (1).
+     * Sets how the button reacts to being hovered/pressed. Can be `tint` or `sprite`. Defaults to
+     * `tint`.
      * @param value - The transition mode.
      */
-    set transitionMode(value: number);
+    set transitionMode(value: 'tint' | 'sprite');
     /**
      * Gets how the button reacts to being hovered/pressed.
      * @returns The transition mode.
      */
-    get transitionMode(): number;
+    get transitionMode(): "tint" | "sprite";
     /**
      * Sets the tint color applied to the image entity when the button is hovered (tint transition
      * mode).
@@ -181,4 +182,9 @@ declare class ButtonComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-button': ButtonComponentElement;
+    }
+}
 export { ButtonComponentElement };

package/dist/components/camera-component.d.ts

@@ -42,14 +42,14 @@ declare class CameraComponentElement extends ComponentElement {
         gammaCorrection: 0 | 1;
         horizontalFov: boolean;
         nearClip: number;
-        orthographic: boolean;
+        projection: 0 | 1;
         orthoHeight: number;
         priority: number;
         rect: Vec4;
         scissorRect: Vec4;
-        toneMapping: 0 | 3 | 1 | 2 | 4 | 5 | 6 | undefined;
+        toneMapping: number | undefined;
     };
-    get xrAvailable(): boolean | null | undefined;
+    get xrAvailable(): boolean | null;
     /**
      * Starts the camera in XR mode.
      * @param type - The type of XR mode to start.
@@ -64,7 +64,7 @@ declare class CameraComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas camera component.
      * @returns The camera component.
      */
-    get component(): CameraComponent | null;
+    get component(): CameraComponent;
     /**
      * Sets the clear color of the camera.
      * @param value - The clear color.
@@ -249,4 +249,9 @@ declare class CameraComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-camera': CameraComponentElement;
+    }
+}
 export { CameraComponentElement };

package/dist/components/collision-component.d.ts

@@ -27,13 +27,13 @@ declare class CollisionComponentElement extends ComponentElement {
         height: number;
         linearOffset: Vec3;
         radius: number;
-        type: string;
+        type: "box" | "capsule" | "compound" | "cone" | "cylinder" | "mesh" | "sphere";
     };
     /**
      * Gets the underlying PlayCanvas collision component.
      * @returns The collision component.
      */
-    get component(): CollisionComponent | null;
+    get component(): CollisionComponent;
     set angularOffset(value: Quat);
     get angularOffset(): Quat;
     set axis(value: number);
@@ -48,9 +48,14 @@ declare class CollisionComponentElement extends ComponentElement {
     get linearOffset(): Vec3;
     set radius(value: number);
     get radius(): number;
-    set type(value: string);
-    get type(): string;
+    set type(value: 'box' | 'capsule' | 'compound' | 'cone' | 'cylinder' | 'mesh' | 'sphere');
+    get type(): "box" | "capsule" | "compound" | "cone" | "cylinder" | "mesh" | "sphere";
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-collision': CollisionComponentElement;
+    }
+}
 export { CollisionComponentElement };

package/dist/components/component.d.ts

@@ -9,6 +9,7 @@ declare class ComponentElement extends AsyncElement {
     private _componentName;
     private _enabled;
     private _component;
+    private _appElement;
     /**
      * Creates a new ComponentElement instance.
      *
@@ -21,7 +22,12 @@ declare class ComponentElement extends AsyncElement {
     initComponent(): void;
     connectedCallback(): Promise<void>;
     disconnectedCallback(): void;
-    get component(): Component | null;
+    /**
+     * The PlayCanvas component instance. Available once the element is ready — await
+     * {@link whenReady} or the element's `ready()` promise before accessing it.
+     * @returns The component instance.
+     */
+    get component(): Component;
     /**
      * Sets the enabled state of the component.
      * @param value - The enabled state of the component.

package/dist/components/element-component.d.ts

@@ -10,13 +10,13 @@ import { ComponentElement } from './component';
  */
 declare class ElementComponentElement extends ComponentElement {
     private _anchor;
-    private _asset;
     private _autoWidth;
     private _autoHeight;
     private _autoFitWidth;
     private _autoFitHeight;
     private _color;
     private _enableMarkup;
+    private _fontAsset;
     private _fontSize;
     private _maxFontSize;
     private _minFontSize;
@@ -43,7 +43,7 @@ declare class ElementComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas element component.
      * @returns The element component.
      */
-    get component(): ElementComponent | null;
+    get component(): ElementComponent;
     /**
      * Sets the anchor of the element component.
      * @param value - The anchor.
@@ -54,16 +54,6 @@ declare class ElementComponentElement extends ComponentElement {
      * @returns The anchor.
      */
     get anchor(): Vec4;
-    /**
-     * Sets the id of the `pc-asset` to use for the font (text elements).
-     * @param value - The asset ID.
-     */
-    set asset(value: string);
-    /**
-     * Gets the id of the `pc-asset` to use for the font.
-     * @returns The asset ID.
-     */
-    get asset(): string;
     /**
      * Sets whether the element component should automatically adjust its width to the text content
      * (text elements only).
@@ -106,6 +96,16 @@ declare class ElementComponentElement extends ComponentElement {
      * @returns Whether markup is enabled.
      */
     get enableMarkup(): boolean;
+    /**
+     * Sets the id of the `pc-asset` to use for the font (text elements).
+     * @param value - The font asset ID.
+     */
+    set fontAsset(value: string);
+    /**
+     * Gets the id of the `pc-asset` to use for the font.
+     * @returns The font asset ID.
+     */
+    get fontAsset(): string;
     /**
      * Sets the font size of the element component.
      * @param value - The font size.
@@ -312,4 +312,9 @@ declare class ElementComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-element': ElementComponentElement;
+    }
+}
 export { ElementComponentElement };

package/dist/components/gsplat-component.d.ts

@@ -29,7 +29,7 @@ declare class GSplatComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas gsplat component.
      * @returns The gsplat component.
      */
-    get component(): GSplatComponent | null;
+    get component(): GSplatComponent;
     /**
      * Sets id of the `pc-asset` to use for the splat.
      * @param value - The asset ID.
@@ -105,4 +105,9 @@ declare class GSplatComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-gsplat': GSplatComponentElement;
+    }
+}
 export { GSplatComponentElement };

package/dist/components/layoutchild-component.d.ts

@@ -31,7 +31,7 @@ declare class LayoutChildComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas layout child component.
      * @returns The layout child component.
      */
-    get component(): LayoutChildComponent | null;
+    get component(): LayoutChildComponent;
     /**
      * Sets the minimum width the element should be laid out with.
      * @param value - The minimum width.
@@ -107,4 +107,9 @@ declare class LayoutChildComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-layoutchild': LayoutChildComponentElement;
+    }
+}
 export { LayoutChildComponentElement };

package/dist/components/layoutgroup-component.d.ts

@@ -21,31 +21,32 @@ declare class LayoutGroupComponentElement extends ComponentElement {
     /** @ignore */
     constructor();
     getInitialComponentData(): {
-        orientation: number;
+        orientation: number | undefined;
         reverseX: boolean;
         reverseY: boolean;
         alignment: Vec2;
         padding: Vec4;
         spacing: Vec2;
-        widthFitting: number;
-        heightFitting: number;
+        widthFitting: number | undefined;
+        heightFitting: number | undefined;
         wrap: boolean;
     };
     /**
      * Gets the underlying PlayCanvas layout group component.
      * @returns The layout group component.
      */
-    get component(): LayoutGroupComponent | null;
+    get component(): LayoutGroupComponent;
     /**
-     * Sets the orientation of the layout group. Can be `horizontal` (0) or `vertical` (1).
+     * Sets the orientation of the layout group. Can be `horizontal` or `vertical`. Defaults to
+     * `horizontal`.
      * @param value - The orientation.
      */
-    set orientation(value: number);
+    set orientation(value: 'horizontal' | 'vertical');
     /**
      * Gets the orientation of the layout group.
      * @returns The orientation.
      */
-    get orientation(): number;
+    get orientation(): "horizontal" | "vertical";
     /**
      * Sets whether the order of children is reversed along the horizontal axis.
      * @param value - Whether to reverse the horizontal order.
@@ -97,27 +98,27 @@ declare class LayoutGroupComponentElement extends ComponentElement {
      */
     get spacing(): Vec2;
     /**
-     * Sets the fitting mode along the horizontal axis. Can be `none` (0), `stretch` (1), `shrink`
-     * (2) or `both` (3).
+     * Sets the fitting mode along the horizontal axis. Can be `none`, `stretch`, `shrink` or
+     * `both`. Defaults to `none`.
      * @param value - The width fitting mode.
      */
-    set widthFitting(value: number);
+    set widthFitting(value: 'none' | 'stretch' | 'shrink' | 'both');
     /**
      * Gets the fitting mode along the horizontal axis.
      * @returns The width fitting mode.
      */
-    get widthFitting(): number;
+    get widthFitting(): "none" | "stretch" | "shrink" | "both";
     /**
-     * Sets the fitting mode along the vertical axis. Can be `none` (0), `stretch` (1), `shrink` (2)
-     * or `both` (3).
+     * Sets the fitting mode along the vertical axis. Can be `none`, `stretch`, `shrink` or
+     * `both`. Defaults to `none`.
      * @param value - The height fitting mode.
      */
-    set heightFitting(value: number);
+    set heightFitting(value: 'none' | 'stretch' | 'shrink' | 'both');
     /**
      * Gets the fitting mode along the vertical axis.
      * @returns The height fitting mode.
      */
-    get heightFitting(): number;
+    get heightFitting(): "none" | "stretch" | "shrink" | "both";
     /**
      * Sets whether children wrap onto a new line/column when they overflow the group.
      * @param value - Whether to wrap children.
@@ -131,4 +132,9 @@ declare class LayoutGroupComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-layoutgroup': LayoutGroupComponentElement;
+    }
+}
 export { LayoutGroupComponentElement };

package/dist/components/light-component.d.ts

@@ -46,8 +46,8 @@ declare class LightComponentElement extends ComponentElement {
         shadowIntensity: number;
         shadowResolution: number;
         shadowSamples: number;
-        shadowType: 0 | 3 | 2 | 4 | 5 | 6 | 7 | 8 | 9 | undefined;
-        type: string;
+        shadowType: number | undefined;
+        type: "directional" | "omni" | "spot";
         vsmBias: number;
         vsmBlurSize: number;
     };
@@ -55,7 +55,7 @@ declare class LightComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas light component.
      * @returns The light component.
      */
-    get component(): LightComponent | null;
+    get component(): LightComponent;
     /**
      * Sets the cast shadows flag of the light.
      * @param value - The cast shadows flag.
@@ -187,15 +187,16 @@ declare class LightComponentElement extends ComponentElement {
      */
     get shadowType(): "pcf1-16f" | "pcf1-32f" | "pcf3-16f" | "pcf3-32f" | "pcf5-16f" | "pcf5-32f" | "vsm-16f" | "vsm-32f" | "pcss-32f";
     /**
-     * Sets the type of the light.
+     * Sets the type of the light. Can be `directional`, `omni` or `spot`. Defaults to
+     * `directional`.
      * @param value - The type.
      */
-    set type(value: string);
+    set type(value: 'directional' | 'omni' | 'spot');
     /**
      * Gets the type of the light.
      * @returns The type.
      */
-    get type(): string;
+    get type(): "directional" | "omni" | "spot";
     /**
      * Sets the VSM bias of the light.
      * @param value - The VSM bias.
@@ -259,4 +260,9 @@ declare class LightComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-light': LightComponentElement;
+    }
+}
 export { LightComponentElement };

package/dist/components/listener-component.d.ts

@@ -15,6 +15,11 @@ declare class ListenerComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas audio listener component.
      * @returns The audio listener component.
      */
-    get component(): AudioListenerComponent | null;
+    get component(): AudioListenerComponent;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-listener': ListenerComponentElement;
+    }
 }
 export { ListenerComponentElement };

package/dist/components/particlesystem-component.d.ts

@@ -17,7 +17,7 @@ declare class ParticleSystemComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas particle system component.
      * @returns The particle system component.
      */
-    get component(): ParticleSystemComponent | null;
+    get component(): ParticleSystemComponent;
     private applyConfig;
     private _loadAsset;
     /**
@@ -49,4 +49,9 @@ declare class ParticleSystemComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-particles': ParticleSystemComponentElement;
+    }
+}
 export { ParticleSystemComponentElement };

package/dist/components/render-component.d.ts

@@ -6,6 +6,10 @@ import { ComponentElement } from './component';
  * The RenderComponentElement interface also inherits the properties and methods of the
  * {@link HTMLElement} interface.
  *
+ * This element renders one of the engine's built-in primitives, selected with `type` (defaulting
+ * to `box`). It does not cover the engine's `asset` render type, since there is no way to supply
+ * a render asset here — use `pc-model` for glTF content instead.
+ *
  * @category Components
  */
 declare class RenderComponentElement extends ComponentElement {
@@ -16,7 +20,7 @@ declare class RenderComponentElement extends ComponentElement {
     /** @ignore */
     constructor();
     getInitialComponentData(): {
-        type: "box" | "asset" | "capsule" | "cone" | "cylinder" | "plane" | "sphere";
+        type: "box" | "capsule" | "cone" | "cylinder" | "sphere" | "plane";
         castShadows: boolean;
         material: StandardMaterial | null | undefined;
         receiveShadows: boolean;
@@ -25,17 +29,17 @@ declare class RenderComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas render component.
      * @returns The render component.
      */
-    get component(): RenderComponent | null;
+    get component(): RenderComponent;
     /**
      * Sets the type of the render component.
      * @param value - The type.
      */
-    set type(value: 'asset' | 'box' | 'capsule' | 'cone' | 'cylinder' | 'plane' | 'sphere');
+    set type(value: 'box' | 'capsule' | 'cone' | 'cylinder' | 'plane' | 'sphere');
     /**
      * Gets the type of the render component.
      * @returns The type.
      */
-    get type(): 'asset' | 'box' | 'capsule' | 'cone' | 'cylinder' | 'plane' | 'sphere';
+    get type(): 'box' | 'capsule' | 'cone' | 'cylinder' | 'plane' | 'sphere';
     /**
      * Sets the cast shadows flag of the render component.
      * @param value - The cast shadows flag.
@@ -69,4 +73,9 @@ declare class RenderComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-render': RenderComponentElement;
+    }
+}
 export { RenderComponentElement };

package/dist/components/rigidbody-component.d.ts

@@ -56,13 +56,13 @@ declare class RigidBodyComponentElement extends ComponentElement {
         mass: number;
         restitution: number;
         rollingFriction: number;
-        type: string;
+        type: "static" | "dynamic" | "kinematic";
     };
     /**
      * Gets the underlying PlayCanvas rigidbody component.
      * @returns The rigidbody component.
      */
-    get component(): RigidBodyComponent | null;
+    get component(): RigidBodyComponent;
     set angularDamping(value: number);
     get angularDamping(): number;
     set angularFactor(value: Vec3);
@@ -79,9 +79,14 @@ declare class RigidBodyComponentElement extends ComponentElement {
     get restitution(): number;
     set rollingFriction(value: number);
     get rollingFriction(): number;
-    set type(value: string);
-    get type(): string;
+    set type(value: 'static' | 'dynamic' | 'kinematic');
+    get type(): "static" | "dynamic" | "kinematic";
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-rigidbody': RigidBodyComponentElement;
+    }
+}
 export { RigidBodyComponentElement };

package/dist/components/screen-component.d.ts

@@ -29,7 +29,7 @@ declare class ScreenComponentElement extends ComponentElement {
      * Gets the underlying PlayCanvas screen component.
      * @returns The screen component.
      */
-    get component(): ScreenComponent | null;
+    get component(): ScreenComponent;
     set priority(value: number);
     get priority(): number;
     set referenceResolution(value: Vec2);
@@ -45,4 +45,9 @@ declare class ScreenComponentElement extends ComponentElement {
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        'pc-screen': ScreenComponentElement;
+    }
+}
 export { ScreenComponentElement };