@playcanvas/web-components 0.11.0 → 0.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (82) hide show
  1. package/README.md +1 -1
  2. package/dist/app.d.ts +31 -49
  3. package/dist/asset.d.ts +152 -12
  4. package/dist/async-element.d.ts +26 -9
  5. package/dist/components/button-component.d.ts +3 -7
  6. package/dist/components/camera-component.d.ts +3 -7
  7. package/dist/components/collision-component.d.ts +19 -7
  8. package/dist/components/component.d.ts +41 -4
  9. package/dist/components/element-component.d.ts +4 -8
  10. package/dist/components/gsplat-component.d.ts +2 -7
  11. package/dist/components/layoutchild-component.d.ts +2 -7
  12. package/dist/components/layoutgroup-component.d.ts +3 -7
  13. package/dist/components/light-component.d.ts +3 -7
  14. package/dist/components/listener-component.d.ts +1 -6
  15. package/dist/components/particlesystem-component.d.ts +2 -7
  16. package/dist/components/render-component.d.ts +2 -7
  17. package/dist/components/rigidbody-component.d.ts +3 -7
  18. package/dist/components/screen-component.d.ts +3 -7
  19. package/dist/components/script-component.d.ts +8 -20
  20. package/dist/components/script.d.ts +2 -22
  21. package/dist/components/scrollbar-component.d.ts +2 -7
  22. package/dist/components/scrollview-component.d.ts +3 -7
  23. package/dist/components/sound-component.d.ts +2 -7
  24. package/dist/components/sound-slot.d.ts +8 -6
  25. package/dist/custom-elements.json +5824 -10581
  26. package/dist/entity-base.d.ts +67 -0
  27. package/dist/entity.d.ts +7 -48
  28. package/dist/index.d.ts +41 -1
  29. package/dist/material.d.ts +14 -13
  30. package/dist/model.d.ts +43 -5
  31. package/dist/module.d.ts +0 -6
  32. package/dist/node.d.ts +253 -0
  33. package/dist/parse.d.ts +2 -1
  34. package/dist/pwc.cjs +1830 -274
  35. package/dist/pwc.cjs.map +1 -1
  36. package/dist/pwc.js +1830 -274
  37. package/dist/pwc.js.map +1 -1
  38. package/dist/pwc.min.js +1 -1
  39. package/dist/pwc.min.js.map +1 -1
  40. package/dist/pwc.min.mjs +1 -1
  41. package/dist/pwc.min.mjs.map +1 -1
  42. package/dist/pwc.mjs +1830 -276
  43. package/dist/pwc.mjs.map +1 -1
  44. package/dist/scene.d.ts +4 -7
  45. package/dist/sky.d.ts +13 -5
  46. package/dist/vscode.html-custom-data.json +148 -26
  47. package/dist/web-types.json +894 -581
  48. package/package.json +9 -8
  49. package/src/app.ts +163 -88
  50. package/src/asset.ts +472 -36
  51. package/src/async-element.ts +39 -12
  52. package/src/components/button-component.ts +5 -9
  53. package/src/components/camera-component.ts +24 -10
  54. package/src/components/collision-component.ts +61 -15
  55. package/src/components/component.ts +151 -11
  56. package/src/components/element-component.ts +26 -30
  57. package/src/components/gsplat-component.ts +4 -9
  58. package/src/components/layoutchild-component.ts +4 -9
  59. package/src/components/layoutgroup-component.ts +14 -9
  60. package/src/components/light-component.ts +42 -12
  61. package/src/components/listener-component.ts +1 -7
  62. package/src/components/particlesystem-component.ts +7 -15
  63. package/src/components/render-component.ts +5 -10
  64. package/src/components/rigidbody-component.ts +23 -16
  65. package/src/components/screen-component.ts +5 -9
  66. package/src/components/script-component.ts +108 -46
  67. package/src/components/script.ts +38 -33
  68. package/src/components/scrollbar-component.ts +6 -16
  69. package/src/components/scrollview-component.ts +16 -11
  70. package/src/components/sound-component.ts +10 -15
  71. package/src/components/sound-slot.ts +30 -20
  72. package/src/entity-base.ts +136 -0
  73. package/src/entity.ts +47 -118
  74. package/src/index.ts +50 -1
  75. package/src/loading-bar.ts +8 -8
  76. package/src/material.ts +65 -39
  77. package/src/model.ts +140 -17
  78. package/src/module.ts +8 -7
  79. package/src/node.ts +715 -0
  80. package/src/parse.ts +62 -17
  81. package/src/scene.ts +12 -9
  82. package/src/sky.ts +50 -10
