holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

change tabbox to be an input widget allowing to get and set the active tab

Browse Source
This commit is contained in:
ralf 2022-08-05 17:37:11 +02:00
parent 59ff16f98b
commit b22674dbd7
1 changed files with 44 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
api/js/etemplate/Layout/Et2Tabs/Et2Tabs.ts
View File

@ -8,15 +8,16 @@
* @author Nathan Gray
*/
import {SlTab, SlTabGroup, SlTabPanel} from "@shoelace-style/shoelace";
import {Et2Widget, loadWebComponent} from "../../Et2Widget/Et2Widget";
import {loadWebComponent} from "../../Et2Widget/Et2Widget";
import {et2_directChildrenByTagName, et2_filteredNodeIterator, et2_readAttrWithDefault} from "../../et2_core_xml";
import {css, PropertyValues} from "@lion/core";
import shoelace from "../../Styles/shoelace";
import {et2_createWidget} from "../../et2_core_widget";
import {colorsDefStyles} from "../../Styles/colorsDefStyles";
import {Et2InputWidget} from "../../Et2InputWidget/Et2InputWidget";
export class Et2Tabs extends Et2Widget(SlTabGroup)
export class Et2Tabs extends Et2InputWidget(SlTabGroup)
{
static get styles()
{
@ -78,7 +79,12 @@ export class Et2Tabs extends Et2Widget(SlTabGroup)
* @deprecated use "placement" instead
* @see https://shoelace.style/components/tab-group
*/
alignTabs: {type: String}
alignTabs: {type: String},
/**
* active tab is the value
*/
value: {type: String}
}
}
@ -99,6 +105,41 @@ export class Et2Tabs extends Et2Widget(SlTabGroup)
this.addTabs = false;
}
get value()
{
return this.getActiveTab()?.panel;
}
set value(tab)
{
if (this.tabs && Array.isArray(this.tabs) && this.tabs.length)
{
this.show(this.__value = tab);
}
else
{
this.__value = tab;
}
}
connectedCallback()
{
super.connectedCallback();
this.updateComplete.then(() =>
{
if (this.__value)
{
this.show(this.__value);
}
});
}
isDirty(): boolean
{
return false;
}
loadFromXML(_node)
{
// Get the tabs and tabpanels tags