# RenderComponentElement

Class · extends [`ComponentElement`](https://api.playcanvas.com/web-components/classes/ComponentElement.md)`<RenderComponent>` · category: Components

Source: https://github.com/playcanvas/web-components/blob/252f001881302c266c8d727044408c32be2bb5e7/src/components/render-component.ts#L41

The RenderComponentElement interface provides properties and methods for manipulating
[`<pc-render>`](https://developer.playcanvas.com/user-manual/web-components/tags/pc-render/) elements.
The RenderComponentElement interface also inherits the properties and methods of the
[HTMLElement](https://developer.mozilla.org/docs/Web/API/HTMLElement) interface.

This element renders one of the engine's built-in primitives, selected with `type` (defaulting
to `box`). It does not cover the engine's `asset` render type, since there is no way to supply
a render asset here — use `pc-model` for glTF content instead.

Engine component: [RenderComponent](https://api.playcanvas.com/engine/classes/RenderComponent.html) (`render`).

**elementSummary** The `<pc-render>` element renders one of the engine's built-in primitives at its
entity — box, sphere, capsule, cone, cylinder, plane or torus — shaded by the `<pc-material>`
its `material` attribute names. For glTF content, use `<pc-model>` instead. Must be a child of
a `<pc-entity>`, `<pc-model>` or `<pc-node>`.

## Accessors

### castShadows

```ts
get castShadows(): boolean
set castShadows(value: boolean)
```

Gets the cast shadows flag of the render component.

### component

```ts
get component(): RenderComponent | null
```

Gets the underlying PlayCanvas render component. `null` until the element is
ready — see [ComponentElement.component](https://api.playcanvas.com/web-components/classes/ComponentElement.md#component).

### material

```ts
get material(): string
set material(value: string)
```

Gets the id of the material asset used by the render component.

### receiveShadows

```ts
get receiveShadows(): boolean
set receiveShadows(value: boolean)
```

Gets the receive shadows flag of the render component.

### shadowCascadeMask

```ts
get shadowCascadeMask(): number
set shadowCascadeMask(value: number)
```

Gets which shadow cascades of directional lights the render component casts into, which
needs `cast-shadows`. As a property, it is a bitmask of `SHADOW_CASCADE_0` to
`SHADOW_CASCADE_3` flags.

### type

```ts
get type(): "box" | "capsule" | "cone" | "cylinder" | "plane" | "sphere" | "torus"
set type(value: "box" | "capsule" | "cone" | "cylinder" | "plane" | "sphere" | "torus")
```

Gets the type of the render component.

## Methods

### getInitialComponentData

```ts
protected getInitialComponentData(): Record<string, unknown>
```

Returns the data the component is created with. Overridden by subclasses to supply the
initial values of their cached properties. The element's `enabled` state is not among them:
the base class adds it when it creates the component.

**Returns** `Record<string, unknown>`: The initial component data.

## Inherited from [ComponentElement](https://api.playcanvas.com/web-components/classes/ComponentElement.md)

- `get closestApp(): AppElement | null`
- `get closestEntity(): EntityBaseElement | null`
- `get enabled(): boolean` · `set enabled(value: boolean)`
- `protected _onReady(): void`
- `protected _resetReady(): void`
- `protected initComponent(): void`
- `ready(): Promise<RenderComponentElement>`