@playcanvas/web-components 0.11.1 → 0.13.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 (96) hide show
  1. package/README.md +1 -1
  2. package/dist/app.d.cts +246 -0
  3. package/dist/app.d.ts +38 -13
  4. package/dist/asset.d.cts +218 -0
  5. package/dist/asset.d.ts +145 -6
  6. package/dist/async-element.d.cts +103 -0
  7. package/dist/async-element.d.ts +11 -8
  8. package/dist/colors.d.cts +1 -0
  9. package/dist/components/button-component.d.cts +186 -0
  10. package/dist/components/button-component.d.ts +1 -1
  11. package/dist/components/camera-component.d.cts +253 -0
  12. package/dist/components/camera-component.d.ts +1 -1
  13. package/dist/components/collision-component.d.cts +73 -0
  14. package/dist/components/collision-component.d.ts +17 -1
  15. package/dist/components/component.d.cts +82 -0
  16. package/dist/components/component.d.ts +20 -1
  17. package/dist/components/element-component.d.cts +316 -0
  18. package/dist/components/element-component.d.ts +1 -1
  19. package/dist/components/gsplat-component.d.cts +108 -0
  20. package/dist/components/gsplat-component.d.ts +1 -1
  21. package/dist/components/layoutchild-component.d.cts +110 -0
  22. package/dist/components/layoutchild-component.d.ts +1 -1
  23. package/dist/components/layoutgroup-component.d.cts +136 -0
  24. package/dist/components/layoutgroup-component.d.ts +1 -1
  25. package/dist/components/light-component.d.cts +264 -0
  26. package/dist/components/light-component.d.ts +1 -1
  27. package/dist/components/listener-component.d.cts +20 -0
  28. package/dist/components/listener-component.d.ts +1 -1
  29. package/dist/components/particlesystem-component.d.cts +52 -0
  30. package/dist/components/particlesystem-component.d.ts +1 -1
  31. package/dist/components/render-component.d.cts +76 -0
  32. package/dist/components/render-component.d.ts +1 -1
  33. package/dist/components/rigidbody-component.d.cts +88 -0
  34. package/dist/components/rigidbody-component.d.ts +1 -1
  35. package/dist/components/screen-component.d.cts +70 -0
  36. package/dist/components/screen-component.d.ts +1 -1
  37. package/dist/components/script-component.d.cts +163 -0
  38. package/dist/components/script-component.d.ts +1 -1
  39. package/dist/components/script.d.cts +94 -0
  40. package/dist/components/script.d.ts +1 -1
  41. package/dist/components/scrollbar-component.d.cts +69 -0
  42. package/dist/components/scrollbar-component.d.ts +1 -1
  43. package/dist/components/scrollview-component.d.cts +178 -0
  44. package/dist/components/scrollview-component.d.ts +1 -1
  45. package/dist/components/sound-component.d.cts +108 -0
  46. package/dist/components/sound-component.d.ts +1 -1
  47. package/dist/components/sound-slot.d.cts +134 -0
  48. package/dist/components/sound-slot.d.ts +2 -2
  49. package/dist/custom-elements.json +1127 -179
  50. package/dist/entity-base.d.cts +67 -0
  51. package/dist/entity-base.d.ts +67 -0
  52. package/dist/entity.d.cts +131 -0
  53. package/dist/entity.d.ts +3 -38
  54. package/dist/index.d.cts +79 -0
  55. package/dist/index.d.ts +35 -32
  56. package/dist/loading-bar.d.cts +35 -0
  57. package/dist/material.d.cts +1011 -0
  58. package/dist/material.d.ts +2 -1
  59. package/dist/model.d.cts +72 -0
  60. package/dist/model.d.ts +27 -5
  61. package/dist/module.d.cts +29 -0
  62. package/dist/module.d.ts +16 -10
  63. package/dist/node.d.cts +253 -0
  64. package/dist/node.d.ts +253 -0
  65. package/dist/parse.d.cts +147 -0
  66. package/dist/pwc.cjs +1496 -200
  67. package/dist/pwc.cjs.map +1 -1
  68. package/dist/pwc.js +1497 -201
  69. package/dist/pwc.js.map +1 -1
  70. package/dist/pwc.min.js +1 -1
  71. package/dist/pwc.min.js.map +1 -1
  72. package/dist/pwc.min.mjs +1 -1
  73. package/dist/pwc.min.mjs.map +1 -1
  74. package/dist/pwc.mjs +1496 -202
  75. package/dist/pwc.mjs.map +1 -1
  76. package/dist/scene.d.cts +117 -0
  77. package/dist/scene.d.ts +1 -1
  78. package/dist/sky.d.cts +121 -0
  79. package/dist/sky.d.ts +1 -1
  80. package/dist/vscode.html-custom-data.json +127 -5
  81. package/dist/web-types.json +399 -59
  82. package/package.json +16 -7
  83. package/src/app.ts +137 -45
  84. package/src/asset.ts +439 -9
  85. package/src/async-element.ts +11 -8
  86. package/src/components/collision-component.ts +35 -0
  87. package/src/components/component.ts +93 -3
  88. package/src/entity-base.ts +136 -0
  89. package/src/entity.ts +23 -117
  90. package/src/index.ts +5 -0
  91. package/src/loading-bar.ts +2 -2
  92. package/src/material.ts +2 -2
  93. package/src/model.ts +79 -11
  94. package/src/module.ts +39 -20
  95. package/src/node.ts +715 -0
  96. package/src/sky.ts +0 -1
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
- <img width="3840" height="2160" alt="image" src="https://github.com/user-attachments/assets/e113cd2a-300d-4713-a1f4-ada647a8f04c" />
33
+ <img width="5120" height="2160" alt="examples" src="https://github.com/user-attachments/assets/92cf1156-c93f-46b5-8d05-e576967ceaf3" />
34
34
 
