@geenius/tools 0.1.0 → 0.3.0

package/packages/devtools/solidjs/dist/index.js

@@ -0,0 +1,1830 @@
+import { createContext, createSignal, createEffect, createMemo, useContext, onCleanup, onMount } from 'solid-js';
+import { cn } from '@geenius/ui-solid';
+import { Github, AlertCircle, CheckCircle2, ExternalLink, Lightbulb, Bug, Component, Activity, Trash2, X, Clock, Zap, AlertTriangle, Power, Target, PanelRight, RefreshCw, Minimize2, Maximize2 } from 'lucide-solid';
+import { jsx, Fragment, jsxs } from 'solid-js/jsx-runtime';
+import { metricsStore } from '@geenius/tools-logger';
+import { Show, For } from 'solid-js/web';
+
+// src/components/DevToolbar.tsx
+var DEV_MODE_STORAGE_KEY = "geenius-dev-mode-state";
+var defaultState = {
+  isDevMode: false,
+  isSidebarOpen: false,
+  isInspectorMode: false,
+  issueDialog: {
+    isOpen: false,
+    type: "bug",
+    initialDescription: ""
+  }
+};
+var DevModeContext = createContext(void 0);
+function createDevMode() {
+  const context = useContext(DevModeContext);
+  if (!context) {
+    throw new Error("createDevMode must be used within a DevModeProvider");
+  }
+  return context;
+}
+function createDevModeOptional() {
+  return useContext(DevModeContext) ?? null;
+}
+var DevModeProvider = memo(function DevModeProvider2({
+  children,
+  isAllowed
+}) {
+  const resolvedAllowed = isAllowed ?? resolveDevAllowed();
+  const [state, setState] = createSignal(() => {
+    if (!resolvedAllowed || typeof window === "undefined") return defaultState;
+    try {
+      const stored = localStorage.getItem(DEV_MODE_STORAGE_KEY);
+      if (stored) {
+        const parsed = JSON.parse(stored);
+        return {
+          isDevMode: parsed.isDevMode ?? false,
+          isSidebarOpen: false,
+          isInspectorMode: false,
+          issueDialog: defaultState.issueDialog
+        };
+      }
+    } catch {
+    }
+    return defaultState;
+  });
+  createEffect(() => {
+    if (!resolvedAllowed || typeof window === "undefined") return;
+    try {
+      localStorage.setItem(
+        DEV_MODE_STORAGE_KEY,
+        JSON.stringify({ isDevMode: state.isDevMode })
+      );
+    } catch {
+    }
+  }, [state.isDevMode, resolvedAllowed]);
+  const toggleDevMode = () => {
+    setState((prev) => ({
+      ...prev,
+      isDevMode: !prev.isDevMode,
+      isSidebarOpen: prev.isDevMode ? false : prev.isSidebarOpen,
+      isInspectorMode: prev.isDevMode ? false : prev.isInspectorMode
+    }));
+  };
+  const toggleSidebar = () => {
+    setState((prev) => ({ ...prev, isSidebarOpen: !prev.isSidebarOpen }));
+  };
+  const toggleInspector = () => {
+    setState((prev) => ({
+      ...prev,
+      isInspectorMode: !prev.isInspectorMode
+    }));
+  };
+  const setDevMode = (enabled) => {
+    setState((prev) => ({
+      ...prev,
+      isDevMode: enabled,
+      isSidebarOpen: enabled ? prev.isSidebarOpen : false,
+      isInspectorMode: enabled ? prev.isInspectorMode : false
+    }));
+  };
+  const setSidebarOpen = (open) => {
+    setState((prev) => ({ ...prev, isSidebarOpen: open }));
+  };
+  const setInspectorMode = (enabled) => {
+    setState((prev) => ({ ...prev, isInspectorMode: enabled }));
+  };
+  const openIssueDialog = (type, description, componentDetails) => {
+    setState((prev) => ({
+      ...prev,
+      issueDialog: {
+        isOpen: true,
+        type,
+        initialDescription: description,
+        componentDetails
+      }
+    }));
+  };
+  const closeIssueDialog = () => {
+    setState((prev) => ({
+      ...prev,
+      issueDialog: { ...prev.issueDialog, isOpen: false }
+    }));
+  };
+  if (!resolvedAllowed) {
+    return /* @__PURE__ */ jsx(Fragment, { children });
+  }
+  return /* @__PURE__ */ jsx(
+    DevModeContext.Provider,
+    {
+      value: {
+        ...state,
+        toggleDevMode,
+        toggleSidebar,
+        toggleInspector,
+        setDevMode,
+        setSidebarOpen,
+        setInspectorMode,
+        openIssueDialog,
+        closeIssueDialog
+      },
+      children
+    }
+  );
+});
+function createIsDevToolsVisible() {
+  const context = createDevModeOptional();
+  if (!context) return false;
+  return context.isDevMode;
+}
+function createIsDevAllowed(isAllowed) {
+  return isAllowed ?? resolveDevAllowed();
+}
+function resolveDevAllowed() {
+  try {
+    if (import.meta?.env?.VITE_CONVEX_IS_DEV === "true") return true;
+    if (import.meta?.env?.DEV) return true;
+  } catch {
+  }
+  return false;
+}
+var MAX_METRICS = 100;
+var PerformanceContext = createContext(
+  void 0
+);
+function createPerformanceContext() {
+  const context = useContext(PerformanceContext);
+  if (!context) {
+    throw new Error(
+      "createPerformanceContext must be used within PerformanceProvider"
+    );
+  }
+  return context;
+}
+function createPerformanceContextOptional() {
+  return useContext(PerformanceContext) ?? null;
+}
+var PerformanceProvider = memo(function PerformanceProvider2({
+  children
+}) {
+  const [isPerformancePanelOpen, setIsPerformancePanelOpen] = createSignal(false);
+  const [metrics, setMetrics] = createSignal([]);
+  const [filters, setFilters] = createSignal({
+    network: true,
+    query: true,
+    mutation: true,
+    render: true,
+    route: true
+  });
+  createEffect(() => {
+    const unsubscribe = metricsStore.subscribe((newMetrics) => {
+      setMetrics((prev) => {
+        const combined = [...prev, ...newMetrics];
+        if (combined.length > MAX_METRICS) {
+          return combined.slice(-MAX_METRICS);
+        }
+        return combined;
+      });
+    });
+    return () => unsubscribe();
+  });
+  const stats = () => {
+    const filtered = metrics.filter((m) => m.duration !== void 0);
+    const total = filtered.length;
+    if (total === 0) {
+      return {
+        totalRequests: 0,
+        avgDuration: 0,
+        slowRequests: 0,
+        fastRequests: 0
+      };
+    }
+    const durations = filtered.map((m) => m.duration);
+    const avg = durations.reduce((a, b) => a + b, 0) / total;
+    const slow = durations.filter((d) => d > 100).length;
+    const fast = durations.filter((d) => d < 50).length;
+    return {
+      totalRequests: total,
+      avgDuration: Math.round(avg * 100) / 100,
+      slowRequests: slow,
+      fastRequests: fast
+    };
+  };
+  const togglePerformancePanel = () => {
+    setIsPerformancePanelOpen((prev) => !prev);
+  };
+  const clearMetrics = () => {
+    setMetrics([]);
+    metricsStore.clear();
+  };
+  const toggleFilter = (filter) => {
+    setFilters((prev) => ({
+      ...prev,
+      [filter]: !prev[filter]
+    }));
+  };
+  return /* @__PURE__ */ jsx(
+    PerformanceContext.Provider,
+    {
+      value: {
+        isPerformancePanelOpen,
+        metrics,
+        filters,
+        stats: stats(),
+        togglePerformancePanel,
+        clearMetrics,
+        toggleFilter
+      },
+      children
+    }
+  );
+});
+
+// src/services/github-service.ts
+var _config = null;
+function configureGitHub(config) {
+  _config = config;
+}
+function getGitHubConfig() {
+  if (_config) return _config;
+  let owner = "";
+  let repo = "";
+  let branch = "main";
+  let token = "";
+  try {
+    owner = import.meta?.env?.VITE_GITHUB_OWNER ?? "";
+    repo = import.meta?.env?.VITE_GITHUB_REPO ?? "";
+    branch = import.meta?.env?.VITE_GITHUB_BRANCH ?? "main";
+    token = import.meta?.env?.VITE_GITHUB_TOKEN ?? "";
+  } catch {
+  }
+  return { owner, repo, branch, token };
+}
+function isGitHubConfigured() {
+  const { owner, repo, token } = getGitHubConfig();
+  const isPlaceholder = !token || token === "ghp_your_personal_access_token_here";
+  return Boolean(owner && repo && token && !isPlaceholder);
+}
+async function createGitHubIssue(issue) {
+  const { owner, repo, token } = getGitHubConfig();
+  if (!owner || !repo || !token) {
+    throw new Error(
+      "GitHub configuration is incomplete. Call configureGitHub() or set VITE_GITHUB_* env vars."
+    );
+  }
+  const response = await fetch(
+    `https://api.github.com/repos/${owner}/${repo}/issues`,
+    {
+      method: "POST",
+      headers: {
+        Accept: "application/vnd.github+json",
+        Authorization: `Bearer ${token}`,
+        "X-GitHub-Api-Version": "2022-11-28",
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({
+        title: issue.title,
+        body: issue.body,
+        labels: issue.labels || []
+      })
+    }
+  );
+  if (!response.ok) {
+    const error = await response.json().catch(() => ({ message: "Unknown error" }));
+    throw new Error(
+      `Failed to create issue: ${error.message || response.statusText}`
+    );
+  }
+  return response.json();
+}
+async function getRepositoryLabels() {
+  const { owner, repo, token } = getGitHubConfig();
+  if (!owner || !repo || !token) return [];
+  try {
+    const response = await fetch(
+      `https://api.github.com/repos/${owner}/${repo}/labels`,
+      {
+        headers: {
+          Accept: "application/vnd.github+json",
+          Authorization: `Bearer ${token}`,
+          "X-GitHub-Api-Version": "2022-11-28"
+        }
+      }
+    );
+    if (!response.ok) return [];
+    return response.json();
+  } catch {
+    return [];
+  }
+}
+async function getGitHubIssues(filter = "all", state = "open") {
+  const { owner, repo, token } = getGitHubConfig();
+  if (!owner || !repo || !token) return [];
+  try {
+    const params = new URLSearchParams({
+      state,
+      per_page: "50",
+      sort: "updated",
+      direction: "desc"
+    });
+    if (filter !== "all") {
+      params.set("labels", filter);
+    }
+    const response = await fetch(
+      `https://api.github.com/repos/${owner}/${repo}/issues?${params.toString()}`,
+      {
+        headers: {
+          Accept: "application/vnd.github+json",
+          Authorization: `Bearer ${token}`,
+          "X-GitHub-Api-Version": "2022-11-28"
+        }
+      }
+    );
+    if (!response.ok) return [];
+    const issues = await response.json();
+    return issues.filter((issue) => !("pull_request" in issue));
+  } catch {
+    return [];
+  }
+}
+function generateContextInfo() {
+  const lines = [
+    "---",
+    "### Context",
+    "",
+    `**Page URL:** ${window.location.href}`,
+    `**Timestamp:** ${(/* @__PURE__ */ new Date()).toISOString()}`,
+    `**User Agent:** ${navigator.userAgent}`,
+    `**Branch:** ${getGitHubConfig().branch ?? "main"}`
+  ];
+  if (typeof window !== "undefined") {
+    lines.push(`**Screen:** ${window.innerWidth}x${window.innerHeight}`);
+  }
+  return lines.join("\n");
+}
+function getIssueType(issue) {
+  const labelNames = issue.labels.map((l) => l.name.toLowerCase());
+  if (labelNames.includes("bug")) return "bug";
+  if (labelNames.includes("enhancement") || labelNames.includes("feature"))
+    return "feature";
+  return "other";
+}
+function formatRelativeTime(dateString) {
+  const date = new Date(dateString);
+  const now = /* @__PURE__ */ new Date();
+  const diffMs = now.getTime() - date.getTime();
+  const diffMins = Math.floor(diffMs / 6e4);
+  const diffHours = Math.floor(diffMs / 36e5);
+  const diffDays = Math.floor(diffMs / 864e5);
+  if (diffMins < 1) return "just now";
+  if (diffMins < 60) return `${diffMins}m ago`;
+  if (diffHours < 24) return `${diffHours}h ago`;
+  if (diffDays < 7) return `${diffDays}d ago`;
+  return date.toLocaleDateString();
+}
+
+// src/hooks/createGitHubLabels.ts
+function createGitHubLabels() {
+  const [data, setData] = createSignal(void 0);
+  const [isLoading, setIsLoading] = createSignal(false);
+  const [error, setError] = createSignal(null);
+  const isConfigured = isGitHubConfigured();
+  createEffect(() => {
+    if (!isConfigured) return;
+    let cancelled = false;
+    setIsLoading(true);
+    getRepositoryLabels().then((labels) => {
+      if (!cancelled) {
+        setData(labels);
+        setIsLoading(false);
+      }
+    }).catch((err) => {
+      if (!cancelled) {
+        setError(err);
+        setIsLoading(false);
+      }
+    });
+    return () => {
+      cancelled = true;
+    };
+  });
+  return { data, isLoading, error, isConfigured };
+}
+var initialFormState = {
+  type: "feature",
+  title: "",
+  description: "",
+  selectedLabel: ""
+};
+var GitHubIssueDialog = memo(function GitHubIssueDialog2({
+  open,
+  onOpenChange,
+  initialType = "feature",
+  initialDescription = "",
+  componentDetails
+}) {
+  const [form, setForm] = createSignal({
+    ...initialFormState,
+    type: initialType,
+    description: initialDescription
+  });
+  const [loading, setLoading] = createSignal(false);
+  const [success, setSuccess] = createSignal(null);
+  const [error, setError] = createSignal(null);
+  const { data: labels } = createGitHubLabels();
+  const configured = isGitHubConfigured();
+  let dialogRef;
+  createEffect(() => {
+    if (open) {
+      setForm({
+        ...initialFormState,
+        type: initialType,
+        description: initialDescription
+      });
+      setError(null);
+      setSuccess(null);
+    }
+  });
+  createEffect(() => {
+    if (!open) return;
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") onOpenChange(false);
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  });
+  const handleSubmit = async () => {
+    if (!form.title.trim()) {
+      setError("Please provide a title for the issue.");
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      const typePrefix = form.type === "bug" ? "\u{1F41B} Bug Report" : "\u2728 Feature Request";
+      let componentSection = "";
+      if (componentDetails && componentDetails.length > 0) {
+        componentSection = `
+### Components
+${componentDetails.map((detail, index) => {
+          let propsBlock = "";
+          if (detail.props) {
+            try {
+              propsBlock = `
+- **Props:**
+\`\`\`json
+${JSON.stringify(detail.props, null, 2)}
+\`\`\``;
+            } catch {
+              propsBlock = "\n- **Props:** (Complex Object)";
+            }
+          }
+          return `
+**Component ${index + 1}**
+- **Name:** \`${detail.name}\`
+${detail.key ? `- **Key:** \`${detail.key}\`` : ""}
+${detail.file ? `- **File:** \`${detail.file}\`` : ""}
+- **Selector:** \`${detail.selector}\`${propsBlock}
+`;
+        }).join("\n")}`;
+      }
+      const descriptionSection = form.description ? `## Description
+${form.description}` : "";
+      const timestamp = (/* @__PURE__ */ new Date()).toISOString();
+      const theme = typeof document !== "undefined" && document.documentElement.classList.contains("dark") ? "dark" : "light";
+      const viewport = typeof window !== "undefined" ? `${window.innerWidth}x${window.innerHeight}` : "unknown";
+      const userAgent = typeof navigator !== "undefined" ? navigator.userAgent : "unknown";
+      const url = typeof window !== "undefined" ? window.location.href : "unknown";
+      const contextSection = `
+-----
+**Context Information**
+- **URL:** ${url}
+- **Time:** ${timestamp}
+- **Theme:** ${theme}
+- **Viewport:** ${viewport}
+- **User Agent:** ${userAgent}
+`.trim();
+      const body = [
+        `# ${typePrefix}`,
+        "",
+        descriptionSection,
+        componentSection,
+        "",
+        contextSection
+      ].filter(Boolean).join("\n");
+      const issueLabels = [];
+      if (form.type === "bug") issueLabels.push("bug");
+      if (form.type === "feature") issueLabels.push("enhancement");
+      if (form.selectedLabel) issueLabels.push(form.selectedLabel);
+      const result = await createGitHubIssue({
+        title: `[${form.type === "bug" ? "Bug" : "Feature"}] ${form.title}`,
+        body,
+        labels: issueLabels
+      });
+      setSuccess(result);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "An error occurred");
+    } finally {
+      setLoading(false);
+    }
+  };
+  const handleFieldChange = (field, value) => {
+    setForm((prev) => ({ ...prev, [field]: value }));
+    setError(null);
+  };
+  if (!open) return null;
+  return /* @__PURE__ */ jsxs("div", { class: "fixed inset-0 z-[10000] flex items-center justify-center", "data-dev-tool": "true", children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        class: "absolute inset-0 bg-black/60 backdrop-blur-sm",
+        onClick: () => onOpenChange(false)
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: dialogRef,
+        class: cn(
+          "relative z-10 w-full max-w-[500px] mx-4",
+          "bg-gradient-to-br from-slate-900 to-slate-800",
+          "border border-white/10 rounded-2xl shadow-2xl",
+          "max-h-[90vh] overflow-y-auto",
+          "animate-in fade-in zoom-in-95 duration-200"
+        ),
+        children: [
+          /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-2 px-6 py-4 border-b border-white/10", children: [
+            /* @__PURE__ */ jsx(Github, { class: "h-5 w-5 text-primary" }),
+            /* @__PURE__ */ jsx("h2", { class: "text-lg font-bold text-white", children: "Create GitHub Issue" })
+          ] }),
+          /* @__PURE__ */ jsx("div", { class: "px-6 py-4", children: !configured ? /* @__PURE__ */ jsx("div", { class: "py-6", children: /* @__PURE__ */ jsxs("div", { class: "text-center space-y-3", children: [
+            /* @__PURE__ */ jsx("div", { class: "mx-auto w-12 h-12 rounded-full bg-yellow-500/10 flex items-center justify-center", children: /* @__PURE__ */ jsx(AlertCircle, { class: "h-6 w-6 text-yellow-500" }) }),
+            /* @__PURE__ */ jsxs("p", { class: "text-sm text-white/60", children: [
+              "GitHub integration is not configured. Call",
+              " ",
+              /* @__PURE__ */ jsx("code", { class: "text-xs bg-white/10 px-1.5 py-0.5 rounded", children: "configureGitHub()" }),
+              " ",
+              "or set VITE_GITHUB_TOKEN to enable issue creation."
+            ] })
+          ] }) }) : success ? /* @__PURE__ */ jsx("div", { class: "py-6", children: /* @__PURE__ */ jsxs("div", { class: "text-center space-y-4", children: [
+            /* @__PURE__ */ jsx(CheckCircle2, { class: "mx-auto h-12 w-12 text-green-500" }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("p", { class: "font-medium text-white", children: "Issue Created!" }),
+              /* @__PURE__ */ jsx("p", { class: "text-sm text-white/60 mt-1", children: success.title })
+            ] }),
+            /* @__PURE__ */ jsxs(
+              "a",
+              {
+                href: success.html_url,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                class: "inline-flex items-center gap-2 px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary/80 transition-colors",
+                children: [
+                  /* @__PURE__ */ jsx(ExternalLink, { class: "h-4 w-4" }),
+                  "View on GitHub"
+                ]
+              }
+            )
+          ] }) }) : /* @__PURE__ */ jsxs("div", { class: "space-y-4 py-2", children: [
+            /* @__PURE__ */ jsxs("div", { class: "grid grid-cols-2 gap-2", children: [
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => handleFieldChange("type", "feature"),
+                  class: cn(
+                    "flex items-center gap-2 p-3 rounded-lg border-2 transition-all",
+                    form.type === "feature" ? "border-emerald-500 bg-emerald-500/10 text-emerald-400" : "border-white/10 text-white/60 hover:border-white/20"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(Lightbulb, { class: "h-4 w-4" }),
+                    /* @__PURE__ */ jsx("span", { class: "font-medium text-sm", children: "Feature" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => handleFieldChange("type", "bug"),
+                  class: cn(
+                    "flex items-center gap-2 p-3 rounded-lg border-2 transition-all",
+                    form.type === "bug" ? "border-red-500 bg-red-500/10 text-red-400" : "border-white/10 text-white/60 hover:border-white/20"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(Bug, { class: "h-4 w-4" }),
+                    /* @__PURE__ */ jsx("span", { class: "font-medium text-sm", children: "Bug Report" })
+                  ]
+                }
+              )
+            ] }),
+            componentDetails && componentDetails.length > 0 && /* @__PURE__ */ jsxs("div", { class: "p-3 rounded-lg bg-white/5 border border-white/10", children: [
+              /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-1.5 text-xs text-white/50 mb-2", children: [
+                /* @__PURE__ */ jsx(Component, { class: "h-3 w-3" }),
+                /* @__PURE__ */ jsxs("span", { children: [
+                  componentDetails.length,
+                  " component",
+                  componentDetails.length > 1 ? "s" : "",
+                  " attached"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx("div", { class: "space-y-1", children: componentDetails.map((c, i) => /* @__PURE__ */ jsxs("div", { class: "text-xs font-mono text-white/80", children: [
+                c.name,
+                c.key && /* @__PURE__ */ jsxs("span", { class: "text-white/40 ml-1", children: [
+                  "key=",
+                  c.key
+                ] })
+              ] }, i)) })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("label", { class: "block text-xs font-medium text-white/60 mb-1", children: "Title" }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "text",
+                  value: form.title,
+                  onChange: (e) => handleFieldChange("title", e.target.value),
+                  placeholder: form.type === "bug" ? "Describe the bug..." : "Feature idea...",
+                  class: "w-full px-3 py-2 bg-white/5 border border-white/10 rounded-lg text-sm text-white placeholder:text-white/30 focus:outline-none focus:ring-2 focus:ring-primary/50",
+                  autoFocus: true
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("label", { class: "block text-xs font-medium text-white/60 mb-1", children: "Description" }),
+              /* @__PURE__ */ jsx(
+                "textarea",
+                {
+                  value: form.description,
+                  onChange: (e) => handleFieldChange("description", e.target.value),
+                  placeholder: "Provide more details...",
+                  rows: 4,
+                  class: "w-full px-3 py-2 bg-white/5 border border-white/10 rounded-lg text-sm text-white placeholder:text-white/30 focus:outline-none focus:ring-2 focus:ring-primary/50 resize-none"
+                }
+              )
+            ] }),
+            labels && labels.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("label", { class: "block text-xs font-medium text-white/60 mb-1", children: "Label" }),
+              /* @__PURE__ */ jsxs(
+                "select",
+                {
+                  value: form.selectedLabel,
+                  onChange: (e) => handleFieldChange("selectedLabel", e.target.value),
+                  class: "w-full px-3 py-2 bg-white/5 border border-white/10 rounded-lg text-sm text-white focus:outline-none focus:ring-2 focus:ring-primary/50",
+                  children: [
+                    /* @__PURE__ */ jsx("option", { value: "", children: "No label" }),
+                    labels.map((label) => /* @__PURE__ */ jsx("option", { value: label.name, children: label.name }, label.id))
+                  ]
+                }
+              )
+            ] }),
+            error && /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-2 p-3 bg-red-500/10 border border-red-500/20 rounded-lg", children: [
+              /* @__PURE__ */ jsx(AlertCircle, { class: "h-4 w-4 text-red-400 flex-shrink-0" }),
+              /* @__PURE__ */ jsx("p", { class: "text-xs text-red-300", children: error })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { class: "flex justify-end gap-2 pt-2", children: [
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: () => onOpenChange(false),
+                  class: "px-4 py-2 text-sm text-white/60 hover:text-white transition-colors",
+                  children: "Cancel"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: handleSubmit,
+                  disabled: loading || !form.title.trim(),
+                  class: cn(
+                    "px-4 py-2 text-sm font-medium rounded-lg transition-all",
+                    loading || !form.title.trim() ? "bg-white/10 text-white/30 cursor-not-allowed" : "bg-primary text-white hover:bg-primary/80"
+                  ),
+                  children: loading ? "Creating..." : "Create Issue"
+                }
+              )
+            ] })
+          ] }) })
+        ]
+      }
+    )
+  ] });
+});
+function getDurationColor(duration) {
+  if (duration === void 0) return "text-white/40";
+  if (duration > 100) return "text-red-400";
+  if (duration > 50) return "text-yellow-400";
+  return "text-green-400";
+}
+function getDurationBgColor(duration) {
+  if (duration === void 0) return "bg-white/20";
+  if (duration > 100) return "bg-red-500";
+  if (duration > 50) return "bg-yellow-500";
+  return "bg-green-500";
+}
+function getTypeColor(type) {
+  switch (type) {
+    case "network":
+      return "text-blue-400";
+    case "query":
+      return "text-orange-400";
+    case "mutation":
+      return "text-red-400";
+    case "render":
+      return "text-purple-400";
+    case "route":
+      return "text-green-400";
+    case "component":
+      return "text-cyan-400";
+    case "effect":
+      return "text-teal-400";
+    default:
+      return "text-white/60";
+  }
+}
+function getTypeIcon(type) {
+  switch (type) {
+    case "network":
+      return "\u{1F310}";
+    case "query":
+      return "\u{1F50D}";
+    case "mutation":
+      return "\u270F\uFE0F";
+    case "render":
+      return "\u{1F3A8}";
+    case "route":
+      return "\u{1F9ED}";
+    case "component":
+      return "\u{1F4E6}";
+    case "effect":
+      return "\u26A1";
+    default:
+      return "\u{1F4DD}";
+  }
+}
+var MiniBar = memo(function MiniBar2({
+  height,
+  color,
+  label
+}) {
+  return /* @__PURE__ */ jsx("div", { class: "flex flex-col items-center gap-0.5 flex-1 min-w-0", children: /* @__PURE__ */ jsx("div", { class: "w-full h-12 flex items-end", children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      class: cn("w-full rounded-t-sm transition-all duration-300", color),
+      style: { height: `${Math.min(height, 100)}%` },
+      title: label
+    }
+  ) }) });
+});
+var MetricRow = memo(function MetricRow2({
+  metric
+}) {
+  const duration = metric.duration;
+  const durationStr = duration ? `${duration.toFixed(1)}ms` : "pending...";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      class: cn(
+        "flex items-center gap-3 px-3 py-2 rounded-lg",
+        "bg-white/5 hover:bg-white/10 transition-colors"
+      ),
+      children: [
+        /* @__PURE__ */ jsx("span", { class: "text-sm", children: getTypeIcon(metric.type) }),
+        /* @__PURE__ */ jsx("div", { class: "flex-1 min-w-0", children: /* @__PURE__ */ jsx("div", { class: cn("text-xs font-medium truncate", getTypeColor(metric.type)), children: metric.name }) }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            class: cn(
+              "text-xs font-mono font-bold",
+              getDurationColor(duration)
+            ),
+            children: durationStr
+          }
+        )
+      ]
+    }
+  );
+});
+var StatCard = memo(function StatCard2({
+  icon: Icon,
+  label,
+  value,
+  color = "text-white"
+}) {
+  return /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-2 px-3 py-2 rounded-lg bg-white/5", children: [
+    /* @__PURE__ */ jsx(Icon, { class: cn("w-4 h-4", color) }),
+    /* @__PURE__ */ jsxs("div", { class: "flex flex-col", children: [
+      /* @__PURE__ */ jsx("span", { class: "text-[10px] text-white/50 uppercase", children: label }),
+      /* @__PURE__ */ jsx("span", { class: "text-sm font-bold text-white", children: value })
+    ] })
+  ] });
+});
+var FilterToggle = memo(function FilterToggle2({
+  label,
+  active,
+  color,
+  onClick
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      onClick,
+      class: cn(
+        "px-2 py-1 rounded text-xs font-medium transition-all",
+        active ? `${color} text-white` : "bg-white/10 text-white/50 hover:bg-white/20"
+      ),
+      children: label
+    }
+  );
+});
+var PerformancePanel = memo(function PerformancePanel2() {
+  const {
+    isPerformancePanelOpen,
+    metrics,
+    filters,
+    stats,
+    togglePerformancePanel,
+    clearMetrics,
+    toggleFilter
+  } = createPerformanceContext();
+  let listRef;
+  const filteredMetrics = createMemo(() => {
+    return metrics.filter((m) => {
+      if (m.type === "network" && !filters.network) return false;
+      if (m.type === "query" && !filters.query) return false;
+      if (m.type === "mutation" && !filters.mutation) return false;
+      if (m.type === "render" && !filters.render) return false;
+      if (m.type === "route" && !filters.route) return false;
+      return true;
+    });
+  });
+  const chartMetrics = createMemo(() => {
+    return filteredMetrics.filter((m) => m.duration !== void 0).slice(-20);
+  });
+  const maxDuration = createMemo(() => {
+    if (chartMetrics.length === 0) return 100;
+    const max = Math.max(...chartMetrics.map((m) => m.duration || 0));
+    return Math.max(max, 100);
+  });
+  createEffect(() => {
+  }, [filteredMetrics.length]);
+  if (!isPerformancePanelOpen) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-dev-tool": "true",
+      class: cn(
+        "fixed bottom-20 left-1/2 -translate-x-1/2 z-50",
+        "w-[440px] max-h-[400px]",
+        "rounded-2xl border border-white/10",
+        "bg-gradient-to-b from-slate-900/95 via-slate-800/95 to-slate-900/95",
+        "backdrop-blur-xl shadow-2xl shadow-black/50",
+        "flex flex-col overflow-hidden",
+        "animate-in slide-in-from-bottom-4 fade-in duration-300"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { class: "flex items-center justify-between px-4 py-3 border-b border-white/10", children: [
+          /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(Activity, { class: "w-4 h-4 text-primary" }),
+            /* @__PURE__ */ jsx("span", { class: "text-sm font-bold text-white", children: "Performance" }),
+            /* @__PURE__ */ jsxs("span", { class: "text-xs text-white/40", children: [
+              "(",
+              filteredMetrics.length,
+              " events)"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: clearMetrics,
+                class: "p-1.5 text-white/40 hover:text-white hover:bg-white/10 rounded-lg transition-colors",
+                title: "Clear metrics",
+                children: /* @__PURE__ */ jsx(Trash2, { class: "w-3.5 h-3.5" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: togglePerformancePanel,
+                class: "p-1.5 text-white/40 hover:text-white hover:bg-white/10 rounded-lg transition-colors",
+                title: "Close panel",
+                children: /* @__PURE__ */ jsx(X, { class: "w-4 h-4" })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { class: "flex gap-2 px-4 py-3 border-b border-white/10 overflow-x-auto", children: [
+          /* @__PURE__ */ jsx(
+            StatCard,
+            {
+              icon: Activity,
+              label: "Requests",
+              value: stats.totalRequests,
+              color: "text-blue-400"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            StatCard,
+            {
+              icon: Clock,
+              label: "Avg",
+              value: `${stats.avgDuration}ms`,
+              color: stats.avgDuration > 100 ? "text-red-400" : stats.avgDuration > 50 ? "text-yellow-400" : "text-green-400"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            StatCard,
+            {
+              icon: Zap,
+              label: "Fast",
+              value: stats.fastRequests,
+              color: "text-green-400"
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            StatCard,
+            {
+              icon: AlertTriangle,
+              label: "Slow",
+              value: stats.slowRequests,
+              color: stats.slowRequests > 0 ? "text-red-400" : "text-white/50"
+            }
+          )
+        ] }),
+        chartMetrics.length > 0 && /* @__PURE__ */ jsxs("div", { class: "px-4 py-3 border-b border-white/10", children: [
+          /* @__PURE__ */ jsx("div", { class: "flex items-end gap-1 h-16", children: chartMetrics.map((metric) => /* @__PURE__ */ jsx(
+            MiniBar,
+            {
+              height: (metric.duration || 0) / maxDuration * 100,
+              color: getDurationBgColor(metric.duration),
+              label: `${metric.name}: ${metric.duration?.toFixed(1)}ms`
+            },
+            metric.id
+          )) }),
+          /* @__PURE__ */ jsxs("div", { class: "flex justify-between mt-1 text-xs text-white/40", children: [
+            /* @__PURE__ */ jsx("span", { children: "Recent requests" }),
+            /* @__PURE__ */ jsxs("span", { children: [
+              "0-",
+              maxDuration.toFixed(0),
+              "ms"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { class: "flex gap-1 px-4 py-2 border-b border-white/10", children: [
+          /* @__PURE__ */ jsx(FilterToggle, { label: "Network", active: filters.network, color: "bg-blue-500", onClick: () => toggleFilter("network") }),
+          /* @__PURE__ */ jsx(FilterToggle, { label: "Query", active: filters.query, color: "bg-orange-500", onClick: () => toggleFilter("query") }),
+          /* @__PURE__ */ jsx(FilterToggle, { label: "Mutation", active: filters.mutation, color: "bg-red-500", onClick: () => toggleFilter("mutation") }),
+          /* @__PURE__ */ jsx(FilterToggle, { label: "Render", active: filters.render, color: "bg-purple-500", onClick: () => toggleFilter("render") }),
+          /* @__PURE__ */ jsx(FilterToggle, { label: "Route", active: filters.route, color: "bg-green-500", onClick: () => toggleFilter("route") })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref: listRef,
+            class: "flex-1 overflow-y-auto px-3 py-2 space-y-1 min-h-[100px] max-h-[180px]",
+            children: filteredMetrics.length === 0 ? /* @__PURE__ */ jsx("div", { class: "flex items-center justify-center py-8 text-sm text-white/30", children: "No metrics recorded yet" }) : filteredMetrics.map((metric) => /* @__PURE__ */ jsx(MetricRow, { metric }, metric.id))
+          }
+        )
+      ]
+    }
+  );
+});
+var ToolbarButton = memo(function ToolbarButton2({
+  icon,
+  label,
+  onClick,
+  active = false,
+  variant = "default",
+  showLabel = true,
+  disabled = false
+}) {
+  const variantStyles = {
+    default: active ? "bg-white/20 text-white" : "text-white/70 hover:text-white hover:bg-white/10",
+    primary: active ? "bg-primary/30 text-primary-foreground" : "text-white/70 hover:text-primary hover:bg-primary/10",
+    success: "text-white/70 hover:text-emerald-400 hover:bg-emerald-500/10",
+    danger: "text-white/70 hover:text-red-400 hover:bg-red-500/10"
+  };
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    icon,
+    showLabel && /* @__PURE__ */ jsx("span", { class: "hidden sm:inline text-xs font-medium", children: label })
+  ] });
+  const className = cn(
+    "flex items-center gap-2 px-3 py-2 rounded-lg transition-all duration-200",
+    "focus:outline-none focus:ring-2 focus:ring-white/20",
+    disabled ? "opacity-40 cursor-not-allowed text-white" : variantStyles[variant]
+  );
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: disabled ? void 0 : onClick,
+      class: cn(className, !disabled && "cursor-pointer"),
+      title: label,
+      disabled,
+      children: content
+    }
+  );
+});
+var ExpandableSection = memo(function ExpandableSection2({
+  show,
+  children
+}) {
+  let contentRef;
+  const [width, setWidth] = createSignal(0);
+  createEffect(() => {
+  });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      class: "overflow-hidden transition-all duration-300 ease-out",
+      style: { width: show ? width : 0, opacity: show ? 1 : 0 },
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: contentRef,
+          class: cn(
+            "flex items-center gap-1 whitespace-nowrap",
+            "transition-transform duration-300 ease-out",
+            show ? "translate-x-0" : "-translate-x-2"
+          ),
+          children
+        }
+      )
+    }
+  );
+});
+var DevToolbar = memo(function DevToolbar2({
+  isAllowed
+} = {}) {
+  const isDevAllowed = createIsDevAllowed(isAllowed);
+  const devMode = createDevModeOptional();
+  const performanceContext = createPerformanceContextOptional();
+  const [isReady, setIsReady] = createSignal(false);
+  createEffect(() => {
+    const timer = setTimeout(() => setIsReady(true), 1e3);
+    return () => clearTimeout(timer);
+  });
+  if (!isDevAllowed || !devMode) return null;
+  const {
+    isDevMode,
+    isSidebarOpen,
+    toggleDevMode,
+    toggleSidebar,
+    openIssueDialog,
+    issueDialog,
+    closeIssueDialog
+  } = devMode;
+  const showContent = isDevMode && isReady;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-dev-tool": "true",
+        class: cn(
+          "fixed bottom-4 left-1/2 -translate-x-1/2 z-50",
+          "flex items-center px-2 py-1",
+          showContent ? "gap-2" : "gap-0",
+          "rounded-2xl border border-white/10",
+          "bg-gradient-to-r from-slate-900/95 via-slate-800/95 to-slate-900/95",
+          "backdrop-blur-xl shadow-2xl shadow-black/50",
+          "transition-all duration-300 ease-out"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              icon: /* @__PURE__ */ jsx(Power, { class: "w-4 h-4" }),
+              label: isDevMode ? "Dev Mode On" : "Dev Mode Off",
+              onClick: toggleDevMode,
+              active: isDevMode,
+              variant: isDevMode ? "primary" : "default"
+            }
+          ),
+          /* @__PURE__ */ jsxs(ExpandableSection, { show: showContent, children: [
+            /* @__PURE__ */ jsx("div", { class: "shrink-0 w-px h-6 bg-white/20 mx-1 my-2" }),
+            /* @__PURE__ */ jsx(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx(Target, { class: "w-4 h-4" }),
+                label: "Inspector",
+                onClick: devMode.toggleInspector,
+                active: devMode.isInspectorMode,
+                variant: devMode.isInspectorMode ? "primary" : "default"
+              }
+            ),
+            performanceContext && /* @__PURE__ */ jsx(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx(Activity, { class: "w-4 h-4" }),
+                label: "Perf",
+                onClick: performanceContext.togglePerformancePanel,
+                active: performanceContext.isPerformancePanelOpen,
+                variant: performanceContext.isPerformancePanelOpen ? "primary" : "default"
+              }
+            ),
+            /* @__PURE__ */ jsx("div", { class: "hidden md:block", children: /* @__PURE__ */ jsx(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx(PanelRight, { class: "w-4 h-4" }),
+                label: "Issues",
+                onClick: toggleSidebar,
+                active: isSidebarOpen
+              }
+            ) }),
+            /* @__PURE__ */ jsx(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx(Bug, { class: "w-4 h-4" }),
+                label: "Bug",
+                onClick: () => openIssueDialog("bug"),
+                variant: "danger"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              ToolbarButton,
+              {
+                icon: /* @__PURE__ */ jsx(Lightbulb, { class: "w-4 h-4" }),
+                label: "Feature",
+                onClick: () => openIssueDialog("feature"),
+                variant: "success"
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    performanceContext && /* @__PURE__ */ jsx(PerformancePanel, {}),
+    /* @__PURE__ */ jsx("div", { "data-dev-tool": "true", children: /* @__PURE__ */ jsx(
+      GitHubIssueDialog,
+      {
+        open: issueDialog.isOpen,
+        onOpenChange: (open) => !open && closeIssueDialog(),
+        initialType: issueDialog.type,
+        initialDescription: issueDialog.initialDescription,
+        componentDetails: issueDialog.componentDetails
+      }
+    ) })
+  ] });
+});
+var IssueCard = memo(function IssueCard2({
+  issue,
+  expandedView
+}) {
+  const issueType = getIssueType(issue);
+  const linkedComponent = createMemo(() => {
+    if (!issue.body) return null;
+    const match = issue.body.match(/\*\*Name:\*\*\s*`([^`]+)`/);
+    return match ? match[1] : null;
+  }, [issue.body]);
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: issue.html_url,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      class: cn(
+        "block p-3 rounded-lg border transition-all duration-200",
+        "hover:bg-white/5 hover:border-white/20",
+        "border-white/10 bg-white/[0.02]"
+      ),
+      children: /* @__PURE__ */ jsxs("div", { class: "flex items-start gap-3", children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            class: cn(
+              "flex-shrink-0 w-8 h-8 rounded-lg flex items-center justify-center",
+              issueType === "bug" && "bg-red-500/10 text-red-500",
+              issueType === "feature" && "bg-emerald-500/10 text-emerald-500",
+              issueType === "other" && "bg-blue-500/10 text-blue-500"
+            ),
+            children: issueType === "bug" ? /* @__PURE__ */ jsx(Bug, { class: "w-4 h-4" }) : /* @__PURE__ */ jsx(Lightbulb, { class: "w-4 h-4" })
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { class: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsx("p", { class: "font-medium text-sm text-white line-clamp-2", children: issue.title }),
+          linkedComponent && /* @__PURE__ */ jsx("span", { class: "inline-flex items-center gap-1 mt-1 text-[10px] px-1.5 py-0.5 bg-white/5 border border-white/10 rounded text-white/60", children: linkedComponent }),
+          /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-3 mt-2 text-xs text-white/40", children: [
+            /* @__PURE__ */ jsxs("span", { children: [
+              "#",
+              issue.number
+            ] }),
+            /* @__PURE__ */ jsxs("span", { class: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsx(Clock, { class: "w-3 h-3" }),
+              formatRelativeTime(issue.updated_at)
+            ] })
+          ] }),
+          expandedView && issue.body && /* @__PURE__ */ jsxs("div", { class: "mt-3 text-xs text-white/40 border-l-2 border-white/10 pl-2 line-clamp-6 whitespace-pre-line font-mono bg-white/[0.02] p-2 rounded-sm", children: [
+            issue.body.substring(0, 300),
+            issue.body.length > 300 ? "..." : ""
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(ExternalLink, { class: "w-4 h-4 text-white/30 flex-shrink-0" })
+      ] })
+    }
+  );
+});
+var DevSidebar = memo(function DevSidebar2() {
+  const devMode = createDevModeOptional();
+  const [issues, setIssues] = createSignal([]);
+  const [loading, setLoading] = createSignal(false);
+  const [tab, setTab] = createSignal("bugs");
+  const [isExpanded, setIsExpanded] = createSignal(false);
+  const isSidebarOpen = devMode?.isSidebarOpen ?? false;
+  const setSidebarOpen = devMode?.setSidebarOpen ?? (() => {
+  });
+  createEffect(() => {
+    if (isSidebarOpen && issues.length === 0 && !loading) {
+      fetchIssues();
+    }
+  });
+  const fetchIssues = async () => {
+    setLoading(true);
+    try {
+      const result = await getGitHubIssues("all", "open");
+      setIssues(result);
+    } catch {
+    } finally {
+      setLoading(false);
+    }
+  };
+  const handleRefresh = () => fetchIssues();
+  const toggleExpand = () => setIsExpanded((prev) => !prev);
+  const { bugs, features } = createMemo(() => {
+    const bugs2 = [];
+    const features2 = [];
+    issues.forEach((issue) => {
+      const type = getIssueType(issue);
+      if (type === "bug") bugs2.push(issue);
+      else features2.push(issue);
+    });
+    return { bugs: bugs2, features: features2 };
+  });
+  const currentIssues = tab === "bugs" ? bugs : features;
+  if (!devMode || !isSidebarOpen) return null;
+  const config = getGitHubConfig();
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-dev-tool": "true",
+      class: cn(
+        "fixed top-0 right-0 h-full z-50",
+        "flex flex-col",
+        "bg-gradient-to-b from-slate-900/98 to-slate-950/98",
+        "backdrop-blur-xl border-l border-white/10",
+        "shadow-2xl shadow-black/50",
+        "transition-all duration-300 ease-in-out",
+        isExpanded ? "w-full sm:max-w-[50vw]" : "w-full sm:max-w-md",
+        "animate-in slide-in-from-right duration-300"
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { class: "flex items-center justify-between px-4 py-3 border-b border-white/10", children: [
+          /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(Bug, { class: "w-4 h-4 text-primary" }),
+            /* @__PURE__ */ jsx("span", { class: "text-sm font-bold text-white", children: "GitHub Issues" }),
+            /* @__PURE__ */ jsxs("span", { class: "text-xs text-white/40", children: [
+              "(",
+              config.owner,
+              "/",
+              config.repo,
+              ")"
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { class: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: handleRefresh,
+                disabled: loading,
+                class: cn(
+                  "p-1.5 text-white/40 hover:text-white hover:bg-white/10 rounded-lg transition-colors",
+                  loading && "animate-spin"
+                ),
+                children: /* @__PURE__ */ jsx(RefreshCw, { class: "w-3.5 h-3.5" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: toggleExpand,
+                class: "hidden sm:block p-1.5 text-white/40 hover:text-white hover:bg-white/10 rounded-lg transition-colors",
+                children: isExpanded ? /* @__PURE__ */ jsx(Minimize2, { class: "w-3.5 h-3.5" }) : /* @__PURE__ */ jsx(Maximize2, { class: "w-3.5 h-3.5" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: () => setSidebarOpen(false),
+                class: "p-1.5 text-white/40 hover:text-white hover:bg-white/10 rounded-lg transition-colors",
+                children: /* @__PURE__ */ jsx(X, { class: "w-4 h-4" })
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { class: "flex border-b border-white/10", children: [
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setTab("bugs"),
+              class: cn(
+                "flex-1 px-4 py-2.5 text-xs font-medium transition-colors",
+                tab === "bugs" ? "text-red-400 border-b-2 border-red-500" : "text-white/40 hover:text-white/70"
+              ),
+              children: [
+                "\u{1F41B} Bugs (",
+                bugs.length,
+                ")"
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "button",
+            {
+              onClick: () => setTab("features"),
+              class: cn(
+                "flex-1 px-4 py-2.5 text-xs font-medium transition-colors",
+                tab === "features" ? "text-emerald-400 border-b-2 border-emerald-500" : "text-white/40 hover:text-white/70"
+              ),
+              children: [
+                "\u2728 Features (",
+                features.length,
+                ")"
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { class: "flex-1 overflow-y-auto p-3 space-y-2", children: loading ? /* @__PURE__ */ jsx("div", { class: "flex items-center justify-center py-12", children: /* @__PURE__ */ jsx("div", { class: "w-6 h-6 border-2 border-white/20 border-t-primary rounded-full animate-spin" }) }) : currentIssues.length === 0 ? /* @__PURE__ */ jsxs("div", { class: "text-center py-12 text-sm text-white/30", children: [
+          "No ",
+          tab === "bugs" ? "bugs" : "features",
+          " found"
+        ] }) : currentIssues.map((issue) => /* @__PURE__ */ jsx(IssueCard, { issue, expandedView: isExpanded }, issue.id)) })
+      ]
+    }
+  );
+});
+function getComponentInfo(element) {
+  let fiberNode = null;
+  const key = Object.keys(element).find((k) => k.startsWith("__reactFiber$"));
+  if (key) {
+    fiberNode = element[key];
+  }
+  if (!fiberNode) return null;
+  const elementKey = fiberNode.key !== null ? String(fiberNode.key) : void 0;
+  let node = fiberNode;
+  while (node) {
+    if (node.tag === 0 || node.tag === 1) {
+      if (node.type && (node.type.displayName || node.type.name)) {
+        return {
+          name: node.type.displayName || node.type.name,
+          file: node._debugSource?.fileName,
+          key: elementKey !== void 0 ? elementKey : node.key !== null ? String(node.key) : void 0
+        };
+      }
+    }
+    node = node.return;
+  }
+  return { name: element.tagName.toLowerCase() };
+}
+function InspectorOverlay() {
+  const devMode = createDevModeOptional();
+  const [hoveredRect, setHoveredRect] = createSignal(null);
+  const [selectedComponents, setSelectedComponents] = createSignal([]);
+  const [hoveredComponent, setHoveredComponent] = createSignal(null);
+  const [cursorPos, setCursorPos] = createSignal({ x: 0, y: 0 });
+  let overlayRef;
+  const isInspectorMode = devMode?.isInspectorMode ?? false;
+  const setInspectorMode = devMode?.setInspectorMode ?? (() => {
+  });
+  const openIssueDialog = devMode?.openIssueDialog ?? (() => {
+  });
+  createEffect(() => {
+    if (!isInspectorMode) {
+      setHoveredRect(null);
+      setSelectedComponents([]);
+      return;
+    }
+    const isDevTool = (element) => {
+      if (!element) return false;
+      return !!element.closest('[data-dev-tool="true"]');
+    };
+    const handleMouseMove = (e) => {
+      setCursorPos({ x: e.clientX, y: e.clientY });
+      const elements = document.elementsFromPoint(e.clientX, e.clientY);
+      if (elements.length > 0 && isDevTool(elements[0])) {
+        setHoveredRect(null);
+        setHoveredComponent(null);
+        return;
+      }
+      let target = null;
+      for (const el of elements) {
+        if (!isDevTool(el)) {
+          target = el;
+          break;
+        }
+      }
+      if (target && target !== document.body && target !== document.documentElement) {
+        const rect = target.getBoundingClientRect();
+        setHoveredRect({
+          top: rect.top,
+          left: rect.left,
+          width: rect.width,
+          height: rect.height
+        });
+        setHoveredComponent(getComponentInfo(target));
+      } else {
+        setHoveredRect(null);
+        setHoveredComponent(null);
+      }
+    };
+    const handleClick = (e) => {
+      const elements = document.elementsFromPoint(e.clientX, e.clientY);
+      if (elements.length > 0 && isDevTool(elements[0])) return;
+      let target = null;
+      for (const el of elements) {
+        if (!isDevTool(el)) {
+          target = el;
+          break;
+        }
+      }
+      if (target) {
+        e.preventDefault();
+        e.stopPropagation();
+        const info = getComponentInfo(target);
+        const rect = target.getBoundingClientRect();
+        if (info) {
+          setSelectedComponents((prev) => {
+            const existsIndex = prev.findIndex(
+              (p) => p.info.name === info.name && p.info.key === info.key && p.info.file === info.file
+            );
+            if (existsIndex >= 0) {
+              const newSelection = [...prev];
+              newSelection.splice(existsIndex, 1);
+              return newSelection;
+            } else {
+              return [
+                ...prev,
+                {
+                  rect: {
+                    top: rect.top,
+                    left: rect.left,
+                    width: rect.width,
+                    height: rect.height
+                  },
+                  info
+                }
+              ];
+            }
+          });
+        }
+      }
+    };
+    window.addEventListener("mousemove", handleMouseMove, { capture: true });
+    window.addEventListener("click", handleClick, { capture: true });
+    return () => {
+      window.removeEventListener("mousemove", handleMouseMove, { capture: true });
+      window.removeEventListener("click", handleClick, { capture: true });
+    };
+  });
+  if (!devMode || !isInspectorMode) return null;
+  return (
+    /* Portal: */
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: overlayRef,
+        class: "fixed inset-0 z-[9999] pointer-events-none cursor-crosshair",
+        style: { background: "transparent" },
+        "data-dev-tool": "true",
+        children: [
+          /* @__PURE__ */ jsx("div", { class: "hidden md:block fixed top-0 left-0 z-[10000] p-2 text-xs font-mono text-white pointer-events-auto transition-all duration-300", children: /* @__PURE__ */ jsxs(
+            "div",
+            {
+              class: cn(
+                "group flex flex-col gap-1 min-w-[150px] p-2 rounded-lg backdrop-blur-sm transition-all duration-300",
+                "bg-blue-500/10 hover:bg-blue-950/90",
+                "border border-blue-500/30",
+                "text-black hover:text-white"
+              ),
+              children: [
+                /* @__PURE__ */ jsxs("div", { class: "flex justify-between items-center opacity-80", children: [
+                  /* @__PURE__ */ jsx("span", { class: "font-bold opacity-100 group-hover:text-white/90", children: "INSPECTOR" }),
+                  /* @__PURE__ */ jsxs("span", { class: "opacity-70 group-hover:text-white/70", children: [
+                    Math.round(cursorPos.x),
+                    ", ",
+                    Math.round(cursorPos.y)
+                  ] })
+                ] }),
+                hoveredComponent && /* @__PURE__ */ jsx("div", { class: "font-bold drop-shadow-sm truncate text-blue-700 group-hover:text-blue-300", children: hoveredComponent.name }),
+                selectedComponents.length > 0 && /* @__PURE__ */ jsxs("div", { class: "truncate text-[10px] opacity-80 text-green-700 group-hover:text-green-300 border-t border-white/10 pt-1 mt-1", children: [
+                  selectedComponents.length,
+                  " Selected"
+                ] })
+              ]
+            }
+          ) }),
+          hoveredRect && /* @__PURE__ */ jsx(
+            "div",
+            {
+              class: "absolute border-2 border-blue-500 bg-blue-500/10 pointer-events-none transition-all duration-75 ease-out",
+              style: {
+                top: hoveredRect.top,
+                left: hoveredRect.left,
+                width: hoveredRect.width,
+                height: hoveredRect.height
+              },
+              children: /* @__PURE__ */ jsxs("div", { class: "absolute -top-6 left-0 bg-blue-500 text-white text-[10px] px-1.5 py-0.5 rounded-sm whitespace-nowrap", children: [
+                hoveredComponent?.name,
+                " (",
+                Math.round(hoveredRect.width),
+                " x",
+                " ",
+                Math.round(hoveredRect.height),
+                ")"
+              ] })
+            }
+          ),
+          selectedComponents.map((comp, i) => /* @__PURE__ */ jsx(
+            "div",
+            {
+              class: "absolute border-2 border-green-500 bg-green-500/20 pointer-events-none transition-all duration-75 ease-out",
+              style: {
+                top: comp.rect.top,
+                left: comp.rect.left,
+                width: comp.rect.width,
+                height: comp.rect.height
+              },
+              children: /* @__PURE__ */ jsx("div", { class: "absolute -top-6 left-0 bg-green-600 text-white text-[10px] px-1.5 py-0.5 rounded-sm whitespace-nowrap z-[10001]", children: comp.info.name })
+            },
+            i
+          )),
+          selectedComponents.length > 0 && (() => {
+            const lastSelected = selectedComponents[selectedComponents.length - 1];
+            return /* @__PURE__ */ jsxs(
+              "div",
+              {
+                class: "fixed z-[10002] flex items-center gap-1 p-1 bg-slate-900 border border-slate-700 rounded-md shadow-xl animate-in fade-in zoom-in-95 pointer-events-auto",
+                style: {
+                  top: Math.max(10, lastSelected.rect.top - 45),
+                  left: Math.max(10, lastSelected.rect.left)
+                },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      onClick: () => {
+                        const allDetails = selectedComponents.map((c) => ({
+                          name: c.info.name,
+                          file: c.info.file,
+                          key: c.info.key,
+                          props: c.info.props,
+                          selector: "Multi-select"
+                        }));
+                        openIssueDialog("feature", "", allDetails);
+                        setInspectorMode(false);
+                      },
+                      class: "px-2 py-1 text-xs font-medium text-white hover:bg-white/10 rounded transition-colors",
+                      children: "Feature"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { class: "w-px h-3 bg-white/20 mx-0.5" }),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      onClick: () => {
+                        const allDetails = selectedComponents.map((c) => ({
+                          name: c.info.name,
+                          file: c.info.file,
+                          key: c.info.key,
+                          props: c.info.props,
+                          selector: "Multi-select"
+                        }));
+                        openIssueDialog("bug", "", allDetails);
+                        setInspectorMode(false);
+                      },
+                      class: "px-2 py-1 text-xs font-medium text-red-400 hover:bg-red-500/10 rounded transition-colors",
+                      children: "Bug"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx("div", { class: "w-px h-3 bg-white/20 mx-0.5" }),
+                  /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      onClick: () => setSelectedComponents([]),
+                      class: "px-2 py-1 text-xs text-slate-400 hover:text-white hover:bg-white/10 rounded transition-colors",
+                      children: "Deselect all"
+                    }
+                  )
+                ]
+              }
+            );
+          })()
+        ]
+      }
+    ), document.body
+  );
+}
+function DesignPreview(props) {
+  let iframeRef;
+  const applyTheme = () => {
+    try {
+      if (iframeRef?.contentDocument) ;
+    } catch {
+    }
+  };
+  createEffect(applyTheme);
+  return /* @__PURE__ */ jsxs("div", { class: "relative w-full h-screen", children: [
+    (props.showGrid ?? false) && /* @__PURE__ */ jsx("div", { class: "absolute inset-0 pointer-events-none z-[100] flex justify-between px-4 max-w-[1400px] mx-auto w-full", children: Array.from({ length: 12 }).map((_, i) => /* @__PURE__ */ jsx("div", { class: "h-full w-[calc(100%/12)] border-x border-red-500/20 bg-red-500/5 mx-2" })) }),
+    /* @__PURE__ */ jsx(
+      "iframe",
+      {
+        ref: iframeRef,
+        src: `/designs/design-${props.designNumber}.html`,
+        class: "w-full h-full border-0",
+        title: `Design ${props.designNumber} Preview`,
+        onLoad: applyTheme
+      }
+    )
+  ] });
+}
+function DesignSwitcherDropdown(props) {
+  const [isOpen, setIsOpen] = createSignal(false);
+  let dropdownRef;
+  const getCurrentDesign = () => {
+    const match = props.currentPath.match(/\/dev\/design\/(\d+)/);
+    return match ? `Design ${match[1]}` : "Current Design";
+  };
+  createEffect(() => {
+    const handleClickOutside = (event) => {
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    onCleanup(() => document.removeEventListener("mousedown", handleClickOutside));
+  });
+  const handleDesignChange = (path) => {
+    props.onNavigate(path);
+    setIsOpen(false);
+  };
+  const designs2 = () => [
+    { label: "Current Design", path: "/" },
+    ...Array.from({ length: props.designCount ?? 21 }, (_, i) => ({
+      label: `Design ${i + 1}`,
+      path: `/dev/design/${i + 1}`
+    }))
+  ];
+  return /* @__PURE__ */ jsxs("div", { ref: dropdownRef, class: "relative", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setIsOpen(!isOpen()),
+        "aria-label": "Switch Design",
+        class: "flex items-center gap-2 px-3 py-2 rounded-lg text-foreground hover:bg-bg-muted transition-colors text-sm font-medium",
+        children: [
+          /* @__PURE__ */ jsxs("svg", { class: "w-4 h-4", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": 2, children: [
+            /* @__PURE__ */ jsx("circle", { cx: "13.5", cy: "6.5", r: "0.5" }),
+            /* @__PURE__ */ jsx("circle", { cx: "17.5", cy: "10.5", r: "0.5" }),
+            /* @__PURE__ */ jsx("circle", { cx: "8.5", cy: "7.5", r: "0.5" }),
+            /* @__PURE__ */ jsx("circle", { cx: "6.5", cy: "12", r: "0.5" }),
+            /* @__PURE__ */ jsx("path", { d: "M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z" })
+          ] }),
+          /* @__PURE__ */ jsx("span", { class: "hidden sm:inline", children: getCurrentDesign() }),
+          /* @__PURE__ */ jsx(
+            "svg",
+            {
+              class: `w-4 h-4 transition-transform duration-200 ${isOpen() ? "rotate-180" : ""}`,
+              fill: "none",
+              stroke: "currentColor",
+              viewBox: "0 0 24 24",
+              children: /* @__PURE__ */ jsx("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": 2, d: "M19 9l-7 7-7-7" })
+            }
+          )
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(Show, { when: isOpen(), children: /* @__PURE__ */ jsx("div", { class: "absolute right-0 mt-2 py-2 bg-card border border-border rounded-lg shadow-xl overflow-hidden min-w-[180px] max-h-[400px] overflow-y-auto z-50", children: /* @__PURE__ */ jsx(For, { each: designs2(), children: (design) => /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => handleDesignChange(design.path),
+        class: `w-full px-4 py-2.5 text-left text-sm transition-colors ${getCurrentDesign() === design.label ? "bg-primary/10 text-primary font-medium" : "hover:bg-bg-muted text-foreground"}`,
+        children: [
+          design.label,
+          /* @__PURE__ */ jsx(Show, { when: getCurrentDesign() === design.label, children: /* @__PURE__ */ jsx("span", { class: "ml-2 text-primary", children: "\u2713" }) })
+        ]
+      }
+    ) }) }) })
+  ] });
+}
+function PageLoadWaterfall(props) {
+  let hasLogged = false;
+  onMount(() => {
+    if (hasLogged) return;
+    hasLogged = true;
+    logWaterfall(props.ssrTiming);
+  });
+  return null;
+}
+function logWaterfall(ssrTiming) {
+  const clientStart = performance.now();
+  const run = () => {
+    const navEntry = performance.getEntriesByType("navigation")[0];
+    const fcp = performance.getEntriesByType("paint").find((e) => e.name === "first-contentful-paint");
+    console.log("\n");
+    console.log("%c\u2554\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2557", "color: #4CAF50; font-weight: bold");
+    console.log("%c\u2551        PAGE LOAD PERFORMANCE WATERFALL               \u2551", "color: #4CAF50; font-weight: bold");
+    console.log("%c\u255A\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u255D", "color: #4CAF50; font-weight: bold");
+    if (navEntry) {
+      const dns = navEntry.domainLookupEnd - navEntry.domainLookupStart;
+      const tcp = navEntry.connectEnd - navEntry.connectStart;
+      const ttfb = navEntry.responseStart - navEntry.requestStart;
+      const download = navEntry.responseEnd - navEntry.responseStart;
+      const domParsing = navEntry.domInteractive - navEntry.responseEnd;
+      const domComplete = navEntry.domComplete - navEntry.domInteractive;
+      const totalLoad = navEntry.loadEventEnd - navEntry.startTime;
+      console.log("%c\n\u2500\u2500 Network & Browser Timing \u2500\u2500", "color: #FF9800; font-weight: bold");
+      console.table({
+        "DNS Lookup": { ms: Math.round(dns), bar: "\u2588".repeat(Math.max(1, Math.round(dns / 20))) },
+        "TCP Connect": { ms: Math.round(tcp), bar: "\u2588".repeat(Math.max(1, Math.round(tcp / 20))) },
+        "TTFB (Time to First Byte)": { ms: Math.round(ttfb), bar: "\u2588".repeat(Math.max(1, Math.round(ttfb / 20))) },
+        "Response Download": { ms: Math.round(download), bar: "\u2588".repeat(Math.max(1, Math.round(download / 20))) },
+        "DOM Parsing": { ms: Math.round(domParsing), bar: "\u2588".repeat(Math.max(1, Math.round(domParsing / 20))) },
+        "DOM Complete": { ms: Math.round(domComplete), bar: "\u2588".repeat(Math.max(1, Math.round(domComplete / 20))) },
+        "Total Page Load": { ms: Math.round(totalLoad), bar: "\u2588".repeat(Math.max(1, Math.round(totalLoad / 20))) }
+      });
+      console.log(
+        `%c
+\u26A1 TTFB: ${Math.round(ttfb)}ms \u2014 This includes all SSR processing time`,
+        ttfb > 500 ? "color: #F44336; font-weight: bold; font-size: 14px" : "color: #4CAF50; font-weight: bold; font-size: 14px"
+      );
+    }
+    if (ssrTiming) {
+      console.log("%c\n\u2500\u2500 SSR beforeLoad Breakdown \u2500\u2500", "color: #2196F3; font-weight: bold");
+      const total = ssrTiming.ssrEnd - ssrTiming.ssrStart;
+      const auth = ssrTiming.getAuthEnd ? ssrTiming.getAuthEnd - ssrTiming.getAuthStart : 0;
+      const prefs = ssrTiming.userPrefsEnd ? ssrTiming.userPrefsEnd - ssrTiming.userPrefsStart : 0;
+      const trans = ssrTiming.translationsEnd ? ssrTiming.translationsEnd - ssrTiming.translationsStart : 0;
+      console.table({
+        "getAuth()": { ms: auth, bar: "\u2588".repeat(Math.max(1, Math.round(auth / 20))), note: ssrTiming.isCachedAuth ? "(cached)" : "(server call)" },
+        "User Prefs": { ms: prefs, bar: "\u2588".repeat(Math.max(1, Math.round(prefs / 20))) },
+        "loadTranslations()": { ms: trans, bar: "\u2588".repeat(Math.max(1, Math.round(trans / 20))) },
+        "Total SSR beforeLoad": { ms: total, bar: "\u2588".repeat(Math.max(1, Math.round(total / 20))) }
+      });
+    } else {
+      console.log("%c\n\u2500\u2500 SSR Timing: Not available (client-side navigation) \u2500\u2500", "color: #9E9E9E");
+    }
+    if (fcp) {
+      console.log(
+        `%c
+\u{1F3A8} First Contentful Paint: ${Math.round(fcp.startTime)}ms`,
+        fcp.startTime > 1500 ? "color: #F44336; font-weight: bold; font-size: 14px" : "color: #4CAF50; font-weight: bold; font-size: 14px"
+      );
+    }
+    console.log(
+      `%c
+\u{1F9E9} Component mounted at: ${Math.round(clientStart)}ms from page start`,
+      "color: #2c4f7c; font-weight: bold"
+    );
+    const resources = performance.getEntriesByType("resource");
+    const jsResources = resources.filter((r) => r.name.endsWith(".js") || r.name.endsWith(".mjs") || r.name.includes(".js?"));
+    const cssResources = resources.filter((r) => r.name.endsWith(".css") || r.name.includes(".css?"));
+    const fontResources = resources.filter((r) => r.name.includes("fonts.googleapis") || r.name.includes("fonts.gstatic"));
+    const imgResources = resources.filter((r) => r.initiatorType === "img");
+    const totalJsSize = jsResources.reduce((sum, r) => sum + (r.transferSize || 0), 0);
+    const slowestJs = [...jsResources].sort((a, b) => b.duration - a.duration).slice(0, 5);
+    console.log("%c\n\u2500\u2500 Resource Loading \u2500\u2500", "color: #9C27B0; font-weight: bold");
+    console.table({
+      "JS bundles": { count: jsResources.length, totalKB: Math.round(totalJsSize / 1024), slowest_ms: Math.round(slowestJs[0]?.duration ?? 0) },
+      "CSS files": { count: cssResources.length, totalKB: Math.round(cssResources.reduce((s, r) => s + (r.transferSize || 0), 0) / 1024) },
+      "Font resources": { count: fontResources.length, slowest_ms: Math.round([...fontResources].sort((a, b) => b.duration - a.duration)[0]?.duration ?? 0) },
+      "Images": { count: imgResources.length, totalKB: Math.round(imgResources.reduce((s, r) => s + (r.transferSize || 0), 0) / 1024) }
+    });
+    if (slowestJs.length > 0) {
+      console.log("%c\n\u2500\u2500 Top 5 Slowest JS Bundles \u2500\u2500", "color: #E91E63; font-weight: bold");
+      console.table(
+        Object.fromEntries(
+          slowestJs.map((r, i) => [
+            `#${i + 1}`,
+            {
+              file: r.name.split("/").pop()?.split("?")[0] ?? r.name,
+              duration_ms: Math.round(r.duration),
+              size_KB: Math.round((r.transferSize || 0) / 1024)
+            }
+          ])
+        )
+      );
+    }
+    console.log("%c\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550", "color: #4CAF50; font-weight: bold");
+  };
+  if (document.readyState === "complete") {
+    setTimeout(run, 500);
+  } else {
+    window.addEventListener("load", () => setTimeout(run, 500));
+  }
+}
+
+// src/data/designs.ts
+var designs = Array.from({ length: 21 }, (_, i) => ({
+  id: String(i + 1),
+  name: `Design ${i + 1}`,
+  path: `/dev/design/${i + 1}`
+}));
+
+export { DesignPreview, DesignSwitcherDropdown, DevModeProvider, DevSidebar, DevToolbar, GitHubIssueDialog, InspectorOverlay, PageLoadWaterfall, PerformancePanel, PerformanceProvider, configureGitHub, createDevMode, createDevModeOptional, createGitHubIssue, createGitHubLabels, createIsDevAllowed, createIsDevToolsVisible, createPerformanceContext, createPerformanceContextOptional, designs, formatRelativeTime, generateContextInfo, getGitHubConfig, getGitHubIssues, getIssueType, getRepositoryLabels, isGitHubConfigured, logWaterfall };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map