@alepha/devtools 0.16.0 → 0.19.1

package/src/ui/components/shared/TreeView.tsx

@@ -0,0 +1,189 @@
+import { Flex } from "@alepha/ui";
+import { Text, UnstyledButton } from "@mantine/core";
+import { IconChevronDown, IconChevronRight } from "@tabler/icons-react";
+import type { ReactNode } from "react";
+import { useMemo } from "react";
+
+export interface TreeViewNode {
+  id: string;
+  label: string;
+  icon?: ReactNode;
+  badge?: ReactNode;
+  children?: TreeViewNode[];
+}
+
+export interface TreeViewProps {
+  nodes: TreeViewNode[];
+  selectedId: string;
+  openNodes: Set<string>;
+  search?: string;
+  onSelect: (id: string) => void;
+  onToggle: (id: string) => void;
+  showLeafCount?: boolean;
+}
+
+const filterTree = (nodes: TreeViewNode[], search: string): TreeViewNode[] => {
+  if (!search) return nodes;
+  const term = search.toLowerCase();
+
+  return nodes.reduce<TreeViewNode[]>((acc, node) => {
+    if (node.children) {
+      const filtered = filterTree(node.children, search);
+      if (filtered.length > 0) {
+        acc.push({ ...node, children: filtered });
+      } else if (node.label.toLowerCase().includes(term)) {
+        acc.push(node);
+      }
+    } else if (node.label.toLowerCase().includes(term)) {
+      acc.push(node);
+    }
+    return acc;
+  }, []);
+};
+
+const countLeaves = (nodes: TreeViewNode[]): number => {
+  let count = 0;
+  for (const node of nodes) {
+    if (node.children && node.children.length > 0) {
+      count += countLeaves(node.children);
+    } else {
+      count++;
+    }
+  }
+  return count;
+};
+
+export const TreeView = ({
+  nodes,
+  selectedId,
+  openNodes,
+  search = "",
+  onSelect,
+  onToggle,
+  showLeafCount = true,
+}: TreeViewProps) => {
+  const filtered = useMemo(() => filterTree(nodes, search), [nodes, search]);
+
+  return (
+    <Flex direction="column" gap={2} style={{ minHeight: 0 }}>
+      {filtered.map((node) => (
+        <TreeViewItem
+          key={node.id}
+          node={node}
+          depth={0}
+          selectedId={selectedId}
+          openNodes={openNodes}
+          onSelect={onSelect}
+          onToggle={onToggle}
+          showLeafCount={showLeafCount}
+        />
+      ))}
+    </Flex>
+  );
+};
+
+const TreeViewItem = ({
+  node,
+  depth,
+  selectedId,
+  openNodes,
+  onSelect,
+  onToggle,
+  showLeafCount,
+}: {
+  node: TreeViewNode;
+  depth: number;
+  selectedId: string;
+  openNodes: Set<string>;
+  onSelect: (id: string) => void;
+  onToggle: (id: string) => void;
+  showLeafCount: boolean;
+}) => {
+  const isFolder = !!node.children && node.children.length > 0;
+  const isOpen = openNodes.has(node.id);
+  const isSelected = selectedId === node.id;
+  const leafCount = isFolder ? countLeaves(node.children!) : 0;
+
+  return (
+    <>
+      <UnstyledButton
+        w="100%"
+        py={4}
+        className="devtools-tree-node"
+        data-selected={isSelected || undefined}
+        style={{
+          borderRadius: 6,
+          paddingLeft: 8 + depth * 20,
+          paddingRight: 8,
+          transition: "background 100ms ease",
+        }}
+        onClick={() => {
+          if (isFolder) {
+            onToggle(node.id);
+          } else {
+            onSelect(node.id);
+          }
+        }}
+      >
+        <Flex gap={8} wrap="nowrap">
+          {isFolder ? (
+            <Flex
+              style={{
+                width: 14,
+                flexShrink: 0,
+                display: "flex",
+                alignItems: "center",
+              }}
+            >
+              {isOpen ? (
+                <IconChevronDown size={14} opacity={0.5} />
+              ) : (
+                <IconChevronRight size={14} opacity={0.5} />
+              )}
+            </Flex>
+          ) : (
+            <Flex
+              style={{
+                width: 14,
+                flexShrink: 0,
+                display: "flex",
+                alignItems: "center",
+              }}
+            />
+          )}
+          {node.icon}
+          <Text
+            fz={12}
+            fw={isSelected ? 600 : 400}
+            truncate
+            style={{ flex: 1 }}
+          >
+            {node.label}
+          </Text>
+          {node.badge}
+          {isFolder && showLeafCount && leafCount > 0 && (
+            <Text fz={10} c="dimmed" style={{ flexShrink: 0 }}>
+              {leafCount}
+            </Text>
+          )}
+        </Flex>
+      </UnstyledButton>
+      {isFolder && isOpen && (
+        <Flex direction="column" gap={2} style={{ minHeight: 0 }}>
+          {node.children!.map((child) => (
+            <TreeViewItem
+              key={child.id}
+              node={child}
+              depth={depth + 1}
+              selectedId={selectedId}
+              openNodes={openNodes}
+              onSelect={onSelect}
+              onToggle={onToggle}
+              showLeafCount={showLeafCount}
+            />
+          ))}
+        </Flex>
+      )}
+    </>
+  );
+};