35
35
  See PlayCanvas Web Components in action here: https://playcanvas.github.io/web-components/examples
36
36
 
package/dist/app.d.cts ADDED
@@ -0,0 +1,246 @@
1
+ import type { Entity } from 'playcanvas';
2
+ import { AppBase } from 'playcanvas';
3
+ import { AsyncElement } from './async-element.cjs';
4
+ import type { EntityBaseElement } from './entity-base.cjs';
5
+ /**
6
+ * The AppElement interface provides properties and methods for manipulating
7
+ * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-app/ | `<pc-app>`} elements.
8
+ * The AppElement interface also inherits the properties and methods of the
9
+ * {@link HTMLElement} interface.
10
+ *
11
+ * The element is sized like a replaced element such as `<video>`: a block-level box that the
12
+ * page's CSS controls, 300x150 by default. The application's canvas always fills the element,
13
+ * and the drawing buffer resolution follows the element's size (capped by `max-pixel-ratio`),
14
+ * tracked live via a ResizeObserver — so the element can be embedded at any size, resized by
15
+ * its container, or made fullscreen with ordinary CSS such as `width: 100vw; height: 100dvh`.
16
+ *
17
+ * @fires {ProgressEvent} progress - Fired while the application preloads its assets. `loaded` and
18
+ * `total` are asset counts, not bytes, and an asset that fails to load still counts as loaded.
19
+ * Fired at least once per boot, and the final event always has `loaded` equal to `total`. Does
20
+ * not bubble.
21
+ *
22
+ * @fires {ErrorEvent} error - Fired when the application cannot boot because no graphics device
23
+ * could be created (for example, a browser with WebGL disabled). `message` names the requested
24
+ * backends and `error` holds the underlying failure. The element never becomes ready
25
+ * and `app` stays `null` — listen for this event to show a fallback UI. Removing the element and
26
+ * re-inserting it retries the boot with its current attributes. Does not bubble.
27
+ */
28
+ declare class AppElement extends AsyncElement {
29
+ /**
30
+ * The canvas element.
31
+ */
32
+ private _canvas;
33
+ private _alpha;
34
+ private _backend;
35
+ private _antialias;
36
+ private _depthBuffer;
37
+ private _stencilBuffer;
38
+ private _maxPixelRatio;
39
+ private _loadingBar;
40
+ /**
41
+ * Set once the graphics options above have been handed to `createGraphicsDevice`, after which
42
+ * writing any of them changes nothing. Guards the warning in {@link _warnIfBooted}, and is
43
+ * cleared on disconnect so a re-connected element boots from its current attributes.
44
+ */
45
+ private _optionsLocked;
46
+ private _bar;
47
+ /**
48
+ * Incremented on every connect and disconnect. Boot captures the value on entry and abandons
49
+ * itself wherever it resumes from an await if the value has moved on — so a boot whose
50
+ * element was removed cannot complete against a torn-down element, and a boot whose element
51
+ * was removed and re-inserted (which starts a boot of its own) cannot race the newer one.
52
+ */
53
+ private _bootGeneration;
54
+ /**
55
+ * The elements backing this application's entities, keyed by the entity itself. Registered
56
+ * by EntityElement at creation (and NodeElement at binding) and removed when an entity is
57
+ * destroyed or unbound, this joins engine scene nodes back to their owning elements by
58
+ * identity - never by name.
59
+ */
60
+ private _entityElements;
61
+ private _picker;
62
+ private _hasPointerListeners;
63
+ private _hoveredEntity;
64
+ private _pickToken;
65
+ private _pointerHandlers;
66
+ private _app;
67
+ private _loadProgress;
68
+ /**
69
+ * Tracks the element's box so the drawing buffer and picker follow it. Created per boot once
70
+ * the application exists, and disconnected on teardown. `null` where ResizeObserver is
71
+ * unavailable (jsdom), where the boot-time resolution set is the only sizing that happens.
72
+ */
73
+ private _resizeObserver;
74
+ /**
75
+ * The PlayCanvas application instance. `null` until the element is ready, and again once it
76
+ * has been removed from the document — await {@link whenReady} or the element's `ready()`
77
+ * promise before accessing it.
78
+ * @returns The application instance, or `null`.
79
+ */
80
+ get app(): AppBase | null;
81
+ /**
82
+ * The asset preload progress of the application, as a fraction from 0 to 1. It is 0 until
83
+ * preloading begins (and again once the element has been removed from the document), and 1
84
+ * once preloading has finished — including when there was nothing to preload. Read this to
85
+ * initialize a loading UI; subsequent updates arrive via the `progress` event.
86
+ * @returns The preload progress.
87
+ */
88
+ get loadProgress(): number;
89
+ /**
90
+ * Creates a new AppElement instance.
91
+ *
92
+ * @ignore
93
+ */
94
+ constructor();
95
+ connectedCallback(): Promise<void>;
96
+ disconnectedCallback(): void;
97
+ /**
98
+ * Syncs the drawing buffer and the picker to the canvas's current CSS size. The picker must
99
+ * track the buffer, or picks would land at stale coordinates after a resize. Skipped while
100
+ * an XR session presents - the session owns the buffer size.
101
+ */
102
+ private _syncCanvasSize;
103
+ private _pickerCreate;
104
+ private _pickerDestroy;
105
+ /**
106
+ * Returns the `<pc-entity>` or `<pc-node>` element whose backing entity is `entity`, or
107
+ * `null` if the entity is not fronted by an element of this application - for example, an
108
+ * unbound node inside a model's instantiated hierarchy, or an entity created through the
109
+ * engine API.
110
+ *
111
+ * @param entity - The entity to look up.
112
+ * @returns The element fronting the entity, or `null`.
113
+ */
114
+ elementFromEntity(entity: Entity): EntityBaseElement | null;
115
+ /**
116
+ * Resolves the element that owns a picked node: the nearest node up the parent chain -
117
+ * starting with the node itself - that is fronted by a `<pc-entity>` or `<pc-node>` of this
118
+ * application. A hit inside a model's instantiated hierarchy therefore resolves to the
119
+ * nearest bound `<pc-node>`, or failing that the element hosting the model.
120
+ *
121
+ * @param node - The picked node, or `null`.
122
+ * @returns The owning element, or `null`.
123
+ */
124
+ private _elementFromNode;
125
+ /**
126
+ * Like {@link _elementFromNode}, but skips elements without a listener for `type`, so a hit
127
+ * on an unlistened child still reaches a listening ancestor.
128
+ *
129
+ * @param node - The picked node, or `null`.
130
+ * @param type - The pointer event type a listener is required for.
131
+ * @returns The nearest listening element, or `null`.
132
+ */
133
+ private _elementWithListener;
134
+ private _getPickerCoordinates;
135
+ /**
136
+ * Picks the scene under the pointer and returns the graph node that was hit, or `null`.
137
+ *
138
+ * The read back is asynchronous because the synchronous {@link Picker.getSelection} is not
139
+ * supported on WebGPU, where it returns an empty selection rather than failing - which
140
+ * silently disabled every `onpointer*` handler once WebGPU became the resolved backend. The
141
+ * async variant works on both backends and does not block the main thread on a GPU read.
142
+ *
143
+ * @param event - The pointer event to pick under.
144
+ * @returns The graph node under the pointer, or `null` if nothing was hit.
145
+ */
146
+ private _pickNode;
147
+ private _onPointerMove;
148
+ private _onPointerDown;
149
+ private _onPointerUp;
150
+ private _onPointerListenerAdded;
151
+ private _onPointerListenerRemoved;
152
+ /**
153
+ * Warns that a graphics option was written too late to have any effect. These options are read
154
+ * once, when the element connects and creates its graphics device, so a later write updates
155
+ * only the element's own property - silently, without this.
156
+ *
157
+ * @param name - The name of the option, as its attribute.
158
+ */
159
+ private _warnIfBooted;
160
+ /**
161
+ * Sets whether the frame buffer has an alpha channel, which is what lets the page show through
162
+ * wherever the scene has not drawn. Read only when the application boots.
163
+ * @param value - The alpha flag.
164
+ */
165
+ set alpha(value: boolean);
166
+ /**
167
+ * Gets whether the frame buffer has an alpha channel.
168
+ * @returns The alpha flag.
169
+ */
170
+ get alpha(): boolean;
171
+ /**
172
+ * Sets whether the frame buffer is anti-aliased. Read only when the application boots.
173
+ * @param value - The antialias flag.
174
+ */
175
+ set antialias(value: boolean);
176
+ /**
177
+ * Gets whether the frame buffer is anti-aliased.
178
+ * @returns The antialias flag.
179
+ */
180
+ get antialias(): boolean;
181
+ /**
182
+ * Sets the graphics backend. Defaults to 'webgpu', which falls back to 'webgl2' if WebGPU
183
+ * is not supported by the browser. Read only when the application boots.
184
+ * @param value - The graphics backend ('webgpu', 'webgl2', or 'null').
185
+ */
186
+ set backend(value: 'webgpu' | 'webgl2' | 'null');
187
+ /**
188
+ * Gets the graphics backend.
189
+ * @returns The graphics backend.
190
+ */
191
+ get backend(): "webgpu" | "webgl2" | "null";
192
+ /**
193
+ * Sets whether the frame buffer has a depth buffer, which the renderer needs to resolve which
194
+ * surface is nearest the camera. Read only when the application boots.
195
+ * @param value - The depth buffer flag.
196
+ */
197
+ set depthBuffer(value: boolean);
198
+ /**
199
+ * Gets whether the frame buffer has a depth buffer.
200
+ * @returns The depth buffer flag.
201
+ */
202
+ get depthBuffer(): boolean;
203
+ /**
204
+ * Sets whether the application shows its built-in loading bar while it boots and preloads its
205
+ * assets. Enabled by default; setting `false` removes the bar immediately, while setting
206
+ * `true` has no effect until the element is next connected. The bar can be themed with the
207
+ * CSS custom properties `--pc-loading-bar-color`, `--pc-loading-bar-background` and
208
+ * `--pc-loading-bar-height`.
209
+ * @param value - The loading bar flag.
210
+ */
211
+ set loadingBar(value: boolean);
212
+ /**
213
+ * Gets whether the application shows its built-in loading bar while it boots and preloads
214
+ * its assets.
215
+ * @returns The loading bar flag.
216
+ */
217
+ get loadingBar(): boolean;
218
+ /**
219
+ * Sets the cap on the pixel ratio the application renders at. The canvas is sized by the
220
+ * smaller of this value and the display's own device pixel ratio, so the default of `Infinity`
221
+ * renders at full physical resolution, `1` renders at CSS resolution, and an intermediate
222
+ * value such as `2` keeps a dense display sharp without paying for every one of its pixels.
223
+ * Must be greater than 0. Unlike the other graphics options, this applies immediately.
224
+ * @param value - The maximum pixel ratio.
225
+ */
226
+ set maxPixelRatio(value: number);
227
+ /**
228
+ * Gets the cap on the pixel ratio the application renders at.
229
+ * @returns The maximum pixel ratio.
230
+ */
231
+ get maxPixelRatio(): number;
232
+ /**
233
+ * Sets whether the frame buffer has a stencil buffer, which stencil-based effects and UI
234
+ * masking need. Read only when the application boots.
235
+ * @param value - The stencil buffer flag.
236
+ */
237
+ set stencilBuffer(value: boolean);
238
+ /**
239
+ * Gets whether the frame buffer has a stencil buffer.
240
+ * @returns The stencil buffer flag.
241
+ */
242
+ get stencilBuffer(): boolean;
243
+ static get observedAttributes(): string[];
244
+ attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
245
+ }
246
+ export { AppElement };
package/dist/app.d.ts CHANGED
@@ -1,17 +1,29 @@
1
1
  import type { Entity } from 'playcanvas';
