Sha256: 069c61b08a7df11d5a012f5214be8bd288f1e5d5fa7fe4085fc45890deea777a
Contents?: true
Size: 1.11 KB
Versions: 78
Compression:
Stored size: 1.11 KB
Contents
import {Controller} from '@hotwired/stimulus'
export default class TabNavComponent extends Controller {
static targets = ['tab']
declare readonly tabTargets: [HTMLAnchorElement]
// keep in synch with tab_nav_component
SELECTED_CLASSES = ['ariadne-border-indigo-500', 'ariadne-text-indigo-600']
UNSELECTED_CLASSES = ['ariadne-text-gray-500', 'hover:ariadne-text-gray-700', 'hover:ariadne-border-gray-300']
connect() {
for (const tab of this.tabTargets) {
if (tab.hasAttribute('aria-current')) {
tab.classList.add(...this.SELECTED_CLASSES)
tab.classList.remove(...this.UNSELECTED_CLASSES)
}
}
}
toggle(event: Event) {
for (const tab of this.tabTargets) {
if (tab === event.target) {
tab.setAttribute('aria-current', 'page')
tab.classList.add(...this.SELECTED_CLASSES)
tab.classList.remove(...this.UNSELECTED_CLASSES)
} else if (tab.hasAttribute('aria-current')) {
tab.removeAttribute('aria-current')
tab.classList.add(...this.UNSELECTED_CLASSES)
tab.classList.remove(...this.SELECTED_CLASSES)
}
}
}
}
Version data entries
78 entries across 78 versions & 1 rubygems