65 lines
1.3 KiB
JavaScript
65 lines
1.3 KiB
JavaScript
|
import {
|
||
|
|
tab_panel_styles_default
|
||
|
|
} from "./chunk.G3N2MV5V.js";
|
||
|
|
import {
|
||
|
|
e
|
||
|
|
} from "./chunk.UZVKBFXH.js";
|
||
|
|
import {
|
||
|
|
watch
|
||
|
|
} from "./chunk.FA5RT4K4.js";
|
||
|
|
import {
|
||
|
|
ShoelaceElement,
|
||
|
|
n
|
||
|
|
} from "./chunk.SEXBCYCU.js";
|
||
|
|
import {
|
||
|
|
x
|
||
|
|
} from "./chunk.CXZZ2LVK.js";
|
||
|
|
import {
|
||
|
|
__decorateClass
|
||
|
|
} from "./chunk.KIILAQWQ.js";
|
||
|
|
|
||
|
|
// src/components/tab-panel/tab-panel.component.ts
|
||
|
|
var id = 0;
|
||
|
|
var SlTabPanel = class extends ShoelaceElement {
|
||
|
|
constructor() {
|
||
|
|
super(...arguments);
|
||
|
|
this.attrId = ++id;
|
||
|
|
this.componentId = `sl-tab-panel-${this.attrId}`;
|
||
|
|
this.name = "";
|
||
|
|
this.active = false;
|
||
|
|
}
|
||
|
|
connectedCallback() {
|
||
|
|
super.connectedCallback();
|
||
|
|
this.id = this.id.length > 0 ? this.id : this.componentId;
|
||
|
|
this.setAttribute("role", "tabpanel");
|
||
|
|
}
|
||
|
|
handleActiveChange() {
|
||
|
|
this.setAttribute("aria-hidden", this.active ? "false" : "true");
|
||
|
|
}
|
||
|
|
render() {
|
||
|
|
return x`
|
||
|
|
<slot
|
||
|
|
part="base"
|
||
|
|
class=${e({
|
||
|
|
"tab-panel": true,
|
||
|
|
"tab-panel--active": this.active
|
||
|
|
})}
|
||
|
|
></slot>
|
||
|
|
`;
|
||
|
|
}
|
||
|
|
};
|
||
|
|
SlTabPanel.styles = tab_panel_styles_default;
|
||
|
|
__decorateClass([
|
||
|
|
n({ reflect: true })
|
||
|
|
], SlTabPanel.prototype, "name", 2);
|
||
|
|
__decorateClass([
|
||
|
|
n({ type: Boolean, reflect: true })
|
||
|
|
], SlTabPanel.prototype, "active", 2);
|
||
|
|
__decorateClass([
|
||
|
|
watch("active")
|
||
|
|
], SlTabPanel.prototype, "handleActiveChange", 1);
|
||
|
|
|
||
|
|
export {
|
||
|
|
SlTabPanel
|
||
|
|
};
|