2
2
  import { AppBase } from 'playcanvas';
3
- import { AsyncElement } from './async-element';
4
- import type { EntityElement } from './entity';
3
+ import { AsyncElement } from './async-element.js';
4
+ import type { EntityBaseElement } from './entity-base.js';
5
5
  /**
6
6
  * The AppElement interface provides properties and methods for manipulating
7
7
  * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-app/ | `<pc-app>`} elements.
8
8
  * The AppElement interface also inherits the properties and methods of the
9
9
  * {@link HTMLElement} interface.
10
10
  *
11
+ * The element is sized like a replaced element such as `<video>`: a block-level box that the
12
+ * page's CSS controls, 300x150 by default. The application's canvas always fills the element,
13
+ * and the drawing buffer resolution follows the element's size (capped by `max-pixel-ratio`),
14
+ * tracked live via a ResizeObserver — so the element can be embedded at any size, resized by
15
+ * its container, or made fullscreen with ordinary CSS such as `width: 100vw; height: 100dvh`.
16
+ *
11
17
  * @fires {ProgressEvent} progress - Fired while the application preloads its assets. `loaded` and
12
18
  * `total` are asset counts, not bytes, and an asset that fails to load still counts as loaded.
13
19
  * Fired at least once per boot, and the final event always has `loaded` equal to `total`. Does
14
20
  * not bubble.
21
+ *
22
+ * @fires {ErrorEvent} error - Fired when the application cannot boot because no graphics device
23
+ * could be created (for example, a browser with WebGL disabled). `message` names the requested
24
+ * backends and `error` holds the underlying failure. The element never becomes ready
25
+ * and `app` stays `null` — listen for this event to show a fallback UI. Removing the element and
26
+ * re-inserting it retries the boot with its current attributes. Does not bubble.
15
27
  */
