Reply To: Close one tabbed docked window

[Hristofor]

Hi Jozef,
The closedItems property of the Smart.DockingLayout returns the instances of the LayoutPanels that have been closed. A LayoutPanel is one of the main structural components of the Smart.DockingLayout and represents a Smart.TabsWindow component that contains TabItems. When clicking the close button of a TabItem you are closing a single TabItem inside the LayoutPanel and a close event is fired. The close event is also fired when a LayoutPanel is closed so you need to check the even.target to determine the cause for the event. The close event that is fired when a TabItem is clicked comes from the Smart.Tabs component which is part of the LayoutPanel and contains a event.detail object that holds the tab item index of the closed item.
Since the LayoutPanels are actually Smart.TabsWindow components they provide the same API as Smart.Tabs component for Tab items modification. For example you can add/remove/update any TabItem inside the LayoutPanel via the following syntax:

const dockingLayout = document.querySelector('smart-docking-layout'),
layoutPanels = dockingLayout.items,
firstPanel = layoutPanels[0];
//If the first panel has more than one tab item you can close one of them
const tabItems = firstPanel.items;
firstPanel.close(tabItems[0]);
//or insert a new tab item
firstPanel.insert(1, { label: 'New Tab item', content: 'Content ...' });

You can read more about Smart.TabsWindow API in the following tutorial.
Best Regards,
Christopher
Smart HTML Elements Team
https://www.htmlelements.com