Angular 11 & ui buttons

[damiencuvillier]

In a angular version, I've used summernote for a while.
I've added custom buttons. i.e. for valign mangement, with success.

     public toggleValign() {
		const ui =  ($ as any).summernote.ui;
		const ref = this;
		const button = ui.button({
			contents: function () {
				setTimeout(function (rref) {
					document.getElementsByClassName('valign')[0].innerHTML = rref.valignTop ? 'align_vertical_top' : 'align_vertical_center';
				}, 500, ref);
				return '<i class="valign material-icons">align_vertical_center</i>';
			}(),
			tooltip: 'Align on top',
			click: function (_context) {
				ref.valignTop = !ref.valignTop;
				if (ref.valignTop) {
					ref.widget.css['align-items'] = 'start';
					_context.currentTarget.innerHTML = '<i class="material-icons">align_vertical_top</i>';
				} else {
					ref.widget.css['align-items'] = 'center';
					_context.currentTarget.innerHTML = '<i class="material-icons">align_vertical_center</i>';
				}

			}
		});
		return button.render();
	}

While I've upgraded to 0.8.4 version (in angular 8 => 11 migration project), I've got a kind of nullpointerexception on ($ as any).summernote.ui; code line.

$.summernote as no .ui child.

Here is $.summernote object

package.json

"ngx-summernote": "^0.8.4",
"summernote": "0.8.18",

angular.json

"styles": [
	"src/styles.scss",
	"node_modules/bootstrap/dist/css/bootstrap.min.css",
	"node_modules/summernote/dist/summernote-bs4.min.css",
],
"scripts": [
	"node_modules/jquery/dist/jquery.min.js",
	"node_modules/summernote/dist/summernote-bs4.min.js",
	"src/assets/summernote/fr_FR.js"
]

[lula]

hello @damiencuvillier for some reason bs4 styles and scripts cause errors. I still haven't had so much time to investigate (I usually use the lite version). I'll try to check when I have some spare time.