add lit reactive element

package.json

@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@babel/parser": "^7.26.2",
+    "@lit/reactive-element": "^2.0.4",
     "leaflet": "^1.9.4",
     "perfect-arrows": "^0.3.7",
     "perfect-freehand": "^1.2.2"

src/common/folk-element.ts

@@ -1,5 +1,7 @@
+import { ReactiveElement } from '@lit/reactive-element';
+
 // will eventually extend Lit's ReactiveElement
-export class FolkElement extends HTMLElement {
+export class FolkElement extends ReactiveElement {
   static tagName = '';
 
   static define() {

src/folk-base-connection.ts

@@ -9,7 +9,7 @@ function parseCSSSelector(selector: string): string[] {
 }
 
 export class FolkBaseConnection extends HTMLElement {
-  static tagName = 'folk-base-connection';
+  static tagName = '';
 
   static define() {
     if (customElements.get(this.tagName)) return;

src/folk-base-set.ts

@@ -2,16 +2,10 @@ import { ClientRectObserverEntry, ClientRectObserverManager } from './common/cli
 
 const clientRectObserver = new ClientRectObserverManager();
 
-declare global {
-  interface HTMLElementTagNameMap {
-    'folk-base-set': FolkBaseSet;
-  }
-}
-
 const defaultRect = DOMRectReadOnly.fromRect();
 
 export class FolkBaseSet extends HTMLElement {
-  static tagName = 'folk-base-set';
+  static tagName = '';
 
   static define() {
     if (customElements.get(this.tagName)) return;