You have a couple of options. The simplest is using the Text content type to include the widget using the standard TinyMCE widget feature.
Your other option is to create a new content type which wraps your widget in a Page Builder content type. Our Products content type does exactly this, it's just an interface for the Catalog Product List widget.
products.xml
contains a mass converter to create the widget directive:
view/adminhtml/pagebuilder/content_type/products.xml
<converters>
<converter component="Magento_PageBuilder/js/content-type/products/mass-converter/widget-directive" name="widget_directive">
<config>
<item name="html_variable" value="html"/>
</config>
</converter>
</converters>
Which in turn within widget-directive.ts
(or JS depending on which source you're viewing) we create the standard product list widget directive:
view/adminhtml/web/ts/js/content-type/products/mass-converter/widget-directive.ts
:
public toDom(data: ConverterDataInterface, config: ConverterConfigInterface): object {
const attributes = {
type: "Magento\\CatalogWidget\\Block\\Product\\ProductsList",
template: "Magento_CatalogWidget::product/widget/content/grid.phtml",
anchor_text: "",
id_path: "",
show_pager: 0,
products_count: data.products_count,
type_name: "Catalog Products List",
conditions_encoded: this.encodeWysiwygCharacters(data.conditions_encoded || ""),
};
if (attributes.conditions_encoded.length === 0) {
return data;
}
set(data, config.html_variable, this.buildDirective(attributes));
return data;
}
You can read more about mass converters here: https://devdocs.magento.com/page-builder/docs/reference/configurations.html#mass-converter
You can look to duplicate the Products content type and modify it to your needs. On a high level, it just feeds it's configured form fields into the directive's parameters.
Alongside the above, we have a great step by step tutorial on how to create a new content type available here: https://devdocs.magento.com/page-builder/docs/create-custom-content-type/overview.html
Best Answer
Oh well, i've found a way to pass through this.
We use "HTML code" builder of page builder instead of "text" buider.
Worked perfectly for me.