kjol/go/webui/fuzzymatch.go

package webui

import (
	"sort"
	"strconv"
	"strings"
	"unicode"

	"kjol/vdom"
)

// Port of web/kit/FuzzyMatch.tsx.
//
// The fuzzy-scoring/matching logic (Forrest Smith's fts_fuzzy_match, Sublime-
// style subsequence scoring) is pure and is ported directly to Go below. The
// component keeps the API + structure + Tailwind and models query / open /
// highlighted state as plain value props + callbacks.
//
// NOTE: the exported matcher `fuzzyMatch` would collide (case-folded) with the
// `FuzzyMatch` component in Go, so it is renamed to FuzzyMatchOne here. The
// other matchers keep their names (Go-cased): FuzzyMatchTypoTolerant,
// FuzzySegments, RankFuzzyMatches.
// NOTE: positions are rune indices (the TSX used UTF-16 code-unit indices);
// these agree for BMP text and are what FuzzySegments consumes here.

// ============================================================================
// Fuzzy matching  (Sublime-style subsequence scoring)
// ============================================================================

// FuzzyMatchResult is a scored match with the matched character positions.
type FuzzyMatchResult struct {
	Score     int
	Positions []int
}

// FuzzySegment is a run of text flagged matched or unmatched (for highlighting).
type FuzzySegment struct {
	Text  string
	Match bool
}

// FuzzyRankedItem is one ranked option: its value, score, and highlight segments.
type FuzzyRankedItem struct {
	Value    string
	Score    int
	Segments []FuzzySegment
}

const (
	fuzzySequentialBonus   = 15
	fuzzySeparatorBonus    = 30
	fuzzyCamelBonus        = 30
	fuzzyFirstLetterBonus  = 15
	fuzzyLeadingPenalty    = -5
	fuzzyMaxLeadingPenalty = -15
	fuzzyUnmatchedPenalty  = -1
	fuzzyRecursionLimit    = 10
	fuzzyTransposePenalty  = -20
	fuzzyExactSubstrBonus  = 100
)

func fuzzyIsLower(c rune) bool     { return c >= 'a' && c <= 'z' }
func fuzzyIsUpper(c rune) bool     { return c >= 'A' && c <= 'Z' }
func fuzzyIsSeparator(c rune) bool { return c == ' ' || c == '_' || c == '-' }

func fuzzyMax(a, b int) int {
	if a > b {
		return a
	}
	return b
}

func fuzzyScore(target []rune, matches []int) int {
	score := 100
	score += fuzzyMax(fuzzyMaxLeadingPenalty, fuzzyLeadingPenalty*matches[0])
	score += fuzzyUnmatchedPenalty * (len(target) - len(matches))

	for i := 0; i < len(matches); i++ {
		curr := matches[i]
		if i > 0 && curr == matches[i-1]+1 {
			score += fuzzySequentialBonus
		}
		if curr == 0 {
			score += fuzzyFirstLetterBonus
		} else {
			prev := target[curr-1]
			if fuzzyIsLower(prev) && fuzzyIsUpper(target[curr]) {
				score += fuzzyCamelBonus
			}
			if fuzzyIsSeparator(prev) {
				score += fuzzySeparatorBonus
			}
		}
	}
	return score
}

func fuzzyRecurse(query, target []rune, qi, ti int, matches []int, rec *int) []int {
	*rec++
	if *rec >= fuzzyRecursionLimit {
		return nil
	}

	var best []int
	for qi < len(query) && ti < len(target) {
		if unicode.ToLower(query[qi]) == unicode.ToLower(target[ti]) {
			skipped := fuzzyRecurse(query, target, qi, ti+1, append([]int(nil), matches...), rec)
			if skipped != nil && (best == nil || fuzzyScore(target, skipped) > fuzzyScore(target, best)) {
				best = skipped
			}
			matches = append(matches, ti)
			qi++
		}
		ti++
	}

	if qi < len(query) {
		return best // query not fully consumed -> this path failed
	}
	if best == nil || fuzzyScore(target, matches) > fuzzyScore(target, best) {
		return matches
	}
	return best
}

