A search utility in vanillaJS to query availability of starnames
Include the script in the body of your html
<script src="https://unpkg.com/search-starnames"></script>This script gets updated automatically whenever the actual utility package is updated on NPM
There are 3 elements hence 3 ID's to control styling
| Component | ID |
|---|---|
| Search Input | starname-search-input |
| Search Button | starname-search-button |
| Search Result Div | starname-search-result-div |
All these 3 elements must be present in the document
Result Div behaviour:
This showcase how html inside search result div will appear on different cases
Case: Entering valid starname:
<p>
Congrats <span>{starname}</span> is available
<br />
Register it <a href="...">Here</a>
</p>OR
<p>Sorry <span>{starname}</span> is already taken</p>Case: Entering invalid starname:
<p class="error">{ERROR_MESSAGE}</p>