Custom editor in Angular

Hello!

I’m working on a project where I’m using a library for editing commands. Here’s a link to an example with demo data: Angular Starter (forked) - StackBlitz.

I need help with Angular and this library. My task is to create a command editor where users can input specific commands and “navigate” through an object tree. For example, the command format should be:

$import.variable1.PriceTypeName
or
$import.variable2.PriceTypeName

All commands must strictly adhere to predefined templates. If a user starts deleting part of a command, the deletion should be complete, and we should return to the previous level in the command hierarchy.

Additionally, users should be able to select functions, such as:

getValueFromMatrix(matrix; any)
or

quantityCheck(any)

Users can also use their own values instead of function parameters, such as variables like $variable1.PriceTypeName or any other values, like numbers or text.

Could you please provide guidance on how to implement this in Angular using the specified library? I would greatly appreciate any template that I can further customize to fit my needs. Please don’t hesitate to assist.