Editor script issues

I’m not sure how this is called.
I’m working on a Script to make navigation for buttons.

If I write this script the Editor will not show the serialized values.

import { _decorator, Button, Component, log } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('UISelectable')
export class UISelectable extends Component 
{       
    //For now lets just use a Explicit Navigation   
    @property({ type: UISelectable, tooltip: "Navigation Up", })
    public SelectOnUp: UISelectable = null;
    
    @property({ type: UISelectable, tooltip: "Navigation Down", })
    public SelectOnDown: UISelectable = null;
    
    @property({ type: UISelectable, tooltip: "Navigation Left", })
    public SelectOnLeft: UISelectable = null;
    
    @property({ type:UISelectable, tooltip: "Navigation Right", })
    public SelectOnRight: UISelectable = null;      
    
    private Button:Button = null;
    
    protected onLoad(): void {
        this.Button = this.getComponent(Button);
        
    }
}

It will looks like this.
image

Of course If I write this

import { _decorator, Button, Component, log } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('UISelectable')
export class UISelectable extends Component 
{       
    //For now lets just use a Explicit Navigation   
    @property({ type: Button, tooltip: "Navigation Up", })
    public SelectOnUp: Button = null;
    
    @property({ type: Button, tooltip: "Navigation Down", })
    public SelectOnDown: Button = null;
    
    @property({ type: Button, tooltip: "Navigation Left", })
    public SelectOnLeft: Button = null;
    
    @property({ type:Button, tooltip: "Navigation Right", })
    public SelectOnRight: Button = null;      
    
    private Button:Button = null;
    
    protected onLoad(): void {
        this.Button = this.getComponent(Button);
        
    }
}

Now it looks like this.
image

It’s possible to display self components references on a custom script?

We will look into this issue.