nekomimi.pet
forked from
jakelazaroff.com/actor-typeahead
a tiny atproto handle typeahead web component
1# actor-typeahead
2
3A small web component that progressively enhances an `<input>` element into an autocomplete for ATProto handles!
4
5It works with any web stack and any JavaScript framework.
6
7## Installation
8
9The easiest way to install is to just copy `actor-typeahead.js` into your project and reference it in a script tag:
10
11```html
12<script type="module" src="actor-typeahead.js"></script>
13```
14
15It will automatically register the `<actor-typeahead>` tag as a custom element.
16
17If you'd like to use a different tag, you can import the file with a query string:
18
19```html
20<script type="module" src="actor-typeahead.js?tag=some-other-tag"></script>
21```
22
23If you'd prefer to manually register the custom element, you can use the query string `?tag=none` and call the static method `define`:
24
25<script type="module">
26 import ActorTypeahead from "actor-typeahead.js?tag=none";
27 ActorTypeahead.define("some-other-tag");
28</script>
29
30If you're using a bundler, you can install it from npm:
31
32```sh
33npm install actor-typeahead
34```
35
36Then import it somewhere in your JavaScript. It'll auto-register itself.
37
38```js
39import "actor-typeahead";
40```
41
42## Usage
43
44Simply wrap your `<input>` with `<actor-typeahead>`:
45
46```html
47<actor-typeahead>
48 <input>
49</actor-typeahead>
50```