How to use the @microsoft/mixed-reality-extension-sdk.Actor function in @microsoft/mixed-reality-extension-sdk

addCollider: true,
                actor: {
                    parentId: menu.id,
                    name: hatId,
                    transform: {
                        local: { position: { x: 0, y, z: 0 } }
                    }
                }
            });

            // Set a click handler on the button.
            button.value.setBehavior(MRESDK.ButtonBehavior)
                .onClick('released', user => this.wearHat(hatId, user.id));

            // Create a label for the menu entry.
            MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    parentId: menu.id,
                    name: 'label',
                    text: {
                        contents: HatDatabase[hatId].displayName,
                        height: 0.5,
                        anchor: MRESDK.TextAnchorLocation.MiddleLeft
                    },
                    transform: {
                        local: { position: { x: 0.5, y, z: 0 } }
                    }
                }
            });
            y = y + 0.5;
        }

//      position                -- position of center of celestial body (orbits sol)
        //          label               -- centered above position. location of label.
        //          obliquity0          -- centered on position. hidden node to account
        //                                 for the fact that obliquity is a world-relative axis
        //              obliquity1      -- centered on position. tilt of obliquity axis
        //                  model       -- centered on position. the celestial body (rotates)
        try {
            const inclination = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-inclination`,
                    transform: {
                        rotation: inclinationValue
                    }
                }
            });
            const position = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-position`,
                    parentId: inclination.value.id,
                    transform: {
                        position: positionValue
                    }
                }
            });
            const label = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-label`,
                    parentId: position.value.id,
                    transform: {
                        position: { y: 0.1 + Math.pow(scaleMultiplier, 1 / 2.5) }
                    }
                }

private showHatMenu() {
        // Create a parent object for all the menu items.
        const menu = MRESDK.Actor.CreateEmpty(this.context).value;
        let y = 0.3;

        // Loop over the hat database, creating a menu item for each entry.
        for (const hatId of Object.keys(HatDatabase)) {
            // Create a clickable button.
            const button = MRESDK.Actor.CreatePrimitive(this.context, {
                definition: {
                    shape: MRESDK.PrimitiveShape.Box,
                    dimensions: { x: 0.3, y: 0.3, z: 0.01 }
                },
                addCollider: true,
                actor: {
                    parentId: menu.id,
                    name: hatId,
                    transform: {
                        local: { position: { x: 0, y, z: 0 } }

const scaleValue = { x: scaleMultiplier / 2, y: scaleMultiplier / 2, z: scaleMultiplier / 2 };
        const obliquityValue = MRESDK.Quaternion.RotationAxis(
            MRESDK.Vector3.Forward(), facts.obliquity * MRESDK.DegreesToRadians);
        const inclinationValue = MRESDK.Quaternion.RotationAxis(
            MRESDK.Vector3.Forward(), facts.inclination * MRESDK.DegreesToRadians);

        // Object layout for celestial body is:
        //  inclination                 -- orbital plane. centered on sol and tilted
        //      position                -- position of center of celestial body (orbits sol)
        //          label               -- centered above position. location of label.
        //          obliquity0          -- centered on position. hidden node to account
        //                                 for the fact that obliquity is a world-relative axis
        //              obliquity1      -- centered on position. tilt of obliquity axis
        //                  model       -- centered on position. the celestial body (rotates)
        try {
            const inclination = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-inclination`,
                    transform: {
                        app: { rotation: inclinationValue }
                    }
                }
            });
            const position = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-position`,
                    parentId: inclination.value.id,
                    transform: {
                        local: { position: positionValue }
                    }
                }
            });

private wearHat(hatId: string, userId: string) {
        // If the user is wearing a hat, destroy it.
        if (this.attachedHats[userId]) this.attachedHats[userId].destroy();
        delete this.attachedHats[userId];

        const hatRecord = HatDatabase[hatId];

        // If the user selected 'none', then early out.
        if (!hatRecord.resourceName) {
            return;
        }

        // Create the hat model and attach it to the avatar's head.
        this.attachedHats[userId] = MRESDK.Actor.CreateFromPrefab(this.context, {
            prefabId: this.prefabs[hatId].prefabs.byIndex(0).id,
            actor: {
                transform: {
                    local: {
                        position: hatRecord.position,
                        rotation: MRESDK.Quaternion.FromEulerAngles(
                            hatRecord.rotation.x * MRESDK.DegreesToRadians,
                            hatRecord.rotation.y * MRESDK.DegreesToRadians,
                            hatRecord.rotation.z * MRESDK.DegreesToRadians),
                        scale: hatRecord.scale,
                    }
                },
                attachment: {
                    attachPoint: 'head',
                    userId
                }

const scaleValue = { x: scaleMultiplier / 2, y: scaleMultiplier / 2, z: scaleMultiplier / 2 };
        const obliquityValue = MRESDK.Quaternion.RotationAxis(
            MRESDK.Vector3.Forward(), facts.obliquity * MRESDK.DegreesToRadians);
        const inclinationValue = MRESDK.Quaternion.RotationAxis(
            MRESDK.Vector3.Forward(), facts.inclination * MRESDK.DegreesToRadians);

        // Object layout for celestial body is:
        //  inclination                 -- orbital plane. centered on sol and tilted
        //      position                -- position of center of celestial body (orbits sol)
        //          label               -- centered above position. location of label.
        //          obliquity0          -- centered on position. hidden node to account
        //                                 for the fact that obliquity is a world-relative axis
        //              obliquity1      -- centered on position. tilt of obliquity axis
        //                  model       -- centered on position. the celestial body (rotates)
        try {
            const inclination = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-inclination`,
                    transform: {
                        rotation: inclinationValue
                    }
                }
            });
            const position = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-position`,
                    parentId: inclination.value.id,
                    transform: {
                        position: positionValue
                    }
                }
            });

if (this.exclusiveUser || !user) {
			this.exclusiveUser = null;
			this.exclusiveUserLabel.contents = "Inclusive";
		} else {
			this.exclusiveUser = user;
			this.exclusiveUserLabel.contents = `Exclusive to:\n${user.name}`;
		}

		const wasRunning = !!this.activeTest;
		await this.stopTest();

		if (this.testRoot) {
			this.testRoot.destroy();
		}

		this.testRoot = MRE.Actor.Create(this.context, {
			actor: {
				name: 'testRoot',
				exclusiveToUser: this.exclusiveUser && this.exclusiveUser.id || undefined
			}
		});

		if (wasRunning) {
			this.runTest(user);
		}
	}

transform: {
						local: {
							position: { x: buttonWidth * 1.2, z: 0.05 }
						},
					},
					text: {
						contents: "Placeholder",
						height: 0.2,
						anchor: MRE.TextAnchorLocation.MiddleLeft
					}
				}
			});
			this.labels.push(label);
		}

		const backButton = MRE.Actor.Create(this.context, {
			actor: {
				name: 'BackButton',
				appearance: {
					meshId: this.buttonMesh.id
				},
				transform: {
					local: {
						position: { x: -1 + buttonWidth / 2, y: buttonSpacing / 2, z: -0.05 }
					}
				},
				collider: { geometry: { shape: MRE.ColliderType.Auto } }
			}
		});

		const backLabel = MRE.Actor.Create(this.context, {
			actor: {

const obliquity0 = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-obliquity0`,
                    parentId: position.value.id
                }
            });
            const obliquity1 = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-obliquity1`,
                    parentId: obliquity0.value.id,
                    transform: {
                        rotation: obliquityValue
                    }
                }
            });
            const model = MRESDK.Actor.CreateFromGLTF(this.context, {
                resourceUrl: `${this.baseUrl}/assets/${bodyName}.gltf`,
                colliderType: 'sphere',
                actor: {
                    name: `${bodyName}-body`,
                    parentId: obliquity1.value.id,
                    transform: {
                        scale: scaleValue
                    }
                }
            });

            label.value.enableText({
                contents: bodyName,
                height: 0.5,
                pixelsPerLine: 50,
                color: MRESDK.Color3.Yellow(),

const obliquity0 = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-obliquity0`,
                    parentId: position.value.id
                }
            });
            const obliquity1 = MRESDK.Actor.CreateEmpty(this.context, {
                actor: {
                    name: `${bodyName}-obliquity1`,
                    parentId: obliquity0.value.id,
                    transform: {
                        local: { rotation: obliquityValue }
                    }
                }
            });
            const model = MRESDK.Actor.CreateFromGLTF(this.context, {
                resourceUrl: `${this.baseUrl}/assets/${bodyName}.gltf`,
                colliderType: 'sphere',
                actor: {
                    name: `${bodyName}-body`,
                    parentId: obliquity1.value.id,
                    transform: {
                        local: { scale: scaleValue }
                    }
                }

            });

            label.value.enableText({
                contents: bodyName,
                height: 0.5,
                pixelsPerLine: 50,