[skeleton] Use datalist for query suggestions for autocomplete experience

[frontsideair]

WHY are these changes introduced?

Predictive query suggestions are listed as inline, and the experience is fine, but the HTML <datalist> element has better semantics and keyboard accessibility. Has good compatibility across the board. (Firefox has partial support, but in this case the problem is with date and time fields, not related in current case.)

WHAT is this pull request doing?

Uses <datalist> HTML element.

Predictive query via datalist

datalist.mov

HOW to test your changes?

1. Open search sidebar
2. Type "s"
3. See query results (if using mock.shop there should be a few)

Post-merge steps

Checklist

• I've read the Contributing Guidelines
• I've considered possible cross-platform impacts (Mac, Linux, Windows)
• I've added a changeset if this PR contains user-facing or noteworthy changes
• I've added tests to cover my changes
• I've added or updated the documentation

[wizardlyhel]

Nice! Thank you for the contribution! We'll review this as soon as we can.

[wizardlyhel]

code looks good

[scottdixon]

Thanks @frontsideair! CI failed on typecheck - can you please adjust? 🙏

[frontsideair]

@scottdixon I must've missed your comment, just saw it and fixed the type errors.

[scottdixon]

Thanks @frontsideair! One last ask - can you please include a changeset (yarn changeset from Hydrogen root).

[frontsideair]

Just did it @scottdixon!