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

sunPrimitives.forEach((prim) => {
                // Add a collider so that the behavior system will work properly on Unity host apps.
                const center = { x: 0, y: 0, z: 0 } as MRESDK.Vector3Like;
                const radius = 3;
                prim.setCollider('sphere', false, center, radius);

                const buttonBehavior = prim.setBehavior(MRESDK.ButtonBehavior);

                buttonBehavior.onClick('pressed', () => {
                    if (this.animationsRunning) {
                        this.pauseAnimations();
                        this.animationsRunning = false;
                    } else {
                        this.resumeAnimations();
                        this.animationsRunning = true;
                    }
                });

                buttonBehavior.onHover('enter', () => {
                    console.log(`Hover entered on ${sunEntity.model.name}.`);
                });

                buttonBehavior.onHover('exit', () => {

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 } }
                    }
                }
            });

            // 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 } }
                    }
                }

transform: {
					local: {
						position: { z: -0.1 }
					}
				},
				text: {
					contents: "Return",
					height: 0.15,
					anchor: MRE.TextAnchorLocation.MiddleCenter,
					justify: MRE.TextJustify.Center,
					color: MRE.Color3.Black()
				}
			}
		});

		menuButton.setBehavior(MRE.ButtonBehavior)
			.onButton("released", async () => {
				await this.stopTest();
				[this.contextLabel, this.playPauseButton, this.playPauseText]
					= this.runnerActors
					= destroyActors(this.runnerActors);

				this.menu.show();
			});

		this.runnerActors = [this.contextLabel, this.testRoot, this.playPauseButton,
		this.playPauseText, menuButton, menuText];
	}
}

name: 'BackLabel',
				parentId: backButton.id,
				transform: {
					local: {
						position: { x: buttonWidth * 1.2, z: 0.05 }
					},
				},
				text: {
					contents: "Back",
					height: 0.2,
					anchor: MRE.TextAnchorLocation.MiddleLeft
				}
			}
		});

		backButton.setBehavior(MRE.ButtonBehavior)
			.onButton('released', () => {
				this.back();
				this.show();
			});

		this.otherActors = [backButton, backLabel];
	}

transform: {
					local: {
						position: { z: -0.1 }
					}
				},
				text: {
					contents: "Start",
					height: 0.15,
					anchor: MRE.TextAnchorLocation.MiddleCenter,
					justify: MRE.TextJustify.Center,
					color: NeutralColor
				}
			}
		});

		this.playPauseButton.setBehavior(MRE.ButtonBehavior)
			.onButton("released", user => {
				if (this.activeTest === null) {
					this.runTest(user);
				} else {
					this.stopTest().catch(() => { });
				}
			});

		const menuButton = MRE.Actor.Create(this.context, {
			actor: {
				name: 'menu',
				appearance: {
					meshId: ppMesh.id
				},
				transform: {
					local: {

sunPrimitives.forEach((prim) => {
                const buttonBehavior = prim.setBehavior(MRESDK.ButtonBehavior);

                buttonBehavior.onClick('pressed', (userId: string) => {
                    if (this.animationsRunning) {
                        this.pauseAnimations();
                        this.animationsRunning = false;
                    } else {
                        this.resumeAnimations();
                        this.animationsRunning = true;
                    }
                });

                buttonBehavior.onHover('enter', (userId: string) => {
                    console.log(`Hover entered on ${sunEntity.model.name}.`);
                });

                buttonBehavior.onHover('exit', (userId: string) => {