@playcanvas/web-components 0.15.0 → 0.17.0

package/dist/entity-base.d.cts

@@ -2,11 +2,12 @@ import type { Entity } from 'playcanvas';
 import type { AppElement } from './app.cjs';
 import { AsyncElement } from './async-element.cjs';
 /**
- * The base class for elements that front an engine {@link Entity}: `<pc-entity>`, which creates
- * one, and `<pc-node>`, which binds to one inside a model's instantiated hierarchy. It carries
- * what both need — the `entity` contract, registration with the owning application (which joins
- * picked scene nodes back to elements by identity, never by name), and the pointer listener
- * bookkeeping that lets the application lazily attach its canvas handlers.
+ * The base class for elements that front an engine {@link Entity}: `<pc-entity>` and
+ * `<pc-model>`, which create one, and `<pc-node>`, which binds to one inside a model's
+ * instantiated hierarchy. It carries what all of them need — the `entity` contract, registration
+ * with the owning application (which joins picked scene nodes back to elements by identity,
+ * never by name), and the pointer listener bookkeeping that lets the application lazily attach
+ * its canvas handlers.
  */
 declare class EntityBaseElement extends AsyncElement {
     protected _entity: Entity | null;

package/dist/entity-base.d.ts

@@ -2,11 +2,12 @@ import type { Entity } from 'playcanvas';
 import type { AppElement } from './app.js';
 import { AsyncElement } from './async-element.js';
 /**
- * The base class for elements that front an engine {@link Entity}: `<pc-entity>`, which creates
- * one, and `<pc-node>`, which binds to one inside a model's instantiated hierarchy. It carries
- * what both need — the `entity` contract, registration with the owning application (which joins
- * picked scene nodes back to elements by identity, never by name), and the pointer listener
- * bookkeeping that lets the application lazily attach its canvas handlers.
+ * The base class for elements that front an engine {@link Entity}: `<pc-entity>` and
+ * `<pc-model>`, which create one, and `<pc-node>`, which binds to one inside a model's
+ * instantiated hierarchy. It carries what all of them need — the `entity` contract, registration
+ * with the owning application (which joins picked scene nodes back to elements by identity,
+ * never by name), and the pointer listener bookkeeping that lets the application lazily attach
+ * its canvas handlers.
  */
 declare class EntityBaseElement extends AsyncElement {
     protected _entity: Entity | null;

package/dist/entity-owner.d.cts

@@ -0,0 +1,118 @@
+import { Entity, Vec3 } from 'playcanvas';
+import { EntityBaseElement } from './entity-base.cjs';
+/**
+ * The base class for elements that create and own their backing entity: `<pc-entity>` and
+ * `<pc-model>`, whose host entity carries the same authored properties. It carries the cached
+ * property state, entity creation and parenting, and the reset that follows the entity's
+ * destruction. `<pc-node>` sits outside this class: it borrows an entity a model instantiated,
+ * and its properties are nullable overrides rather than owned values.
+ */
+declare class EntityOwnerElement extends EntityBaseElement {
+    /**
+     * Whether the entity is enabled.
+     */
+    private _enabled;
+    /**
+     * The name of the entity.
+     */
+    private _name;
+    /**
+     * The position of the entity.
+     */
+    private _position;
+    /**
+     * The rotation of the entity.
+     */
+    private _rotation;
+    /**
+     * The scale of the entity.
+     */
+    private _scale;
+    /**
+     * The tags of the entity.
+     */
+    private _tags;
+    /**
+     * Whether the hierarchy has been built for this entity — set once {@link _buildHierarchy} has
+     * parented it. Read by subclasses that gate work on the entity being in the scene graph.
+     */
+    protected _built: boolean;
+    /**
+     * Handles the destruction of the backing entity. Resets the element so a later re-insertion
+     * starts clean: `_built` must be cleared alongside `_entity`, or _buildHierarchy would bail
+     * and a re-created entity would never be parented. Readiness is re-armed for the same
+     * reason — with the entity gone, a resolved ready promise would resume its awaiters against
+     * a null `entity`.
+     *
+     * @param entity - The entity that was destroyed.
+     */
+    protected _onEntityDestroy(entity: Entity): void;
+    /**
+     * Called by {@link _buildHierarchy} once the backing entity has been parented — exactly once
+     * per build cycle. The default announces readiness, which is what a parented `<pc-entity>`
+     * means; `<pc-model>` overrides it to start loading content instead, because its readiness
+     * tracks the content settling rather than the host entering the scene graph.
+     */
+    protected _onBuilt(): void;
+    /**
+     * Sets the enabled state of the entity.
+     * @param value - Whether the entity is enabled.
+     */
+    set enabled(value: boolean);
+    /**
+     * Gets the enabled state of the entity.
+     * @returns Whether the entity is enabled.
+     */
+    get enabled(): boolean;
+    /**
+     * Sets the name of the entity.
+     * @param value - The name of the entity.
+     */
+    set name(value: string);
+    /**
+     * Gets the name of the entity.
+     * @returns The name of the entity.
+     */
+    get name(): string;
+    /**
+     * Sets the position of the entity.
+     * @param value - The position of the entity.
+     */
+    set position(value: Vec3);
+    /**
+     * Gets the position of the entity.
+     * @returns The position of the entity.
+     */
+    get position(): Vec3;
+    /**
+     * Sets the rotation of the entity.
+     * @param value - The rotation of the entity.
+     */
+    set rotation(value: Vec3);
+    /**
+     * Gets the rotation of the entity.
+     * @returns The rotation of the entity.
+     */
+    get rotation(): Vec3;
+    /**
+     * Sets the scale of the entity.
+     * @param value - The scale of the entity.
+     */
+    set scale(value: Vec3);
+    /**
+     * Gets the scale of the entity.
+     * @returns The scale of the entity.
+     */
+    get scale(): Vec3;
+    /**
+     * Sets the tags of the entity.
+     * @param value - The tags of the entity.
+     */
+    set tags(value: string[]);
+    /**
+     * Gets the tags of the entity.
+     * @returns The tags of the entity.
+     */
+    get tags(): string[];
+}
+export { EntityOwnerElement };

package/dist/entity-owner.d.ts

@@ -0,0 +1,118 @@
+import { Entity, Vec3 } from 'playcanvas';
+import { EntityBaseElement } from './entity-base.js';
+/**
+ * The base class for elements that create and own their backing entity: `<pc-entity>` and
+ * `<pc-model>`, whose host entity carries the same authored properties. It carries the cached
+ * property state, entity creation and parenting, and the reset that follows the entity's
+ * destruction. `<pc-node>` sits outside this class: it borrows an entity a model instantiated,
+ * and its properties are nullable overrides rather than owned values.
+ */
+declare class EntityOwnerElement extends EntityBaseElement {
+    /**
+     * Whether the entity is enabled.
+     */
+    private _enabled;
+    /**
+     * The name of the entity.
+     */
+    private _name;
+    /**
+     * The position of the entity.
+     */
+    private _position;
+    /**
+     * The rotation of the entity.
+     */
+    private _rotation;
+    /**
+     * The scale of the entity.
+     */
+    private _scale;
+    /**
+     * The tags of the entity.
+     */
+    private _tags;
+    /**
+     * Whether the hierarchy has been built for this entity — set once {@link _buildHierarchy} has
+     * parented it. Read by subclasses that gate work on the entity being in the scene graph.
+     */
+    protected _built: boolean;
+    /**
+     * Handles the destruction of the backing entity. Resets the element so a later re-insertion
+     * starts clean: `_built` must be cleared alongside `_entity`, or _buildHierarchy would bail
+     * and a re-created entity would never be parented. Readiness is re-armed for the same
+     * reason — with the entity gone, a resolved ready promise would resume its awaiters against
+     * a null `entity`.
+     *
+     * @param entity - The entity that was destroyed.
+     */
+    protected _onEntityDestroy(entity: Entity): void;
+    /**
+     * Called by {@link _buildHierarchy} once the backing entity has been parented — exactly once
+     * per build cycle. The default announces readiness, which is what a parented `<pc-entity>`
+     * means; `<pc-model>` overrides it to start loading content instead, because its readiness
+     * tracks the content settling rather than the host entering the scene graph.
+     */
+    protected _onBuilt(): void;
+    /**
+     * Sets the enabled state of the entity.
+     * @param value - Whether the entity is enabled.
+     */
+    set enabled(value: boolean);
+    /**
+     * Gets the enabled state of the entity.
+     * @returns Whether the entity is enabled.
+     */
+    get enabled(): boolean;
+    /**
+     * Sets the name of the entity.
+     * @param value - The name of the entity.
+     */
+    set name(value: string);
+    /**
+     * Gets the name of the entity.
+     * @returns The name of the entity.
+     */
+    get name(): string;
+    /**
+     * Sets the position of the entity.
+     * @param value - The position of the entity.
+     */
+    set position(value: Vec3);
+    /**
+     * Gets the position of the entity.
+     * @returns The position of the entity.
+     */
+    get position(): Vec3;
+    /**
+     * Sets the rotation of the entity.
+     * @param value - The rotation of the entity.
+     */
+    set rotation(value: Vec3);
+    /**
+     * Gets the rotation of the entity.
+     * @returns The rotation of the entity.
+     */
+    get rotation(): Vec3;
+    /**
+     * Sets the scale of the entity.
+     * @param value - The scale of the entity.
+     */
+    set scale(value: Vec3);
+    /**
+     * Gets the scale of the entity.
+     * @returns The scale of the entity.
+     */
+    get scale(): Vec3;
+    /**
+     * Sets the tags of the entity.
+     * @param value - The tags of the entity.
+     */
+    set tags(value: string[]);
+    /**
+     * Gets the tags of the entity.
+     * @returns The tags of the entity.
+     */
+    get tags(): string[];
+}
+export { EntityOwnerElement };

package/dist/entity.d.cts

@@ -1,5 +1,4 @@
-import { Vec3 } from 'playcanvas';
-import { EntityBaseElement } from './entity-base.cjs';
+import { EntityOwnerElement } from './entity-owner.cjs';
 /**
  * The EntityElement interface provides properties and methods for manipulating
  * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-entity/ | `<pc-entity>`} elements.
@@ -11,6 +10,12 @@ import { EntityBaseElement } from './entity-base.cjs';
  * them, registered either with {@link addEventListener} or with the matching inline `onpointer*`
  * attribute.
  *
+ * @attribute {boolean} enabled - The enabled state of the entity.
+ * @attribute {string} name - The name of the entity.
+ * @attribute {string} position - The position of the entity.
+ * @attribute {string} rotation - The rotation of the entity.
+ * @attribute {string} scale - The scale of the entity.
+ * @attribute {string} tags - The tags of the entity.
  * @attribute {string} onpointerenter - Script to run when the pointer moves onto the entity.
  * @attribute {string} onpointerleave - Script to run when the pointer moves off the entity.
  * @attribute {string} onpointermove - Script to run when the pointer moves over the entity.
@@ -24,107 +29,9 @@ import { EntityBaseElement } from './entity-base.cjs';
  * @fires {PointerEvent} pointerdown - Fired when a pointer button is pressed over the entity.
  * @fires {PointerEvent} pointerup - Fired when a pointer button is released over the entity.
  */
-declare class EntityElement extends EntityBaseElement {
-    /**
-     * Whether the entity is enabled.
-     */
-    private _enabled;
-    /**
-     * The name of the entity.
-     */
-    private _name;
-    /**
-     * The position of the entity.
-     */
-    private _position;
-    /**
-     * The rotation of the entity.
-     */
-    private _rotation;
-    /**
-     * The scale of the entity.
-     */
-    private _scale;
-    /**
-     * The tags of the entity.
-     */
-    private _tags;
-    /**
-     * Whether the hierarchy has been built for this entity.
-     */
-    private _built;
-    /**
-     * Handles the destruction of the backing entity. Resets the element so a later re-insertion
-     * starts clean: `_built` must be cleared alongside `_entity`, or _buildHierarchy would bail
-     * and a re-created entity would never be parented. Readiness is re-armed for the same
-     * reason — with the entity gone, a resolved ready promise would resume its awaiters against
-     * a null `entity`.
-     *
-     * @param entity - The entity that was destroyed.
-     */
-    private _onEntityDestroy;
+declare class EntityElement extends EntityOwnerElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
-    /**
-     * Sets the enabled state of the entity.
-     * @param value - Whether the entity is enabled.
-     */
-    set enabled(value: boolean);
-    /**
-     * Gets the enabled state of the entity.
-     * @returns Whether the entity is enabled.
-     */
-    get enabled(): boolean;
-    /**
-     * Sets the name of the entity.
-     * @param value - The name of the entity.
-     */
-    set name(value: string);
-    /**
-     * Gets the name of the entity.
-     * @returns The name of the entity.
-     */
-    get name(): string;
-    /**
-     * Sets the position of the entity.
-     * @param value - The position of the entity.
-     */
-    set position(value: Vec3);
-    /**
-     * Gets the position of the entity.
-     * @returns The position of the entity.
-     */
-    get position(): Vec3;
-    /**
-     * Sets the rotation of the entity.
-     * @param value - The rotation of the entity.
-     */
-    set rotation(value: Vec3);
-    /**
-     * Gets the rotation of the entity.
-     * @returns The rotation of the entity.
-     */
-    get rotation(): Vec3;
-    /**
-     * Sets the scale of the entity.
-     * @param value - The scale of the entity.
-     */
-    set scale(value: Vec3);
-    /**
-     * Gets the scale of the entity.
-     * @returns The scale of the entity.
-     */
-    get scale(): Vec3;
-    /**
-     * Sets the tags of the entity.
-     * @param value - The tags of the entity.
-     */
-    set tags(value: string[]);
-    /**
-     * Gets the tags of the entity.
-     * @returns The tags of the entity.
-     */
-    get tags(): string[];
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
 }

package/dist/entity.d.ts

@@ -1,5 +1,4 @@
-import { Vec3 } from 'playcanvas';
-import { EntityBaseElement } from './entity-base.js';
+import { EntityOwnerElement } from './entity-owner.js';
 /**
  * The EntityElement interface provides properties and methods for manipulating
  * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-entity/ | `<pc-entity>`} elements.
@@ -11,6 +10,12 @@ import { EntityBaseElement } from './entity-base.js';
  * them, registered either with {@link addEventListener} or with the matching inline `onpointer*`
  * attribute.
  *
+ * @attribute {boolean} enabled - The enabled state of the entity.
+ * @attribute {string} name - The name of the entity.
+ * @attribute {string} position - The position of the entity.
+ * @attribute {string} rotation - The rotation of the entity.
+ * @attribute {string} scale - The scale of the entity.
+ * @attribute {string} tags - The tags of the entity.
  * @attribute {string} onpointerenter - Script to run when the pointer moves onto the entity.
  * @attribute {string} onpointerleave - Script to run when the pointer moves off the entity.
  * @attribute {string} onpointermove - Script to run when the pointer moves over the entity.
@@ -24,107 +29,9 @@ import { EntityBaseElement } from './entity-base.js';
  * @fires {PointerEvent} pointerdown - Fired when a pointer button is pressed over the entity.
  * @fires {PointerEvent} pointerup - Fired when a pointer button is released over the entity.
  */
-declare class EntityElement extends EntityBaseElement {
-    /**
-     * Whether the entity is enabled.
-     */
-    private _enabled;
-    /**
-     * The name of the entity.
-     */
-    private _name;
-    /**
-     * The position of the entity.
-     */
-    private _position;
-    /**
-     * The rotation of the entity.
-     */
-    private _rotation;
-    /**
-     * The scale of the entity.
-     */
-    private _scale;
-    /**
-     * The tags of the entity.
-     */
-    private _tags;
-    /**
-     * Whether the hierarchy has been built for this entity.
-     */
-    private _built;
-    /**
-     * Handles the destruction of the backing entity. Resets the element so a later re-insertion
-     * starts clean: `_built` must be cleared alongside `_entity`, or _buildHierarchy would bail
-     * and a re-created entity would never be parented. Readiness is re-armed for the same
-     * reason — with the entity gone, a resolved ready promise would resume its awaiters against
-     * a null `entity`.
-     *
-     * @param entity - The entity that was destroyed.
-     */
-    private _onEntityDestroy;
+declare class EntityElement extends EntityOwnerElement {
     connectedCallback(): void;
     disconnectedCallback(): void;
-    /**
-     * Sets the enabled state of the entity.
-     * @param value - Whether the entity is enabled.
-     */
-    set enabled(value: boolean);
-    /**
-     * Gets the enabled state of the entity.
-     * @returns Whether the entity is enabled.
-     */
-    get enabled(): boolean;
-    /**
-     * Sets the name of the entity.
-     * @param value - The name of the entity.
-     */
-    set name(value: string);
-    /**
-     * Gets the name of the entity.
-     * @returns The name of the entity.
-     */
-    get name(): string;
-    /**
-     * Sets the position of the entity.
-     * @param value - The position of the entity.
-     */
-    set position(value: Vec3);
-    /**
-     * Gets the position of the entity.
-     * @returns The position of the entity.
-     */
-    get position(): Vec3;
-    /**
-     * Sets the rotation of the entity.
-     * @param value - The rotation of the entity.
-     */
-    set rotation(value: Vec3);
-    /**
-     * Gets the rotation of the entity.
-     * @returns The rotation of the entity.
-     */
-    get rotation(): Vec3;
-    /**
-     * Sets the scale of the entity.
-     * @param value - The scale of the entity.
-     */
-    set scale(value: Vec3);
-    /**
-     * Gets the scale of the entity.
-     * @returns The scale of the entity.
-     */
-    get scale(): Vec3;
-    /**
-     * Sets the tags of the entity.
-     * @param value - The tags of the entity.
-     */
-    set tags(value: string[]);
-    /**
-     * Gets the tags of the entity.
-     * @returns The tags of the entity.
-     */
-    get tags(): string[];
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
 }

package/dist/index.d.cts

@@ -7,34 +7,37 @@
  * @module EngineWebComponents
  */
 import { AsyncElement, whenReady } from './async-element.cjs';
-import { ModuleElement } from './module.cjs';
+import { WasmElement } from './wasm.cjs';
 import { AppElement } from './app.cjs';
 import { EntityElement } from './entity.cjs';
+import { ModelElement } from './model.cjs';
 import { AssetElement } from './asset.cjs';
-import { ListenerComponentElement } from './components/listener-component.cjs';
+import { AnimComponentElement } from './components/anim-component.cjs';
+import { AnimClipElement } from './components/anim-clip.cjs';
+import { AudioListenerComponentElement } from './components/audio-listener-component.cjs';
 import { ButtonComponentElement } from './components/button-component.cjs';
 import { CameraComponentElement } from './components/camera-component.cjs';
 import { CollisionComponentElement } from './components/collision-component.cjs';
 import { ComponentElement } from './components/component.cjs';
 import { ElementComponentElement } from './components/element-component.cjs';
 import { JointComponentElement } from './components/joint-component.cjs';
-import { LayoutChildComponentElement } from './components/layoutchild-component.cjs';
-import { LayoutGroupComponentElement } from './components/layoutgroup-component.cjs';
+import { LayoutChildComponentElement } from './components/layout-child-component.cjs';
+import { LayoutGroupComponentElement } from './components/layout-group-component.cjs';
 import { LightComponentElement } from './components/light-component.cjs';
-import { ParticleSystemComponentElement } from './components/particlesystem-component.cjs';
+import { ParticleSystemComponentElement } from './components/particle-system-component.cjs';
 import { RenderComponentElement } from './components/render-component.cjs';
-import { RigidBodyComponentElement } from './components/rigidbody-component.cjs';
+import { RigidBodyComponentElement } from './components/rigid-body-component.cjs';
 import { ScreenComponentElement } from './components/screen-component.cjs';
 import { ScrollbarComponentElement } from './components/scrollbar-component.cjs';
-import { ScrollViewComponentElement } from './components/scrollview-component.cjs';
+import { ScrollViewComponentElement } from './components/scroll-view-component.cjs';
 import { ScriptComponentElement } from './components/script-component.cjs';
-import { ScriptElement } from './components/script.cjs';
+import { ScriptInstanceElement } from './components/script-instance.cjs';
 import { SoundComponentElement } from './components/sound-component.cjs';
 import { SoundSlotElement } from './components/sound-slot.cjs';
 import { GSplatComponentElement } from './components/gsplat-component.cjs';
 import { EntityBaseElement } from './entity-base.cjs';
+import { EntityOwnerElement } from './entity-owner.cjs';
 import { MaterialElement } from './material.cjs';
-import { ModelElement } from './model.cjs';
 import { NodeElement } from './node.cjs';
 import { SceneElement } from './scene.cjs';
 import { SkyElement } from './sky.cjs';
@@ -47,6 +50,8 @@ declare global {
         scriptnamechange: ScriptNameChangeEvent;
     }
     interface HTMLElementTagNameMap {
+        'pc-anim': AnimComponentElement;
+        'pc-anim-clip': AnimClipElement;
         'pc-app': AppElement;
         'pc-asset': AssetElement;
         'pc-button': ButtonComponentElement;
@@ -56,29 +61,29 @@ declare global {
         'pc-entity': EntityElement;
         'pc-gsplat': GSplatComponentElement;
         'pc-joint': JointComponentElement;
-        'pc-layoutchild': LayoutChildComponentElement;
-        'pc-layoutgroup': LayoutGroupComponentElement;
+        'pc-layout-child': LayoutChildComponentElement;
+        'pc-layout-group': LayoutGroupComponentElement;
         'pc-light': LightComponentElement;
-        'pc-listener': ListenerComponentElement;
+        'pc-audio-listener': AudioListenerComponentElement;
         'pc-material': MaterialElement;
         'pc-model': ModelElement;
-        'pc-module': ModuleElement;
+        'pc-wasm': WasmElement;
         'pc-node': NodeElement;
-        'pc-particles': ParticleSystemComponentElement;
+        'pc-particle-system': ParticleSystemComponentElement;
         'pc-render': RenderComponentElement;
-        'pc-rigidbody': RigidBodyComponentElement;
+        'pc-rigid-body': RigidBodyComponentElement;
         'pc-scene': SceneElement;
         'pc-screen': ScreenComponentElement;
-        'pc-script': ScriptElement;
-        'pc-scripts': ScriptComponentElement;
+        'pc-script-instance': ScriptInstanceElement;
+        'pc-script': ScriptComponentElement;
         'pc-scrollbar': ScrollbarComponentElement;
-        'pc-scrollview': ScrollViewComponentElement;
+        'pc-scroll-view': ScrollViewComponentElement;
         'pc-sky': SkyElement;
-        'pc-sound': SoundSlotElement;
-        'pc-sounds': SoundComponentElement;
+        'pc-sound-slot': SoundSlotElement;
+        'pc-sound': SoundComponentElement;
     }
 }
-export { AsyncElement, ModuleElement, AppElement, EntityElement, AssetElement, ButtonComponentElement, CameraComponentElement, CollisionComponentElement, ComponentElement, ElementComponentElement, JointComponentElement, LayoutChildComponentElement, LayoutGroupComponentElement, ParticleSystemComponentElement, LightComponentElement, ListenerComponentElement, RenderComponentElement, RigidBodyComponentElement, ScreenComponentElement, ScrollbarComponentElement, ScrollViewComponentElement, ScriptComponentElement, ScriptElement, SoundComponentElement, SoundSlotElement, GSplatComponentElement, EntityBaseElement, MaterialElement, ModelElement, NodeElement, SceneElement, SkyElement, whenReady };
+export { AsyncElement, WasmElement, AppElement, EntityElement, AssetElement, AnimComponentElement, AnimClipElement, ButtonComponentElement, CameraComponentElement, CollisionComponentElement, ComponentElement, ElementComponentElement, JointComponentElement, LayoutChildComponentElement, LayoutGroupComponentElement, ParticleSystemComponentElement, LightComponentElement, AudioListenerComponentElement, RenderComponentElement, RigidBodyComponentElement, ScreenComponentElement, ScrollbarComponentElement, ScrollViewComponentElement, ScriptComponentElement, ScriptInstanceElement, SoundComponentElement, SoundSlotElement, GSplatComponentElement, EntityBaseElement, EntityOwnerElement, MaterialElement, ModelElement, NodeElement, SceneElement, SkyElement, whenReady };
 export type { AsyncElementTagName } from './async-element.cjs';
 export type { HierarchyMaterial, HierarchyNode } from './model.cjs';
 export type { MaterialOverrides } from './node.cjs';