@playcanvas/web-components 0.1.10 → 0.1.12

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2024 PlayCanvas
+Copyright (c) 2011-2025 PlayCanvas
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -5,7 +5,9 @@
 [![License](https://img.shields.io/npm/l/@playcanvas/web-components.svg)](https://github.com/playcanvas/web-components/blob/main/LICENSE)
 [![GitHub Actions Build Status](https://github.com/playcanvas/web-components/actions/workflows/deploy.yml/badge.svg)](https://github.com/playcanvas/web-components/actions/workflows/deploy.yml)
 
-PlayCanvas Web Components are a set of custom HTML elements for building 3D interactive web apps. Using the declarative nature of HTML makes it both easy and fun to incorporate 3D into your website.
+| [User Guide](https://developer.playcanvas.com/user-manual/engine/web-components) | [API Reference](https://api.playcanvas.com/modules/EngineWebComponents.html) | [Examples](https://playcanvas.github.io/web-components/examples) | [Forum](https://forum.playcanvas.com/) | [Discord](https://discord.gg/RSaMRzg) |
+
+PlayCanvas Web Components are a set of custom HTML elements for building 3D interactive web apps. Using the declarative nature of HTML makes it both easy and fun to incorporate 3D into your website. Check out this simple example:
 
 ```html
 <!-- A lit sphere -->
@@ -30,293 +32,51 @@ PlayCanvas Web Components are a set of custom HTML elements for building 3D inte
 
 See PlayCanvas Web Components in action here: https://playcanvas.github.io/web-components/examples
 
-## Usage 🚧
-
-If you are using a bundler (e.g. Rollup), you can install PlayCanvas Web Components and the PlayCanvas Engine using NPM:
-
-```bash
-npm install playcanvas @playcanvas/web-components --save-dev
-```
-
-Or you can include it directly in your HTML file from a CDN.
-
-ES Modules:
-
-```html
-<script type="module" src="https://cdn.jsdelivr.net/npm/@playcanvas/web-components@0.1.9/dist/pwc.mjs"></script>
-```
-
-UMD:
-
-```html
-<script src="https://cdn.jsdelivr.net/npm/@playcanvas/web-components@0.1.9"></script>
-```
-
-## Tag Reference 📖
-
-Table of contents:
-
-- [pc-app](#pc-app)
-- [pc-asset](#pc-asset)
-- [pc-camera](#pc-camera)
-- [pc-collision](#pc-collision)
-- [pc-element](#pc-element)
-- [pc-entity](#pc-entity)
-- [pc-light](#pc-light)
-- [pc-listener](#pc-listener)
-- [pc-module](#pc-module)
-- [pc-render](#pc-render)
-- [pc-rigidbody](#pc-rigidbody)
-- [pc-scene](#pc-scene)
-- [pc-script](#pc-script)
-- [pc-scripts](#pc-scripts)
-- [pc-sky](#pc-sky)
-- [pc-screen](#pc-screen)
-- [pc-sound](#pc-sound)
-- [pc-sounds](#pc-sounds)
-- [pc-splat](#pc-splat)
-
-### pc-app
-
-The `pc-app` tag is the root element for your PlayCanvas application. It is used to initialize the PlayCanvas application and provide a container for your scene.
-
-| Attribute | Description |
-| --- | --- |
-| `alpha` | Boolean attribute. Determines whether the application allocates an alpha channel in the frame buffer. Defaults to `true`. |
-| `antialias` | Boolean attribute. Determines whether the application uses anti-aliasing. Defaults to `true`. |
-| `depth` | Boolean attribute. Determines whether the application allocates a depth buffer. Defaults to `true`. |
-| `high-resolution` | Boolean attribute. Determines whether the application renders using physical resolution or CSS resolution. Defaults to `true`. |
-| `stencil` | Boolean attribute. Determines whether the application allocates a stencil buffer. Defaults to `true`. |
-
-### pc-asset
-
-The `pc-asset` tag is used to define an asset. It must be a direct child of `pc-app`.
-
-| Attribute | Description |
-| --- | --- |
-| `id` | The ID of the asset. This is used to reference the asset in scripts. |
-| `src` | The path to the asset. |
-| `preload` | Valueless attribute. If present, the asset is loaded immediately. |
-| `type` | The type of asset. If not specified, the type is inferred from the file extension. Can be: `audio`, `binary`, `css`, `container`, `gsplat`, `html`, `json`, `script`, `shader`, `text`, `texture`. |
-
-### pc-camera
-
-The `pc-camera` tag is used to define a camera component. It must be a direct child of an `pc-entity`.
-
-| Attribute | Description |
-| --- | --- |
-| `clear-color` | The background color of the camera. Can be a space-separated list of R, G, B, and A values or a hex color code. If unspecified, `0.75,0.75,0.75,1` is used. |
-| `clear-color-buffer` | Boolean attribute. Controls whether the camera clears the color buffer. If unspecified, the color buffer is cleared. |
-| `clear-depth-buffer` | Boolean attribute. Controls whether the camera clears the depth buffer. If unspecified, the depth buffer is cleared. |
-| `clear-stencil-buffer` | Boolean attribute. Controls whether the camera clears the stencil buffer. If unspecified, the stencil buffer is cleared. |
-| `cull-faces` | Boolean attribute. Controls whether the camera culls faces. If unspecified, faces are culled. |
-| `far-clip` | The far clipping plane of the camera. If unspecified, `1000` is used. |
-| `flip-faces` | Boolean attribute. Controls whether the camera flips faces. If unspecified, faces are not flipped. |
-| `fov` | The field of view of the camera. If unspecified, `45` is used. |
-| `frustum-culling` | Boolean attribute. Controls whether the camera uses frustum culling. If unspecified, frustum culling is used. |
-| `near-clip` | The near clipping plane of the camera. If unspecified, `0.1` is used. |
-| `orthographic` | Valueless attribute. If present, the camera uses an orthographic projection. If unspecified, the camera uses a perspective projection. |
-| `ortho-height` | The height of the orthographic projection. If unspecified, `10` is used. |
-| `priority` | The priority of the camera. If unspecified, `0` is used. |
-| `rect` | The viewport rectangle of the camera. Specified as a space-separated list of X, Y, Width, and Height values. If unspecified, `0 0 1 1` is used. |
-| `scissor-rect` | The scissor rectangle of the camera. Specified as a space-separated list of X, Y, Width, and Height values. If not specified, `0 0 1 1` is used. |
-
-### pc-collision
-
-The `pc-collision` tag is used to define a collision component. It must be a direct child of a `pc-entity`.
-
-| Attribute | Description |
-| --- | --- |
-| `axis` | The axis of the collision component. If not specified, `1` is used (Y-axis). |
-| `convex-hull` | Valueless attribute. If present, the collision component uses a convex hull. |
-| `enabled` | Enabled state of the collision component. If not specified, `true` is used. |
-| `half-extents` | The half-extents of the collision component. Specified as a space-separated list of X, Y, and Z values. If not specified, `0.5 0.5 0.5` is used. |
-| `height` | The height of the collision component. If not specified, `2` is used. |
-| `radius` | The radius of the collision component. If not specified, `0.5` is used. |
-| `type` | The type of collision component. Can be `box`, `capsule`, `cone`, `cylinder` or `sphere`. |
-
-### pc-element
+## Usage
 
-The `pc-element` tag is used to define an element component. It must be a direct child of a `pc-entity`.
+Please see the [Getting Started Guide](https://developer.playcanvas.com/user-manual/engine/web-components/getting-started) for installation and usage instructions.
 
-| Attribute | Description |
-| --- | --- |
-| `anchor` | The anchor of the element component. Specified as a space-separated list of X, Y, Z, and W values. If not specified, `0 0 0 1` is used. |
-| `asset` | A string that should match the `id` of a `pc-asset` tag that has a type of `font`. |
-| `auto-width` | Valueless attribute. If present, the element component automatically adjusts its width. |
-| `color` | The color of the element component. Can be a space-separated list of R, G, B, and A values or a hex color code. If not specified, `1 1 1 1` is used. |
-| `font-size` | The font size of the element component. If not specified, `16` is used. |
-| `line-height` | The line height of the element component. If not specified, `1.2` is used. |
-| `pivot` | The pivot of the element component. Specified as a space-separated list of X and Y values. If not specified, `0.5 0.5` is used. |
-| `text` | The text of the element component. |
-| `type` | The type of element component. Can be `group`, `image` or `text`. If not specified, `group` is used. |
-| `width` | The width of the element component. If not specified, `0` is used. |
-| `wrap-lines` | Valueless attribute. If present, the element component wraps lines. |
+## Development 
 
-### pc-entity
+### Setting Up Local Development
 
-The `pc-entity` tag is used to define an entity. It must be a direct child of `pc-scene` or another `pc-entity`.
+1. Clone the repository:
 
-| Attribute | Description |
-| --- | --- |
-| `enabled` | Enabled state of the entity. If not specified, `true` is used. |
-| `name` | The name of the entity. |
-| `position` | The position of the entity. Specified as a space-separated list of X, Y, and Z values. If not specified, `0 0 0` is used. |
-| `rotation` | The rotation of the entity. Specified as a space-separated list of X, Y, and Z Euler angles in degrees. If not specified, `0 0 0` is used. |
-| `scale` | The scale of the entity. Specified as a space-separated list of X, Y, and Z values. If not specified, `1 1 1` is used. |
-| `tags` | A space-separated list of tags for the entity. |
+   ```bash
+   git clone https://github.com/playcanvas/web-components.git
+   cd web-components
+   ```
 
-### pc-light
+2. Install dependencies:
 
-The `pc-light` tag is used to define a light component. It must be a direct child of a `pc-entity`.
+   ```bash
+   npm install
+   ```
 
-| Attribute | Description |
-| --- | --- |
-| `color` | The color of the light. Can be a space-separated list of R, G, B values or a hex color code. If not specified, `1 1 1` is used. |
-| `cast-shadows` | Valueless attribute. If present, the light casts shadows. |
-| `inner-cone-angle` | The angle of the light's inner cone. If not specified, `40` is used. |
-| `intensity` | The intensity of the light. If not specified, `1` is used. |
-| `normal-offset-bias` | The bias of the light's normal offset. If not specified, `0.05` is used. |
-| `outer-cone-angle` | The angle of the light's outer cone. If not specified, `45` is used. |
-| `range` | The range of the light. If not specified, `10` is used. |
-| `shadow-bias` | The bias of the light's shadows. If not specified, `0.2` is used. |
-| `shadow-distance` | The distance at which the light's shadows are no longer rendered. If not specified, `16` is used. |
-| `type` | The type of light. Can be `directional`, `point` or `omni`. |
+3. Build the library in watch mode and start the development server:
 
-### pc-listener
+   ```bash
+   npm run dev
+   ```
 
-The `pc-listener` tag is used to define a listener component. It must be a direct child of a `pc-entity`. It has no attributes.
+4. Open http://localhost:3000/examples/ in your browser to see the examples.
 
-### pc-module
+### Building
 
-The `pc-module` tag is used to define a WASM module. It must be a direct child of `pc-app`.
+To build the library:
 
-| Attribute | Description |
-| --- | --- |
-| `name` | The name of the module. This is used to reference the module in scripts. |
-| `glue` | The path to the glue code for the module. |
-| `wasm` | The path to the WASM file for the module. |
-| `fallback` | The path to the fallback (asm.js) code for the module. |
-
-### pc-render
-
-The `pc-render` tag is used to define a render component that render a 3D primitive. It must be a direct child of a `pc-entity`.
-
-| Attribute | Description |
-| --- | --- |
-| `type` | The type of render component. Can be `box`, `capsule`, `cone`, `cylinder`, `plane` or `sphere`. |
-| `cast-shadows` | Valueless attribute. If present, the render component casts shadows. |
-| `receive-shadows` | Valueless attribute. If present, the render component receives shadows. |
-
-### pc-rigidbody
-
-The `pc-rigidbody` tag is used to define a rigidbody component. It must be a direct child of a `pc-entity`.
-
-| Attribute | Description |
-| --- | --- |
-| `angular-damping` | The angular damping of the rigidbody. If not specified, `0` is used. |
-| `angular-factor` | The angular factor of the rigidbody. Specified as a space-separated list of X, Y, and Z values. If not specified, `1 1 1` is used. |
-| `friction` | The friction of the rigidbody. If not specified, `0.5` is used. |
-| `linear-damping` | The linear damping of the rigidbody. If not specified, `0` is used. |
-| `linear-factor` | The linear factor of the rigidbody. Specified as a space-separated list of X, Y, and Z values. If not specified, `1 1 1` is used. |
-| `mass` | The mass of the rigidbody. If not specified, `1` is used. |
-| `restitution` | The restitution of the rigidbody. If not specified, `0` is used. |
-| `rolling-friction` | The rolling friction of the rigidbody. If not specified, `0` is used. |
-| `type` | The type of rigidbody component. Can be `static`, `kinematic` or `dynamic`. |
-
-### pc-scene
-
-The `pc-scene` tag is used to define the scene. It must be a direct child of `pc-app`.
-
-| Attribute | Description |
-| --- | --- |
-| `fog` | The type of fog to use. Can be `linear`, `exp`, or `exp2`. |
-| `fog-color` | The color of the fog. Can be a CSS color string or a hex color code. |
-| `fog-start` | The start distance of the fog. |
-| `fog-end` | The end distance of the fog. |
-| `fog-density` | The density of the fog. |
-
-### pc-screen
-
-The `pc-screen` tag is used to define a screen component. It must be a direct child of a `pc-entity`.
-
-| Attribute | Description |
-| --- | --- |
-| `blend` | Valueless attribute. If present, the screen component blends. |
-| `priority` | The priority of the screen component. Must be an integer between `0` and `255`. If not specified, `0` is used. |
-| `reference-resolution` | The reference resolution of the screen component. Specified as a space-separated list of Width and Height values. If not specified, `640 320` is used. |
-| `resolution` | The resolution of the screen component. Specified as a space-separated list of Width and Height values. If not specified, `640 320` is used. |
-| `scale-blend` | The scale blend of the screen component. Must be a number between `0` and `1`. If not specified, `0.5` is used. |
-| `screen-space` | Valueless attribute. If present, the screen component is in screen space. |
-
-
-### pc-script
-
-The `pc-script` tag is used to define a script. It must be a direct child of a `pc-scripts` component.
-
-| Attribute | Description |
-| --- | --- |
-| `attributes` | A JSON string of attributes for the script. |
-| `enabled` | Enabled state of the script. If not specified, `true` is used. |
-| `name` | The name of the script. |
-
-### pc-scripts
-
-The `pc-scripts` tag is used to define a scripts component. It must be a direct child of a `pc-entity`.
-
-| Attribute | Description |
-| --- | --- |
-| `enabled` | Enabled state of the scripts component. If not specified, `true` is used. |
-
-### pc-sky
-
-The `pc-sky` tag is used to define a sky component. It must be a direct child of a `pc-scene`.
-
-| Attribute | Description |
-| --- | --- |
-| `asset` | A string that should match the `id` of a `pc-asset` tag that has a type of `texture`. |
-| `center` | The center of the sky. Specified as a space-separated list of X, Y, and Z values in the range 0 to 1. If not specified, `0 0.01 0` is used. |
-| `intensity` | The intensity of the sky. If not specified, `1` is used. |
-| `level` | The mipmap level used to render the sky. If not specified, `0` is used (base mip level). |
-| `rotation` | The rotation of the sky. Specified as a space-separated list of X, Y, and Z values. If not specified, `0 0 0` is used. |
-| `scale` | The scale of the sky. Specified as a space-separated list of X, Y, and Z values. If not specified, `100 100 100` is used. |
-| `type` | The type of sky component. Can be `box`, `dome`, `infinite` or `none`. |
-
-### pc-sound
-
-The `pc-sound` tag is used to define a sound. It must be a direct child of a `pc-sounds`.
-
-| Attribute | Description |
-| --- | --- |
-| `asset` | A string that should match the `id` of a `pc-asset` tag that has a type of `audio`. |
-| `auto-play` | Valueless attribute. If present, the sound slot plays automatically. |
-| `duration` | The duration of the sound slot. |
-| `loop` | Valueless attribute. If present, the sound slot loops. |
-| `name` | The name of the sound slot. |
-| `overlap` | Valueless attribute. If present, the sound slot overlaps. |
-| `pitch` | The pitch of the sound slot. If not specified, `1` is used. |
-| `start-time` | The start time of the sound slot. If not specified, `0` is used. |
-| `volume` | The volume of the sound slot. If not specified, `1` is used. |
-
-### pc-sounds
+```bash
+npm run build
+```
 
-The `pc-sounds` tag is used to define a sound component. It must be a direct child of a `pc-entity`.
+The built files will be available in the `dist` directory.
 
-| Attribute | Description |
-| --- | --- |
-| `distance-model` | The distance model of the sound. Can be `exponential`, `inverse` or `linear`. If not specified, `linear` is used. |
-| `pitch` | The pitch of the sound. If not specified, `1` is used. |
-| `max-distance` | The maximum distance from the listener at which audio falloff stops. If not specified, `10000` is used. |
-| `positional` | Valueless attribute. If present, the sound is positional. |
-| `ref-distance` | The distance from the listener at which the volume will be at full volume. If not specified, `1` is used. |
-| `roll-off-factor` | The factor used in the falloff equation. If not specified, `1` is used. |
-| `volume` | The volume of the sound. If not specified, `1` is used. |
+### API Documentation
 
-### pc-splat
+To generate API documentation:
 
-The `pc-splat` tag is used to define a splat component. It must be a direct child of a `pc-entity`.
+```bash
+npm run docs
+```
 
-| Attribute | Description |
-| --- | --- |
-| `asset` | A string that should match the `id` of a `pc-asset` tag that has a type of `gsplat`. |
-| `enabled` | Enabled state of the splat component. If not specified, `true` is used. |
+The documentation will be generated in the `docs` directory.

package/dist/app.d.ts

@@ -1,7 +1,10 @@
 import { Application } from 'playcanvas';
 import { AsyncElement } from './async-element';
 /**
- * The main application element.
+ * The AppElement interface provides properties and methods for manipulating
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-app/ | `<pc-app>`} elements.
+ * The AppElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  */
 declare class AppElement extends AsyncElement {
     /**

package/dist/asset.d.ts

@@ -1,8 +1,9 @@
 import { Asset } from 'playcanvas';
 /**
  * The AssetElement interface provides properties and methods for manipulating
- * `<pc-asset>` elements. The AssetElement interface also inherits the properties and
- * methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-asset/ | `<pc-asset>`} elements.
+ * The AssetElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  */
 declare class AssetElement extends HTMLElement {
     private _preload;

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

@@ -2,8 +2,9 @@ import { CameraComponent, Color, Vec4 } from 'playcanvas';
 import { ComponentElement } from './component';
 /**
  * The CameraComponentElement interface provides properties and methods for manipulating
- * `<pc-camera>` elements. The CameraComponentElement interface also inherits the properties and
- * methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-camera/ | `<pc-camera>`} elements.
+ * The CameraComponentElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  *
  * @category Components
  */
@@ -18,6 +19,7 @@ declare class CameraComponentElement extends ComponentElement {
     private _fov;
     private _frustumCulling;
     private _gamma;
+    private _horizontalFov;
     private _nearClip;
     private _orthographic;
     private _orthoHeight;
@@ -38,6 +40,7 @@ declare class CameraComponentElement extends ComponentElement {
         fov: number;
         frustumCulling: boolean;
         gammaCorrection: number;
+        horizontalFov: boolean;
         nearClip: number;
         orthographic: boolean;
         orthoHeight: number;
@@ -50,7 +53,7 @@ declare class CameraComponentElement extends ComponentElement {
     startXr(type: 'immersive-ar' | 'immersive-vr', space: 'bounded-floor' | 'local' | 'local-floor' | 'unbounded' | 'viewer'): void;
     endXr(): void;
     /**
-     * Gets the camera component.
+     * Gets the underlying PlayCanvas camera component.
      * @returns The camera component.
      */
     get component(): CameraComponent | null;
@@ -154,6 +157,17 @@ declare class CameraComponentElement extends ComponentElement {
      * @returns The gamma correction.
      */
     get gamma(): 'none' | 'srgb';
+    /**
+     * Sets whether the camera's field of view (fov) is horizontal or vertical. Defaults to false
+     * (meaning it is vertical be default).
+     * @param value - Whether the camera's field of view is horizontal.
+     */
+    set horizontalFov(value: boolean);
+    /**
+     * Gets whether the camera's field of view (fov) is horizontal or vertical.
+     * @returns Whether the camera's field of view is horizontal.
+     */
+    get horizontalFov(): boolean;
     /**
      * Sets the near clip distance of the camera.
      * @param value - The near clip distance.

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

@@ -2,8 +2,9 @@ import { CollisionComponent, Quat, Vec3 } from 'playcanvas';
 import { ComponentElement } from './component';
 /**
  * The CollisionComponentElement interface provides properties and methods for manipulating
- * `<pc-collision>` elements. The CollisionComponentElement interface also inherits the properties
- * and methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-collision/ | `<pc-collision>`} elements.
+ * The CollisionComponentElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  *
  * @category Components
  */
@@ -29,7 +30,7 @@ declare class CollisionComponentElement extends ComponentElement {
         type: string;
     };
     /**
-     * Gets the collision component.
+     * Gets the underlying PlayCanvas collision component.
      * @returns The collision component.
      */
     get component(): CollisionComponent | null;

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

@@ -2,8 +2,9 @@ import { Color, ElementComponent, Vec2, Vec4 } from 'playcanvas';
 import { ComponentElement } from './component';
 /**
  * The ElementComponentElement interface provides properties and methods for manipulating
- * `<pc-element>` elements. The ElementComponentElement interface also inherits the properties and
- * methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-element/ | `<pc-element>`} elements.
+ * The ElementComponentElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  *
  * @category Components
  */
@@ -36,25 +37,89 @@ declare class ElementComponentElement extends ComponentElement {
         wrapLines: boolean;
     };
     /**
-     * Gets the element component.
+     * Gets the underlying PlayCanvas element component.
      * @returns The element component.
      */
     get component(): ElementComponent | null;
+    /**
+     * Sets the anchor of the element component.
+     * @param value - The anchor.
+     */
     set anchor(value: Vec4);
+    /**
+     * Gets the anchor of the element component.
+     * @returns The anchor.
+     */
     get anchor(): Vec4;
+    /**
+     * Sets the id of the `pc-asset` to use for the font.
+     * @param value - The asset ID.
+     */
     set asset(value: string);
+    /**
+     * Gets the id of the `pc-asset` to use for the font.
+     * @returns The asset ID.
+     */
     get asset(): string;
+    /**
+     * Sets whether the element component should automatically adjust its width.
+     * @param value - Whether to automatically adjust the width.
+     */
     set autoWidth(value: boolean);
+    /**
+     * Gets whether the element component should automatically adjust its width.
+     * @returns Whether to automatically adjust the width.
+     */
     get autoWidth(): boolean;
+    /**
+     * Sets the color of the element component.
+     * @param value - The color.
+     */
     set color(value: Color);
+    /**
+     * Gets the color of the element component.
+     * @returns The color.
+     */
     get color(): Color;
+    /**
+     * Sets the font size of the element component.
+     * @param value - The font size.
+     */
     set fontSize(value: number);
+    /**
+     * Gets the font size of the element component.
+     * @returns The font size.
+     */
     get fontSize(): number;
+    /**
+     * Sets the line height of the element component.
+     * @param value - The line height.
+     */
     set lineHeight(value: number);
+    /**
+     * Gets the line height of the element component.
+     * @returns The line height.
+     */
     get lineHeight(): number;
+    /**
+     * Sets the pivot of the element component.
+     * @param value - The pivot.
+     */
     set pivot(value: Vec2);
+    /**
+     * Gets the pivot of the element component.
+     * @returns The pivot.
+     */
     get pivot(): Vec2;
+    /**
+     * Sets the text of the element component.
+     * @param value - The text.
+     */
     set text(value: string);
+    /**
+     * Gets the text of the element component.
+     * @returns The text.
+     */
     get text(): string;
     /**
      * Sets the type of the element component.
@@ -66,9 +131,25 @@ declare class ElementComponentElement extends ComponentElement {
      * @returns The type.
      */
     get type(): 'group' | 'image' | 'text';
+    /**
+     * Sets the width of the element component.
+     * @param value - The width.
+     */
     set width(value: number);
+    /**
+     * Gets the width of the element component.
+     * @returns The width.
+     */
     get width(): number;
+    /**
+     * Sets whether the element component should wrap lines.
+     * @param value - Whether to wrap lines.
+     */
     set wrapLines(value: boolean);
+    /**
+     * Gets whether the element component should wrap lines.
+     * @returns Whether to wrap lines.
+     */
     get wrapLines(): boolean;
     static get observedAttributes(): string[];
     attributeChangedCallback(name: string, _oldValue: string, newValue: string): void;

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

@@ -2,8 +2,9 @@ import { Color, LightComponent } from 'playcanvas';
 import { ComponentElement } from './component';
 /**
  * The LightComponentElement interface provides properties and methods for manipulating
- * `<pc-light>` elements. The LightComponentElement interface also inherits the properties and
- * methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-light/ | `<pc-light>`} elements.
+ * The LightComponentElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  *
  * @category Components
  */
@@ -41,7 +42,7 @@ declare class LightComponentElement extends ComponentElement {
         vsmBias: number;
     };
     /**
-     * Gets the light component.
+     * Gets the underlying PlayCanvas light component.
      * @returns The light component.
      */
     get component(): LightComponent | null;

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

@@ -2,8 +2,9 @@ import { AudioListenerComponent } from 'playcanvas';
 import { ComponentElement } from './component';
 /**
  * The ListenerComponentElement interface provides properties and methods for manipulating
- * `<pc-listener>` elements. The ListenerComponentElement interface also inherits the properties
- * and methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-listener/ | `<pc-listener>`} elements.
+ * The ListenerComponentElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  *
  * @category Components
  */
@@ -11,7 +12,7 @@ declare class ListenerComponentElement extends ComponentElement {
     /** @ignore */
     constructor();
     /**
-     * Gets the audio listener component.
+     * Gets the underlying PlayCanvas audio listener component.
      * @returns The audio listener component.
      */
     get component(): AudioListenerComponent | null;

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

@@ -2,8 +2,9 @@ import { RenderComponent, StandardMaterial } from 'playcanvas';
 import { ComponentElement } from './component';
 /**
  * The RenderComponentElement interface provides properties and methods for manipulating
- * `<pc-render>` elements. The RenderComponentElement interface also inherits the properties and
- * methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-render/ | `<pc-render>`} elements.
+ * The RenderComponentElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  *
  * @category Components
  */
@@ -21,7 +22,7 @@ declare class RenderComponentElement extends ComponentElement {
         receiveShadows: boolean;
     };
     /**
-     * Gets the render component.
+     * Gets the underlying PlayCanvas render component.
      * @returns The render component.
      */
     get component(): RenderComponent | null;

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

@@ -2,8 +2,9 @@ import { RigidBodyComponent, Vec3 } from 'playcanvas';
 import { ComponentElement } from './component';
 /**
  * The RigidBodyComponentElement interface provides properties and methods for manipulating
- * `<pc-rigidbody>` elements. The RigidBodyComponentElement interface also inherits the properties
- * and methods of the {@link HTMLElement} interface.
+ * {@link https://developer.playcanvas.com/user-manual/engine/web-components/tags/pc-rigidbody/ | `<pc-rigidbody>`} elements.
+ * The RigidBodyComponentElement interface also inherits the properties and methods of the
+ * {@link HTMLElement} interface.
  *
  * @category Components
  */
@@ -58,8 +59,8 @@ declare class RigidBodyComponentElement extends ComponentElement {
         type: string;
     };
     /**
-     * Gets the collision component.
-     * @returns The collision component.
+     * Gets the underlying PlayCanvas rigidbody component.
+     * @returns The rigidbody component.
      */
     get component(): RigidBodyComponent | null;
     set angularDamping(value: number);