egroupware_official/doc/etemplate2/pages/tutorials/creating-a-widget.md

Creating a component

ETemplate components are LitElements that are wrapped with our Et2Widget mixin, which adds properties and methods to support loading from our template files and returning values to the server. They should (relatively) stand-alone.

Common components are in api/js/etemplate/. You can add application specific components in <appname>/js/.

Create the files

myapp/
    js/
        MyWidget/
            test/
            MyWidget.ts
            

You should have automatic tests to verify your component and avoid regressions in test/.

Get it loaded

To have EGroupware load your component, it must be included somewhere. Add your component to the include block at the top of /api/js/etemplate/etemplate2.js. If you have an application specific component, include at the top of your app.js.

...
import './MyWidget/MyWidget.ts';

...

Load and return

AJAX data