Пример. Элемент управления "SuperControl"

<?xml version="1.0" encoding="utf-8" ?>
<Controls>
    <Control Name="SuperControl" DisplayName="Супер элемент управления">
        <Properties>
            <Property Type="Name" /> (1)
            <Property Type="Visibility" /> (2)

            <Property Name="Url" Category="BehaviorCategory" DataType="System.String" /> (3)
        </Properties>
        <Events>
            <Event Name="Click" ResourceKey="ControlTypes_ClickEventProperty"/>  (4)
        </Events>
    </Control>
</Controls>

import { BaseControlParams, BaseControlState, BaseControl } from "@docsvision/webclient/System/BaseControl";
import { r } from "@docsvision/webclient/System/Readonly";
import { apiEvent } from "@docsvision/webclient/System/Event";
import { BasicApiEvent } from "@docsvision/webclient/System/ApiEvent";
import { IEventArgs } from "@docsvision/webclient/System/IEventArgs";
import { BaseControlImpl } from "@docsvision/webclient/System/BaseControlImpl";
import { SimpleEvent } from "@docsvision/webclient/System/SimpleEvent";
import React from "react"; (1)

export class SuperControlParams extends BaseControlParams { (2)
    @r url?: string; (3)
    @apiEvent onClick?: BasicApiEvent<IEventArgs>;
}

export interface SuperControlState extends SuperControlParams, BaseControlState { (4)
}

export class SuperControlImpl extends BaseControlImpl<SuperControlParams, SuperControlState> { (5)
    construct() {
        super.construct();

        this.state.onClick = SimpleEvent.Create<IEventArgs>(this.state.wrapper); (6)

        this.clickHandler = this.clickHandler.bind(this); (7)
    }

    clickHandler() { (8)
        SimpleEvent.cast(this.state.onClick).trigger(); (9)
        window.open(this.props.url, "_blank");
    }

    renderControl() { (10)

        if (this.props.visibility) { (11)
            return (
                <a onClick={this.clickHandler}>{this.props.url}</a> (12)
            );
        }
    }
}

export class SuperControl extends BaseControl<SuperControlParams, SuperControlState> {
    protected createParams() { (13)
        return new SuperControlParams();
    }

    protected createImpl() {
        return new SuperControlImpl(this.props, this.state);
    }
}