// FuzzyMatchOne scores query against target, or returns nil if the query is
// empty or is not a subsequence of target. (Port of the TSX `fuzzyMatch`.)
func FuzzyMatchOne(query, target string) *FuzzyMatchResult {
	if query == "" {
		return nil
	}
	qr := []rune(query)
	tr := []rune(target)
	rec := 0
	matches := fuzzyRecurse(qr, tr, 0, 0, nil, &rec)
	if matches == nil {
		return nil
	}
	score := fuzzyScore(tr, matches)
	// A contiguous substring hit ("bankof" in "Bankof") should outrank a
	// word-boundary match split across tokens ("Bank of America"). The bonus is
	// constant per query/target, so it lives here rather than in the per-
	// alignment scorer the recursion uses to pick match positions.
	if strings.Contains(strings.ToLower(target), strings.ToLower(query)) {
		score += fuzzyExactSubstrBonus
	}
	return &FuzzyMatchResult{Score: score, Positions: matches}
}

// FuzzyMatchTypoTolerant also tries every single adjacent-swap variant of the
// query (subsequence matching can't tolerate a transposed typo like "teh" vs
// "the"), penalizing transposed hits so exact matches still rank first.
func FuzzyMatchTypoTolerant(query, target string) *FuzzyMatchResult {
	best := FuzzyMatchOne(query, target)
	qr := []rune(query)
	for i := 0; i < len(qr)-1; i++ {
		swapped := string(qr[:i]) + string(qr[i+1]) + string(qr[i]) + string(qr[i+2:])
		m := FuzzyMatchOne(swapped, target)
		if m == nil {
			continue
		}
		score := m.Score + fuzzyTransposePenalty
		if best == nil || score > best.Score {
			best = &FuzzyMatchResult{Score: score, Positions: m.Positions}
		}
	}
	return best
}

// FuzzySegments splits text into alternating matched / unmatched runs for
// highlighting, using the given (rune-index) positions.
func FuzzySegments(text string, positions []int) []FuzzySegment {
	matched := make(map[int]bool, len(positions))
	for _, p := range positions {
		matched[p] = true
	}
	tr := []rune(text)
	var segments []FuzzySegment
	buf := ""
	bufMatch := matched[0]
	for i := 0; i < len(tr); i++ {
		isMatch := matched[i]
		if isMatch != bufMatch {
			if buf != "" {
				segments = append(segments, FuzzySegment{Text: buf, Match: bufMatch})
			}
			buf = ""
			bufMatch = isMatch
		}
		buf += string(tr[i])
	}
	if buf != "" {
		segments = append(segments, FuzzySegment{Text: buf, Match: bufMatch})
	}
	return segments
}

// RankFuzzyMatches ranks options against query, best score first, with
// highlight segments. Returns nil for an empty query. maxResults <= 0 means no
// limit. This is the headless entry point.
func RankFuzzyMatches(query string, options []string, maxResults int) []FuzzyRankedItem {
	q := strings.TrimSpace(query)
	if q == "" {
		return nil
	}
	var out []FuzzyRankedItem
	for _, value := range options {
		m := FuzzyMatchTypoTolerant(q, value)
		if m != nil {
			out = append(out, FuzzyRankedItem{Value: value, Score: m.Score, Segments: FuzzySegments(value, m.Positions)})
		}
	}
	sort.SliceStable(out, func(i, j int) bool { return out[i].Score > out[j].Score })
	if maxResults > 0 && len(out) > maxResults {
		out = out[:maxResults]
	}
	return out
}

// ============================================================================
// Component
// ============================================================================

// FuzzyMatchDisplay selects how FuzzyMatch renders its results.
type FuzzyMatchDisplay = string

