TsComponent.md

The current page is translated by a machine, information may be missing or inaccurate. If you encounter any problems or have questions, please submit an ISSUE.

Introduction

This is a component designed to function similarly to UnityEngine.MonoBehaviour. It can be used to attach and serialize TypeScript script member declarations, automatically building a JSObject object and managing its lifecycle (TsComponentLifecycle).

It relies on TypeScript's AST analysis functionality to analyze TypeScript scripts, retrieve class declarations, and their member information, and then pass it to C# EditorGUI for use.

Usage Guidelines

• TypeScript types must inherit from xor.TsComponent, be exported, and not be abstract to be used by TsComponent.
• TypeScript type members must use the declare modifier or be decorated with xor.field to be serialized.
• If an enum type does not specify a value, its default value is 0 (System.Int32) or null (System.String).
• TypeScript analysis service and SerializedObject rendering are only used in the Unity Editor environment.
• TypeScript analysis service runs in a separate thread (ThreadWorker), please follow its known issues for setup, otherwise it may cause crashes.
• When specifying a value, the expression must be accessible in the separate thread; for example, UnityEngine.Vector2.right is acceptable, but UnityEngine.Application.dataPath is not.

Definitions

[C#] Inheritance: XOR.TsComponent → XOR.TsBehaviour

Interface Details

Member	Description
Puerts.JSObject JSObject{ get; }	JSObject created by it

Methods	Description
static void Register(Puerts.JsEnv)	Register the Puerts.JsEnv instance used by TsComponent
static void Unregister()	Remove the registered Puerts.JsEnv instance
static void GC()	Recycle XOR.TsComponent objects that are not properly released (e.g., when using Object.DestroyImmediate, OnDestroy may not be called properly)
static void PrintStatus()	Print the status of all instances (execute GC first)
XOR.Serializables.ResultPair[] GetProperties()	Get all serialized members
void SetProperty(string, object)	(EditorOnly) Set key-value
void SetPropertyListener(Action<string, object>)	(EditorOnly) Set key-value update callback

[ts] Inheritance: xor.TsComponent → xor.TsBehaviour

Interface Details

Decorator	Description
@xor.guid(string): ClassDecorator	Define the component GUID (⚠⚠⚠ This statement should be generated and managed by xor, bound to the class declaration, and users should not manually create or modify it)
@xor.route(string): ClassDecorator	Define the component route (unique value), which can be used later to get the component instance (more in line with human reading and memory habits compared to GUID)
@xor.field({...}): PropertyDecorator	Define serialization field details, such as RawType, default value, Range (only for numbers)

Built-in Types

Details

Type	Basic	Array
string	√	√
number	√	√
boolean	√	√
bigint	√	√
UnityEngine.Vector2	√	√
UnityEngine.Vector3	√	√
UnityEngine.Object and its subtypes	√	√

For other types, please refer to Custom Types

Basic Type Demo

Example Scene: projects/Assets/Samples/01_TsComponent
Example TypeScript Code: projects/TsProject/src/samples/01_TsComponent.ts

Array Type Demo

RawType, Default Value, and Range Demo

Enum Type Demo

If no value is specified for an enum type, its default value is 0 (System.Int32) or null (System.String)

Custom Extension Type Demo

Check the code in Samples for TsComponent.partial and SerializablesEditor

Two-Way Binding Demo

Modifying this._value in Sample06.OnGUI will be synchronized to the Inspector, and vice versa, modifying the _value field in the Inspector will be synchronized to Sample06._value.

TypeScript Reference Type Binding

// _sample01, _sample03, and _sample04 here are Proxy objects and cannot be directly compared using '==='. // Call xxx.valueOf() to get the original JS object.

let isSample01 = this._sample04?.valueOf() === this._sample01?.valueOf();
let isSample03 = this._sample04?.valueOf() === this._sample03?.valueOf();
console.log(`this._sample04: is sample01 = ${isSample01},  is sample03 = ${isSample03}`);

Runtime Methods (AddComponent/GetComponent)

Output prints as follows:

UGUI Event Binding

Please refer to UGUI Page