16
28
  declare class AppElement extends AsyncElement {
17
29
  /**
@@ -41,8 +53,9 @@ declare class AppElement extends AsyncElement {
41
53
  private _bootGeneration;
42
54
  /**
43
55
  * The elements backing this application's entities, keyed by the entity itself. Registered
44
- * by EntityElement at creation and removed when an entity is destroyed, this joins engine
45
- * scene nodes back to their owning elements by identity - never by name.
56
+ * by EntityElement at creation (and NodeElement at binding) and removed when an entity is
57
+ * destroyed or unbound, this joins engine scene nodes back to their owning elements by
58
+ * identity - never by name.
46
59
  */
47
60
  private _entityElements;
48
61
  private _picker;
@@ -52,6 +65,12 @@ declare class AppElement extends AsyncElement {
52
65
  private _pointerHandlers;
53
66
  private _app;
54
67
  private _loadProgress;
68
+ /**
69
+ * Tracks the element's box so the drawing buffer and picker follow it. Created per boot once
70
+ * the application exists, and disconnected on teardown. `null` where ResizeObserver is
71
+ * unavailable (jsdom), where the boot-time resolution set is the only sizing that happens.
72
+ */
73
+ private _resizeObserver;
55
74
  /**
56
75
  * The PlayCanvas application instance. `null` until the element is ready, and again once it
57
76
  * has been removed from the document — await {@link whenReady} or the element's `ready()`
@@ -75,23 +94,29 @@ declare class AppElement extends AsyncElement {
75
94
  constructor();
76
95
  connectedCallback(): Promise<void>;
77
96
  disconnectedCallback(): void;
78
- private _onWindowResize;
97
+ /**
98
+ * Syncs the drawing buffer and the picker to the canvas's current CSS size. The picker must
99
+ * track the buffer, or picks would land at stale coordinates after a resize. Skipped while
100
+ * an XR session presents - the session owns the buffer size.
101
+ */
102
+ private _syncCanvasSize;
79
103
  private _pickerCreate;
80
104
  private _pickerDestroy;
81
105
  /**
82
- * Returns the `<pc-entity>` element whose backing entity is `entity`, or `null` if the
83
- * entity was not created by an element of this application - for example, a node inside a
84
- * model's instantiated hierarchy, or an entity created through the engine API.
106
+ * Returns the `<pc-entity>` or `<pc-node>` element whose backing entity is `entity`, or
107
+ * `null` if the entity is not fronted by an element of this application - for example, an
108
+ * unbound node inside a model's instantiated hierarchy, or an entity created through the
109
+ * engine API.
85
110
  *
86
111
  * @param entity - The entity to look up.
87
- * @returns The element backing the entity, or `null`.
112
+ * @returns The element fronting the entity, or `null`.
88
113
  */
89
- elementFromEntity(entity: Entity): EntityElement | null;
114
+ elementFromEntity(entity: Entity): EntityBaseElement | null;
90
115
  /**
91
116
  * Resolves the element that owns a picked node: the nearest node up the parent chain -
92
- * starting with the node itself - that was created by a `<pc-entity>` of this application.
93
- * A hit inside a model's instantiated hierarchy therefore resolves to the element hosting
94
- * the model.
117
+ * starting with the node itself - that is fronted by a `<pc-entity>` or `<pc-node>` of this
118
+ * application. A hit inside a model's instantiated hierarchy therefore resolves to the
119
+ * nearest bound `<pc-node>`, or failing that the element hosting the model.
95
120
  *
96
121
  * @param node - The picked node, or `null`.
97
122
  * @returns The owning element, or `null`.
@@ -0,0 +1,218 @@
1
+ import { Asset } from 'playcanvas';
2
+ import { AsyncElement } from './async-element.cjs';
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';
6
+ /**
7
+ * The AssetElement interface provides properties and methods for manipulating
8
+ * {@link https://developer.playcanvas.com/user-manual/web-components/tags/pc-asset/ | `<pc-asset>`} elements.
9
+ * The AssetElement interface also inherits the properties and methods of the
10
+ * {@link HTMLElement} interface.
11
+ *
12
+ * The element becomes ready once the containing application has started and the asset is in the
13
+ * state declared by the markup: loaded for preloaded assets (even if loading failed — check the
14
+ * asset's `resource`), or registered and awaiting a load for `lazy` assets. Elements inserted
15
+ * while the application is running are created and registered on insertion, and begin loading
16
+ * immediately unless `lazy`. A `pc-asset` must be a direct child of `pc-app` — elements placed
17
+ * elsewhere, or with an unsupported asset type, never become ready.
18
+ *
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.
29
+ *
30
+ * @attribute {string} id - The identifier used to reference the asset from other elements.
31
+ * @attribute {string} src - The URL of the asset to load.
32
+ * @attribute {string} type - The asset type. Inferred from the `src` file extension when omitted.
33
+ * @attribute {string} data - Additional asset data, as a JSON object.
34
+ * @attribute {string} atlas - For a `sprite` asset, the `id` of the texture atlas asset it uses.
35
+ * The atlas must be declared before the sprite.
36
+ * @attribute {string} frame-keys - For a `sprite` asset, the atlas frame keys it uses, separated
37
+ * by spaces or commas.
38
+ * @attribute {number} pixels-per-unit - For a `sprite` asset, the number of pixels per world unit.
39
+ * @attribute {'simple' | 'sliced' | 'tiled'} render-mode - For a `sprite` asset, how the sprite is
40
+ * rendered when resized.
41
+ *
42
+ * @fires {Event} load - Fired each time the asset finishes loading, including a `lazy` asset
43
+ * loaded later and any subsequent reloads. Does not bubble — listen on this element, or use a
44
+ * capture-phase listener on an ancestor to observe every asset.
45
+ * @fires {ErrorEvent} error - Fired when the asset fails to load, with the engine's error in
46
+ * `message`. Does not bubble. The element still becomes ready — readiness means the load settled,
47
+ * not that it succeeded.
48
+ */
49
+ declare class AssetElement extends AsyncElement {
50
+ private _addressU;
51
+ private _addressV;
52
+ private _anisotropy;
53
+ private _flipY;
54
+ private _lazy;
55
+ private _magFilter;
56
+ private _minFilter;
57
+ private _mipmaps;
58
+ private _srgb;
59
+ /**
60
+ * The asset that is loaded. Available once the element is ready — await
61
+ * {@link whenReady} or the element's `ready()` promise before accessing it.
62
+ */
63
+ asset: Asset | null;
64
+ connectedCallback(): Promise<void>;
65
+ disconnectedCallback(): void;
66
+ private _onAssetLoad;
67
+ private _onAssetError;
68
+ /**
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.
74
+ * @param type - The resolved asset type.
75
+ * @returns The asset data, or `undefined`.
76
+ */
77
+ private _buildData;
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;
148
+ /**
149
+ * Sets whether the asset should be loaded lazily.
150
+ * @param value - The lazy loading flag.
151
+ */
152
+ set lazy(value: boolean);
153
+ /**
154
+ * Gets whether the asset should be loaded lazily.
155
+ * @returns The lazy loading flag.
156
+ */
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
+ */
214
+ static get(id: string): Asset | null | undefined;
215
+ static get observedAttributes(): string[];
216
+ attributeChangedCallback(name: string, _oldValue: string | null, newValue: string | null): void;
217
+ }
218
+ export { AssetElement };