package/src/ui/main.css

@@ -0,0 +1,17 @@
+@import "@alepha/ui/styles";
+
+.devtools-tree-node:hover {
+  background: var(--mantine-color-default-hover) !important;
+}
+
+.devtools-tree-node:active {
+  background: var(--mantine-color-default-border) !important;
+}
+
+.devtools-tree-node[data-selected="true"] {
+  background: var(--mantine-primary-color-light) !important;
+}
+
+.devtools-tree-node[data-selected="true"]:hover {
+  background: var(--mantine-primary-color-light-hover) !important;
+}

package/src/ui/main.ts

@@ -1,8 +1,4 @@
-import { Alepha, run } from "alepha";
+import { run } from "alepha";
 import { AppRouter } from "./AppRouter.tsx";
 
-const alepha = Alepha.create();
-
-alepha.with(AppRouter);
-
-run(alepha);
+run(AppRouter);

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2025 Nicolas Foures
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/assets/devtools/actions.html

@@ -1,21 +0,0 @@
-<!DOCTYPE html>
-<html data-theme="Midnight">
-<head><meta charset="UTF-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<link rel="stylesheet" href="/devtools/asset.BJSLFcNT.css" crossorigin="">
-<script type="module" crossorigin="" src="/devtools/entry.DhzNl8q_.js"></script>
-</head>
-<body>
-<div id="root"><script data-mantine-script="true">try {
-  var _colorScheme = window.localStorage.getItem("mantine-color-scheme-value");
-  var colorScheme = _colorScheme === "light" || _colorScheme === "dark" || _colorScheme === "auto" ? _colorScheme : "light";
-  var computedColorScheme = colorScheme !== "auto" ? colorScheme : window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-  document.documentElement.setAttribute("data-mantine-color-scheme", computedColorScheme);
-} catch (e) {}
-</script><style data-mantine-styles="true">:root, :host{--mantine-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--mantine-font-family-monospace: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--mantine-font-family-headings: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;--mantine-heading-font-weight: 600;--mantine-radius-default: 6px;--mantine-primary-color-filled: var(--mantine-color-pink-filled);--mantine-primary-color-filled-hover: var(--mantine-color-pink-filled-hover);--mantine-primary-color-light: var(--mantine-color-pink-light);--mantine-primary-color-light-hover: var(--mantine-color-pink-light-hover);--mantine-primary-color-light-color: var(--mantine-color-pink-light-color);--mantine-radius-xs: 3px;--mantine-radius-sm: 6px;--mantine-radius-md: 6px;--mantine-radius-lg: 8px;--mantine-radius-xl: 12px;--mantine-primary-color-0: var(--mantine-color-pink-0);--mantine-primary-color-1: var(--mantine-color-pink-1);--mantine-primary-color-2: var(--mantine-color-pink-2);--mantine-primary-color-3: var(--mantine-color-pink-3);--mantine-primary-color-4: var(--mantine-color-pink-4);--mantine-primary-color-5: var(--mantine-color-pink-5);--mantine-primary-color-6: var(--mantine-color-pink-6);--mantine-primary-color-7: var(--mantine-color-pink-7);--mantine-primary-color-8: var(--mantine-color-pink-8);--mantine-primary-color-9: var(--mantine-color-pink-9);--mantine-color-dark-0: #d0d7de;--mantine-color-dark-1: #8b949e;--mantine-color-dark-2: #6e7681;--mantine-color-dark-3: #484f58;--mantine-color-dark-4: #30363d;--mantine-color-dark-5: #21262d;--mantine-color-dark-6: #161b22;--mantine-color-dark-7: #151b23;--mantine-color-dark-8: #0d1117;--mantine-color-dark-9: #010409;--mantine-color-gray-0: #f6f8fa;--mantine-color-gray-1: #eaeef2;--mantine-color-gray-2: #d0d7de;--mantine-color-gray-3: #afb8c1;--mantine-color-gray-4: #8c959f;--mantine-color-gray-5: #6e7781;--mantine-color-gray-6: #57606a;--mantine-color-gray-7: #424a53;--mantine-color-gray-8: #32383f;--mantine-color-gray-9: #24292f;--mantine-color-red-0: #ffebe9;--mantine-color-red-1: #ffcecb;--mantine-color-red-2: #ffaba8;--mantine-color-red-3: #ff8182;--mantine-color-red-4: #fa4549;--mantine-color-red-5: #cf222e;--mantine-color-red-6: #a40e26;--mantine-color-red-7: #82071e;--mantine-color-red-8: #660018;--mantine-color-red-9: #4c0014;--mantine-color-blue-0: #ddf4ff;--mantine-color-blue-1: #b6e3ff;--mantine-color-blue-2: #80ccff;--mantine-color-blue-3: #54aeff;--mantine-color-blue-4: #218bff;--mantine-color-blue-5: #0969da;--mantine-color-blue-6: #0550ae;--mantine-color-blue-7: #033d8b;--mantine-color-blue-8: #0a3069;--mantine-color-blue-9: #002155;--mantine-color-green-0: #dafbe1;--mantine-color-green-1: #aceebb;--mantine-color-green-2: #6fdd8b;--mantine-color-green-3: #4ac26b;--mantine-color-green-4: #2da44e;--mantine-color-green-5: #1a7f37;--mantine-color-green-6: #116329;--mantine-color-green-7: #044f1e;--mantine-color-green-8: #003d16;--mantine-color-green-9: #002d11;--mantine-h1-font-size: 2rem;--mantine-h1-line-height: 1.25;--mantine-h1-font-weight: 600;--mantine-h2-font-size: 1.5rem;--mantine-h2-line-height: 1.3;--mantine-h2-font-weight: 600;--mantine-h3-font-size: 1.25rem;--mantine-h3-font-weight: 600;--mantine-h4-font-size: 1rem;--mantine-h4-line-height: 1.5;--mantine-h4-font-weight: 600;--mantine-h5-font-size: 0.875rem;--mantine-h5-font-weight: 600;--mantine-h6-font-size: 0.75rem;--mantine-h6-font-weight: 600;}
-
-:root[data-mantine-color-scheme="dark"], :host([data-mantine-color-scheme="dark"]){--mantine-color-anchor: var(--mantine-color-pink-4);--mantine-color-dark-light: rgba(22, 27, 34, 0.15);--mantine-color-dark-light-hover: rgba(22, 27, 34, 0.2);--mantine-color-dark-outline-hover: rgba(48, 54, 61, 0.05);--mantine-color-gray-light: rgba(87, 96, 106, 0.15);--mantine-color-gray-light-hover: rgba(87, 96, 106, 0.2);--mantine-color-gray-outline-hover: rgba(140, 149, 159, 0.05);--mantine-color-red-light: rgba(164, 14, 38, 0.15);--mantine-color-red-light-hover: rgba(164, 14, 38, 0.2);--mantine-color-red-outline-hover: rgba(250, 69, 73, 0.05);--mantine-color-blue-light: rgba(5, 80, 174, 0.15);--mantine-color-blue-light-hover: rgba(5, 80, 174, 0.2);--mantine-color-blue-outline-hover: rgba(33, 139, 255, 0.05);--mantine-color-green-light: rgba(17, 99, 41, 0.15);--mantine-color-green-light-hover: rgba(17, 99, 41, 0.2);--mantine-color-green-outline-hover: rgba(45, 164, 78, 0.05);}
-
-:root[data-mantine-color-scheme="light"], :host([data-mantine-color-scheme="light"]){--mantine-color-anchor: var(--mantine-color-pink-7);--mantine-color-dark-filled: var(--mantine-color-dark-7);--mantine-color-dark-filled-hover: var(--mantine-color-dark-8);--mantine-color-dark-light: rgba(21, 27, 35, 0.1);--mantine-color-dark-light-hover: rgba(21, 27, 35, 0.12);--mantine-color-dark-light-color: var(--mantine-color-dark-7);--mantine-color-dark-outline: var(--mantine-color-dark-7);--mantine-color-dark-outline-hover: rgba(21, 27, 35, 0.05);--mantine-color-gray-filled: var(--mantine-color-gray-7);--mantine-color-gray-filled-hover: var(--mantine-color-gray-8);--mantine-color-gray-light: rgba(66, 74, 83, 0.1);--mantine-color-gray-light-hover: rgba(66, 74, 83, 0.12);--mantine-color-gray-light-color: var(--mantine-color-gray-7);--mantine-color-gray-outline: var(--mantine-color-gray-7);--mantine-color-gray-outline-hover: rgba(66, 74, 83, 0.05);--mantine-color-red-filled: var(--mantine-color-red-7);--mantine-color-red-filled-hover: var(--mantine-color-red-8);--mantine-color-red-light: rgba(130, 7, 30, 0.1);--mantine-color-red-light-hover: rgba(130, 7, 30, 0.12);--mantine-color-red-light-color: var(--mantine-color-red-7);--mantine-color-red-outline: var(--mantine-color-red-7);--mantine-color-red-outline-hover: rgba(130, 7, 30, 0.05);--mantine-color-pink-filled: var(--mantine-color-pink-7);--mantine-color-pink-filled-hover: var(--mantine-color-pink-8);--mantine-color-pink-light: rgba(214, 51, 108, 0.1);--mantine-color-pink-light-hover: rgba(214, 51, 108, 0.12);--mantine-color-pink-light-color: var(--mantine-color-pink-7);--mantine-color-pink-outline: var(--mantine-color-pink-7);--mantine-color-pink-outline-hover: rgba(214, 51, 108, 0.05);--mantine-color-grape-filled: var(--mantine-color-grape-7);--mantine-color-grape-filled-hover: var(--mantine-color-grape-8);--mantine-color-grape-light: rgba(174, 62, 201, 0.1);--mantine-color-grape-light-hover: rgba(174, 62, 201, 0.12);--mantine-color-grape-light-color: var(--mantine-color-grape-7);--mantine-color-grape-outline: var(--mantine-color-grape-7);--mantine-color-grape-outline-hover: rgba(174, 62, 201, 0.05);--mantine-color-violet-filled: var(--mantine-color-violet-7);--mantine-color-violet-filled-hover: var(--mantine-color-violet-8);--mantine-color-violet-light: rgba(112, 72, 232, 0.1);--mantine-color-violet-light-hover: rgba(112, 72, 232, 0.12);--mantine-color-violet-light-color: var(--mantine-color-violet-7);--mantine-color-violet-outline: var(--mantine-color-violet-7);--mantine-color-violet-outline-hover: rgba(112, 72, 232, 0.05);--mantine-color-indigo-filled: var(--mantine-color-indigo-7);--mantine-color-indigo-filled-hover: var(--mantine-color-indigo-8);--mantine-color-indigo-light: rgba(66, 99, 235, 0.1);--mantine-color-indigo-light-hover: rgba(66, 99, 235, 0.12);--mantine-color-indigo-light-color: var(--mantine-color-indigo-7);--mantine-color-indigo-outline: var(--mantine-color-indigo-7);--mantine-color-indigo-outline-hover: rgba(66, 99, 235, 0.05);--mantine-color-blue-filled: var(--mantine-color-blue-7);--mantine-color-blue-filled-hover: var(--mantine-color-blue-8);--mantine-color-blue-light: rgba(3, 61, 139, 0.1);--mantine-color-blue-light-hover: rgba(3, 61, 139, 0.12);--mantine-color-blue-light-color: var(--mantine-color-blue-7);--mantine-color-blue-outline: var(--mantine-color-blue-7);--mantine-color-blue-outline-hover: rgba(3, 61, 139, 0.05);--mantine-color-cyan-filled: var(--mantine-color-cyan-7);--mantine-color-cyan-filled-hover: var(--mantine-color-cyan-8);--mantine-color-cyan-light: rgba(16, 152, 173, 0.1);--mantine-color-cyan-light-hover: rgba(16, 152, 173, 0.12);--mantine-color-cyan-light-color: var(--mantine-color-cyan-7);--mantine-color-cyan-outline: var(--mantine-color-cyan-7);--mantine-color-cyan-outline-hover: rgba(16, 152, 173, 0.05);--mantine-color-teal-filled: var(--mantine-color-teal-7);--mantine-color-teal-filled-hover: var(--mantine-color-teal-8);--mantine-color-teal-light: rgba(12, 166, 120, 0.1);--mantine-color-teal-light-hover: rgba(12, 166, 120, 0.12);--mantine-color-teal-light-color: var(--mantine-color-teal-7);--mantine-color-teal-outline: var(--mantine-color-teal-7);--mantine-color-teal-outline-hover: rgba(12, 166, 120, 0.05);--mantine-color-green-filled: var(--mantine-color-green-7);--mantine-color-green-filled-hover: var(--mantine-color-green-8);--mantine-color-green-light: rgba(4, 79, 30, 0.1);--mantine-color-green-light-hover: rgba(4, 79, 30, 0.12);--mantine-color-green-light-color: var(--mantine-color-green-7);--mantine-color-green-outline: var(--mantine-color-green-7);--mantine-color-green-outline-hover: rgba(4, 79, 30, 0.05);--mantine-color-lime-filled: var(--mantine-color-lime-7);--mantine-color-lime-filled-hover: var(--mantine-color-lime-8);--mantine-color-lime-light: rgba(116, 184, 22, 0.1);--mantine-color-lime-light-hover: rgba(116, 184, 22, 0.12);--mantine-color-lime-light-color: var(--mantine-color-lime-7);--mantine-color-lime-outline: var(--mantine-color-lime-7);--mantine-color-lime-outline-hover: rgba(116, 184, 22, 0.05);--mantine-color-yellow-filled: var(--mantine-color-yellow-7);--mantine-color-yellow-filled-hover: var(--mantine-color-yellow-8);--mantine-color-yellow-light: rgba(245, 159, 0, 0.1);--mantine-color-yellow-light-hover: rgba(245, 159, 0, 0.12);--mantine-color-yellow-light-color: var(--mantine-color-yellow-7);--mantine-color-yellow-outline: var(--mantine-color-yellow-7);--mantine-color-yellow-outline-hover: rgba(245, 159, 0, 0.05);--mantine-color-orange-filled: var(--mantine-color-orange-7);--mantine-color-orange-filled-hover: var(--mantine-color-orange-8);--mantine-color-orange-light: rgba(247, 103, 7, 0.1);--mantine-color-orange-light-hover: rgba(247, 103, 7, 0.12);--mantine-color-orange-light-color: var(--mantine-color-orange-7);--mantine-color-orange-outline: var(--mantine-color-orange-7);--mantine-color-orange-outline-hover: rgba(247, 103, 7, 0.05);}</style><style data-mantine-styles="classes">@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}</style><style data-mantine-styles="inline">:root{--app-shell-navbar-width:calc(18.75rem * var(--mantine-scale));--app-shell-navbar-offset:calc(18.75rem * var(--mantine-scale));--app-shell-header-height:calc(3.75rem * var(--mantine-scale));--app-shell-header-offset:calc(3.75rem * var(--mantine-scale));--app-shell-padding:var(--mantine-spacing-md);}@media(max-width: 47.99375em){:root{--app-shell-navbar-width:100%;--app-shell-navbar-offset:0px;--app-shell-navbar-transform:translateX(calc(var(--app-shell-navbar-width) * -1));--app-shell-navbar-transform-rtl:translateX(var(--app-shell-navbar-width));}}</style><div style="--app-shell-transition-duration:200ms;--app-shell-transition-timing-function:ease;width:100%;flex:1" class="m_89ab340 mantine-AppShell-root" data-resizing="true" data-mode="fixed" id="mantine-_R_lu_"><header style="--app-shell-header-z-index:100;background:var(--alepha-background)" class="m_3b16f56b mantine-AppShell-header right-scroll-bar-position" data-with-border="true"><div style="align-items:center;justify-content:space-between;padding-inline:var(--mantine-spacing-md);height:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_2jdlu_"><div style="flex:1" class="m_8bffd616 mantine-Flex-root __m__-_R_dmjdlu_"><div style="align-items:center;margin-left:0rem" class="m_8bffd616 mantine-Flex-root __m__-_R_3ddmjdlu_"><button style="--burger-size:var(--burger-size-sm)" class="mantine-focus-auto m_fea6bf1a mantine-Burger-root m_87cf2631 mantine-UnstyledButton-root mantine-hidden-from-sm" data-size="sm" type="button"><div class="m_d4fb9cad mantine-Burger-burger" data-reduce-motion="true"></div></button></div><div style="align-items:center;margin-left:var(--mantine-spacing-md)" class="m_8bffd616 mantine-Flex-root __m__-_R_5ddmjdlu_"><div style="margin-left:-32px;border-right:1px solid var(--mantine-color-default-border);width:calc(4.875rem * var(--mantine-scale));height:calc(3.75rem * var(--mantine-scale))" class="m_8bffd616 mantine-Flex-root __m__-_R_bdddmjdlu_"></div></div><div style="align-items:center;margin-left:var(--mantine-spacing-md)" class="m_8bffd616 mantine-Flex-root __m__-_R_7ddmjdlu_"><button style="--button-justify:space-between;--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-pink-outline-hover);--button-color:var(--mantine-color-pink-outline);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-pink-outline);border:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-default-border)" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="outline" data-with-right-section="true" type="button" justify="space-between"><span class="m_80f1301b mantine-Button-inner"><span class="m_811560b9 mantine-Button-label"><div style="gap:var(--mantine-spacing-xs);align-items:center" class="m_8bffd616 mantine-Flex-root __m__-_R_barfddmjdlu_"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="gray" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-search "><path d="M3 10a7 7 0 1 0 14 0a7 7 0 1 0 -14 0"></path><path d="M21 21l-6 -6"></path></svg><div style="min-width:calc(12rem * var(--mantine-scale))" class="m_8bffd616 mantine-Flex-root __m__-_R_2mrarfddmjdlu_ mantine-visible-from-sm"><p style="--text-fz:var(--mantine-font-size-xs);--text-lh:var(--mantine-line-height-xs);color:var(--mantine-color-dimmed)" class="mantine-focus-auto m_b6d8b162 mantine-Text-root" data-size="xs">Search...</p></div></div></span><span class="m_a74036a mantine-Button-section" data-position="right"><kbd style="--kbd-fz:var(--kbd-fz-sm)" class="m_dc6f14e2 mantine-Kbd-root mantine-visible-from-sm" data-size="sm">+K</kbd></span></span></button></div></div><div class="m_8bffd616 mantine-Flex-root __m__-_R_lmjdlu_"></div><div style="align-items:center;justify-content:end;flex:1" class="m_8bffd616 mantine-Flex-root __m__-_R_tmjdlu_"><div style="align-items:center;margin-left:0rem" class="m_8bffd616 mantine-Flex-root __m__-_R_3dtmjdlu_"><button style="--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text)" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" type="button" aria-label="Toggle color scheme"><span class="m_80f1301b mantine-Button-inner"><span class="m_811560b9 mantine-Button-label"><div style="--ti-size:var(--ti-size-sm);--ti-bg:transparent;--ti-color:var(--mantine-color-pink-light-color);--ti-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;color:var(--mantine-color-text);width:calc(1.5rem * var(--mantine-scale))" class="m_7341320d mantine-ThemeIcon-root" data-variant="transparent" data-size="sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-sun alepha-light-hidden"><path d="M8 12a4 4 0 1 0 8 0a4 4 0 1 0 -8 0"></path><path d="M3 12h1m8 -9v1m8 8h1m-9 8v1m-6.4 -15.4l.7 .7m12.1 -.7l-.7 .7m0 11.4l.7 .7m-12.1 -.7l-.7 .7"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-moon alepha-dark-hidden"><path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454l0 .008"></path></svg></div></span></span></button></div></div></div></header><nav style="opacity:1;--app-shell-navbar-z-index:calc(100 + 1);background:var(--alepha-background)" class="m_45252eee mantine-AppShell-navbar alepha-sidebar-navbar" data-with-border="true" data-resizing="false" data-hover-expanded="false"><div style="flex-direction:column;padding-block:var(--mantine-spacing-md);flex:1" class="alepha-sidebar-scroll m_8bffd616 mantine-Flex-root __m__-_R_6ldlu_"><div style="gap:calc(0.125rem * var(--mantine-scale));flex-direction:column;padding-inline:var(--mantine-spacing-md)" class="m_8bffd616 mantine-Flex-root __m__-_R_1mmldlu_"></div><div style="gap:calc(0.125rem * var(--mantine-scale));flex-direction:column;padding-inline:var(--mantine-spacing-md);flex:1" class="alepha-sidebar-scroll m_8bffd616 mantine-Flex-root __m__-_R_2mmldlu_"><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_dmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldkdmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-dashboard "><path d="M10 13a2 2 0 1 0 4 0a2 2 0 1 0 -4 0"></path><path d="M13.45 11.55l2.05 -2.05"></path><path d="M6.4 20a9 9 0 1 1 11.2 0l-11.2 0"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldkdmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldkdmmmldlu_">Dashboard</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="margin-inline:var(--mantine-spacing-sm);margin-block:var(--mantine-spacing-xs);background:var(--alepha-border);height:calc(0.0625rem * var(--mantine-scale))" class="m_8bffd616 mantine-Flex-root __m__-_R_lmmmldlu_"></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_tmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:var(--mantine-color-default);--button-hover:var(--mantine-color-default-hover);--button-color:var(--mantine-color-default-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid var(--mantine-color-default-border);padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="default" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/actions"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldktmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-api "><path d="M4 13h5"></path><path d="M12 16v-8h3a2 2 0 0 1 2 2v1a2 2 0 0 1 -2 2h-3"></path><path d="M20 8v8"></path><path d="M9 16v-5.5a2.5 2.5 0 0 0 -5 0v5.5"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldktmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldktmmmldlu_">Actions</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_15mmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/queues"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldl5mmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-stack-2 "><path d="M12 4l-8 4l8 4l8 -4l-8 -4"></path><path d="M4 12l8 4l8 -4"></path><path d="M4 16l8 4l8 -4"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldl5mmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldl5mmmldlu_">Queues</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_1dmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/topics"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldldmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-message-circle "><path d="M3 20l1.3 -3.9c-2.324 -3.437 -1.426 -7.872 2.1 -10.374c3.526 -2.501 8.59 -2.296 11.845 .48c3.255 2.777 3.695 7.266 1.029 10.501c-2.666 3.235 -7.615 4.215 -11.574 2.293l-4.7 1"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldldmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldldmmmldlu_">Topics</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_1lmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/caches"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldllmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-archive "><path d="M3 6a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2"></path><path d="M5 8v10a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-10"></path><path d="M10 12l4 0"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldllmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldllmmmldlu_">Caches</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_1tmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/db"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldltmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-database "><path d="M4 6a8 3 0 1 0 16 0a8 3 0 1 0 -16 0"></path><path d="M4 6v6a8 3 0 0 0 16 0v-6"></path><path d="M4 12v6a8 3 0 0 0 16 0v-6"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldltmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldltmmmldlu_">DB Studio</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="margin-inline:var(--mantine-spacing-sm);margin-block:var(--mantine-spacing-xs);background:var(--alepha-border);height:calc(0.0625rem * var(--mantine-scale))" class="m_8bffd616 mantine-Flex-root __m__-_R_25mmmldlu_"></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_2dmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/env"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldmdmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-variable "><path d="M5 4c-2.5 5 -2.5 10 0 16m14 -16c2.5 5 2.5 10 0 16m-10 -11h1c1 0 1 1 2.016 3.527c.984 2.473 .984 3.473 1.984 3.473h1"></path><path d="M8 16c1.5 0 3 -2 4 -3.5s2.5 -3.5 4 -3.5"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldmdmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldmdmmmldlu_">Environment</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_2lmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/atoms"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldmlmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-atom "><path d="M12 12v.01"></path><path d="M19.071 4.929c-1.562 -1.562 -6 .337 -9.9 4.243c-3.905 3.905 -5.804 8.337 -4.242 9.9c1.562 1.561 6 -.338 9.9 -4.244c3.905 -3.905 5.804 -8.337 4.242 -9.9"></path><path d="M4.929 4.929c-1.562 1.562 .337 6 4.243 9.9c3.905 3.905 8.337 5.804 9.9 4.242c1.561 -1.562 -.338 -6 -4.244 -9.9c-3.905 -3.905 -8.337 -5.804 -9.9 -4.242"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldmlmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldmlmmmldlu_">Atoms</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="margin-inline:var(--mantine-spacing-sm);margin-block:var(--mantine-spacing-xs);background:var(--alepha-border);height:calc(0.0625rem * var(--mantine-scale))" class="m_8bffd616 mantine-Flex-root __m__-_R_2tmmmldlu_"></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_35mmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/graph"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldn5mmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-topology-ring "><path d="M14 20a2 2 0 1 0 -4 0a2 2 0 0 0 4 0"></path><path d="M14 4a2 2 0 1 0 -4 0a2 2 0 0 0 4 0"></path><path d="M6 12a2 2 0 1 0 -4 0a2 2 0 0 0 4 0"></path><path d="M22 12a2 2 0 1 0 -4 0a2 2 0 0 0 4 0"></path><path d="M13.5 5.5l5 5"></path><path d="M5.5 13.5l5 5"></path><path d="M13.5 18.5l5 -5"></path><path d="M10.5 5.5l-5 5"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldn5mmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldn5mmmldlu_">Graph</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div><div style="flex-direction:column;padding-inline-start:0rem;position:relative" class="m_8bffd616 mantine-Flex-root __m__-_R_3dmmmldlu_"><a style="--button-justify:space-between;--button-height:var(--button-height-sm);--button-padding-x:var(--button-padding-x-sm);--button-fz:var(--mantine-font-size-sm);--button-radius:var(--mantine-radius-md);--button-bg:transparent;--button-hover:var(--mantine-color-gray-light-hover);--button-color:var(--mantine-color-gray-light-color);--button-bd:calc(0.0625rem * var(--mantine-scale)) solid transparent;padding-inline:var(--mantine-spacing-xs);color:var(--mantine-color-text);width:100%" class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root" data-variant="subtle" data-size="sm" data-with-left-section="true" justify="space-between" href="/devtools/logs"><span class="m_80f1301b mantine-Button-inner"><span class="m_a74036a mantine-Button-section" data-position="left"><div style="gap:var(--mantine-spacing-sm);align-items:center;width:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_lldndmmmldlu_"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tabler-icon tabler-icon-logs "><path d="M4 12h.01"></path><path d="M4 6h.01"></path><path d="M4 18h.01"></path><path d="M8 18h2"></path><path d="M8 12h2"></path><path d="M8 6h2"></path><path d="M14 6h6"></path><path d="M14 12h6"></path><path d="M14 18h6"></path></svg><div style="flex-direction:column" class="m_8bffd616 mantine-Flex-root __m__-_R_5dlldndmmmldlu_"><div class="m_8bffd616 mantine-Flex-root __m__-_R_bddlldndmmmldlu_">Logs</div></div></div></span><span class="m_811560b9 mantine-Button-label"></span></span></a></div></div><div style="gap:calc(0.125rem * var(--mantine-scale));flex-direction:column;padding-inline:var(--mantine-spacing-md)" class="m_8bffd616 mantine-Flex-root __m__-_R_3mmldlu_"></div></div><div style="cursor:col-resize;user-select:none;width:calc(0.75rem * var(--mantine-scale));position:absolute;top:0rem;bottom:0rem;right:calc(-0.375rem * var(--mantine-scale))" class="m_8bffd616 mantine-Flex-root __m__-_R_aldlu_"></div></nav><main style="flex-direction:column;padding-top:calc(3.75rem * var(--mantine-scale));padding-bottom:0rem;padding-left:calc(18.75rem * var(--mantine-scale));padding-right:0rem;display:flex;flex:1" class="m_8983817 mantine-AppShell-main alepha-sidebar-main" data-resizing="false"><div style="align-items:center;justify-content:center;height:100%" class="m_8bffd616 mantine-Flex-root __m__-_R_2ndlu_"><span style="--loader-size:var(--loader-size-sm)" class="m_b34414df m_5ae2e3c mantine-Loader-root" data-size="sm"></span></div></main></div></div>
-<script>window.__ssr={"layers":[{"part":"/","name":"root","config":{"query":{},"params":{}},"props":{}},{"name":"layout","config":{"query":{},"params":{}},"props":{}},{"part":"/actions","name":"actions","config":{"query":{},"params":{}},"props":{}}]}</script></body>
-</html>