const (
	FuzzyDisplayList     = "list"     // inline highlighted results below the input (default)
	FuzzyDisplayDropdown = "dropdown" // ComboBox-style autocomplete popover
	FuzzyDisplayNone     = "none"     // render only the input (headless)
)

const fuzzyInputCls = "bg-white block w-full border border-neutral-300 rounded-default shadow-xs text-sm p-2 h-[38px] focus:outline-2 focus:outline-offset-1 focus:outline-sky-500"

// Mirror FormCombobox's dropdown styling: neutral hover / highlight.
const fuzzyDropdownCls = "bg-white border border-neutral-300 rounded-default shadow-lg max-h-60 overflow-auto"
const fuzzyDropdownOptionCls = "w-full text-left p-2 text-sm cursor-pointer flex items-center justify-between gap-2 bg-transparent border-none hover:bg-neutral-100 whitespace-nowrap"
const fuzzyDropdownOptionHighlightCls = "bg-neutral-100"

// FuzzyMatchProps configures the FuzzyMatch component. Query / Open / Highlighted
// are caller-held state (read at the call site); the On* callbacks report changes.
type FuzzyMatchProps struct {
	Options     []string
	Display     FuzzyMatchDisplay // default FuzzyDisplayList
	ShowScores  bool
	MaxResults  int
	Placeholder string
	Class       string
	ListClass   string

	Query       string // current query text
	Open        bool   // dropdown open (Display == dropdown)
	Highlighted int    // highlighted result index (dropdown keyboard selection)

	OnSelect      func(value string, item FuzzyRankedItem)
	OnQueryChange func(query string)
	OnResults     func(results []FuzzyRankedItem) // see NOTE: not auto-invoked
}

// fuzzyHighlight renders a segment list as sky-highlighted / plain spans.
func fuzzyHighlight(segments []FuzzySegment) []*vdom.VNode {
	out := make([]*vdom.VNode, 0, len(segments))
	for _, seg := range segments {
		if seg.Match {
			out = append(out, vdom.Span(vdom.Attr("class", "text-sky-700 font-semibold"), vdom.Text(seg.Text)))
		} else {
			out = append(out, vdom.Span(vdom.Text(seg.Text)))
		}
	}
	return out
}

// fuzzyScoreBadge renders the debug score badge, or nil when disabled.
func fuzzyScoreBadge(show bool, score int) *vdom.VNode {
	if !show {
		return nil
	}
	return vdom.Span(vdom.Attr("class", "ml-3 shrink-0 text-xs text-neutral-400"), vdom.Text(strconv.Itoa(score)))
}

// fuzzyListView renders the inline "list" display. Before the user types, all
// options show unranked so the searchable set is visible up front.
func fuzzyListView(p FuzzyMatchProps, results []FuzzyRankedItem) *vdom.VNode {
	var items []FuzzyRankedItem
	if strings.TrimSpace(p.Query) != "" {
		items = results
	} else {
		for _, v := range p.Options {
			items = append(items, FuzzyRankedItem{Value: v, Score: 0, Segments: []FuzzySegment{{Text: v, Match: false}}})
		}
	}

	outer := []vdom.Mod{vdom.Attr("class", cx("mt-3", pick(p.ListClass, "h-72 overflow-y-auto")))}
	if len(items) > 0 {
		ul := []vdom.Mod{vdom.Attr("class", "flex flex-col gap-0.5")}
		for _, r := range items {
			r := r
			li := []vdom.Mod{
				vdom.Attr("class", "flex items-center justify-between gap-3 px-2 py-1 rounded-default cursor-pointer hover:bg-neutral-100"),
			}
			if p.OnSelect != nil {
				li = append(li, vdom.On(vdom.EVENT_CLICK, func() { p.OnSelect(r.Value, r) }))
			}
			li = append(li, vdom.Span(kids([]vdom.Mod{vdom.Attr("class", "text-sm text-neutral-800")}, fuzzyHighlight(r.Segments))...))
			if badge := fuzzyScoreBadge(p.ShowScores, r.Score); badge != nil {
				li = append(li, badge)
			}
			ul = append(ul, vdom.Li(li...))
		}
		outer = append(outer, vdom.Ul(ul...))
	} else if strings.TrimSpace(p.Query) != "" {
		outer = append(outer, vdom.P(vdom.Attr("class", "text-sm text-neutral-500 italic"),
			vdom.Text(`No matches for "`+p.Query+`".`)))
	}
	return vdom.Div(outer...)
}

