fix(lit-components): fix rendering and interaction issues in force-graph, html-table, and draggable-dom

- lit-force-graph: Refactored for instance reuse, better lifecycle management, and added dynamic imports for AR/VR modes.
- lit-html-table: Improved visual design, readability of headers, and fixed reactivity in editable mode.
- lit-draggable-dom: Fixed clipping issues by switching to relative/absolute positioning and resolved a panning speed bug caused by CSS variable inheritance.

lit-components/vite-rxdb-lit/components/app-bar.ts

@@ -0,0 +1,37 @@
+import { html, TemplateResult } from "lit";
+
+import "@material/mwc-top-app-bar-fixed";
+import "@material/mwc-icon-button";
+import { iconButton } from "./app-button";
+
+const TITLE = "TODOS";
+
+export const appBar = (props: {
+  navigation?: TemplateResult;
+  title?: string;
+  content?: TemplateResult;
+  actions?: TemplateResult[];
+}) => {
+  return html` <mwc-top-app-bar-fixed>
+    ${props?.navigation ?? ""}
+    <div slot="title">${props?.title ?? TITLE}</div>
+    ${props?.actions ?? ""}
+    <div>${props?.content ?? ""}</div>
+  </mwc-top-app-bar-fixed>`;
+};
+
+export const navigationIcon = (callback: () => void, icon: string = "menu") => {
+  return iconButton({
+    icon: icon,
+    slot: "navigationIcon",
+    callback: () => callback(),
+  });
+};
+
+export const actionButton = (icon: string, callback: () => void) => {
+  return iconButton({
+    icon: icon,
+    slot: "actionItems",
+    callback: () => callback(),
+  });
+};