Prettified Code!

This commit is contained in:
gabek
2022-01-12 21:53:44 +00:00
committed by GitHub Action
parent 045a0a2afd
commit 04f4464e5e
3 changed files with 42 additions and 40 deletions

View File

@@ -25,44 +25,39 @@ export default class TabBar extends Component {
}
if (tabs.length === 1) {
return html`
${tabs[0].content}
`;
return html` ${tabs[0].content} `;
} else {
return html`
<div class="tab-bar">
<div role="tablist" aria-label=${ariaLabel}>
${
tabs.map((tabItem, index) => {
const handleClick = () => this.handleTabClick(index);
return html`
<button
role="tab"
aria-selected=${index === this.state.activeIndex}
aria-controls=${`tabContent${index}`}
id=${`tab-${tabItem.label}`}
onclick=${handleClick}
>${tabItem.label}</button>
`;
})
}
</div>
${
tabs.map((tabItem, index) => {
${tabs.map((tabItem, index) => {
const handleClick = () => this.handleTabClick(index);
return html`
<div
tabindex="0"
role="tabpanel"
id=${`tabContent${index}`}
aria-labelledby=${`tab-${tabItem.label}`}
hidden=${index !== this.state.activeIndex}
>
${tabItem.content}
</div>
<button
role="tab"
aria-selected=${index === this.state.activeIndex}
aria-controls=${`tabContent${index}`}
id=${`tab-${tabItem.label}`}
onclick=${handleClick}
>
${tabItem.label}
</button>
`;
})
}
})}
</div>
${tabs.map((tabItem, index) => {
return html`
<div
tabindex="0"
role="tabpanel"
id=${`tabContent${index}`}
aria-labelledby=${`tab-${tabItem.label}`}
hidden=${index !== this.state.activeIndex}
>
${tabItem.content}
</div>
`;
})}
</div>
`;
}