JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › General Discussions › How to use a Smart Element in a self-made custom element › Reply To: How to use a Smart Element in a self-made custom element
Hi feffe,
yes, you can use the ListItem element even if it’s outside the ListBox component. May I suggest you create custom components using the Smart Library instead of the WebComponents. It’s simpler and easier to create custom elements using the Smart Framework. Smart elements also support ShadowDOM by simply settings the Smart.EnableShadowDOM flag to true
. We have a complete tutorial on how to create custom elements using the Smart Framework. Here’s the link to the documentations. Here’s how the definition of the same element looks like using Smart:
Smart('vanilla-webcomponent', class VanillaWebcomponent extends Smart.ContentElement {
/** Element's template. */
template() {
return '<div class="custom-element-container"><smart-list-box grouped filterable sorted selectionMode=”zeroOrOne”>' +
'<smart-list-item>Washington, Connecticut</smart-list-item>' +
'<smart-list-item>Washington, Iowa</smart-list-item>' +
'</smart-list-box></div>';
}
});
Best Regards,
Christopher
Smart HTML Elements Team
https://www.htmlelements.com