tracks lexicons and how many times they appeared on the jetstream
1<script lang="ts">
2 interface Props {
3 refreshRate: string;
4 onRefreshChange: (value: string) => void;
5 }
6
7 let { refreshRate, onRefreshChange }: Props = $props();
8</script>
9
10<div
11 class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-lime-100 dark:bg-lime-900 dark:hover:bg-lime-800 hover:bg-lime-200 border-lime-300 dark:border-lime-700"
12>
13 <label for="refresh-rate" class="text-lime-800 dark:text-lime-200 mr-1"
14 >refresh:</label
15 >
16 <input
17 id="refresh-rate"
18 value={refreshRate}
19 oninput={(e) => {
20 const el = e.target as HTMLInputElement;
21 if (!el.validity.valid) el.value = el.value.replace(/\D+/g, "");
22 onRefreshChange(el.value);
23 }}
24 type="text"
25 inputmode="numeric"
26 pattern="[0-9]*"
27 min="0"
28 placeholder="real-time"
29 class="bg-green-50 dark:bg-green-900 text-lime-900 dark:text-lime-200 placeholder-lime-600 dark:placeholder-lime-400 border border-lime-200 dark:border-lime-700 rounded-full px-1 outline-none focus:border-lime-400 min-w-0 w-20"
30 />
31 <span class="text-lime-800 dark:text-lime-200">s</span>
32</div>