How to put and components inside in Gutenberg block

When an element doesn’t have children it can be self-closing:

<Something something="123" />

Otherwise it needs to behave like normal html tag with an opening part: <Something> and a closing one: </Something>

edit: function( props ) {
    return(
        <Form
            method="get"
            className="search-form"
        >
            <PlainText
                title="search box"
                placeholder="Search"
                className="search-field"
                type="text"
                name="s"
                readonly="true"
            />
            <PlainText
                type="hidden"
                name="type"
                value="media"
            />
            <Button
                type="submit"
                title="search site"
                className="search-submit"
                value="&rsaquo;"
                disabled="disabled"
            />
        </Form>
    );
},