package/README.md CHANGED
@@ -30,7 +30,7 @@ PlayCanvas Web Components are a set of custom HTML elements for building 3D inte
30
30
 
31
31
  ## Examples
32
32
 
33
- [![image](https://github.com/user-attachments/assets/25ac8dd3-abc9-4d65-8950-3d72ed1f7152)](https://playcanvas.github.io/web-components/examples)
33
+ <img width="3840" height="2160" alt="image" src="https://github.com/user-attachments/assets/e113cd2a-300d-4713-a1f4-ada647a8f04c" />
34
34
 
35
35
  See PlayCanvas Web Components in action here: https://playcanvas.github.io/web-components/examples
36
36
 
package/dist/app.d.ts CHANGED
@@ -1,6 +1,7 @@
1
- import { AppBase, Entity } from 'playcanvas';
1
+ import type { Entity } from 'playcanvas';
2
+ import { AppBase } from 'playcanvas';
2
3
  import { AsyncElement } from './async-element';
3
- import { EntityElement } from './entity';
4
+ import type { EntityBaseElement } from './entity-base';
4
5
  /**
5
6
  * The AppElement interface provides properties and methods for manipulating
6
7
  * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-app/ | `<pc-app>`} elements.
@@ -31,11 +32,18 @@ declare class AppElement extends AsyncElement {
31
32
  */
32
33
  private _optionsLocked;
33
34
  private _bar;
34
- private _hierarchyReady;
35
+ /**
36
+ * Incremented on every connect and disconnect. Boot captures the value on entry and abandons
37
+ * itself wherever it resumes from an await if the value has moved on — so a boot whose
38
+ * element was removed cannot complete against a torn-down element, and a boot whose element
39
+ * was removed and re-inserted (which starts a boot of its own) cannot race the newer one.
40
+ */
41
+ private _bootGeneration;
35
42
  /**
36
43
  * The elements backing this application's entities, keyed by the entity itself. Registered
37
- * by EntityElement at creation and removed when an entity is destroyed, this joins engine
38
- * scene nodes back to their owning elements by identity - never by name.
44
+ * by EntityElement at creation (and NodeElement at binding) and removed when an entity is
45
+ * destroyed or unbound, this joins engine scene nodes back to their owning elements by
46
+ * identity - never by name.
39
47
  */
40
48
  private _entityElements;
41
49
  private _picker;
@@ -68,39 +76,24 @@ declare class AppElement extends AsyncElement {
68
76
  constructor();
69
77
  connectedCallback(): Promise<void>;
70
78
  disconnectedCallback(): void;
71
- _onWindowResize(): void;
72
- _pickerCreate(): void;
73
- _pickerDestroy(): void;
74
- /**
75
- * Registers the element that created an entity. Called by EntityElement when it creates its
76
- * entity.
77
- *
78
- * @param entity - The entity.
79
- * @param element - The element that created it.
80
- * @ignore
81
- */
82
- _registerEntityElement(entity: Entity, element: EntityElement): void;
83
- /**
84
- * Removes the registration for a destroyed entity. Called by EntityElement.
85
- *
86
- * @param entity - The entity.
87
- * @ignore
88
- */
89
- _unregisterEntityElement(entity: Entity): void;
90
- /**
91
- * Returns the `<pc-entity>` element whose backing entity is `entity`, or `null` if the
92
- * entity was not created by an element of this application - for example, a node inside a
93
- * model's instantiated hierarchy, or an entity created through the engine API.
79
+ private _onWindowResize;
80
+ private _pickerCreate;
81
+ private _pickerDestroy;
82
+ /**
83
+ * Returns the `<pc-entity>` or `<pc-node>` element whose backing entity is `entity`, or
84
+ * `null` if the entity is not fronted by an element of this application - for example, an
85
+ * unbound node inside a model's instantiated hierarchy, or an entity created through the
86
+ * engine API.
94
87
  *
95
88
  * @param entity - The entity to look up.
96
- * @returns The element backing the entity, or `null`.
89
+ * @returns The element fronting the entity, or `null`.
97
90
  */
98
- elementFromEntity(entity: Entity): EntityElement | null;
91
+ elementFromEntity(entity: Entity): EntityBaseElement | null;
99
92
  /**
100
93
  * Resolves the element that owns a picked node: the nearest node up the parent chain -
101
- * starting with the node itself - that was created by a `<pc-entity>` of this application.
102
- * A hit inside a model's instantiated hierarchy therefore resolves to the element hosting
103
- * the model.
94
+ * starting with the node itself - that is fronted by a `<pc-entity>` or `<pc-node>` of this
95
+ * application. A hit inside a model's instantiated hierarchy therefore resolves to the
96
+ * nearest bound `<pc-node>`, or failing that the element hosting the model.
104
97
  *
105
98
  * @param node - The picked node, or `null`.
106
99
  * @returns The owning element, or `null`.
@@ -128,11 +121,11 @@ declare class AppElement extends AsyncElement {
128
121
  * @returns The graph node under the pointer, or `null` if nothing was hit.
129
122
  */
130
123
  private _pickNode;
131
- _onPointerMove(event: PointerEvent): Promise<void>;
132
- _onPointerDown(event: PointerEvent): Promise<void>;
133
- _onPointerUp(event: PointerEvent): Promise<void>;
134
- _onPointerListenerAdded(type: string): void;
135
- _onPointerListenerRemoved(type: string): void;
124
+ private _onPointerMove;
125
+ private _onPointerDown;
126
+ private _onPointerUp;
127
+ private _onPointerListenerAdded;
128
+ private _onPointerListenerRemoved;
136
129
  /**
137
130
  * Warns that a graphics option was written too late to have any effect. These options are read
138
131
  * once, when the element connects and creates its graphics device, so a later write updates
@@ -184,12 +177,6 @@ declare class AppElement extends AsyncElement {
184
177
  * @returns The depth buffer flag.
185
178
  */
186
179
  get depthBuffer(): boolean;
187
- /**
188
- * Gets the hierarchy ready flag.
189
- * @returns The hierarchy ready flag.
190
- * @ignore
191
- */
192
- get hierarchyReady(): boolean;
193
180
  /**
194
181
  * Sets whether the application shows its built-in loading bar while it boots and preloads its
195
182
  * assets. Enabled by default; setting `false` removes the bar immediately, while setting
@@ -233,9 +220,4 @@ declare class AppElement extends AsyncElement {
233
220
  static get observedAttributes(): string[];
234
221
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
235
222
  }
236
- declare global {
237
- interface HTMLElementTagNameMap {
238
- 'pc-app': AppElement;
239
- }
240
- }
241
223
  export { AppElement };
package/dist/asset.d.ts CHANGED
@@ -1,5 +1,8 @@
1
1
  import { Asset } from 'playcanvas';
2
2
  import { AsyncElement } from './async-element';
3
+ type AddressMode = 'repeat' | 'clamp' | 'mirror';
4
+ type MinFilterMode = 'nearest' | 'linear' | 'nearest-mip-nearest' | 'linear-mip-nearest' | 'nearest-mip-linear' | 'linear-mip-linear';
5
+ type MagFilterMode = 'nearest' | 'linear';
3
6
  /**
4
7
  * The AssetElement interface provides properties and methods for manipulating
5
8
  * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-asset/ | `<pc-asset>`} elements.
@@ -13,8 +16,16 @@ import { AsyncElement } from './async-element';
13
16
  * immediately unless `lazy`. A `pc-asset` must be a direct child of `pc-app` — elements placed
14
17
  * elsewhere, or with an unsupported asset type, never become ready.
15
18
  *
16
- * Apart from `lazy`, these attributes are read once when the asset is created, so changing them
17
- * later has no effect.
19
+ * For `texture` and `textureatlas` assets, the texture options (`address-u`, `address-v`,
20
+ * `min-filter`, `mag-filter`, `anisotropy`, `mipmaps`, `srgb`, `flip-y`) apply when the texture is
21
+ * created and — like `lazy` — are observed: changing one updates a texture that has already
22
+ * loaded, and removing one restores the engine default. Changing `srgb` or `mipmaps` on a loaded
23
+ * texture recreates the underlying GPU resource, so prefer declaring those up front. Each option
24
+ * overrides the matching key in the `data` JSON; options left unset write nothing, leaving the
25
+ * engine's per-format defaults in force.
26
+ *
27
+ * Apart from `lazy` and the texture options, these attributes are read once when the asset is
28
+ * created, so changing them later has no effect.
18
29
  *
19
30
  * @attribute {string} id - The identifier used to reference the asset from other elements.
20
31
  * @attribute {string} src - The URL of the asset to load.
@@ -36,7 +47,15 @@ import { AsyncElement } from './async-element';
36
47
  * not that it succeeded.
37
48
  */
38
49
  declare class AssetElement extends AsyncElement {
50
+ private _addressU;
51
+ private _addressV;
52
+ private _anisotropy;
53
+ private _flipY;
39
54
  private _lazy;
55
+ private _magFilter;
56
+ private _minFilter;
57
+ private _mipmaps;
58
+ private _srgb;
40
59
  /**
41
60
  * The asset that is loaded. Available once the element is ready — await
42
61
  * {@link whenReady} or the element's `ready()` promise before accessing it.
@@ -46,16 +65,86 @@ declare class AssetElement extends AsyncElement {
46
65
  disconnectedCallback(): void;
47
66
  private _onAssetLoad;
48
67
  private _onAssetError;
49
- createAsset(): void;
50
68
  /**
51
- * Builds the `data` object for the asset from an optional inline `data` attribute (JSON) and,
52
- * for sprites, from the convenience attributes (`atlas`, `frame-keys`, `pixels-per-unit`,
53
- * `render-mode`). Returns `undefined` when there is no data to apply.
69
+ * Builds the `data` object for the asset from an optional inline `data` attribute (JSON), the
70
+ * texture option attributes (for `texture` and `textureatlas` assets), and the sprite
71
+ * convenience attributes (`atlas`, `frame-keys`, `pixels-per-unit`, `render-mode`). An
72
+ * attribute overrides the matching `data` JSON key. Returns `undefined` when there is no data
73
+ * to apply.
54
74
  * @param type - The resolved asset type.
55
75
  * @returns The asset data, or `undefined`.
56
76
  */
57
77
  private _buildData;
58
- destroyAsset(): void;
78
+ /**
79
+ * Returns the engine texture behind this asset, when there is one: the resource itself for a
80
+ * `texture` asset, the atlas's texture for a `textureatlas` asset, `null` otherwise
81
+ * (including before the asset has loaded).
82
+ * @returns The texture, or `null`.
83
+ */
84
+ private _texture;
85
+ /**
86
+ * Writes one texture option through to the created asset, if any. The engine-JSON key is
87
+ * written into `asset.data`, mutated in place - replacing the whole object would make the
88
+ * registry re-patch every key, and a re-patched `srgb` or `mipmaps` recreates the texture
89
+ * even when unchanged. The in-place key is what a not-yet-started load reads at texture
90
+ * construction, and what any later reload reads. When the texture already exists, the
91
+ * corresponding property is assigned directly; `null` (attribute removed) deletes the key
92
+ * and restores the engine default. Assets of any other type are left untouched.
93
+ *
94
+ * @param key - The engine texture JSON key in `asset.data`.
95
+ * @param property - The Texture property to assign.
96
+ * @param dataValue - The engine-JSON value for `asset.data`, or `null` to delete the key.
97
+ * @param textureValue - The value for the Texture property, or `null` for the engine default.
98
+ */
99
+ private _applyTextureOption;
100
+ private _destroyAsset;
101
+ /**
102
+ * Sets the texture's horizontal (U) address mode: how texture coordinates outside the 0 to 1
103
+ * range sample the texture. Applies to `texture` and `textureatlas` assets, both when the
104
+ * texture is created and after it has loaded.
105
+ * @param value - The address mode, or `null` to use the engine default of 'repeat'.
106
+ */
107
+ set addressU(value: AddressMode | null);
108
+ /**
109
+ * Gets the texture's horizontal (U) address mode.
110
+ * @returns The address mode, or `null` when unset.
111
+ */
112
+ get addressU(): AddressMode | null;
113
+ /**
114
+ * Sets the texture's vertical (V) address mode: how texture coordinates outside the 0 to 1
115
+ * range sample the texture. Applies to `texture` and `textureatlas` assets, both when the
116
+ * texture is created and after it has loaded.
117
+ * @param value - The address mode, or `null` to use the engine default of 'repeat'.
118
+ */
119
+ set addressV(value: AddressMode | null);
120
+ /**
121
+ * Gets the texture's vertical (V) address mode.
122
+ * @returns The address mode, or `null` when unset.
123
+ */
124
+ get addressV(): AddressMode | null;
125
+ /**
126
+ * Sets the texture's maximum anisotropic filtering level, which improves quality at oblique
127
+ * viewing angles. Applies to `texture` and `textureatlas` assets, both when the texture is
128
+ * created and after it has loaded.
129
+ * @param value - The anisotropy level, or `null` to use the engine default of 1.
130
+ */
131
+ set anisotropy(value: number | null);
132
+ /**
133
+ * Gets the texture's maximum anisotropic filtering level.
134
+ * @returns The anisotropy level, or `null` when unset.
135
+ */
136
+ get anisotropy(): number | null;
137
+ /**
138
+ * Sets whether the texture's image data is flipped vertically at upload. Applies to `texture`
139
+ * and `textureatlas` assets, both when the texture is created and after it has loaded.
140
+ * @param value - The flip flag, or `null` to use the engine default of `false`.
141
+ */
142
+ set flipY(value: boolean | null);
143
+ /**
144
+ * Gets whether the texture's image data is flipped vertically at upload.
145
+ * @returns The flip flag, or `null` when unset.
146
+ */
147
+ get flipY(): boolean | null;
59
148
  /**
60
149
  * Sets whether the asset should be loaded lazily.
61
150
  * @param value - The lazy loading flag.
@@ -66,13 +155,64 @@ declare class AssetElement extends AsyncElement {
66
155
  * @returns The lazy loading flag.
67
156
  */
68
157
  get lazy(): boolean;
158
+ /**
159
+ * Sets the texture's magnification filter, used when the texture is displayed larger than its
160
+ * source size. Applies to `texture` and `textureatlas` assets, both when the texture is
161
+ * created and after it has loaded.
162
+ * @param value - The filter, or `null` to use the engine default of 'linear'.
163
+ */
164
+ set magFilter(value: MagFilterMode | null);
165
+ /**
166
+ * Gets the texture's magnification filter.
167
+ * @returns The filter, or `null` when unset.
168
+ */
169
+ get magFilter(): MagFilterMode | null;
170
+ /**
171
+ * Sets the texture's minification filter, used when the texture is displayed smaller than its
172
+ * source size. The mip variants blend within (and, for the second `linear`, between) mipmap
173
+ * levels. Applies to `texture` and `textureatlas` assets, both when the texture is created
174
+ * and after it has loaded.
175
+ * @param value - The filter, or `null` to use the engine default of 'linear-mip-linear'.
176
+ */
177
+ set minFilter(value: MinFilterMode | null);
178
+ /**
179
+ * Gets the texture's minification filter.
180
+ * @returns The filter, or `null` when unset.
181
+ */
182
+ get minFilter(): MinFilterMode | null;
183
+ /**
184
+ * Sets whether the texture generates and uses mipmaps. Changing this on a loaded texture
185
+ * recreates the underlying GPU resource, so prefer declaring it up front. Applies to
186
+ * `texture` and `textureatlas` assets.
187
+ * @param value - The mipmaps flag, or `null` to use the engine default of `true`.
188
+ */
189
+ set mipmaps(value: boolean | null);
190
+ /**
191
+ * Gets whether the texture generates and uses mipmaps.
192
+ * @returns The mipmaps flag, or `null` when unset.
193
+ */
194
+ get mipmaps(): boolean | null;
195
+ /**
196
+ * Sets whether the texture holds sRGB (gamma-encoded) color data, enabling hardware gamma
197
+ * decode. Free when set before the texture loads; changing it on a loaded texture recreates
198
+ * the underlying GPU resource. Applies to `texture` and `textureatlas` assets.
199
+ * @param value - The sRGB flag, or `null` to use the engine default of `false`.
200
+ */
201
+ set srgb(value: boolean | null);
202
+ /**
203
+ * Gets whether the texture holds sRGB (gamma-encoded) color data.
204
+ * @returns The sRGB flag, or `null` when unset.
205
+ */
206
+ get srgb(): boolean | null;
207
+ /**
208
+ * Returns the {@link Asset} created by the `<pc-asset>` element with the given `id`, or
209
+ * `undefined` if there is no such element or its asset has not been created yet.
210
+ *
211
+ * @param id - The `id` of the `<pc-asset>` element.
212
+ * @returns The asset, or `undefined`.
213
+ */
69
214
  static get(id: string): Asset | null | undefined;
70
215
  static get observedAttributes(): string[];
71
216
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
72
217
  }
73
- declare global {
74
- interface HTMLElementTagNameMap {
75
- 'pc-asset': AssetElement;
76
- }
77
- }
78
218
  export { AssetElement };
@@ -1,14 +1,16 @@
1
- import { AppElement } from './app';
2
- import { EntityElement } from './entity';
1
+ import type { AppElement } from './app';
2
+ import type { EntityBaseElement } from './entity-base';
3
3
  /**
4
4
  * Base class for all PlayCanvas Web Components that initialize asynchronously.
5
5
  *
6
- * @fires {CustomEvent} ready - Fired once the element is fully initialized. Bubbles and is
7
- * composed.
6
+ * @fires {CustomEvent} ready - Fired when the element is fully initialized once per readiness
7
+ * cycle, so an element that is torn down and re-initialized (for example by removing and
8
+ * re-inserting it) fires it again. Bubbles and is composed.
8
9
  */
9
10
  declare class AsyncElement extends HTMLElement {
10
11
  private _readyPromise;
11
12
  private _readyResolve;
13
+ private _readyResolved;
12
14
  /** @ignore */
13
15
  constructor();
14
16
  /**
@@ -18,20 +20,35 @@ declare class AsyncElement extends HTMLElement {
18
20
  */
19
21
  get closestApp(): AppElement | null;
20
22
  /**
21
- * The nearest ancestor `<pc-entity>` element, or `null` if this element has no `<pc-entity>`
22
- * ancestor. The search starts at the parent, so an element never resolves to itself.
23
- * @returns The closest entity element, or `null`.
23
+ * The nearest ancestor element that fronts an entity `<pc-entity>` or `<pc-node>` — or
24
+ * `null` if this element has no such ancestor. The search starts at the parent, so an element
25
+ * never resolves to itself.
26
+ * @returns The closest entity-fronting element, or `null`.
24
27
  */
25
- get closestEntity(): EntityElement | null;
28
+ get closestEntity(): EntityBaseElement | null;
26
29
  /**
27
30
  * Called when the element is fully initialized and ready. Subclasses should call this when
28
31
  * they're ready. Resolves the ready promise and dispatches a bubbling, composed `ready`
29
- * event.
32
+ * event. Signals at most once per readiness cycle: a repeat call before {@link _resetReady}
33
+ * has re-armed the promise does nothing.
30
34
  */
31
35
  protected _onReady(): void;
36
+ /**
37
+ * Returns the ready promise to its pending state. Subclasses should call this when the
38
+ * resource their readiness announced is torn down (typically from `disconnectedCallback`),
39
+ * so that a later re-initialization can signal readiness again. Does nothing while the
40
+ * promise is still pending — an in-flight waiter carries over to the next readiness cycle
41
+ * rather than being stranded on a promise nothing will ever resolve.
42
+ */
43
+ protected _resetReady(): void;
32
44
  /**
33
45
  * Returns a promise that resolves with this element when it's ready. This is the low-level
34
46
  * primitive underlying {@link whenReady}, which is the recommended way to wait for elements.
47
+ *
48
+ * Readiness tracks the element's current lifecycle: once a ready element is torn down (for
49
+ * example by removing it from the document), this returns a fresh promise that resolves when
50
+ * the element is next ready. A promise obtained earlier stays resolved — call this again
51
+ * after re-inserting an element rather than reusing a promise from before its removal.
35
52
  * @returns A promise that resolves with this element when it's ready.
36
53
  */
37
54
  ready(): Promise<this>;
@@ -1,4 +1,5 @@
1
- import { ButtonComponent, Color, Vec4 } from 'playcanvas';
1
+ import type { ButtonComponent } from 'playcanvas';
2
+ import { Color, Vec4 } from 'playcanvas';
2
3
  import { ComponentElement } from './component';
3
4
  /**
4
5
  * The ButtonComponentElement interface provides properties and methods for manipulating
@@ -25,7 +26,7 @@ declare class ButtonComponentElement extends ComponentElement {
25
26
  private _inactiveSpriteFrame;
26
27
  /** @ignore */
27
28
  constructor();
28
- getInitialComponentData(): Record<string, any>;
29
+ protected getInitialComponentData(): Record<string, any>;
29
30
  /**
30
31
  * Gets the underlying PlayCanvas button component.
31
32
  * @returns The button component.
@@ -182,9 +183,4 @@ declare class ButtonComponentElement extends ComponentElement {
182
183
  static get observedAttributes(): string[];
183
184
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
184
185
  }
185
- declare global {
186
- interface HTMLElementTagNameMap {
187
- 'pc-button': ButtonComponentElement;
188
- }
189
- }
190
186
  export { ButtonComponentElement };
@@ -1,4 +1,5 @@
1
- import { CameraComponent, Color, Vec4 } from 'playcanvas';
1
+ import type { CameraComponent } from 'playcanvas';
2
+ import { Color, Vec4 } from 'playcanvas';
2
3
  import { ComponentElement } from './component';
3
4
  /**
4
5
  * The CameraComponentElement interface provides properties and methods for manipulating
@@ -29,7 +30,7 @@ declare class CameraComponentElement extends ComponentElement {
29
30
  private _tonemap;
30
31
  /** @ignore */
31
32
  constructor();
32
- getInitialComponentData(): {
33
+ protected getInitialComponentData(): {
33
34
  clearColor: Color;
34
35
  clearColorBuffer: boolean;
35
36
  clearDepthBuffer: boolean;
@@ -249,9 +250,4 @@ declare class CameraComponentElement extends ComponentElement {
249
250
  static get observedAttributes(): string[];
250
251
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
251
252
  }
252
- declare global {
253
- interface HTMLElementTagNameMap {
254
- 'pc-camera': CameraComponentElement;
255
- }
256
- }
257
253
  export { CameraComponentElement };
@@ -1,4 +1,5 @@
1
- import { CollisionComponent, Quat, Vec3 } from 'playcanvas';
1
+ import type { CollisionComponent } from 'playcanvas';
2
+ import { Quat, Vec3 } from 'playcanvas';
2
3
  import { ComponentElement } from './component';
3
4
  /**
4
5
  * The CollisionComponentElement interface provides properties and methods for manipulating
@@ -6,6 +7,12 @@ import { ComponentElement } from './component';
6
7
  * The CollisionComponentElement interface also inherits the properties and methods of the
7
8
  * {@link HTMLElement} interface.
8
9
  *
10
+ * For `type="mesh"`, the collision geometry defaults to the host entity's own render component
11
+ * (its render asset) — a collider matching the visible mesh, which is what a mesh collider on a
12
+ * glTF node means. The default resolves each time the component applies, so a `pc-node` that
13
+ * retargets or rebinds picks up the new node's geometry. An entity with no asset-backed render
14
+ * component warns, and the collider has no shape.
15
+ *
9
16
  * @category Components
10
17
  */
11
18
  declare class CollisionComponentElement extends ComponentElement {
@@ -19,7 +26,7 @@ declare class CollisionComponentElement extends ComponentElement {
19
26
  private _type;
20
27
  /** @ignore */
21
28
  constructor();
22
- getInitialComponentData(): {
29
+ protected getInitialComponentData(): {
23
30
  axis: number;
24
31
  angularOffset: Quat;
25
32
  convexHull: boolean;
@@ -29,6 +36,16 @@ declare class CollisionComponentElement extends ComponentElement {
29
36
  radius: number;
30
37
  type: "box" | "capsule" | "compound" | "cone" | "cylinder" | "mesh" | "sphere";
31
38
  };
39
+ protected initComponent(): void;
40
+ /**
41
+ * Defaults a mesh collider's geometry to the host entity's own render component. The
42
+ * engine's mesh collider only works with explicitly supplied geometry, and the element has
43
+ * no attribute to supply it - so the host's visible geometry, the meaning a mesh collider
44
+ * on a glTF node carries, fills the gap. Runs on every application (so a rebound `pc-node`
45
+ * recomputes it) and on a runtime switch to `type="mesh"`; an explicitly assigned
46
+ * `renderAsset` is never overwritten.
47
+ */
48
+ private _applyMeshGeometryDefault;
32
49
  /**
33
50
  * Gets the underlying PlayCanvas collision component.
34
51
  * @returns The collision component.
@@ -53,9 +70,4 @@ declare class CollisionComponentElement extends ComponentElement {
53
70
  static get observedAttributes(): string[];
54
71
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
55
72
  }
56
- declare global {
57
- interface HTMLElementTagNameMap {
58
- 'pc-collision': CollisionComponentElement;
59
- }
60
- }
61
73
  export { CollisionComponentElement };
@@ -1,4 +1,4 @@
1
- import { Component } from 'playcanvas';
1
+ import type { Component } from 'playcanvas';
2
2
  import { AsyncElement } from '../async-element';
3
3
  /**
4
4
  * Represents a component in the PlayCanvas engine.
@@ -10,6 +10,24 @@ declare class ComponentElement extends AsyncElement {
10
10
  private _enabled;
11
11
  private _component;
12
12
  private _appElement;
13
+ /**
14
+ * The element hosting this component, held so the host's readiness cycles can be observed
15
+ * even after `closestEntity` would no longer resolve (during teardown).
16
+ */
17
+ private _hostElement;
18
+ /**
19
+ * The listener re-applying this component when the host's readiness cycles. Held for
20
+ * removal on disconnect.
21
+ */
22
+ private _hostReadyListener;
23
+ /**
24
+ * Incremented on every connect and disconnect. connectedCallback captures the value on entry
25
+ * and abandons itself wherever it resumes from an await if the value has moved on — so a
26
+ * callback whose element was removed cannot act on a torn-down tree, and one whose element
27
+ * was removed and re-inserted (which runs a callback of its own) cannot add the component a
28
+ * second time.
29
+ */
30
+ private _connectionGeneration;
13
31
  /**
14
32
  * Creates a new ComponentElement instance.
15
33
  *
@@ -17,9 +35,28 @@ declare class ComponentElement extends AsyncElement {
17
35
  * @ignore
18
36
  */
19
37
  constructor(componentName: string);
20
- getInitialComponentData(): {};
21
- addComponent(): Promise<void>;
22
- initComponent(): void;
38
+ /**
39
+ * Returns the data the component is created with. Overridden by subclasses to supply the
40
+ * initial values of their cached properties.
41
+ *
42
+ * @returns The initial component data.
43
+ */
44
+ protected getInitialComponentData(): {};
45
+ /**
46
+ * Creates the component on the host's current entity, removing it first from a previous
47
+ * entity that is still alive (a retargeted `<pc-node>` moves its decorations with it). When
48
+ * the entity already has a component of this type — a glTF node arriving with its authored
49
+ * `render` component, say — warns and leaves `component` null. The element-level warning is
50
+ * load-bearing: the engine's own duplicate-addComponent warning is Debug-stripped from
51
+ * production builds, which would otherwise leave a silent null.
52
+ */
53
+ private _applyComponent;
54
+ private _addComponent;
55
+ /**
56
+ * Configures the newly added component. Overridden by subclasses whose setup goes beyond
57
+ * the initial data — child-element handling, asset resolution and the like.
58
+ */
59
+ protected initComponent(): void;
23
60
  connectedCallback(): Promise<void>;
24
61
  disconnectedCallback(): void;
25
62
  /**
@@ -1,4 +1,5 @@
1
- import { Color, ElementComponent, Vec2, Vec4 } from 'playcanvas';
1
+ import type { ElementComponent } from 'playcanvas';
2
+ import { Color, Vec2, Vec4 } from 'playcanvas';
2
3
  import { ComponentElement } from './component';
3
4
  /**
4
5
  * The ElementComponentElement interface provides properties and methods for manipulating
@@ -37,8 +38,8 @@ declare class ElementComponentElement extends ComponentElement {
37
38
  private _wrapLines;
38
39
  /** @ignore */
39
40
  constructor();
40
- initComponent(): void;
41
- getInitialComponentData(): Record<string, any>;
41
+ protected initComponent(): void;
42
+ protected getInitialComponentData(): Record<string, any>;
42
43
  /**
43
44
  * Gets the underlying PlayCanvas element component.
44
45
  * @returns The element component.
@@ -312,9 +313,4 @@ declare class ElementComponentElement extends ComponentElement {
312
313
  static get observedAttributes(): string[];
313
314
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
314
315
  }
315
- declare global {
316
- interface HTMLElementTagNameMap {
317
- 'pc-element': ElementComponentElement;
318
- }
319
- }
320
316
  export { ElementComponentElement };
@@ -1,4 +1,4 @@
1
- import { GSplatComponent } from 'playcanvas';
1
+ import type { GSplatComponent } from 'playcanvas';
2
2
  import { ComponentElement } from './component';
3
3
  /**
4
4
  * The GSplatComponentElement interface provides properties and methods for manipulating
@@ -17,7 +17,7 @@ declare class GSplatComponentElement extends ComponentElement {
17
17
  private _lodRangeMax;
18
18
  /** @ignore */
19
19
  constructor();
20
- getInitialComponentData(): {
20
+ protected getInitialComponentData(): {
21
21
  asset: import("playcanvas").Asset | null | undefined;
22
22
  castShadows: boolean;
23
23
  lodBaseDistance: number;
@@ -105,9 +105,4 @@ declare class GSplatComponentElement extends ComponentElement {
105
105
  static get observedAttributes(): string[];
106
106
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
107
107
  }
108
- declare global {
109
- interface HTMLElementTagNameMap {
110
- 'pc-gsplat': GSplatComponentElement;
111
- }
112
- }
113
108
  export { GSplatComponentElement };
@@ -1,4 +1,4 @@
1
- import { LayoutChildComponent } from 'playcanvas';
1
+ import type { LayoutChildComponent } from 'playcanvas';
2
2
  import { ComponentElement } from './component';
3
3
  /**
4
4
  * The LayoutChildComponentElement interface provides properties and methods for manipulating
@@ -18,7 +18,7 @@ declare class LayoutChildComponentElement extends ComponentElement {
18
18
  private _excludeFromLayout;
19
19
  /** @ignore */
20
20
  constructor();
21
- getInitialComponentData(): {
21
+ protected getInitialComponentData(): {
22
22
  minWidth: number;
23
23
  minHeight: number;
24
24
  maxWidth: number | null;
@@ -107,9 +107,4 @@ declare class LayoutChildComponentElement extends ComponentElement {
107
107
  static get observedAttributes(): string[];
108
108
  attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
109
109
  }
110
- declare global {
111
- interface HTMLElementTagNameMap {
112
- 'pc-layoutchild': LayoutChildComponentElement;
113
- }
114
- }
115
110
  export { LayoutChildComponentElement };