a tiny atproto handle typeahead web component
atproto bluesky
43
fork

Configure Feed

Select the types of activity you want to include in your feed.

at main 261 lines 7.2 kB view raw
1{ 2 "schemaVersion": "1.0.0", 3 "readme": "", 4 "modules": [ 5 { 6 "kind": "javascript-module", 7 "path": "actor-typeahead.js", 8 "declarations": [ 9 { 10 "kind": "class", 11 "description": "", 12 "name": "ActorTypeahead", 13 "cssProperties": [ 14 { 15 "description": "Controls the color of the dropdown background.", 16 "name": "--color-background" 17 }, 18 { 19 "description": "Controls the color of the dropdown border.", 20 "name": "--color-border" 21 }, 22 { 23 "description": "Controls the color of the dropdown shadow.", 24 "name": "--color-shadow" 25 }, 26 { 27 "description": "Controls the background color of each row on hover.", 28 "name": "--color-hover" 29 }, 30 { 31 "description": "Controls the background color of an avatar circle if the image fails to load.", 32 "name": "--color-avatar-fallback" 33 }, 34 { 35 "description": "Controls the corner radius of the dropdown.", 36 "name": "--radius" 37 }, 38 { 39 "description": "Controls the padding of the dropdown menu.", 40 "name": "--padding-menu" 41 } 42 ], 43 "cssParts": [ 44 { 45 "description": "The dropdown menu.", 46 "name": "menu" 47 }, 48 { 49 "description": "The user row.", 50 "name": "user" 51 }, 52 { 53 "description": "The user avatar wrapper.", 54 "name": "avatar" 55 }, 56 { 57 "description": "The user avatar image.", 58 "name": "img" 59 }, 60 { 61 "description": "The user handle text.", 62 "name": "handle" 63 } 64 ], 65 "slots": [ 66 { 67 "description": "The <input> tag to progressively enhance.", 68 "name": "" 69 } 70 ], 71 "members": [ 72 { 73 "kind": "field", 74 "name": "tag", 75 "type": { 76 "text": "string" 77 }, 78 "static": true, 79 "default": "\"actor-typeahead\"" 80 }, 81 { 82 "kind": "method", 83 "name": "define", 84 "static": true, 85 "parameters": [ 86 { 87 "name": "tag", 88 "default": "this.tag" 89 } 90 ] 91 }, 92 { 93 "kind": "field", 94 "name": "#shadow", 95 "privacy": "private" 96 }, 97 { 98 "kind": "field", 99 "name": "#actors", 100 "privacy": "private", 101 "type": { 102 "text": "Array<{ handle: string; avatar: string }>" 103 }, 104 "default": "[]" 105 }, 106 { 107 "kind": "field", 108 "name": "#index", 109 "privacy": "private", 110 "type": { 111 "text": "number" 112 }, 113 "default": "-1" 114 }, 115 { 116 "kind": "field", 117 "name": "#pressed", 118 "privacy": "private", 119 "type": { 120 "text": "boolean" 121 }, 122 "default": "false" 123 }, 124 { 125 "kind": "field", 126 "name": "#rows", 127 "privacy": "private", 128 "readonly": true 129 }, 130 { 131 "kind": "method", 132 "name": "handleEvent", 133 "parameters": [ 134 { 135 "name": "evt", 136 "type": { 137 "text": "Event" 138 } 139 } 140 ] 141 }, 142 { 143 "kind": "method", 144 "name": "#onkeydown", 145 "privacy": "private", 146 "parameters": [ 147 { 148 "name": "evt", 149 "type": { 150 "text": "KeyboardEvent" 151 } 152 } 153 ] 154 }, 155 { 156 "kind": "method", 157 "name": "#oninput", 158 "privacy": "private", 159 "parameters": [ 160 { 161 "name": "evt", 162 "type": { 163 "text": "InputEvent & { target: HTMLInputElement }" 164 } 165 } 166 ] 167 }, 168 { 169 "kind": "method", 170 "name": "#onfocusout", 171 "privacy": "private", 172 "parameters": [ 173 { 174 "name": "evt", 175 "type": { 176 "text": "Event" 177 } 178 } 179 ] 180 }, 181 { 182 "kind": "method", 183 "name": "#render", 184 "privacy": "private" 185 }, 186 { 187 "kind": "method", 188 "name": "#onpointerdown", 189 "privacy": "private", 190 "parameters": [ 191 { 192 "name": "evt", 193 "type": { 194 "text": "PointerEvent" 195 } 196 } 197 ] 198 }, 199 { 200 "kind": "method", 201 "name": "#onpointerup", 202 "privacy": "private", 203 "parameters": [ 204 { 205 "name": "evt", 206 "type": { 207 "text": "PointerEvent & { target: HTMLElement }" 208 } 209 } 210 ] 211 } 212 ], 213 "attributes": [ 214 { 215 "type": { 216 "text": "string" 217 }, 218 "description": "The host to which to make the typeahead API call.", 219 "name": "host" 220 }, 221 { 222 "type": { 223 "text": "number" 224 }, 225 "description": "The maximum number of rows to display in the dropdown.", 226 "name": "rows" 227 } 228 ], 229 "superclass": { 230 "name": "HTMLElement" 231 }, 232 "tagName": "actor-typeahead", 233 "customElement": true, 234 "summary": "A small web component that progressively enhances an <input> element into an autocomplete for ATProto handles!" 235 }, 236 { 237 "kind": "variable", 238 "name": "tag" 239 } 240 ], 241 "exports": [ 242 { 243 "kind": "js", 244 "name": "default", 245 "declaration": { 246 "name": "ActorTypeahead", 247 "module": "actor-typeahead.js" 248 } 249 }, 250 { 251 "kind": "custom-element-definition", 252 "name": "tag", 253 "declaration": { 254 "name": "anonymous_0", 255 "module": "actor-typeahead.js" 256 } 257 } 258 ] 259 } 260 ] 261}