package main

// alphabetStripComponent renders the letter band.
templ alphabetStripComponent(data AlphabetStripData) {
	<nav class={ "kg-alphabet-strip", alphabetClass(data.ColorMode) } aria-label="Alphabet strip" data-block="kindergarten:alphabet_strip">
		if len(data.Letters) == 0 {
			<span class="kg-empty" data-empty="true">No letters configured</span>
		}
		for _, letter := range data.Letters {
			<span class="kg-alphabet-letter">{ letter }</span>
		}
	</nav>
}

// alphabetClass returns the modifier class for the chosen colorway.
func alphabetClass(mode string) string {
	switch mode {
	case "primary":
		return "kg-alphabet-primary"
	case "mono":
		return "kg-alphabet-mono"
	default:
		return ""
	}
}