what's the meaning of CodeLayoutPanelInternal, CodeLayoutGridInternal

[Donald2010]

I want to made some modification to suit my case. Could you please give some hint about the difference between CodeLayoutPanel, CodeLayoutPanelInternal ? What's the meaning of "Internal" here?
Similarly CodeLayoutGridInternal which extends CodeLayoutPanelInternal confused me, since a Panel should stay in Grid, not reverse.

[imengyu]

Hello,

• CodeLayoutPanel is a definition of panel, user can pass this define data to addPanel function to create a new panel instance.
• CodeLayoutPanelInternal is a instance of created panel, "Internal" is mean that it holds some data and methods will used by CodeLayout component, user should not create by self, it should returned by component.

There is a parent-child relationship organized by the children field in CodeLayoutPanelInternal, and CodeLayoutGridInternal are only used in top level grid, like primarySideBar, secondarySideBar, bottomPanel. In order to reuse the code, so i made CodeLayoutGridInternal inherits from CodeLayoutPanelInternal, because I don't want to write duplicate code twice.

Because this is the code I wrote alone, there may be some unreasonable areas. You are welcome to provide suggestions, and I will try my best to make modifications. Thank you.

[Donald2010]

I got it, thank you, this is a great project.

Suppose I'd like to save the edited file in a panel, what's the best practice to expose the file data in the panel to the save command menu ?

[imengyu]

My suggestion: Panel has a data field, you can set your editor context into it, and when clicking the save button, first get the currently activated panel, then get its data and call the save method in editor context.

Here is my example, you can modify it according to your own requirements.

I use SplitLayout, this component is designed for multiple file editors.

Pass my editor context at creation:

 grid3.addPanel({
    title: `File 1`,
    tooltip: `File 1tooltip`,
    name: `file1`,
    closeType: 'close',
    iconSmall: () => h(FileIcon),
    data: editorContext, //editorContext, depends on the specific editor component used, assuming it has a 'save' method.
});

When user clicked save button, we try get user focused editor and do save.

let activePanel = splitLayoutRef.value?.getActiveGird()?.activePanel;
if (activePanel) {
    activePanel.data.save() //get editorContext and call save0
}