@rebasepro/studio 0.0.1-canary.09e5ec5

package/dist/JSEditor-D8nVp3Lp.js

@@ -0,0 +1,1308 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { c } from "react-compiler-runtime";
+import { useRef, useState, useMemo, useEffect, useCallback } from "react";
+import { themes, Highlight } from "prism-react-renderer";
+import { toSnakeCase } from "@rebasepro/utils";
+import { cls, Tabs, Tab, Tooltip, Typography, defaultBorderMixin, iconSize, IconButton, ResizablePanels, Button, CircularProgress, Chip, VirtualTable, Menu, MenuItem, Dialog, DialogTitle, DialogContent, TextField, DialogActions } from "@rebasepro/ui";
+import { PlusIcon, Trash2Icon, TerminalIcon, XIcon, SaveIcon, DownloadIcon, PlayIcon, PencilIcon, MoreVerticalIcon } from "lucide-react";
+import { useModeController, useRebaseContext, useRebaseClient, useApiConfig, useSnackbarController, useStudioCollectionRegistry, useStudioSideEntityController, useTranslation, ErrorView, IconForView } from "@rebasepro/core";
+import { createRebaseClient } from "@rebasepro/client";
+import Editor from "@monaco-editor/react";
+import { A as AuthSimulationSelector } from "./AuthSimulationSelector-BF4rkRGp.js";
+const REBASE_CLIENT_TYPES = `
+// ─── Rebase Client SDK Type Definitions ─────────────────────────────
+
+interface Entity<M extends Record<string, any> = any> {
+    id: string | number;
+    path: string;
+    values: M;
+}
+
+interface FindParams {
+    limit?: number;
+    offset?: number;
+    page?: number;
+    where?: Record<string, string>;
+    orderBy?: string;
+    include?: string[];
+    searchString?: string;
+}
+
+interface FindResponse<M extends Record<string, any> = any> {
+    data: Entity<M>[];
+    meta: {
+        total: number;
+        limit: number;
+        offset: number;
+        hasMore: boolean;
+    };
+}
+
+type FilterOperator = "=" | "!=" | ">" | ">=" | "<" | "<=" | "in" | "not-in" | "array-contains" | "array-contains-any" | "is" | "is_not" | "like" | "ilike";
+
+interface QueryBuilder<M extends Record<string, any> = any> {
+    where(column: keyof M & string, operator: FilterOperator, value: any): QueryBuilder<M>;
+    orderBy(column: keyof M & string, direction?: "asc" | "desc"): QueryBuilder<M>;
+    limit(count: number): QueryBuilder<M>;
+    offset(count: number): QueryBuilder<M>;
+    search(searchString: string): QueryBuilder<M>;
+    find(): Promise<FindResponse<M>>;
+    findOne(): Promise<Entity<M> | undefined>;
+    count(): Promise<number>;
+}
+
+interface CollectionClient<M extends Record<string, any> = any> {
+    find(params?: FindParams): Promise<FindResponse<M>>;
+    findById(id: string | number): Promise<Entity<M> | undefined>;
+    create(data: Partial<M>, id?: string | number): Promise<Entity<M>>;
+    update(id: string | number, data: Partial<M>): Promise<Entity<M>>;
+    delete(id: string | number): Promise<void>;
+    where(column: keyof M & string, operator: FilterOperator, value: any): QueryBuilder<M>;
+    orderBy(column: keyof M & string, direction?: "asc" | "desc"): QueryBuilder<M>;
+    limit(count: number): QueryBuilder<M>;
+    offset(count: number): QueryBuilder<M>;
+    search(searchString: string): QueryBuilder<M>;
+    listen?(params: FindParams | undefined, onUpdate: (response: FindResponse<M>) => void, onError?: (error: Error) => void): () => void;
+    listenById?(id: string | number, onUpdate: (entity: Entity<M> | undefined) => void, onError?: (error: Error) => void): () => void;
+    count?(params?: FindParams): Promise<number>;
+}
+
+interface RebaseUser {
+    uid: string;
+    email: string | null;
+    displayName: string | null;
+    photoURL: string | null;
+    emailVerified?: boolean;
+    roles?: string[];
+    providerId: string;
+    isAnonymous: boolean;
+}
+
+interface RebaseSession {
+    accessToken: string;
+    refreshToken: string;
+    expiresAt: number;
+    user: RebaseUser;
+}
+
+type AuthChangeEvent = 'SIGNED_IN' | 'SIGNED_OUT' | 'TOKEN_REFRESHED' | 'USER_UPDATED';
+
+interface RebaseAuth {
+    signInWithEmail(email: string, password: string): Promise<{ user: RebaseUser; accessToken: string; refreshToken: string }>;
+    signUp(email: string, password: string, displayName?: string): Promise<{ user: RebaseUser; accessToken: string; refreshToken: string }>;
+    signInWithGoogle(idToken: string): Promise<{ user: RebaseUser; accessToken: string; refreshToken: string }>;
+    signOut(): Promise<void>;
+    refreshSession(): Promise<RebaseSession>;
+    getUser(): Promise<RebaseUser>;
+    updateUser(updates: { displayName?: string; photoURL?: string }): Promise<RebaseUser>;
+    resetPasswordForEmail(email: string): Promise<{ success: boolean; message: string }>;
+    resetPassword(token: string, password: string): Promise<{ success: boolean; message: string }>;
+    changePassword(oldPassword: string, newPassword: string): Promise<{ success: boolean; message: string }>;
+    sendVerificationEmail(): Promise<{ success: boolean; message: string }>;
+    verifyEmail(token: string): Promise<{ success: boolean; message: string }>;
+    getSessions(): Promise<any[]>;
+    revokeSession(sessionId: string): Promise<{ success: boolean }>;
+    revokeAllSessions(): Promise<{ success: boolean }>;
+    getSession(): RebaseSession | null;
+    onAuthStateChange(callback: (event: AuthChangeEvent, session: RebaseSession | null) => void): () => void;
+}
+
+interface AdminUser {
+    uid: string;
+    email: string;
+    displayName: string | null;
+    photoURL: string | null;
+    provider: string;
+    roles: string[];
+    createdAt: string;
+    updatedAt: string;
+}
+
+interface RebaseRole {
+    id: string;
+    name: string;
+    isAdmin: boolean;
+    defaultPermissions: Record<string, any> | null;
+    config: Record<string, any> | null;
+}
+
+interface RebaseAdmin {
+    listUsers(): Promise<{ users: AdminUser[] }>;
+    getUser(userId: string): Promise<{ user: AdminUser }>;
+    createUser(data: { email: string; displayName?: string; password?: string; roles?: string[] }): Promise<{ user: AdminUser }>;
+    updateUser(userId: string, data: { email?: string; displayName?: string; password?: string; roles?: string[] }): Promise<{ user: AdminUser }>;
+    deleteUser(userId: string): Promise<{ success: boolean }>;
+    listRoles(): Promise<{ roles: RebaseRole[] }>;
+    getRole(roleId: string): Promise<{ role: RebaseRole }>;
+    createRole(data: { id: string; name: string; isAdmin?: boolean; defaultPermissions?: any; config?: any }): Promise<{ role: RebaseRole }>;
+    updateRole(roleId: string, data: { name?: string; isAdmin?: boolean; defaultPermissions?: any; config?: any }): Promise<{ role: RebaseRole }>;
+    deleteRole(roleId: string): Promise<{ success: boolean }>;
+    bootstrap(): Promise<{ success: boolean; message: string; user: { uid: string; roles: string[] } }>;
+}
+
+interface UploadFileProps {
+    file: FileIcon;
+    fileName?: string;
+    path?: string;
+    metadata?: Record<string, any>;
+    bucket?: string;
+}
+
+interface UploadFileResult {
+    path: string;
+    bucket?: string;
+    downloadUrl?: string;
+}
+
+interface DownloadConfig {
+    url: string | null;
+    fileNotFound?: boolean;
+    metadata?: any;
+}
+
+interface StorageSource {
+    putObject(props: UploadFileProps): Promise<UploadFileResult>;
+    getSignedUrl(pathOrUrl: string, bucket?: string): Promise<DownloadConfig>;
+    getObject(path: string, bucket?: string): Promise<FileIcon | null>;
+    deleteObject(path: string, bucket?: string): Promise<void>;
+    listObjects(path: string, options?: { bucket?: string; maxResults?: number; pageToken?: string }): Promise<any>;
+}
+
+type RebaseData = {
+    /** Look up a collection by slug. */
+    collection(slug: string): CollectionClient;
+} & {
+    /** Dynamic collection access — e.g. client.data.authors */
+    [collectionSlug: string]: CollectionClient;
+};
+
+/**
+ * The Rebase client instance. Use \`client.data\`, \`client.auth\`, \`client.admin\`,
+ * \`client.storage\`, and \`client.call()\` to interact with your Rebase backend.
+ *
+ * @example
+ * // Query a collection
+ * const result = await client.data.products.find({ limit: 10 });
+ *
+ * // Create a record
+ * await client.data.products.create({ name: "Camera", price: 299 });
+ *
+ * // Fluent query
+ * const expensive = await client.data.products.where("price", ">", 100).orderBy("price", "desc").limit(5).find();
+ *
+ * // Auth
+ * const session = client.auth.getSession();
+ *
+ * // Admin
+ * const { users } = await client.admin.listUsers();
+ *
+ * // Custom endpoint
+ * const result = await client.call("/my-endpoint", { myData: 123 });
+ */
+interface RebaseClient {
+    /** Data access — dynamic collection accessors */
+    data: RebaseData;
+    /** Authentication methods */
+    auth: RebaseAuth;
+    /** User/role admin methods */
+    admin: RebaseAdmin;
+    /** Storage operations */
+    storage?: StorageSource;
+    /** Call a custom server-side endpoint */
+    call<T = any>(endpoint: string, payload?: any): Promise<T>;
+    /** Direct collection access (shorthand) */
+    [collectionSlug: string]: any;
+}
+
+/** The pre-configured client instance. Already authenticated with the current user session. */
+declare const client: RebaseClient;
+
+/** Execution context with user and collection information. */
+interface JSEditorContext {
+    /** The user the script is running as. */
+    user: {
+        uid: string;
+        displayName: string | null;
+        email: string | null;
+        roles?: string[];
+    } | null;
+    /** Registered collections with their property names. */
+    collections: Array<{
+        slug: string;
+        name: string;
+        properties: string[];
+    }>;
+}
+
+/** Execution context — contains info about the selected user and registered collections. */
+declare const context: JSEditorContext;
+`;
+const JSMonacoEditor = ({
+  value,
+  onChange,
+  onRun,
+  className,
+  readOnly = false,
+  autoFocus = true,
+  collectionSlugs = [],
+  collections = []
+}) => {
+  const {
+    mode
+  } = useModeController();
+  const editorRef = useRef(null);
+  const monacoRef = useRef(null);
+  const onRunRef = useRef(onRun);
+  onRunRef.current = onRun;
+  const typesRegisteredRef = useRef(false);
+  const handleEditorOnMount = (editorInstance, monaco) => {
+    editorRef.current = editorInstance;
+    monacoRef.current = monaco;
+    editorInstance.addAction({
+      id: "run-script",
+      label: "Run Script",
+      keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.Enter],
+      contextMenuGroupId: "operation",
+      contextMenuOrder: 0,
+      run: () => {
+        if (onRunRef.current) {
+          const selection = editorInstance.getSelection();
+          let selectedText;
+          if (selection && !selection.isEmpty()) {
+            selectedText = editorInstance.getModel()?.getValueInRange(selection)?.trim();
+          }
+          onRunRef.current(selectedText || void 0);
+        }
+      }
+    });
+    if (!typesRegisteredRef.current) {
+      typesRegisteredRef.current = true;
+      const ts = monaco.languages.typescript;
+      ts.typescriptDefaults.setCompilerOptions({
+        target: ts.ScriptTarget.ESNext,
+        module: ts.ModuleKind.ESNext,
+        allowJs: true,
+        checkJs: false,
+        strict: false,
+        noEmit: true,
+        allowNonTsExtensions: true
+      });
+      ts.typescriptDefaults.setDiagnosticsOptions({
+        diagnosticCodesToIgnore: [1375, 1108]
+      });
+      ts.typescriptDefaults.addExtraLib(REBASE_CLIENT_TYPES, "ts:rebase-client.d.ts");
+      if (collections.length > 0) {
+        const lines = [];
+        for (const col of collections) {
+          const ifaceName = col.slug.replace(/[^a-zA-Z0-9_]/g, "_");
+          const propsType = col.properties.length > 0 ? `{ ${col.properties.map((p) => `${p}: any`).join("; ")} }` : "Record<string, any>";
+          lines.push(`/** Collection: ${col.name} (${col.slug}) */`);
+          lines.push(`interface ${ifaceName}_Row ${propsType}`);
+          lines.push(`declare namespace client.data { const ${col.slug}: CollectionClient<${ifaceName}_Row>; }`);
+        }
+        ts.typescriptDefaults.addExtraLib(lines.join("\n"), "ts:rebase-collections.d.ts");
+      } else if (collectionSlugs.length > 0) {
+        const collectionHints = collectionSlugs.map((slug) => `/** Collection: ${slug} */
+declare namespace client.data { const ${slug}: CollectionClient; }`).join("\n");
+        ts.typescriptDefaults.addExtraLib(collectionHints, "ts:rebase-collections.d.ts");
+      }
+    }
+    if (autoFocus) {
+      editorInstance.focus();
+    }
+  };
+  return /* @__PURE__ */ jsx("div", { className: cls("relative w-full h-full overflow-hidden", className), children: /* @__PURE__ */ jsx(Editor, { height: "100%", defaultLanguage: "typescript", path: "rebase-script.ts", value, onChange, onMount: handleEditorOnMount, theme: mode === "dark" ? "vs-dark" : "vs", options: {
+    minimap: {
+      enabled: false
+    },
+    fontSize: 14,
+    lineNumbers: "on",
+    scrollBeyondLastLine: false,
+    automaticLayout: true,
+    readOnly,
+    tabSize: 2,
+    wordWrap: "on",
+    suggestOnTriggerCharacters: true,
+    quickSuggestions: true,
+    parameterHints: {
+      enabled: true
+    }
+  } }) });
+};
+const QUICK_REFERENCE = [{
+  label: "Find all",
+  code: 'const result = await client.data.collection("COLLECTION").find({ limit: 20 });\nreturn result;',
+  description: "Fetch records with pagination"
+}, {
+  label: "Find by ID",
+  code: 'const item = await client.data.collection("COLLECTION").findById("ID");\nreturn item;',
+  description: "Fetch a single record"
+}, {
+  label: "Create",
+  code: 'const created = await client.data.collection("COLLECTION").create({\n  // your fields here\n});\nreturn created;',
+  description: "Insert a new record"
+}, {
+  label: "Update",
+  code: 'const updated = await client.data.collection("COLLECTION").update("ID", {\n  // fields to update\n});\nreturn updated;',
+  description: "Update an existing record"
+}, {
+  label: "Delete",
+  code: 'await client.data.collection("COLLECTION").delete("ID");\nreturn { success: true };',
+  description: "Delete a record"
+}, {
+  label: "Fluent query",
+  code: 'const result = await client.data.collection("COLLECTION")\n  .where("field", ">", value)\n  .orderBy("field", "desc")\n  .limit(10)\n  .find();\nreturn result;',
+  description: "Chained query builder"
+}, {
+  label: "Auth: Current session",
+  code: "const session = client.auth.getSession();\nreturn session;",
+  description: "Get current auth session"
+}, {
+  label: "Admin: List users",
+  code: "const { users } = await client.admin.listUsers();\nreturn users;",
+  description: "List all registered users"
+}, {
+  label: "Custom endpoint",
+  code: 'const result = await client.call("/my-endpoint", { key: "value" });\nreturn result;',
+  description: "Call a custom API endpoint"
+}];
+const JSEditorSidebar = ({
+  collections,
+  snippets,
+  history,
+  onSelectSnippet,
+  onDeleteSnippet,
+  onInsertCode
+}) => {
+  const [activeTab, setActiveTab] = useState("collections");
+  return /* @__PURE__ */ jsxs("div", { className: cls("flex flex-col h-full w-full bg-white dark:bg-surface-950 border-r", defaultBorderMixin), children: [
+    /* @__PURE__ */ jsxs(Tabs, { value: activeTab, onValueChange: (v) => setActiveTab(v), variant: "boxy", className: "border-b border-surface-200 dark:border-surface-950", children: [
+      /* @__PURE__ */ jsx(Tab, { value: "collections", children: /* @__PURE__ */ jsx(Tooltip, { title: "Browse collections", children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: "Collections" }) }) }),
+      /* @__PURE__ */ jsx(Tab, { value: "reference", children: /* @__PURE__ */ jsx(Tooltip, { title: "SDK quick reference", children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: "Reference" }) }) }),
+      /* @__PURE__ */ jsx(Tab, { value: "snippets", children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: "Snippets" }) }),
+      /* @__PURE__ */ jsx(Tab, { value: "history", children: /* @__PURE__ */ jsx("span", { className: "text-xs", children: "History" }) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-grow overflow-hidden relative", children: [
+      activeTab === "collections" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
+        /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark", children: "Collections" }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-y-auto p-1 space-y-1 no-scrollbar", children: collections.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark", children: "No collections found" }) }) : collections.map((col) => /* @__PURE__ */ jsx(CollectionItem, { collection: col, onInsertCode }, col.slug)) })
+      ] }),
+      activeTab === "reference" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
+        /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark", children: "SDK Reference" }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-y-auto p-2 space-y-2 no-scrollbar", children: QUICK_REFERENCE.map((ref, i) => /* @__PURE__ */ jsxs("div", { className: cls("group p-2.5 rounded-lg border hover:border-primary/40 dark:hover:border-primary/40", "bg-white dark:bg-surface-900 transition-all cursor-pointer", defaultBorderMixin), onClick: () => onInsertCode(ref.code), children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-1", children: [
+            /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-primary dark:text-text-primary-dark font-semibold text-[13px]", children: ref.label }),
+            /* @__PURE__ */ jsx("svg", { className: "w-3.5 h-3.5 text-text-disabled group-hover:text-primary transition-colors", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" }) })
+          ] }),
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark text-[10px] leading-tight", children: ref.description })
+        ] }, i)) })
+      ] }),
+      activeTab === "snippets" && (() => {
+        const favorites = snippets.filter((s) => s.isFavorite);
+        const others = snippets.filter((s_0) => !s_0.isFavorite);
+        return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
+          /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark", children: "Snippets" }) }),
+          /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-y-auto p-2 space-y-2 no-scrollbar", children: snippets.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark", children: "No saved snippets yet. Use the save button to store reusable code." }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            favorites.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-3", children: [
+              /* @__PURE__ */ jsxs(Typography, { variant: "caption", className: "text-[10px] font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark mb-2 px-1 flex items-center", children: [
+                /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 mr-1 text-amber-500", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { d: "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" }) }),
+                "Favorites"
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "space-y-2", children: favorites.map((snippet) => /* @__PURE__ */ jsx(SnippetItem, { snippet, onSelect: onSelectSnippet, onDelete: onDeleteSnippet }, snippet.id)) })
+            ] }),
+            others.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+              favorites.length > 0 && /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-[10px] font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark mb-2 px-1", children: "Others" }),
+              /* @__PURE__ */ jsx("div", { className: "space-y-2", children: others.map((snippet_0) => /* @__PURE__ */ jsx(SnippetItem, { snippet: snippet_0, onSelect: onSelectSnippet, onDelete: onDeleteSnippet }, snippet_0.id)) })
+            ] })
+          ] }) })
+        ] });
+      })(),
+      activeTab === "history" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full", children: [
+        /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-between px-3 py-2 border-b bg-surface-50 dark:bg-surface-900 min-h-[48px]", defaultBorderMixin), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold uppercase tracking-wider text-text-disabled dark:text-text-disabled-dark", children: "History" }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-y-auto p-1 space-y-1 no-scrollbar", children: history.length === 0 ? /* @__PURE__ */ jsx("div", { className: "p-4 text-center", children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled dark:text-text-disabled-dark", children: "No execution history yet" }) }) : [...history].reverse().map((code, i_0) => /* @__PURE__ */ jsxs("div", { className: "p-2 py-1.5 rounded hover:bg-surface-100 dark:hover:bg-surface-950 cursor-pointer group transition-colors flex items-start", onClick: () => onSelectSnippet(code), children: [
+          /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 mt-1 mr-2 text-text-disabled dark:text-text-disabled-dark group-hover:text-primary transition-colors flex-shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-secondary dark:text-text-secondary-dark group-hover:text-text-primary dark:group-hover:text-text-primary-dark text-[11px] line-clamp-2 leading-tight flex-grow font-mono", children: code.length > 120 ? code.substring(0, 120) + "…" : code })
+        ] }, i_0)) })
+      ] })
+    ] })
+  ] });
+};
+function CollectionItem(t0) {
+  const $ = c(28);
+  const {
+    collection,
+    onInsertCode
+  } = t0;
+  const [expanded, setExpanded] = useState(false);
+  let t1;
+  if ($[0] !== expanded) {
+    t1 = () => setExpanded(!expanded);
+    $[0] = expanded;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const t2 = expanded && "rotate-90";
+  let t3;
+  if ($[2] !== t2) {
+    t3 = cls("w-3 h-3 mr-1 transition-transform", t2);
+    $[2] = t2;
+    $[3] = t3;
+  } else {
+    t3 = $[3];
+  }
+  let t4;
+  if ($[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t4 = /* @__PURE__ */ jsx("path", { d: "M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" });
+    $[4] = t4;
+  } else {
+    t4 = $[4];
+  }
+  let t5;
+  if ($[5] !== t3) {
+    t5 = /* @__PURE__ */ jsx("svg", { className: t3, fill: "currentColor", viewBox: "0 0 20 20", children: t4 });
+    $[5] = t3;
+    $[6] = t5;
+  } else {
+    t5 = $[6];
+  }
+  let t6;
+  if ($[7] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t6 = /* @__PURE__ */ jsx("svg", { className: "w-3.5 h-3.5 mr-1 shrink-0 text-text-disabled dark:text-text-disabled-dark", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4" }) });
+    $[7] = t6;
+  } else {
+    t6 = $[7];
+  }
+  let t7;
+  if ($[8] !== collection.slug) {
+    t7 = /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-secondary dark:text-text-secondary-dark text-xs truncate flex-1 min-w-0", children: collection.slug });
+    $[8] = collection.slug;
+    $[9] = t7;
+  } else {
+    t7 = $[9];
+  }
+  let t8;
+  if ($[10] !== collection.slug || $[11] !== onInsertCode) {
+    t8 = (e) => {
+      e.stopPropagation();
+      onInsertCode(`const result = await client.data.${collection.slug}.find({ limit: 20 });
+return result;`);
+    };
+    $[10] = collection.slug;
+    $[11] = onInsertCode;
+    $[12] = t8;
+  } else {
+    t8 = $[12];
+  }
+  let t9;
+  if ($[13] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t9 = /* @__PURE__ */ jsx(PlusIcon, { size: iconSize.smallest });
+    $[13] = t9;
+  } else {
+    t9 = $[13];
+  }
+  let t10;
+  if ($[14] !== t8) {
+    t10 = /* @__PURE__ */ jsx(Tooltip, { title: "Insert find() snippet", children: /* @__PURE__ */ jsx(IconButton, { size: "smallest", className: "opacity-0 group-hover:opacity-100 text-text-disabled hover:text-primary transition-all", onClick: t8, children: t9 }) });
+    $[14] = t8;
+    $[15] = t10;
+  } else {
+    t10 = $[15];
+  }
+  let t11;
+  if ($[16] !== t1 || $[17] !== t10 || $[18] !== t5 || $[19] !== t7) {
+    t11 = /* @__PURE__ */ jsxs("div", { className: "flex items-center p-1 cursor-pointer hover:bg-surface-100 dark:hover:bg-surface-950 rounded transition-colors group relative", onClick: t1, children: [
+      t5,
+      t6,
+      t7,
+      t10
+    ] });
+    $[16] = t1;
+    $[17] = t10;
+    $[18] = t5;
+    $[19] = t7;
+    $[20] = t11;
+  } else {
+    t11 = $[20];
+  }
+  let t12;
+  if ($[21] !== collection.properties || $[22] !== expanded || $[23] !== onInsertCode) {
+    t12 = expanded && collection.properties.length > 0 && /* @__PURE__ */ jsx("div", { className: cls("ml-5 mt-1 space-y-0.5 border-l", defaultBorderMixin), children: collection.properties.map((prop) => /* @__PURE__ */ jsxs("div", { className: "flex items-center p-1 pl-2 hover:bg-surface-50 dark:hover:bg-surface-950 rounded-r cursor-pointer transition-colors group/prop relative min-h-[28px]", onClick: () => onInsertCode(`"${prop}"`), children: [
+      /* @__PURE__ */ jsx("svg", { className: "w-3 h-3 mr-1.5 text-text-disabled dark:text-text-disabled-dark shrink-0", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M9 4.5v15m6-15v15m-10.5-1.5h15c.621 0 1.125-.504 1.125-1.125V5.625c0-.621-.504-1.125-1.125-1.125h-15c-.621 0-1.125.504-1.125 1.125v12.75c0 .621.504 1.125 1.125 1.125Z" }) }),
+      /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-primary dark:text-text-primary-dark text-[11px] truncate flex-grow font-mono", children: prop })
+    ] }, prop)) });
+    $[21] = collection.properties;
+    $[22] = expanded;
+    $[23] = onInsertCode;
+    $[24] = t12;
+  } else {
+    t12 = $[24];
+  }
+  let t13;
+  if ($[25] !== t11 || $[26] !== t12) {
+    t13 = /* @__PURE__ */ jsxs("div", { children: [
+      t11,
+      t12
+    ] });
+    $[25] = t11;
+    $[26] = t12;
+    $[27] = t13;
+  } else {
+    t13 = $[27];
+  }
+  return t13;
+}
+function SnippetItem(t0) {
+  const $ = c(19);
+  const {
+    snippet,
+    onSelect,
+    onDelete
+  } = t0;
+  let t1;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t1 = cls("group p-2 rounded border hover:border-surface-400 dark:hover:border-surface-600 bg-white dark:bg-surface-900 transition-all cursor-pointer relative", defaultBorderMixin);
+    $[0] = t1;
+  } else {
+    t1 = $[0];
+  }
+  let t2;
+  if ($[1] !== onSelect || $[2] !== snippet.code) {
+    t2 = () => onSelect(snippet.code);
+    $[1] = onSelect;
+    $[2] = snippet.code;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  let t3;
+  if ($[4] !== snippet.name) {
+    t3 = /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-primary dark:text-text-primary-dark font-medium text-[13px] truncate pr-6", children: snippet.name });
+    $[4] = snippet.name;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  let t4;
+  if ($[6] !== snippet.code) {
+    t4 = /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-secondary dark:text-text-secondary-dark text-[10px] block mt-1 truncate font-mono", children: snippet.code });
+    $[6] = snippet.code;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[8] !== onDelete || $[9] !== snippet.id) {
+    t5 = (e) => {
+      e.stopPropagation();
+      onDelete(snippet.id);
+    };
+    $[8] = onDelete;
+    $[9] = snippet.id;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+  let t6;
+  if ($[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t6 = /* @__PURE__ */ jsx(Trash2Icon, { size: iconSize.smallest });
+    $[11] = t6;
+  } else {
+    t6 = $[11];
+  }
+  let t7;
+  if ($[12] !== t5) {
+    t7 = /* @__PURE__ */ jsx(IconButton, { size: "smallest", className: "absolute right-1 top-1 opacity-0 group-hover:opacity-100 text-text-disabled hover:text-red-500 transition-opacity", onClick: t5, children: t6 });
+    $[12] = t5;
+    $[13] = t7;
+  } else {
+    t7 = $[13];
+  }
+  let t8;
+  if ($[14] !== t2 || $[15] !== t3 || $[16] !== t4 || $[17] !== t7) {
+    t8 = /* @__PURE__ */ jsxs("div", { className: t1, onClick: t2, children: [
+      t3,
+      t4,
+      t7
+    ] });
+    $[14] = t2;
+    $[15] = t3;
+    $[16] = t4;
+    $[17] = t7;
+    $[18] = t8;
+  } else {
+    t8 = $[18];
+  }
+  return t8;
+}
+const STORAGE_PREFIX = "rebase_js_";
+const DEFAULT_CODE = `// Available: client (RebaseClient)
+// Press Cmd+Enter (Ctrl+Enter) to run
+//
+// Examples:
+//   const result = await client.data.collection("your_collection").find({ limit: 10 });
+//   const users = await client.admin.listUsers();
+//   const session = client.auth.getSession();
+
+const result = await client.data.collection("your_collection").find({ limit: 10 });
+return result;
+`;
+function loadFromStorage(key, fallback) {
+  try {
+    const raw = localStorage.getItem(STORAGE_PREFIX + key);
+    return raw ? JSON.parse(raw) : fallback;
+  } catch {
+    return fallback;
+  }
+}
+function saveToStorage(key, value) {
+  try {
+    localStorage.setItem(STORAGE_PREFIX + key, JSON.stringify(value));
+  } catch {
+  }
+}
+function formatJSON(value) {
+  try {
+    return JSON.stringify(value, null, 2);
+  } catch {
+    return String(value);
+  }
+}
+function detectCollectionsInResult(code, resultValue, collections) {
+  if (!resultValue || !collections?.length) return [];
+  const mentionedSlugs = /* @__PURE__ */ new Set();
+  const collectionCallRegex = /\.collection\(["']([^"']+)["']\)/g;
+  let m;
+  while ((m = collectionCallRegex.exec(code)) !== null) {
+    mentionedSlugs.add(m[1]);
+  }
+  const dotAccessRegex = /client\.data\.([a-zA-Z_][a-zA-Z0-9_]*)\./g;
+  while ((m = dotAccessRegex.exec(code)) !== null) {
+    if (!["collection", "find", "findById", "create", "update", "delete"].includes(m[1])) {
+      mentionedSlugs.add(m[1]);
+    }
+  }
+  if (mentionedSlugs.size === 0) return [];
+  let rows = [];
+  if (resultValue?.data && Array.isArray(resultValue.data)) {
+    rows = resultValue.data;
+  } else if (Array.isArray(resultValue)) {
+    rows = resultValue;
+  }
+  const hasId = rows.length > 0 && rows.some((r) => r?.id != null);
+  if (!hasId) return [];
+  const matched = [];
+  for (const slug of mentionedSlugs) {
+    const normalised = toSnakeCase(slug);
+    const col = collections.find((c2) => {
+      const tableName = c2.table || toSnakeCase(c2.slug);
+      return c2.slug === slug || tableName === normalised || toSnakeCase(c2.slug) === normalised;
+    });
+    if (col) {
+      matched.push({
+        collectionSlug: col.slug,
+        collection: col,
+        pkColumn: "id"
+      });
+    }
+  }
+  return matched;
+}
+function JSEditor() {
+  const rebaseContext = useRebaseContext();
+  const rebaseClient = useRebaseClient();
+  const apiConfig = useApiConfig();
+  const snackbar = useSnackbarController();
+  const collectionRegistry = useStudioCollectionRegistry();
+  const sideEntityController = useStudioSideEntityController();
+  const {
+    t
+  } = useTranslation();
+  const userManagement = rebaseContext.userManagement;
+  const currentUser = rebaseContext.authController?.user;
+  const [tabs, setTabs] = useState(() => loadFromStorage("tabs", [{
+    id: "1",
+    name: "Script 1",
+    code: DEFAULT_CODE
+  }]));
+  const [activeTabId, setActiveTabId] = useState(() => loadFromStorage("activeTab", "1"));
+  const [result, setResult] = useState(null);
+  const [isRunning, setIsRunning] = useState(false);
+  const [snippets, setSnippets] = useState(() => loadFromStorage("snippets", []));
+  const [history, setHistory] = useState(() => loadFromStorage("history", []));
+  const [showSaveDialog, setShowSaveDialog] = useState(false);
+  const [snippetName, setSnippetName] = useState("");
+  const [resultView, setResultView] = useState("json");
+  const [selectedUser, setSelectedUser] = useState(null);
+  const [authMode, setAuthMode] = useState("jwt");
+  const [sidebarSize, setSidebarSize] = useState(() => {
+    try {
+      const stored = localStorage.getItem(STORAGE_PREFIX + "sidebar_size");
+      return stored ? Number(stored) : 18;
+    } catch {
+      return 18;
+    }
+  });
+  const [editorHeight, setEditorHeight] = useState(() => {
+    try {
+      const stored_0 = localStorage.getItem(STORAGE_PREFIX + "editor_height");
+      return stored_0 ? Number(stored_0) : 55;
+    } catch {
+      return 55;
+    }
+  });
+  const activeTab = tabs.find((t_0) => t_0.id === activeTabId) ?? tabs[0];
+  const collectionInfos = useMemo(() => {
+    const collections = collectionRegistry?.collections ?? [];
+    return collections.map((col) => ({
+      slug: col.slug,
+      name: col.name,
+      properties: Object.keys(col.properties ?? {})
+    }));
+  }, [collectionRegistry?.collections]);
+  const collectionSlugs = useMemo(() => collectionInfos.map((c2) => c2.slug), [collectionInfos]);
+  const users = useMemo(() => {
+    const managed = (userManagement?.users ?? []).map((u) => ({
+      uid: u.uid,
+      displayName: u.displayName,
+      email: u.email,
+      photoURL: u.photoURL,
+      roles: u.roles
+    }));
+    if (currentUser && !managed.some((u_0) => u_0.uid === currentUser.uid)) {
+      managed.unshift({
+        uid: currentUser.uid,
+        displayName: currentUser.displayName,
+        email: currentUser.email,
+        photoURL: currentUser.photoURL,
+        roles: currentUser.roles
+      });
+    }
+    return managed;
+  }, [userManagement?.users, currentUser]);
+  const currentSelectableUser = useMemo(() => {
+    if (!currentUser) return null;
+    return {
+      uid: currentUser.uid,
+      displayName: currentUser.displayName,
+      email: currentUser.email,
+      photoURL: currentUser.photoURL,
+      roles: currentUser.roles
+    };
+  }, [currentUser]);
+  useEffect(() => {
+    saveToStorage("tabs", tabs);
+  }, [tabs]);
+  useEffect(() => {
+    saveToStorage("activeTab", activeTabId);
+  }, [activeTabId]);
+  useEffect(() => {
+    saveToStorage("snippets", snippets);
+  }, [snippets]);
+  useEffect(() => {
+    saveToStorage("history", history);
+  }, [history]);
+  useEffect(() => {
+    try {
+      localStorage.setItem(STORAGE_PREFIX + "sidebar_size", sidebarSize.toString());
+    } catch {
+    }
+  }, [sidebarSize]);
+  useEffect(() => {
+    try {
+      localStorage.setItem(STORAGE_PREFIX + "editor_height", editorHeight.toString());
+    } catch {
+    }
+  }, [editorHeight]);
+  const updateActiveCode = useCallback((code) => {
+    setTabs((prev) => prev.map((t_1) => t_1.id === activeTabId ? {
+      ...t_1,
+      code: code ?? ""
+    } : t_1));
+  }, [activeTabId]);
+  const addTab = useCallback(() => {
+    const id = String(Date.now());
+    const newTab = {
+      id,
+      name: `Script ${tabs.length + 1}`,
+      code: DEFAULT_CODE
+    };
+    setTabs((prev_0) => [...prev_0, newTab]);
+    setActiveTabId(id);
+  }, [tabs.length]);
+  const closeTab = useCallback((tabId) => {
+    setTabs((prev_1) => {
+      const filtered = prev_1.filter((t_2) => t_2.id !== tabId);
+      if (filtered.length === 0) {
+        const fresh = {
+          id: String(Date.now()),
+          name: "Script 1",
+          code: DEFAULT_CODE
+        };
+        setActiveTabId(fresh.id);
+        return [fresh];
+      }
+      if (activeTabId === tabId) {
+        setActiveTabId(filtered[filtered.length - 1].id);
+      }
+      return filtered;
+    });
+  }, [activeTabId]);
+  const buildClient = useCallback(async () => {
+    const apiUrl = apiConfig?.apiUrl;
+    const getAuthToken = apiConfig?.getAuthToken;
+    if (!apiUrl) {
+      throw new Error("API URL not configured. Make sure apiUrl is set.");
+    }
+    if (authMode === "none") {
+      const client = createRebaseClient({
+        baseUrl: apiUrl,
+        token: void 0
+      });
+      return {
+        client,
+        isScoped: true
+      };
+    }
+    if (!selectedUser || currentUser && selectedUser.uid === currentUser.uid) {
+      if (!rebaseClient) {
+        throw new Error("Application client is not initialized.");
+      }
+      return {
+        client: rebaseClient,
+        isScoped: false
+      };
+    }
+    let token;
+    if (getAuthToken) {
+      token = await getAuthToken() ?? void 0;
+    }
+    if (!token) {
+      throw new Error("No auth token available. Please sign in first.");
+    }
+    const client_0 = createRebaseClient({
+      baseUrl: apiUrl,
+      token
+    });
+    return {
+      client: client_0,
+      isScoped: true
+    };
+  }, [apiConfig, rebaseClient, selectedUser, currentUser, authMode]);
+  const executeCode = useCallback(async (codeOverride) => {
+    const code_0 = codeOverride ?? activeTab?.code ?? "";
+    if (!code_0.trim()) return;
+    setIsRunning(true);
+    setResult(null);
+    setHistory((prev_2) => {
+      const deduped = prev_2.filter((h) => h !== code_0);
+      return [...deduped, code_0].slice(-50);
+    });
+    const consoleEntries = [];
+    const startTime = performance.now();
+    let scopedClientToCleanUp = null;
+    const originalConsole = {
+      log: console.log,
+      warn: console.warn,
+      error: console.error,
+      info: console.info
+    };
+    const captureConsole = (type) => (...args) => {
+      consoleEntries.push({
+        type,
+        args,
+        timestamp: Date.now()
+      });
+      originalConsole[type](...args);
+    };
+    try {
+      console.log = captureConsole("log");
+      console.warn = captureConsole("warn");
+      console.error = captureConsole("error");
+      console.info = captureConsole("info");
+      const {
+        client: client_1,
+        isScoped
+      } = await buildClient();
+      if (isScoped) {
+        scopedClientToCleanUp = client_1;
+      }
+      const context = {
+        user: selectedUser ?? (currentUser ? {
+          uid: currentUser.uid,
+          displayName: currentUser.displayName,
+          email: currentUser.email,
+          roles: currentUser.roles
+        } : null),
+        collections: collectionInfos
+      };
+      const AsyncFunction = Object.getPrototypeOf(async function() {
+      }).constructor;
+      const fn = new AsyncFunction("client", "context", code_0);
+      const value = await fn(client_1, context);
+      const duration_0 = performance.now() - startTime;
+      setResult({
+        value,
+        console: consoleEntries,
+        duration: duration_0,
+        timestamp: Date.now()
+      });
+      if (value?.data && Array.isArray(value.data)) {
+        setResultView("table");
+      } else if (consoleEntries.length > 0 && value === void 0) {
+        setResultView("console");
+      } else {
+        setResultView("json");
+      }
+    } catch (err) {
+      const duration = performance.now() - startTime;
+      setResult({
+        value: void 0,
+        console: consoleEntries,
+        duration,
+        error: err?.message || String(err),
+        timestamp: Date.now()
+      });
+      setResultView("json");
+    } finally {
+      console.log = originalConsole.log;
+      console.warn = originalConsole.warn;
+      console.error = originalConsole.error;
+      console.info = originalConsole.info;
+      setIsRunning(false);
+      if (scopedClientToCleanUp) {
+        scopedClientToCleanUp.ws?.disconnect();
+      }
+    }
+  }, [activeTab?.code, buildClient, selectedUser, currentUser, collectionInfos]);
+  const saveSnippet = useCallback(() => {
+    if (!snippetName.trim() || !activeTab?.code.trim()) return;
+    const snippet = {
+      id: String(Date.now()),
+      name: snippetName.trim(),
+      code: activeTab.code,
+      createdAt: Date.now()
+    };
+    setSnippets((prev_3) => [snippet, ...prev_3]);
+    setShowSaveDialog(false);
+    setSnippetName("");
+    snackbar.open({
+      type: "success",
+      message: "Snippet saved"
+    });
+  }, [snippetName, activeTab?.code, snackbar]);
+  const deleteSnippet = useCallback((id_0) => {
+    setSnippets((prev_4) => prev_4.filter((s) => s.id !== id_0));
+  }, []);
+  const exportResult = useCallback(() => {
+    if (!result?.value) return;
+    const blob = new Blob([formatJSON(result.value)], {
+      type: "application/json"
+    });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `rebase-result-${Date.now()}.json`;
+    a.click();
+    URL.revokeObjectURL(url);
+  }, [result]);
+  const tableData = useMemo(() => {
+    if (!result?.value) return {
+      columns: [],
+      data: []
+    };
+    let rows = [];
+    if (result.value?.data && Array.isArray(result.value.data)) {
+      rows = result.value.data.map((entity) => ({
+        id: entity.id,
+        ...entity.values,
+        ...entity.values ? {} : entity
+      }));
+    } else if (Array.isArray(result.value)) {
+      rows = result.value;
+    }
+    if (rows.length === 0) return {
+      columns: [],
+      data: []
+    };
+    const keys = /* @__PURE__ */ new Set();
+    rows.slice(0, 20).forEach((row) => {
+      if (row && typeof row === "object") {
+        Object.keys(row).forEach((k) => keys.add(k));
+      }
+    });
+    const columns = Array.from(keys).map((key) => ({
+      key,
+      title: key,
+      width: key === "id" ? 100 : 200
+    }));
+    return {
+      columns,
+      data: rows
+    };
+  }, [result]);
+  const matchedCollections = useMemo(() => {
+    if (!result?.value || result.error) return [];
+    return detectCollectionsInResult(activeTab?.code ?? "", result.value, collectionRegistry?.collections ?? []);
+  }, [result, activeTab?.code, collectionRegistry?.collections]);
+  const getRowEntityActions = useCallback((rowData) => {
+    if (!rowData || matchedCollections.length === 0) return [];
+    return matchedCollections.filter((mc) => rowData[mc.pkColumn] != null).map((mc_0) => ({
+      collection: mc_0,
+      entityId: rowData[mc_0.pkColumn]
+    }));
+  }, [matchedCollections]);
+  const handleExportCSV = useCallback(() => {
+    if (tableData.data.length === 0) return;
+    const headers = tableData.columns.map((c_0) => c_0.key).join(",");
+    const rows_0 = tableData.data.map((row_0) => tableData.columns.map((c_1) => {
+      const val = row_0[c_1.key];
+      const str = val === null || val === void 0 ? "" : String(val);
+      return str.includes(",") ? `"${str}"` : str;
+    }).join(","));
+    const csv = [headers, ...rows_0].join("\n");
+    const blob_0 = new Blob([csv], {
+      type: "text/csv"
+    });
+    const url_0 = URL.createObjectURL(blob_0);
+    const a_0 = document.createElement("a");
+    a_0.href = url_0;
+    a_0.download = `js_results_${(/* @__PURE__ */ new Date()).toISOString().slice(0, 19)}.csv`;
+    a_0.click();
+    URL.revokeObjectURL(url_0);
+  }, [tableData]);
+  const handleExportMarkdown = useCallback(() => {
+    if (tableData.data.length === 0) return;
+    const headers_0 = tableData.columns.map((c_2) => c_2.key);
+    const headerRow = `| ${headers_0.join(" | ")} |`;
+    const dividerRow = `| ${headers_0.map(() => "---").join(" | ")} |`;
+    const dataRows = tableData.data.map((row_1) => `| ${headers_0.map((h_0) => {
+      const val_0 = row_1[h_0];
+      if (val_0 === null || val_0 === void 0) return "";
+      return String(val_0).replace(/\|/g, "\\|").replace(/\n/g, " ");
+    }).join(" | ")} |`);
+    const markdown = [headerRow, dividerRow, ...dataRows].join("\n");
+    navigator.clipboard.writeText(markdown).then(() => {
+      snackbar.open({
+        type: "success",
+        message: t("studio_sql_markdown_copied")
+      });
+    }).catch(() => {
+      snackbar.open({
+        type: "error",
+        message: t("studio_sql_markdown_copy_failed")
+      });
+    });
+  }, [tableData, snackbar, t]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full w-full", children: [
+    /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-hidden", children: /* @__PURE__ */ jsx(ResizablePanels, { orientation: "horizontal", panelSizePercent: sidebarSize, onPanelSizeChange: setSidebarSize, minPanelSizePx: 200, firstPanel: /* @__PURE__ */ jsx(JSEditorSidebar, { collections: collectionInfos, snippets, history, onSelectSnippet: (code_1) => updateActiveCode(code_1), onDeleteSnippet: deleteSnippet, onInsertCode: (code_2) => updateActiveCode(code_2) }), secondPanel: /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full overflow-hidden", children: [
+      /* @__PURE__ */ jsxs("div", { className: cls("flex items-center justify-between pr-2 border-b bg-white dark:bg-surface-950", defaultBorderMixin), children: [
+        /* @__PURE__ */ jsx("div", { className: "flex items-center flex-grow overflow-hidden mr-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center no-scrollbar overflow-x-auto min-w-0", children: [
+          /* @__PURE__ */ jsx(Tabs, { value: activeTabId, onValueChange: setActiveTabId, variant: "boxy", className: "w-[unset] flex-shrink-0", innerClassName: "bg-white dark:bg-surface-950", children: tabs.map((tab) => /* @__PURE__ */ jsxs(Tab, { value: tab.id, className: "flex items-center justify-between group max-w-[200px]", children: [
+            /* @__PURE__ */ jsx(TerminalIcon, { size: iconSize.smallest, className: "text-amber-500 mr-1.5 flex-shrink-0" }),
+            /* @__PURE__ */ jsx("span", { className: "truncate", children: tab.name }),
+            tabs.length > 1 && /* @__PURE__ */ jsx(IconButton, { size: "smallest", onClick: (e) => {
+              e.stopPropagation();
+              closeTab(tab.id);
+            }, className: "ml-1 !p-0.5 opacity-0 group-hover:opacity-100 hover:text-red-500 transition-opacity", children: /* @__PURE__ */ jsx(XIcon, { size: iconSize.smallest }) })
+          ] }, tab.id)) }),
+          /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: addTab, className: "ml-2 flex-shrink-0", children: /* @__PURE__ */ jsx(PlusIcon, { size: iconSize.smallest }) })
+        ] }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center justify-end gap-1.5", children: [
+          /* @__PURE__ */ jsx(Tooltip, { title: "SaveIcon as snippet", children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: () => {
+            setSnippetName("");
+            setShowSaveDialog(true);
+          }, disabled: !activeTab?.code.trim(), children: /* @__PURE__ */ jsx(SaveIcon, { size: iconSize.smallest }) }) }),
+          result?.value && /* @__PURE__ */ jsx(Tooltip, { title: "Export result as JSON", children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: exportResult, children: /* @__PURE__ */ jsx(DownloadIcon, { size: iconSize.smallest }) }) }),
+          /* @__PURE__ */ jsxs(Button, { size: "small", color: "primary", disabled: isRunning || !activeTab?.code.trim(), onClick: () => executeCode(), children: [
+            isRunning ? /* @__PURE__ */ jsx(CircularProgress, { size: "smallest", className: "mr-2" }) : /* @__PURE__ */ jsx(PlayIcon, { size: iconSize.smallest, className: "mr-2" }),
+            "Run"
+          ] })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "flex-grow overflow-hidden", children: /* @__PURE__ */ jsx(ResizablePanels, { orientation: "vertical", panelSizePercent: editorHeight, onPanelSizeChange: setEditorHeight, minPanelSizePx: 100, firstPanel: /* @__PURE__ */ jsxs("div", { className: "h-full w-full overflow-hidden flex flex-col", children: [
+        /* @__PURE__ */ jsx("div", { className: "p-2 px-3 border-b border-surface-200 dark:border-surface-950 bg-surface-50 dark:bg-surface-900 flex items-center shrink-0", children: /* @__PURE__ */ jsx(AuthSimulationSelector, { authMode, setAuthMode, selectedUser, setSelectedUser, users, loading: userManagement?.loading, currentUser: currentSelectableUser }) }),
+        /* @__PURE__ */ jsx("div", { className: "flex-1 min-h-0", children: /* @__PURE__ */ jsx(JSMonacoEditor, { value: activeTab?.code ?? "", onChange: updateActiveCode, onRun: (selectedText) => executeCode(selectedText), collectionSlugs, collections: collectionInfos, autoFocus: true }) })
+      ] }), secondPanel: /* @__PURE__ */ jsxs("div", { className: "h-full w-full flex flex-col bg-surface-50 dark:bg-surface-950 overflow-hidden min-h-0", children: [
+        /* @__PURE__ */ jsxs("div", { className: cls("p-2 px-4 bg-surface-100 dark:bg-surface-900 border-b shrink-0 flex items-center", defaultBorderMixin), children: [
+          /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "font-bold text-text-disabled dark:text-text-disabled-dark uppercase tracking-widest text-[10px]", children: t("studio_sql_query_results") }),
+          result && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("div", { className: "flex-grow" }),
+            /* @__PURE__ */ jsxs(Tabs, { value: resultView, onValueChange: (val_1) => setResultView(val_1), variant: "pill", className: "w-[unset] mr-2", children: [
+              /* @__PURE__ */ jsx(Tab, { value: "json", children: "JSON" }),
+              tableData.data.length > 0 && /* @__PURE__ */ jsx(Tab, { value: "table", children: "Table" }),
+              result.console.length > 0 && /* @__PURE__ */ jsxs(Tab, { value: "console", children: [
+                "Console (",
+                result.console.length,
+                ")"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(Chip, { size: "smallest", colorScheme: result.error ? "redDarker" : "greenDarker", children: result.error ? "Error" : `${result.duration.toFixed(0)}ms` })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex-grow flex flex-col min-h-0 overflow-hidden", children: [
+          isRunning && /* @__PURE__ */ jsx("div", { className: "flex-grow flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+            /* @__PURE__ */ jsx(CircularProgress, { size: "medium" }),
+            /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "mt-4 text-text-secondary dark:text-text-secondary-dark font-mono tracking-tight animate-pulse", children: "EXECUTING SCRIPT..." })
+          ] }) }),
+          !isRunning && !result && /* @__PURE__ */ jsx("div", { className: "flex-grow flex items-center justify-center text-text-disabled dark:text-text-disabled-dark", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+            /* @__PURE__ */ jsx("svg", { className: "w-12 h-12 mx-auto mb-4 opacity-50", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1, d: "M8 9l3 3-3 3m5 0h3M5 20h14a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) }),
+            /* @__PURE__ */ jsxs(Typography, { variant: "body2", children: [
+              "Write JavaScript and press ",
+              /* @__PURE__ */ jsx("kbd", { className: "px-1.5 py-0.5 rounded bg-surface-200 dark:bg-surface-700 text-[11px] font-mono", children: "⌘ Enter" }),
+              " to run"
+            ] })
+          ] }) }),
+          !isRunning && result?.error && /* @__PURE__ */ jsx("div", { className: "flex-grow flex items-center justify-center p-6 overflow-auto", children: /* @__PURE__ */ jsx(ErrorView, { title: "Execution Error", error: result.error }) }),
+          !isRunning && result && !result.error && resultView === "json" && /* @__PURE__ */ jsx("pre", { className: "flex-grow overflow-auto p-4 text-[13px] font-mono leading-relaxed text-text-primary dark:text-text-primary-dark whitespace-pre-wrap break-words", children: result.value === void 0 ? /* @__PURE__ */ jsx("span", { className: "text-text-disabled italic", children: "undefined (no return value)" }) : /* @__PURE__ */ jsx(JSONHighlight, { value: result.value }) }),
+          !isRunning && result && !result.error && resultView === "table" && tableData.data.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex-grow flex flex-col overflow-hidden min-h-0", children: [
+            matchedCollections.length > 0 && /* @__PURE__ */ jsxs("div", { className: cls("px-4 py-1.5 border-b flex items-center gap-2 shrink-0 bg-surface-50 dark:bg-surface-900", defaultBorderMixin), children: [
+              /* @__PURE__ */ jsx(Tooltip, { title: t("studio_sql_cms_collections_tooltip"), children: /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-[10px] font-bold uppercase tracking-widest text-text-disabled dark:text-text-disabled-dark mr-1 shrink-0 cursor-help", children: t("studio_sql_cms") }) }),
+              /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 overflow-x-auto no-scrollbar", children: matchedCollections.map((mc_1) => /* @__PURE__ */ jsx(Tooltip, { title: `${mc_1.collection.name} (${mc_1.collectionSlug})`, children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-[11px] font-medium bg-primary/10 dark:bg-primary-dark/15 text-primary dark:text-primary-dark whitespace-nowrap border border-primary/20 dark:border-primary-dark/20", children: [
+                typeof mc_1.collection.icon === "string" && /* @__PURE__ */ jsx(IconForView, { collectionOrView: {
+                  icon: mc_1.collection.icon
+                }, className: "text-[12px]" }),
+                mc_1.collection.name
+              ] }) }, mc_1.collectionSlug)) })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "flex-grow relative h-full min-h-0 min-w-0", children: /* @__PURE__ */ jsx(VirtualTable, { data: tableData.data, columns: matchedCollections.length > 0 ? [{
+              key: "__entity_action__",
+              title: "",
+              width: 36,
+              sortable: false,
+              resizable: false
+            }, ...tableData.columns] : tableData.columns, rowHeight: 32, headerHeight: 32, cellRenderer: ({
+              rowData: rowData_0,
+              column,
+              rowIndex
+            }) => {
+              if (column.key === "__entity_action__") {
+                const rowActions = getRowEntityActions(rowData_0);
+                if (rowActions.length === 0) return /* @__PURE__ */ jsx("div", { className: "h-full w-full" });
+                if (rowActions.length === 1) {
+                  const ra = rowActions[0];
+                  return /* @__PURE__ */ jsx("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ jsx(Tooltip, { title: t("studio_sql_edit_entity", {
+                    name: ra.collection.collection.name,
+                    id: String(ra.entityId)
+                  }), children: /* @__PURE__ */ jsx(IconButton, { size: "small", className: "text-surface-400 dark:text-surface-500 hover:text-surface-600 dark:hover:text-surface-300", onClick: (e_0) => {
+                    e_0.stopPropagation();
+                    sideEntityController.open({
+                      path: ra.collection.collectionSlug,
+                      entityId: ra.entityId,
+                      collection: ra.collection.collection,
+                      updateUrl: false
+                    });
+                  }, children: /* @__PURE__ */ jsx(PencilIcon, { size: iconSize.smallest }) }) }) });
+                }
+                return /* @__PURE__ */ jsx("div", { className: "h-full flex items-center justify-center", children: /* @__PURE__ */ jsx(Menu, { trigger: /* @__PURE__ */ jsx(IconButton, { size: "small", className: "text-surface-400 dark:text-surface-500 hover:text-surface-600 dark:hover:text-surface-300", onClick: (e_1) => e_1.stopPropagation(), children: /* @__PURE__ */ jsx(MoreVerticalIcon, { size: iconSize.smallest }) }), children: rowActions.map((ra_0) => /* @__PURE__ */ jsx(MenuItem, { dense: true, onClick: () => {
+                  sideEntityController.open({
+                    path: ra_0.collection.collectionSlug,
+                    entityId: ra_0.entityId,
+                    collection: ra_0.collection.collection,
+                    updateUrl: false
+                  });
+                }, children: t("studio_sql_edit_entity", {
+                  name: ra_0.collection.collection.name,
+                  id: String(ra_0.entityId)
+                }) }, ra_0.collection.collectionSlug)) }) });
+              }
+              if (!rowData_0) return null;
+              const val_2 = rowData_0[column.key];
+              const displayValue = typeof val_2 === "object" && val_2 !== null ? JSON.stringify(val_2) : String(val_2 ?? "");
+              return /* @__PURE__ */ jsx("div", { className: "px-4 py-1.5 h-full flex items-center whitespace-nowrap text-[13px] text-text-primary dark:text-text-primary-dark font-mono", children: /* @__PURE__ */ jsx("div", { className: "truncate flex-grow", title: displayValue, children: displayValue === "" ? /* @__PURE__ */ jsx("span", { className: "text-text-disabled dark:text-text-disabled-dark italic text-[11px]", children: "NULL" }) : displayValue }) });
+            } }) })
+          ] }),
+          !isRunning && result && resultView === "console" && /* @__PURE__ */ jsxs("div", { className: "flex-grow overflow-auto p-2 space-y-1 font-mono text-[12px]", children: [
+            result.console.length === 0 ? /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled p-2", children: "No console output" }) : result.console.map((entry, i) => /* @__PURE__ */ jsxs("div", { className: cls("px-2 py-1 rounded flex items-start gap-2", entry.type === "error" && "bg-red-50 dark:bg-red-950/30 text-red-700 dark:text-red-400", entry.type === "warn" && "bg-amber-50 dark:bg-amber-950/30 text-amber-700 dark:text-amber-400", entry.type === "log" && "text-text-primary dark:text-text-primary-dark", entry.type === "info" && "text-blue-700 dark:text-blue-400"), children: [
+              /* @__PURE__ */ jsx("span", { className: "text-[10px] opacity-50 flex-shrink-0 mt-0.5", children: entry.type === "error" ? "❌" : entry.type === "warn" ? "⚠️" : entry.type === "info" ? "ℹ️" : "›" }),
+              /* @__PURE__ */ jsx("span", { className: "whitespace-pre-wrap break-words", children: entry.args.map((a_1) => typeof a_1 === "object" ? JSON.stringify(a_1, null, 2) : String(a_1)).join(" ") })
+            ] }, i)),
+            result.value !== void 0 && /* @__PURE__ */ jsxs("div", { className: cls("px-2 py-1 mt-2 border-t pt-2", defaultBorderMixin), children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-text-disabled text-[10px] uppercase tracking-wider mb-1 block", children: "Return Value" }),
+              /* @__PURE__ */ jsx("pre", { className: "text-text-primary dark:text-text-primary-dark whitespace-pre-wrap break-words text-[12px]", children: formatJSON(result.value) })
+            ] })
+          ] })
+        ] }),
+        !isRunning && result && !result.error && resultView === "table" && tableData.data.length > 0 && /* @__PURE__ */ jsxs("div", { className: cls("p-2 px-4 border-t bg-surface-50 dark:bg-surface-900 flex justify-between items-center shrink-0", defaultBorderMixin), children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex space-x-4", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center text-[11px]", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-bold text-text-disabled dark:text-text-disabled-dark mr-2 uppercase tracking-tighter", children: t("studio_sql_rows") }),
+              /* @__PURE__ */ jsx("span", { className: "font-mono text-text-secondary dark:text-text-secondary-dark", children: tableData.data.length })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center text-[11px]", children: [
+              /* @__PURE__ */ jsx("span", { className: "font-bold text-text-disabled dark:text-text-disabled-dark mr-2 uppercase tracking-tighter", children: t("studio_sql_time") }),
+              /* @__PURE__ */ jsxs("span", { className: "font-mono text-text-secondary dark:text-text-secondary-dark", children: [
+                result.duration.toFixed(0),
+                "ms"
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex gap-2 overflow-x-auto no-scrollbar items-center px-2", children: [
+            /* @__PURE__ */ jsx(Button, { size: "small", variant: "text", className: "text-[10px] uppercase font-bold text-text-secondary dark:text-text-secondary-dark whitespace-nowrap", onClick: handleExportMarkdown, children: t("studio_sql_copy_markdown") }),
+            /* @__PURE__ */ jsx(Button, { size: "small", variant: "text", className: "text-[10px] uppercase font-bold text-text-secondary dark:text-text-secondary-dark whitespace-nowrap", onClick: exportResult, children: t("studio_sql_export_json") }),
+            /* @__PURE__ */ jsx(Button, { size: "small", variant: "text", className: "text-[10px] uppercase font-bold text-text-secondary dark:text-text-secondary-dark whitespace-nowrap", onClick: handleExportCSV, children: t("studio_sql_export_csv") })
+          ] })
+        ] })
+      ] }) }) })
+    ] }) }) }),
+    /* @__PURE__ */ jsxs(Dialog, { open: showSaveDialog, onOpenChange: setShowSaveDialog, children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: "SaveIcon Snippet" }),
+      /* @__PURE__ */ jsx(DialogContent, { children: /* @__PURE__ */ jsx(TextField, { label: "Snippet name", value: snippetName, onChange: (e_2) => setSnippetName(e_2.target.value), placeholder: "e.g. List all products", autoFocus: true, onKeyDown: (e_3) => {
+        if (e_3.key === "Enter") saveSnippet();
+      } }) }),
+      /* @__PURE__ */ jsxs(DialogActions, { children: [
+        /* @__PURE__ */ jsx(Button, { variant: "text", onClick: () => setShowSaveDialog(false), children: "Cancel" }),
+        /* @__PURE__ */ jsx(Button, { variant: "filled", color: "primary", onClick: saveSnippet, disabled: !snippetName.trim(), children: "Save" })
+      ] })
+    ] })
+  ] });
+}
+function JSONHighlight(t0) {
+  const $ = c(5);
+  const {
+    value
+  } = t0;
+  let t1;
+  if ($[0] !== value) {
+    t1 = formatJSON(value);
+    $[0] = value;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const json = t1;
+  const {
+    mode
+  } = useModeController();
+  const t2 = mode === "dark" ? themes.vsDark : themes.github;
+  let t3;
+  if ($[2] !== json || $[3] !== t2) {
+    t3 = /* @__PURE__ */ jsx(Highlight, { theme: t2, code: json, language: "json", children: _temp });
+    $[2] = json;
+    $[3] = t2;
+    $[4] = t3;
+  } else {
+    t3 = $[4];
+  }
+  return t3;
+}
+function _temp(t0) {
+  const {
+    style,
+    tokens,
+    getLineProps,
+    getTokenProps
+  } = t0;
+  return /* @__PURE__ */ jsx("span", { style: {
+    ...style,
+    backgroundColor: "transparent"
+  }, children: tokens.map((line, i) => /* @__PURE__ */ jsx("div", { ...getLineProps({
+    line
+  }), children: line.map((token, key) => /* @__PURE__ */ jsx("span", { ...getTokenProps({
+    token
+  }) }, key)) }, i)) });
+}
+export {
+  JSEditor
+};
+//# sourceMappingURL=JSEditor-D8nVp3Lp.js.map