The other thing I’ve tried is to use an ngFor to define the tabs:
<smart-tabs #tabs id="tabs" class="demoTabsShort" [closeButtons]="true" [closeButtonMode]="'selected'"
[addNewTab]="true" (addNewTabClick)="onAddNewTabClick($event)" [reorder]="true">
<smart-tab-item *ngFor="let tab of tabNames" [label]="tab"><app-thing></app-thing></smart-tab-item>
</smart-tabs>Where tabNames is just a list of strings.
When a new tab is added (by appending a new string to the tabNames array), the content of the new tab is the new component. However, the label is not updated and there is an error in the console:
core.mjs:8506 ERROR TypeError: Cannot read properties of undefined (reading 'firstElementChild')
at BaseElement._updateTabLabel (smart.tabs.js:34:65344)
at BaseElement.propertyChangedHandler (smart.tabs.js:34:1110)
at t.updateProperty (smart.button.js:34:75016)
at BaseElement.set [as label] (smart.button.js:34:76150)
at set label [as label] (smart-webcomponents-…ular-tabs.js:771:54)
at Object.ngOnChangesSetInput [as setInput] (core.mjs:1586:26)
at setInputsForProperty (core.mjs:11738:17)
at elementPropertyInternal (core.mjs:10874:9)
at Module.ɵɵproperty (core.mjs:13637:9)
at AppComponent_smart_tab_item_6_Template (app.component.html:5:50)