Sha256: 1228ed8b7b9bba03b2c3ce478cec2410ff3e3ee59922837009fcc8719655d9f2
Contents?: true
Size: 1.1 KB
Versions: 192
Compression:
Stored size: 1.1 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-slate-500', 'ariadne-text-slate-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
192 entries across 192 versions & 1 rubygems