// fuzzyDropdownView renders the "dropdown" display's option panel.
//
// NOTE: the TSX portaled this to document.body with `position: fixed` coords
// from getBoundingClientRect + a resize/scroll effect; here it's a statically
// `absolute` panel anchored under the input (the container is `relative`).
func fuzzyDropdownView(p FuzzyMatchProps, results []FuzzyRankedItem) *vdom.VNode {
	mods := []vdom.Mod{
		vdom.Attr("data-floating-content", "true"),
		vdom.Attr("class", cx("absolute left-0 right-0 top-full mt-1 z-[200]", fuzzyDropdownCls)),
	}
	for i, r := range results {
		r := r
		cls := fuzzyDropdownOptionCls
		if i == p.Highlighted {
			cls = cx(fuzzyDropdownOptionCls, fuzzyDropdownOptionHighlightCls)
		}
		btnMods := []vdom.Mod{
			vdom.Attr("type", "button"),
			vdom.Attr("class", cls),
		}
		if p.OnSelect != nil {
			btnMods = append(btnMods, vdom.On(vdom.EVENT_CLICK, func() { p.OnSelect(r.Value, r) }))
		}
		btnMods = append(btnMods, vdom.Span(kids([]vdom.Mod{vdom.Attr("class", "text-neutral-800")}, fuzzyHighlight(r.Segments))...))
		if badge := fuzzyScoreBadge(p.ShowScores, r.Score); badge != nil {
			btnMods = append(btnMods, badge)
		}
		mods = append(mods, vdom.Button(btnMods...))
	}
	return vdom.Div(mods...)
}

// FuzzyMatch renders a fuzzy-search input with inline ("list"), autocomplete
// ("dropdown"), or headless ("none") result display.
//
// NOTE: keyboard navigation (ArrowUp/Down/Enter/Escape) is dropped — the vdom
// Event exposes no key. In dropdown mode, updating Query and closing Open on
// select, opening on focus/typing, and outside-click dismissal are the caller's
// responsibility (report them via the On* callbacks). OnResults is retained for
// API parity but is not auto-invoked; headless callers should call
// RankFuzzyMatches directly.
func FuzzyMatch(p FuzzyMatchProps) *vdom.VNode {
	display := p.Display
	if display == "" {
		display = FuzzyDisplayList
	}

	results := RankFuzzyMatches(p.Query, p.Options, p.MaxResults)

	inputMods := []vdom.Mod{
		vdom.Attr("type", "text"),
		vdom.Attr("class", fuzzyInputCls),
		vdom.Prop("value", p.Query),
		vdom.Attr("placeholder", pick(p.Placeholder, "Search...")),
	}
	if p.OnQueryChange != nil {
		inputMods = append(inputMods, vdom.OnEvent(vdom.EVENT_INPUT, func(e vdom.Event) { p.OnQueryChange(e.Value()) }))
	}

	mods := []vdom.Mod{
		vdom.Attr("class", cx("relative", p.Class)),
		vdom.Input(inputMods...),
	}

	switch display {
	case FuzzyDisplayList:
		mods = append(mods, fuzzyListView(p, results))
	case FuzzyDisplayDropdown:
		if p.Open && len(results) > 0 {
			mods = append(mods, fuzzyDropdownView(p, results))
		}
	}
	return vdom.Div(mods...)
}