@upstash/react-redis-browser 0.2.14-rc.11 → 0.2.14-rc.12

package/dist/index.mjs

@@ -2668,8 +2668,44 @@ var isTest = typeof window !== "undefined" && window.__PLAYWRIGHT__ === true;
 var jsonToJsLiteral = (json) => {
   return json.replaceAll(/"([$A-Z_a-z][\w$]*)"\s*:/g, "$1:");
 };
+var MAX_INLINE_KEYS = 2;
+var isInlineable = (value) => {
+  if (typeof value !== "object" || value === null) return true;
+  if (Array.isArray(value)) return value.every((v) => typeof v !== "object" || v === null);
+  const entries = Object.entries(value);
+  return entries.length <= MAX_INLINE_KEYS && entries.every(([, v]) => typeof v !== "object" || v === null);
+};
+var prettyPrint = (value, indent) => {
+  if (value === void 0 || value === null) return String(value);
+  if (typeof value !== "object") return JSON.stringify(value);
+  const prefix = "  ".repeat(indent);
+  const childPrefix = "  ".repeat(indent + 1);
+  if (Array.isArray(value)) {
+    if (value.length === 0) return "[]";
+    if (value.every((v) => isInlineable(v))) {
+      const inline = `[${value.map((v) => prettyPrint(v, 0)).join(", ")}]`;
+      if (!inline.includes("\n")) return inline;
+    }
+    const items = value.map((v) => `${childPrefix}${prettyPrint(v, indent + 1)}`);
+    return `[
+${items.join(",\n")}
+${prefix}]`;
+  }
+  const entries = Object.entries(value);
+  if (entries.length === 0) return "{}";
+  if (indent > 0 && entries.length <= MAX_INLINE_KEYS && entries.every(([, v]) => isInlineable(v))) {
+    const inline = `{ ${entries.map(([k, v]) => `${JSON.stringify(k)}: ${prettyPrint(v, 0)}`).join(", ")} }`;
+    if (!inline.includes("\n")) return inline;
+  }
+  const parts = entries.map(
+    ([k, v]) => `${childPrefix}${JSON.stringify(k)}: ${prettyPrint(v, indent + 1)}`
+  );
+  return `{
+${parts.join(",\n")}
+${prefix}}`;
+};
 var toJsLiteral = (obj) => {
-  return jsonToJsLiteral(JSON.stringify(obj, null, 2));
+  return jsonToJsLiteral(prettyPrint(obj, 0));
 };
 var formatUpstashErrorMessage = (error) => {
   if (error.name !== "UpstashError") return error.message;
@@ -4004,16 +4040,22 @@ function parseFields(content, prefix, flatSchema) {
     if (fieldName.startsWith('"') && fieldName.endsWith('"') || fieldName.startsWith("'") && fieldName.endsWith("'")) {
       fieldName = fieldName.slice(1, -1);
     }
+    if (fieldName.length === 0) {
+      throw new Error("Field name cannot be empty");
+    }
     const valueStr = entry.slice(colonIndex + 1).trim();
     const fullKey = prefix ? `${prefix}.${fieldName}` : fieldName;
     if (valueStr.startsWith("s.object(")) {
       const nestedContent = extractObjectContent(valueStr);
-      if (nestedContent !== null) {
-        parseFields(nestedContent, fullKey, flatSchema);
-        continue;
+      if (nestedContent === void 0) {
+        throw new Error(
+          `Malformed s.object() for field "${fullKey}": missing closing brace or parenthesis`
+        );
       }
+      parseFields(nestedContent, fullKey, flatSchema);
+      continue;
     }
-    const fieldValue = parseFieldBuilder(valueStr);
+    const fieldValue = parseFieldBuilder(valueStr, fullKey);
     if (fieldValue) {
       flatSchema[fullKey] = fieldValue;
     }
@@ -4074,15 +4116,15 @@ function findColonIndex(entry) {
 }
 function extractObjectContent(str) {
   const match = str.match(/^s\.object\s*\(\s*{([\S\s]*)}\s*\)/);
-  return match ? match[1] : null;
+  return match ? match[1] : void 0;
 }
 function extractFromValue(str) {
   const fromIndex = str.indexOf(".from(");
-  if (fromIndex === -1) return null;
+  if (fromIndex === -1) return void 0;
   const start = fromIndex + 6;
-  if (start >= str.length) return null;
+  if (start >= str.length) return void 0;
   const quoteChar = str[start];
-  if (quoteChar !== '"' && quoteChar !== "'") return null;
+  if (quoteChar !== '"' && quoteChar !== "'") return void 0;
   let result = "";
   let i = start + 1;
   while (i < str.length) {
@@ -4098,151 +4140,61 @@ function extractFromValue(str) {
     result += char;
     i++;
   }
-  return null;
+  return void 0;
 }
-function parseFieldBuilder(str) {
+function parseFieldBuilder(str, fieldName) {
   str = str.trim().replace(/,\s*$/, "");
   if (str.startsWith("s.string()")) {
     const noTokenize = str.includes(".noTokenize()");
     const noStem = str.includes(".noStem()");
     const fromValue = extractFromValue(str);
-    if (!noTokenize && !noStem && fromValue === null) return "TEXT";
+    if (!noTokenize && !noStem && fromValue === void 0) return "TEXT";
     return {
       type: "TEXT",
       ...noTokenize && { noTokenize: true },
       ...noStem && { noStem: true },
-      ...fromValue !== null && { from: fromValue }
+      ...fromValue !== void 0 && { from: fromValue }
     };
   }
   if (str.startsWith("s.number(")) {
     const typeMatch = str.match(/s\.number\(\s*["']?(U64|I64|F64)?["']?\s*\)/);
     const numType = typeMatch?.[1] || "F64";
     const fromValue = extractFromValue(str);
-    if (fromValue === null) return numType;
+    if (fromValue === void 0) return numType;
     return { type: numType, from: fromValue };
   }
   if (str.startsWith("s.boolean()")) {
     const fast = str.includes(".fast()");
     const fromValue = extractFromValue(str);
-    if (!fast && fromValue === null) return "BOOL";
+    if (!fast && fromValue === void 0) return "BOOL";
     return {
       type: "BOOL",
       ...fast && { fast: true },
-      ...fromValue !== null && { from: fromValue }
+      ...fromValue !== void 0 && { from: fromValue }
     };
   }
   if (str.startsWith("s.date()")) {
     const fast = str.includes(".fast()");
     const fromValue = extractFromValue(str);
-    if (!fast && fromValue === null) return "DATE";
+    if (!fast && fromValue === void 0) return "DATE";
     return {
       type: "DATE",
       ...fast && { fast: true },
-      ...fromValue !== null && { from: fromValue }
+      ...fromValue !== void 0 && { from: fromValue }
     };
   }
-  return null;
-}
-function schemaToEditorValue(flatSchema) {
-  const nested = unflattenSchema(flatSchema);
-  const body = renderObject(nested, 1);
-  return `const schema: Schema = s.object({
-${body}})`;
-}
-function unflattenSchema(flat) {
-  const result = {};
-  for (const [key, value] of Object.entries(flat)) {
-    const parts = key.split(".");
-    let current = result;
-    for (let i = 0; i < parts.length - 1; i++) {
-      const part = parts[i];
-      if (!current[part] || typeof current[part] !== "object") {
-        current[part] = {};
-      }
-      current = current[part];
-    }
-    current[parts.at(-1)] = value;
-  }
-  return result;
-}
-function renderObject(obj, indent) {
-  const pad = "  ".repeat(indent);
-  const lines = [];
-  for (const [key, value] of Object.entries(obj)) {
-    if (isFieldValue(value)) {
-      lines.push(`${pad}${key}: ${fieldToBuilder(value)},`);
-    } else {
-      const nested = renderObject(value, indent + 1);
-      lines.push(`${pad}${key}: s.object({`);
-      lines.push(nested.trimEnd());
-      lines.push(`${pad}}),`);
-    }
-  }
-  return lines.join("\n") + "\n";
-}
-function isFieldValue(value) {
-  if (typeof value === "string") return true;
-  if (typeof value === "object" && value !== null) {
-    return "type" in value;
-  }
-  return false;
-}
-function fieldToBuilder(value) {
-  if (typeof value === "string") {
-    switch (value) {
-      case "TEXT": {
-        return "s.string()";
-      }
-      case "BOOL": {
-        return "s.boolean()";
-      }
-      case "DATE": {
-        return "s.date()";
-      }
-      case "U64":
-      case "I64":
-      case "F64": {
-        return `s.number("${value}")`;
-      }
-      default: {
-        return "s.string()";
-      }
-    }
+  if (str.startsWith("s.keyword()")) {
+    return "KEYWORD";
   }
-  const v = value;
-  const type = v.type;
-  let builder = "";
-  switch (type) {
-    case "TEXT": {
-      builder = "s.string()";
-      if (v.noTokenize) builder += ".noTokenize()";
-      if (v.noStem) builder += ".noStem()";
-      break;
-    }
-    case "U64":
-    case "I64":
-    case "F64": {
-      builder = `s.number("${type}")`;
-      break;
-    }
-    case "BOOL": {
-      builder = "s.boolean()";
-      if (v.fast) builder += ".fast()";
-      break;
-    }
-    case "DATE": {
-      builder = "s.date()";
-      if (v.fast) builder += ".fast()";
-      break;
-    }
-    default: {
-      builder = "s.string()";
-    }
+  if (str.startsWith("s.facet()")) {
+    return "FACET";
   }
-  if (v.from) {
-    builder += `.from("${v.from}")`;
+  if (str.startsWith("s.")) {
+    const typeMatch = str.match(/^s\.(\w+)\(/);
+    const typeName = typeMatch?.[1] ?? "unknown";
+    throw new Error(`Unknown field type "s.${typeName}()" for field "${fieldName}"`);
   }
-  return builder;
+  return void 0;
 }
 
 // src/components/databrowser/hooks/use-create-search-index-schema.tsx
@@ -4282,13 +4234,89 @@ var useCreateSearchIndexSchema = () => {
 // src/components/databrowser/components/display/display-header.tsx
 import { IconPlus } from "@tabler/icons-react";
 
-// src/components/ui/tooltip.tsx
+// src/components/ui/scroll-area.tsx
 import * as React7 from "react";
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+import { jsx as jsx15, jsxs as jsxs5 } from "react/jsx-runtime";
+var ScrollArea = React7.forwardRef(
+  ({
+    className,
+    scrollBarClassName,
+    scrollBarForceMount,
+    children,
+    onScroll,
+    disableRoundedInherit = false,
+    orientation = "vertical",
+    ...props
+  }, ref) => /* @__PURE__ */ jsxs5(
+    ScrollAreaPrimitive.Root,
+    {
+      ref,
+      className: cn("relative overflow-hidden", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx15(
+          ScrollAreaPrimitive.Viewport,
+          {
+            onScroll,
+            className: cn(
+              "h-full w-full [&>div]:!block",
+              !disableRoundedInherit && "rounded-[inherit]"
+            ),
+            children
+          }
+        ),
+        (orientation === "vertical" || orientation === "both") && /* @__PURE__ */ jsx15(
+          ScrollBar,
+          {
+            className: scrollBarClassName,
+            forceMount: scrollBarForceMount,
+            orientation: "vertical"
+          }
+        ),
+        (orientation === "horizontal" || orientation === "both") && /* @__PURE__ */ jsx15(
+          ScrollBar,
+          {
+            className: scrollBarClassName,
+            forceMount: scrollBarForceMount,
+            orientation: "horizontal"
+          }
+        ),
+        /* @__PURE__ */ jsx15(ScrollAreaPrimitive.Corner, {})
+      ]
+    }
+  )
+);
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+var ScrollBar = React7.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx15(
+  ScrollAreaPrimitive.ScrollAreaScrollbar,
+  {
+    ref,
+    orientation,
+    className: cn(
+      "flex touch-none select-none transition-colors",
+      orientation === "vertical" && "mr-1 h-full w-2",
+      orientation === "horizontal" && "mb-1 h-2 w-full flex-col",
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx15(
+      ScrollAreaPrimitive.ScrollAreaThumb,
+      {
+        className: cn("relative flex-1 rounded-full bg-zinc-400/70")
+      }
+    )
+  }
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+
+// src/components/ui/tooltip.tsx
+import * as React8 from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs6 } from "react/jsx-runtime";
 var Tooltip = TooltipPrimitive.Root;
 var TooltipTrigger = TooltipPrimitive.Trigger;
-var TooltipContent = React7.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx15(TooltipPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx15(
+var TooltipContent = React8.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx16(TooltipPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx16(
   TooltipPrimitive.Content,
   {
     ref,
@@ -4306,10 +4334,10 @@ var SimpleTooltip = ({
   children,
   variant = "default"
 }) => {
-  if (!content) return /* @__PURE__ */ jsx15(Fragment2, { children });
-  return /* @__PURE__ */ jsxs5(Tooltip, { delayDuration: 100, children: [
-    /* @__PURE__ */ jsx15(TooltipTrigger, { asChild: true, children }),
-    /* @__PURE__ */ jsx15(
+  if (!content) return /* @__PURE__ */ jsx16(Fragment2, { children });
+  return /* @__PURE__ */ jsxs6(Tooltip, { delayDuration: 100, children: [
+    /* @__PURE__ */ jsx16(TooltipTrigger, { asChild: true, children }),
+    /* @__PURE__ */ jsx16(
       TooltipContent,
       {
         side: "top",
@@ -4331,16 +4359,16 @@ import {
   IconQuote,
   IconSearch
 } from "@tabler/icons-react";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 var iconsMap = {
-  string: /* @__PURE__ */ jsx16(IconQuote, { size: 15, stroke: 1.2 }),
-  set: /* @__PURE__ */ jsx16(IconLayersIntersect, { size: 15, stroke: 1.2 }),
-  hash: /* @__PURE__ */ jsx16(IconHash, { size: 15, stroke: 1.2 }),
-  json: /* @__PURE__ */ jsx16(IconCodeDots, { size: 15, stroke: 1.2 }),
-  zset: /* @__PURE__ */ jsx16(IconArrowsSort, { size: 15, stroke: 1.2 }),
-  list: /* @__PURE__ */ jsx16(IconList, { size: 15, stroke: 1.2 }),
-  stream: /* @__PURE__ */ jsx16(IconList, { size: 15, stroke: 1.2 }),
-  search: /* @__PURE__ */ jsx16(IconSearch, { size: 15, stroke: 1.2 })
+  string: /* @__PURE__ */ jsx17(IconQuote, { size: 15, stroke: 1.2 }),
+  set: /* @__PURE__ */ jsx17(IconLayersIntersect, { size: 15, stroke: 1.2 }),
+  hash: /* @__PURE__ */ jsx17(IconHash, { size: 15, stroke: 1.2 }),
+  json: /* @__PURE__ */ jsx17(IconCodeDots, { size: 15, stroke: 1.2 }),
+  zset: /* @__PURE__ */ jsx17(IconArrowsSort, { size: 15, stroke: 1.2 }),
+  list: /* @__PURE__ */ jsx17(IconList, { size: 15, stroke: 1.2 }),
+  stream: /* @__PURE__ */ jsx17(IconList, { size: 15, stroke: 1.2 }),
+  search: /* @__PURE__ */ jsx17(IconSearch, { size: 15, stroke: 1.2 })
 };
 var tagVariants = cva("inline-flex shrink-0 items-center rounded-md justify-center", {
   variants: {
@@ -4366,18 +4394,18 @@ var tagVariants = cva("inline-flex shrink-0 items-center rounded-md justify-cent
   }
 });
 function TypeTag({ className, variant, type }) {
-  const defaultIcon = /* @__PURE__ */ jsx16(IconQuestionMark, { size: 15, stroke: 1.2 });
+  const defaultIcon = /* @__PURE__ */ jsx17(IconQuestionMark, { size: 15, stroke: 1.2 });
   const variantKey = variant && variant in iconsMap ? variant : "default";
-  return /* @__PURE__ */ jsx16("span", { className: cn(tagVariants({ variant: variantKey, type, className })), children: type === "icon" ? iconsMap[variant] ?? defaultIcon : DATA_TYPE_NAMES[variant] ?? variant ?? "Unknown" });
+  return /* @__PURE__ */ jsx17("span", { className: cn(tagVariants({ variant: variantKey, type, className })), children: type === "icon" ? iconsMap[variant] ?? defaultIcon : DATA_TYPE_NAMES[variant] ?? variant ?? "Unknown" });
 }
 
 // src/components/databrowser/components/display/header-badges.tsx
 import bytes from "bytes";
 
 // src/components/ui/skeleton.tsx
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function Skeleton({ className, ...props }) {
-  return /* @__PURE__ */ jsx17("div", { className: cn("animate-pulse rounded-md bg-zinc-900/10", className), ...props });
+  return /* @__PURE__ */ jsx18("div", { className: cn("animate-pulse rounded-md bg-zinc-900/10", className), ...props });
 }
 
 // src/components/databrowser/hooks/use-add-key.ts
@@ -4622,6 +4650,9 @@ var useDeleteKeyCache = () => {
       queryClient.invalidateQueries({
         queryKey: [FETCH_SEARCH_INDEX_QUERY_KEY, key]
       });
+      queryClient.invalidateQueries({
+        queryKey: [FETCH_SEARCH_INDEXES_QUERY_KEY]
+      });
       if (isValuesSearchSelected && valuesSearch.index) {
         queryClient.invalidateQueries({
           queryKey: [FETCH_SEARCH_INDEX_QUERY_KEY, valuesSearch.index]
@@ -4748,12 +4779,12 @@ import { useEffect as useEffect4, useMemo as useMemo5, useState as useState4 } f
 import { Controller, useForm } from "react-hook-form";
 
 // src/components/ui/popover.tsx
-import * as React8 from "react";
+import * as React9 from "react";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { jsx as jsx19 } from "react/jsx-runtime";
 var Popover = PopoverPrimitive.Root;
 var PopoverTrigger = PopoverPrimitive.Trigger;
-var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx18(PopoverPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx18(
+var PopoverContent = React9.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx19(PopoverPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx19(
   PopoverPrimitive.Content,
   {
     ref,
@@ -4769,7 +4800,7 @@ var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffse
 PopoverContent.displayName = PopoverPrimitive.Content.displayName;
 
 // src/components/databrowser/components/display/ttl-popover.tsx
-import { jsx as jsx19, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs7 } from "react/jsx-runtime";
 var timeUnits = [
   { label: "Seconds", value: 1 },
   { label: "Minutes", value: 60 },
@@ -4802,7 +4833,7 @@ function TTLPopover({
     await setTTL(TTL_INFINITE);
     setOpen(false);
   };
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     Popover,
     {
       open,
@@ -4811,8 +4842,8 @@ function TTLPopover({
         setOpen(isOpen);
       },
       children: [
-        /* @__PURE__ */ jsx19(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx19("button", { children }) }),
-        /* @__PURE__ */ jsx19(PopoverContent, { className: "w-[300px]", align: "end", children: /* @__PURE__ */ jsxs6(
+        /* @__PURE__ */ jsx20(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx20("button", { children }) }),
+        /* @__PURE__ */ jsx20(PopoverContent, { className: "w-[300px]", align: "end", children: /* @__PURE__ */ jsxs7(
           "form",
           {
             className: "space-y-4",
@@ -4821,10 +4852,10 @@ function TTLPopover({
               e.stopPropagation();
             },
             children: [
-              /* @__PURE__ */ jsx19("h4", { className: "font-medium leading-none", children: "Expiration" }),
-              /* @__PURE__ */ jsxs6("div", { children: [
-                /* @__PURE__ */ jsxs6("div", { className: "flex items-center", children: [
-                  /* @__PURE__ */ jsx19(
+              /* @__PURE__ */ jsx20("h4", { className: "font-medium leading-none", children: "Expiration" }),
+              /* @__PURE__ */ jsxs7("div", { children: [
+                /* @__PURE__ */ jsxs7("div", { className: "flex items-center", children: [
+                  /* @__PURE__ */ jsx20(
                     Controller,
                     {
                       rules: {
@@ -4833,26 +4864,26 @@ function TTLPopover({
                       },
                       control,
                       name: "value",
-                      render: ({ field }) => /* @__PURE__ */ jsx19(Input, { min: "-1", ...field, className: "grow rounded-r-none" })
+                      render: ({ field }) => /* @__PURE__ */ jsx20(Input, { min: "-1", ...field, className: "grow rounded-r-none" })
                     }
                   ),
-                  /* @__PURE__ */ jsx19(
+                  /* @__PURE__ */ jsx20(
                     Controller,
                     {
                       control,
                       name: "type",
-                      render: ({ field }) => /* @__PURE__ */ jsxs6(Select, { value: field.value, onValueChange: field.onChange, children: [
-                        /* @__PURE__ */ jsx19(SelectTrigger, { className: "w-auto rounded-l-none border-l-0 pr-8", children: /* @__PURE__ */ jsx19(SelectValue, {}) }),
-                        /* @__PURE__ */ jsx19(SelectContent, { children: timeUnits.map((unit) => /* @__PURE__ */ jsx19(SelectItem, { value: unit.label, children: unit.label }, unit.label)) })
+                      render: ({ field }) => /* @__PURE__ */ jsxs7(Select, { value: field.value, onValueChange: field.onChange, children: [
+                        /* @__PURE__ */ jsx20(SelectTrigger, { className: "w-auto rounded-l-none border-l-0 pr-8", children: /* @__PURE__ */ jsx20(SelectValue, {}) }),
+                        /* @__PURE__ */ jsx20(SelectContent, { children: timeUnits.map((unit) => /* @__PURE__ */ jsx20(SelectItem, { value: unit.label, children: unit.label }, unit.label)) })
                       ] })
                     }
                   )
                 ] }),
-                formState.errors.value && /* @__PURE__ */ jsx19("p", { className: "mt-2 text-xs text-red-500", children: formState.errors.value.message }),
-                /* @__PURE__ */ jsx19("p", { className: "mt-2 text-xs text-zinc-500", children: "TTL sets a timer to automatically delete keys after a defined period." })
+                formState.errors.value && /* @__PURE__ */ jsx20("p", { className: "mt-2 text-xs text-red-500", children: formState.errors.value.message }),
+                /* @__PURE__ */ jsx20("p", { className: "mt-2 text-xs text-zinc-500", children: "TTL sets a timer to automatically delete keys after a defined period." })
               ] }),
-              /* @__PURE__ */ jsxs6("div", { className: "flex justify-between", children: [
-                /* @__PURE__ */ jsx19(
+              /* @__PURE__ */ jsxs7("div", { className: "flex justify-between", children: [
+                /* @__PURE__ */ jsx20(
                   Button,
                   {
                     type: "button",
@@ -4862,9 +4893,9 @@ function TTLPopover({
                     children: "Persist"
                   }
                 ),
-                /* @__PURE__ */ jsxs6("div", { className: "flex gap-2", children: [
-                  /* @__PURE__ */ jsx19(Button, { variant: "outline", onClick: () => setOpen(false), type: "button", children: "Cancel" }),
-                  /* @__PURE__ */ jsx19(Button, { variant: "primary", type: "submit", children: /* @__PURE__ */ jsx19(Spinner, { isLoading: isPending, isLoadingText: "Saving", children: "Save" }) })
+                /* @__PURE__ */ jsxs7("div", { className: "flex gap-2", children: [
+                  /* @__PURE__ */ jsx20(Button, { variant: "outline", onClick: () => setOpen(false), type: "button", children: "Cancel" }),
+                  /* @__PURE__ */ jsx20(Button, { variant: "primary", type: "submit", children: /* @__PURE__ */ jsx20(Spinner, { isLoading: isPending, isLoadingText: "Saving", children: "Save" }) })
                 ] })
               ] })
             ]
@@ -4876,7 +4907,7 @@ function TTLPopover({
 }
 
 // src/components/databrowser/components/display/ttl-badge.tsx
-import { jsx as jsx20, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs8 } from "react/jsx-runtime";
 var TTL_INFINITE = -1;
 var TTL_NOT_FOUND = -2;
 var calculateTTL = (expireAt) => {
@@ -4898,9 +4929,9 @@ var TTLBadge = ({
     }, 1e3);
     return () => clearInterval(interval);
   }, [expireAt]);
-  return /* @__PURE__ */ jsx20(Badge, { label, children: ttl === void 0 ? /* @__PURE__ */ jsx20(Skeleton, { className: "ml-1 h-3 w-10 rounded-md opacity-50" }) : /* @__PURE__ */ jsx20(TTLPopover, { ttl, setTTL, isPending, children: /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-[2px]", children: [
+  return /* @__PURE__ */ jsx21(Badge, { label, children: ttl === void 0 ? /* @__PURE__ */ jsx21(Skeleton, { className: "ml-1 h-3 w-10 rounded-md opacity-50" }) : /* @__PURE__ */ jsx21(TTLPopover, { ttl, setTTL, isPending, children: /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-[2px]", children: [
     ttl === TTL_INFINITE ? "No" : formatTime(ttl),
-    /* @__PURE__ */ jsx20(IconChevronDown, { className: "shrink-0 text-zinc-400", size: 16 })
+    /* @__PURE__ */ jsx21(IconChevronDown, { className: "shrink-0 text-zinc-400", size: 16 })
   ] }) }) });
 };
 
@@ -5015,7 +5046,7 @@ var useFetchKeySize = (dataKey) => {
 };
 
 // src/components/databrowser/components/display/header-badges.tsx
-import { jsx as jsx21, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs9 } from "react/jsx-runtime";
 var LengthBadge = ({
   dataKey,
   type,
@@ -5023,18 +5054,18 @@ var LengthBadge = ({
 }) => {
   const { data, isLoading } = useFetchKeyLength({ dataKey, type });
   const length = content?.length ?? data;
-  return /* @__PURE__ */ jsx21(Badge, { label: "Length:", children: isLoading ? /* @__PURE__ */ jsx21(Skeleton, { className: "ml-1 h-3 w-10 rounded-md opacity-50" }) : length });
+  return /* @__PURE__ */ jsx22(Badge, { label: "Length:", children: isLoading ? /* @__PURE__ */ jsx22(Skeleton, { className: "ml-1 h-3 w-10 rounded-md opacity-50" }) : length });
 };
 var SizeBadge = ({ dataKey }) => {
   const { data: size } = useFetchKeySize(dataKey);
-  return /* @__PURE__ */ jsx21(Badge, { label: "Size:", children: size === void 0 || size === null ? /* @__PURE__ */ jsx21(Skeleton, { className: "ml-1 h-3 w-10 rounded-md opacity-50" }) : bytes(size, {
+  return /* @__PURE__ */ jsx22(Badge, { label: "Size:", children: size === void 0 || size === null ? /* @__PURE__ */ jsx22(Skeleton, { className: "ml-1 h-3 w-10 rounded-md opacity-50" }) : bytes(size, {
     unitSeparator: " "
   }) });
 };
 var HeaderTTLBadge = ({ dataKey }) => {
   const { data: expireAt } = useFetchTTL(dataKey);
   const { mutate: setTTL, isPending } = useSetTTL();
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx22(
     TTLBadge,
     {
       expireAt,
@@ -5043,22 +5074,22 @@ var HeaderTTLBadge = ({ dataKey }) => {
     }
   );
 };
-var Badge = ({ children, label }) => /* @__PURE__ */ jsxs8("div", { className: "flex h-[26px] items-center gap-0.5 whitespace-nowrap rounded-md bg-zinc-200 px-2 text-xs text-zinc-700 dark:bg-zinc-300", children: [
-  /* @__PURE__ */ jsx21("span", { className: "text-zinc-500 dark:text-zinc-600", children: label }),
-  /* @__PURE__ */ jsx21("span", { className: "font-medium", children })
+var Badge = ({ children, label }) => /* @__PURE__ */ jsxs9("div", { className: "flex h-[26px] items-center gap-0.5 whitespace-nowrap rounded-md bg-zinc-200 px-2 text-xs text-zinc-700 dark:bg-zinc-300", children: [
+  /* @__PURE__ */ jsx22("span", { className: "text-zinc-500 dark:text-zinc-600", children: label }),
+  /* @__PURE__ */ jsx22("span", { className: "font-medium", children })
 ] });
 
 // src/components/databrowser/components/display/key-actions.tsx
 import { IconDotsVertical } from "@tabler/icons-react";
 
 // src/components/ui/dropdown-menu.tsx
-import * as React9 from "react";
+import * as React10 from "react";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { IconCheck, IconChevronRight, IconCircleFilled } from "@tabler/icons-react";
-import { jsx as jsx22, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs10 } from "react/jsx-runtime";
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-var DropdownMenuSubTrigger = React9.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs9(
+var DropdownMenuSubTrigger = React10.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -5070,12 +5101,12 @@ var DropdownMenuSubTrigger = React9.forwardRef(({ className, inset, children, ..
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx22(IconChevronRight, { className: "ml-auto" })
+      /* @__PURE__ */ jsx23(IconChevronRight, { className: "ml-auto" })
     ]
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
-var DropdownMenuSubContent = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuSubContent = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.SubContent,
   {
     ref,
@@ -5087,7 +5118,7 @@ var DropdownMenuSubContent = React9.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
-var DropdownMenuContent = React9.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx22(
+var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx23(DropdownMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.Content,
   {
     ref,
@@ -5101,7 +5132,7 @@ var DropdownMenuContent = React9.forwardRef(({ className, sideOffset = 4, ...pro
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropdownMenuItem = React9.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuItem = React10.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -5114,7 +5145,7 @@ var DropdownMenuItem = React9.forwardRef(({ className, inset, ...props }, ref) =
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropdownMenuCheckboxItem = React9.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs9(
+var DropdownMenuCheckboxItem = React10.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs10(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -5125,13 +5156,13 @@ var DropdownMenuCheckboxItem = React9.forwardRef(({ className, children, checked
     checked,
     ...props,
     children: [
-      /* @__PURE__ */ jsx22("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx22(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx22(IconCheck, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx23("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx23(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx23(IconCheck, { className: "h-4 w-4" }) }) }),
       children
     ]
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React9.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs9(
+var DropdownMenuRadioItem = React10.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -5141,13 +5172,13 @@ var DropdownMenuRadioItem = React9.forwardRef(({ className, children, ...props }
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsx22("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx22(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx22(IconCircleFilled, { className: "h-2 w-2" }) }) }),
+      /* @__PURE__ */ jsx23("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx23(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx23(IconCircleFilled, { className: "h-2 w-2" }) }) }),
       children
     ]
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
-var DropdownMenuLabel = React9.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuLabel = React10.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.Label,
   {
     ref,
@@ -5156,7 +5187,7 @@ var DropdownMenuLabel = React9.forwardRef(({ className, inset, ...props }, ref)
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-var DropdownMenuSeparator = React9.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx22(
+var DropdownMenuSeparator = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
   DropdownMenuPrimitive.Separator,
   {
     ref,
@@ -5166,7 +5197,7 @@ var DropdownMenuSeparator = React9.forwardRef(({ className, ...props }, ref) =>
 ));
 DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
 var DropdownMenuShortcut = ({ className, ...props }) => {
-  return /* @__PURE__ */ jsx22("span", { className: cn("ml-auto text-xs tracking-widest opacity-60", className), ...props });
+  return /* @__PURE__ */ jsx23("span", { className: cn("ml-auto text-xs tracking-widest opacity-60", className), ...props });
 };
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 
@@ -5174,14 +5205,14 @@ DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
 import { useState as useState6 } from "react";
 
 // src/components/ui/dialog.tsx
-import * as React10 from "react";
+import * as React11 from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { jsx as jsx23, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs11 } from "react/jsx-runtime";
 var Dialog = DialogPrimitive.Root;
 var DialogTrigger = DialogPrimitive.Trigger;
-var DialogPortal = (props) => /* @__PURE__ */ jsx23(DialogPrimitive.Portal, { container: portalRoot, ...props });
+var DialogPortal = (props) => /* @__PURE__ */ jsx24(DialogPrimitive.Portal, { container: portalRoot, ...props });
 DialogPortal.displayName = DialogPrimitive.Portal.displayName;
-var DialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
+var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
   DialogPrimitive.Overlay,
   {
     ref,
@@ -5195,9 +5226,9 @@ var DialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
-var DialogContent = React10.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs10(DialogPortal, { children: [
-  /* @__PURE__ */ jsx23(DialogOverlay, {}),
-  /* @__PURE__ */ jsxs10(
+var DialogContent = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs11(DialogPortal, { children: [
+  /* @__PURE__ */ jsx24(DialogOverlay, {}),
+  /* @__PURE__ */ jsxs11(
     DialogPrimitive.Content,
     {
       ref,
@@ -5217,8 +5248,8 @@ var DialogContent = React10.forwardRef(({ className, children, ...props }, ref)
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsxs10(DialogPrimitive.Close, { className: "absolute right-4 top-4 text-zinc-400 transition-colors hover:text-zinc-600 focus:outline-none disabled:pointer-events-none", children: [
-          /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsxs11(DialogPrimitive.Close, { className: "absolute right-4 top-4 text-zinc-400 transition-colors hover:text-zinc-600 focus:outline-none disabled:pointer-events-none", children: [
+          /* @__PURE__ */ jsx24(
             "svg",
             {
               width: "20",
@@ -5227,7 +5258,7 @@ var DialogContent = React10.forwardRef(({ className, children, ...props }, ref)
               fill: "none",
               xmlns: "http://www.w3.org/2000/svg",
               className: "size-5",
-              children: /* @__PURE__ */ jsx23(
+              children: /* @__PURE__ */ jsx24(
                 "path",
                 {
                   d: "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z",
@@ -5238,16 +5269,16 @@ var DialogContent = React10.forwardRef(({ className, children, ...props }, ref)
               )
             }
           ),
-          /* @__PURE__ */ jsx23("span", { className: "sr-only", children: "Close" })
+          /* @__PURE__ */ jsx24("span", { className: "sr-only", children: "Close" })
         ] })
       ]
     }
   )
 ] }));
 DialogContent.displayName = DialogPrimitive.Content.displayName;
-var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx23("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
+var DialogHeader = ({ className, ...props }) => /* @__PURE__ */ jsx24("div", { className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props });
 DialogHeader.displayName = "DialogHeader";
-var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx23(
+var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx24(
   "div",
   {
     className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
@@ -5255,7 +5286,7 @@ var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ jsx23(
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
+var DialogTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
   DialogPrimitive.Title,
   {
     ref,
@@ -5264,7 +5295,7 @@ var DialogTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx23(
+var DialogDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
   DialogPrimitive.Description,
   {
     ref,
@@ -5275,10 +5306,10 @@ var DialogDescription = React10.forwardRef(({ className, ...props }, ref) => /*
 DialogDescription.displayName = DialogPrimitive.Description.displayName;
 
 // src/components/ui/switch.tsx
-import * as React11 from "react";
+import * as React12 from "react";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
-import { jsx as jsx24 } from "react/jsx-runtime";
-var Switch = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx24(
+import { jsx as jsx25 } from "react/jsx-runtime";
+var Switch = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx25(
   SwitchPrimitives.Root,
   {
     className: cn(
@@ -5287,7 +5318,7 @@ var Switch = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
     ),
     ...props,
     ref,
-    children: /* @__PURE__ */ jsx24(
+    children: /* @__PURE__ */ jsx25(
       SwitchPrimitives.Thumb,
       {
         className: cn(
@@ -5300,7 +5331,7 @@ var Switch = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ *
 Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/components/databrowser/components/delete-key-modal.tsx
-import { jsx as jsx25, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs12 } from "react/jsx-runtime";
 function DeleteKeyModal({
   children,
   onDeleteConfirm,
@@ -5313,24 +5344,28 @@ function DeleteKeyModal({
   const isPlural = count2 > 1;
   const itemLabel = deletionType === "item" ? "Item" : "Key";
   const itemsLabel = deletionType === "item" ? "Items" : "Keys";
+  const [internalOpen, setInternalOpen] = useState6(false);
   const [reindex, setReindex] = useState6(true);
   const [isPending, setIsPending] = useState6(false);
-  return /* @__PURE__ */ jsxs11(Dialog, { open, onOpenChange, children: [
-    children && /* @__PURE__ */ jsx25(DialogTrigger, { asChild: true, children }),
-    /* @__PURE__ */ jsxs11(DialogContent, { children: [
-      /* @__PURE__ */ jsxs11(DialogHeader, { children: [
-        /* @__PURE__ */ jsx25(DialogTitle, { children: isPlural ? `Delete ${count2} ${itemsLabel}` : `Delete ${itemLabel}` }),
-        /* @__PURE__ */ jsxs11(DialogDescription, { className: "mt-5", children: [
+  const isControlled = open !== void 0;
+  const isOpen = isControlled ? open : internalOpen;
+  const setIsOpen = isControlled ? onOpenChange : setInternalOpen;
+  return /* @__PURE__ */ jsxs12(Dialog, { open: isOpen, onOpenChange: setIsOpen, children: [
+    children && /* @__PURE__ */ jsx26(DialogTrigger, { asChild: true, children }),
+    /* @__PURE__ */ jsxs12(DialogContent, { children: [
+      /* @__PURE__ */ jsxs12(DialogHeader, { children: [
+        /* @__PURE__ */ jsx26(DialogTitle, { children: isPlural ? `Delete ${count2} ${itemsLabel}` : `Delete ${itemLabel}` }),
+        /* @__PURE__ */ jsxs12(DialogDescription, { className: "mt-5", children: [
           "Are you sure you want to delete",
           " ",
           isPlural ? `these ${count2} ${deletionType}s` : `this ${deletionType}`,
           "?",
-          /* @__PURE__ */ jsx25("br", {}),
+          /* @__PURE__ */ jsx26("br", {}),
           "This action cannot be undone."
         ] })
       ] }),
-      showReindex && /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx25(
+      showReindex && /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx26(
           Switch,
           {
             id: "reindex",
@@ -5339,20 +5374,20 @@ function DeleteKeyModal({
             disabled: isPending
           }
         ),
-        /* @__PURE__ */ jsx25(Label, { htmlFor: "reindex", className: "cursor-pointer text-sm text-zinc-700", children: "Reindex after deletion" })
+        /* @__PURE__ */ jsx26(Label, { htmlFor: "reindex", className: "cursor-pointer text-sm text-zinc-700", children: "Reindex after deletion" })
       ] }),
-      /* @__PURE__ */ jsxs11(DialogFooter, { children: [
-        /* @__PURE__ */ jsx25(
+      /* @__PURE__ */ jsxs12(DialogFooter, { children: [
+        /* @__PURE__ */ jsx26(
           Button,
           {
             type: "button",
             variant: "outline",
             disabled: isPending,
-            onClick: () => onOpenChange?.(false),
+            onClick: () => setIsOpen?.(false),
             children: "Cancel"
           }
         ),
-        /* @__PURE__ */ jsx25(
+        /* @__PURE__ */ jsx26(
           Button,
           {
             variant: "primary",
@@ -5366,7 +5401,7 @@ function DeleteKeyModal({
                 setIsPending(false);
               }
             },
-            children: /* @__PURE__ */ jsx25(Spinner, { isLoading: isPending, isLoadingText: "Deleting", children: "Yes, Delete" })
+            children: /* @__PURE__ */ jsx26(Spinner, { isLoading: isPending, isLoadingText: "Deleting", children: "Yes, Delete" })
           }
         )
       ] })
@@ -5375,7 +5410,7 @@ function DeleteKeyModal({
 }
 
 // src/components/databrowser/components/display/key-actions.tsx
-import { jsx as jsx26, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs13 } from "react/jsx-runtime";
 function KeyActions({
   dataKey,
   content,
@@ -5383,16 +5418,16 @@ function KeyActions({
 }) {
   const { mutateAsync: deleteKey } = useDeleteKey();
   const { isValuesSearchSelected } = useTab();
-  return /* @__PURE__ */ jsxs12(DropdownMenu, { modal: false, children: [
-    /* @__PURE__ */ jsx26(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx26(Button, { size: "icon-sm", "aria-label": "Key actions", children: /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsxs13(DropdownMenu, { modal: false, children: [
+    /* @__PURE__ */ jsx27(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx27(Button, { size: "icon-sm", "aria-label": "Key actions", children: /* @__PURE__ */ jsx27(
       IconDotsVertical,
       {
         className: "size-4 text-zinc-500 dark:text-zinc-600",
         fill: "rgb(var(--color-zinc-500))"
       }
     ) }) }),
-    /* @__PURE__ */ jsxs12(DropdownMenuContent, { className: "", align: "end", children: [
-      content && /* @__PURE__ */ jsx26(
+    /* @__PURE__ */ jsxs13(DropdownMenuContent, { className: "", align: "end", children: [
+      content && /* @__PURE__ */ jsx27(
         DropdownMenuItem,
         {
           onClick: () => {
@@ -5404,7 +5439,7 @@ function KeyActions({
           children: "Copy content"
         }
       ),
-      /* @__PURE__ */ jsx26(
+      /* @__PURE__ */ jsx27(
         DropdownMenuItem,
         {
           onClick: () => {
@@ -5413,7 +5448,7 @@ function KeyActions({
           children: "Copy key"
         }
       ),
-      /* @__PURE__ */ jsx26(
+      /* @__PURE__ */ jsx27(
         DeleteKeyModal,
         {
           deletionType: "key",
@@ -5421,7 +5456,7 @@ function KeyActions({
           onDeleteConfirm: async (_e, options) => {
             await deleteKey({ keys: [dataKey], reindex: options?.reindex });
           },
-          children: /* @__PURE__ */ jsx26(
+          children: /* @__PURE__ */ jsx27(
             DropdownMenuItem,
             {
               className: "text-red-500 focus:bg-red-500 focus:text-white",
@@ -5436,7 +5471,7 @@ function KeyActions({
 }
 
 // src/components/databrowser/components/display/display-header.tsx
-import { jsx as jsx27, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs14 } from "react/jsx-runtime";
 var DisplayHeader = ({
   dataKey,
   type,
@@ -5447,34 +5482,34 @@ var DisplayHeader = ({
   const handleAddItem = () => {
     setSelectedListItem({ key: type === "stream" ? "*" : "", isNew: true });
   };
-  return /* @__PURE__ */ jsxs13("div", { className: "rounded-lg", children: [
-    /* @__PURE__ */ jsxs13("div", { className: "flex h-[26px] items-center justify-between gap-4", children: [
-      /* @__PURE__ */ jsx27("h2", { className: "grow truncate text-sm", children: dataKey.trim() === "" ? /* @__PURE__ */ jsx27("span", { className: "ml-1 text-zinc-500", children: "(Empty Key)" }) : /* @__PURE__ */ jsx27("span", { className: "font-medium text-zinc-950", children: dataKey }) }),
-      /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-1", children: [
-        type !== "string" && type !== "json" && type !== "search" && /* @__PURE__ */ jsx27(SimpleTooltip, { content: "Add item", children: /* @__PURE__ */ jsx27(Button, { onClick: handleAddItem, size: "icon-sm", "aria-label": "Add item", children: /* @__PURE__ */ jsx27(IconPlus, { className: "size-4 text-zinc-500 dark:text-zinc-600" }) }) }),
-        /* @__PURE__ */ jsx27(KeyActions, { dataKey, content, type })
+  return /* @__PURE__ */ jsxs14("div", { className: "rounded-lg", children: [
+    /* @__PURE__ */ jsxs14("div", { className: "flex h-[26px] items-center justify-between gap-4", children: [
+      /* @__PURE__ */ jsx28("h2", { className: "grow truncate text-sm", children: dataKey.trim() === "" ? /* @__PURE__ */ jsx28("span", { className: "ml-1 text-zinc-500", children: "(Empty Key)" }) : /* @__PURE__ */ jsx28("span", { className: "font-medium text-zinc-950", children: dataKey }) }),
+      /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-1", children: [
+        type !== "string" && type !== "json" && type !== "search" && /* @__PURE__ */ jsx28(SimpleTooltip, { content: "Add item", children: /* @__PURE__ */ jsx28(Button, { onClick: handleAddItem, size: "icon-sm", "aria-label": "Add item", children: /* @__PURE__ */ jsx28(IconPlus, { className: "size-4 text-zinc-500 dark:text-zinc-600" }) }) }),
+        /* @__PURE__ */ jsx28(KeyActions, { dataKey, content, type })
       ] })
     ] }),
-    type === "search" && hideTypeTag ? void 0 : /* @__PURE__ */ jsxs13("div", { className: "flex h-10 items-center gap-1.5 overflow-x-scroll", children: [
-      !hideTypeTag && /* @__PURE__ */ jsx27(TypeTag, { variant: type, type: "badge" }),
-      type !== "search" && /* @__PURE__ */ jsx27(SizeBadge, { dataKey }),
-      type !== "search" && /* @__PURE__ */ jsx27(LengthBadge, { dataKey, type, content }),
-      type !== "search" && /* @__PURE__ */ jsx27(HeaderTTLBadge, { dataKey })
-    ] })
+    type === "search" && hideTypeTag ? void 0 : /* @__PURE__ */ jsx28(ScrollArea, { orientation: "horizontal", className: "w-full whitespace-nowrap", children: /* @__PURE__ */ jsxs14("div", { className: "flex w-max items-center gap-1.5 pb-2 pt-1", children: [
+      !hideTypeTag && /* @__PURE__ */ jsx28(TypeTag, { variant: type, type: "badge" }),
+      type !== "search" && /* @__PURE__ */ jsx28(SizeBadge, { dataKey }),
+      type !== "search" && /* @__PURE__ */ jsx28(LengthBadge, { dataKey, type, content }),
+      type !== "search" && /* @__PURE__ */ jsx28(HeaderTTLBadge, { dataKey })
+    ] }) })
   ] });
 };
 
 // src/components/databrowser/components/display/key-deleted.tsx
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx29 } from "react/jsx-runtime";
 var KeyDeleted = () => {
-  return /* @__PURE__ */ jsx28("div", { className: "flex h-full items-center justify-center rounded-md border border-dashed border-zinc-300", children: /* @__PURE__ */ jsx28("span", { className: "text-zinc-500", children: "This key has been deleted" }) });
+  return /* @__PURE__ */ jsx29("div", { className: "flex h-full items-center justify-center rounded-md border border-dashed border-zinc-300", children: /* @__PURE__ */ jsx29("span", { className: "text-zinc-500", children: "This key has been deleted" }) });
 };
 
 // src/components/databrowser/components/docs-link.tsx
 import { IconExternalLink } from "@tabler/icons-react";
-import { jsx as jsx29, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs15 } from "react/jsx-runtime";
 var DocsLink = ({ href, className }) => {
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     "a",
     {
       href,
@@ -5486,7 +5521,7 @@ var DocsLink = ({ href, className }) => {
       ),
       children: [
         "Docs",
-        /* @__PURE__ */ jsx29(IconExternalLink, { size: 12 })
+        /* @__PURE__ */ jsx30(IconExternalLink, { size: 12 })
       ]
     }
   );
@@ -5496,10 +5531,10 @@ var DocsLink = ({ href, className }) => {
 import { useEffect as useEffect7, useState as useState7 } from "react";
 
 // src/components/ui/progress.tsx
-import * as React12 from "react";
+import * as React13 from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-import { jsx as jsx30 } from "react/jsx-runtime";
-var Progress = React12.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ jsx30(
+import { jsx as jsx31 } from "react/jsx-runtime";
+var Progress = React13.forwardRef(({ className, value, ...props }, ref) => /* @__PURE__ */ jsx31(
   ProgressPrimitive.Root,
   {
     ref,
@@ -5508,7 +5543,7 @@ var Progress = React12.forwardRef(({ className, value, ...props }, ref) => /* @_
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx30(
+    children: /* @__PURE__ */ jsx31(
       ProgressPrimitive.Indicator,
       {
         className: "h-full w-full flex-1 bg-neutral-900 transition-all dark:bg-neutral-50",
@@ -5520,7 +5555,7 @@ var Progress = React12.forwardRef(({ className, value, ...props }, ref) => /* @_
 Progress.displayName = ProgressPrimitive.Root.displayName;
 
 // src/components/databrowser/components/search/save-schema-modal.tsx
-import { Fragment as Fragment3, jsx as jsx31, jsxs as jsxs15 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx32, jsxs as jsxs16 } from "react/jsx-runtime";
 var SaveSchemaModal = ({
   values,
   onClose
@@ -5576,14 +5611,14 @@ var SaveSchemaModal = ({
     }
   };
   const isRunning = status !== void 0;
-  return /* @__PURE__ */ jsx31(
+  return /* @__PURE__ */ jsx32(
     Dialog,
     {
       open: values !== void 0,
       onOpenChange: (open) => {
         if (!open && !isRunning) onClose();
       },
-      children: /* @__PURE__ */ jsxs15(
+      children: /* @__PURE__ */ jsxs16(
         DialogContent,
         {
           onInteractOutside: (e) => {
@@ -5593,26 +5628,26 @@ var SaveSchemaModal = ({
             if (isRunning) e.preventDefault();
           },
           children: [
-            /* @__PURE__ */ jsxs15(DialogHeader, { children: [
-              /* @__PURE__ */ jsx31(DialogTitle, { children: "Save Schema Changes" }),
-              !isRunning && !error && /* @__PURE__ */ jsxs15(DialogDescription, { children: [
+            /* @__PURE__ */ jsxs16(DialogHeader, { children: [
+              /* @__PURE__ */ jsx32(DialogTitle, { children: "Save Schema Changes" }),
+              !isRunning && !error && /* @__PURE__ */ jsxs16(DialogDescription, { children: [
                 "Saving will drop and recreate the index. This will temporarily make the index unavailable.",
-                /* @__PURE__ */ jsx31("br", {}),
-                /* @__PURE__ */ jsx31("br", {}),
+                /* @__PURE__ */ jsx32("br", {}),
+                /* @__PURE__ */ jsx32("br", {}),
                 "Are you sure you want to continue?"
               ] })
             ] }),
-            isRunning && /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-2 py-4", children: [
-              /* @__PURE__ */ jsx31("p", { className: "text-sm text-zinc-500", children: status }),
-              /* @__PURE__ */ jsx31(Progress, { value: progress })
+            isRunning && /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-2 py-4", children: [
+              /* @__PURE__ */ jsx32("p", { className: "text-sm text-zinc-500", children: status }),
+              /* @__PURE__ */ jsx32(Progress, { value: progress })
             ] }),
-            error && /* @__PURE__ */ jsx31("div", { className: "w-full break-words text-sm text-red-500", children: formatUpstashErrorMessage(error) }),
-            /* @__PURE__ */ jsxs15(DialogFooter, { children: [
-              !isRunning && !error && /* @__PURE__ */ jsxs15(Fragment3, { children: [
-                /* @__PURE__ */ jsx31(Button, { onClick: onClose, children: "Cancel" }),
-                /* @__PURE__ */ jsx31(Button, { variant: "primary", onClick: handleConfirm, children: "Confirm" })
+            error && /* @__PURE__ */ jsx32("div", { className: "w-full break-words text-sm text-red-500", children: formatUpstashErrorMessage(error) }),
+            /* @__PURE__ */ jsxs16(DialogFooter, { children: [
+              !isRunning && !error && /* @__PURE__ */ jsxs16(Fragment3, { children: [
+                /* @__PURE__ */ jsx32(Button, { onClick: onClose, children: "Cancel" }),
+                /* @__PURE__ */ jsx32(Button, { variant: "primary", onClick: handleConfirm, children: "Confirm" })
               ] }),
-              error && /* @__PURE__ */ jsx31(Button, { onClick: onClose, children: "Close" })
+              error && /* @__PURE__ */ jsx32(Button, { onClick: onClose, children: "Close" })
             ] })
           ]
         }
@@ -5627,11 +5662,11 @@ import { useMemo as useMemo6 } from "react";
 // src/components/common/editor-with-types.tsx
 import { useEffect as useEffect8, useRef as useRef2 } from "react";
 import { Editor, useMonaco } from "@monaco-editor/react";
-import { jsx as jsx32 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 var EditorWithTypes = (props) => {
-  return isTest ? /* @__PURE__ */ jsx32(TestEditor, { ...props }) : /* @__PURE__ */ jsx32(MonacoEditorWithTypes, { ...props });
+  return isTest ? /* @__PURE__ */ jsx33(TestEditor, { ...props }) : /* @__PURE__ */ jsx33(MonacoEditorWithTypes, { ...props });
 };
-var LoadingSpinner = () => /* @__PURE__ */ jsx32("div", { className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ jsx32("div", { className: "h-4 w-4 animate-spin rounded-full border-2 border-zinc-300 border-t-zinc-600" }) });
+var LoadingSpinner = () => /* @__PURE__ */ jsx33("div", { className: "flex h-full w-full items-center justify-center", children: /* @__PURE__ */ jsx33("div", { className: "h-4 w-4 animate-spin rounded-full border-2 border-zinc-300 border-t-zinc-600" }) });
 var MonacoEditorWithTypes = ({
   value,
   onChange,
@@ -5684,16 +5719,16 @@ var MonacoEditorWithTypes = ({
   useEffect8(() => {
     if (!validateValue(value)) onChange(defaultValue);
   }, [value, onChange, validateValue, defaultValue]);
-  return /* @__PURE__ */ jsx32(
+  return /* @__PURE__ */ jsx33(
     "div",
     {
       className: cn("group/editor relative", height === void 0 && "h-full"),
       style: { height },
-      children: /* @__PURE__ */ jsx32(
+      children: /* @__PURE__ */ jsx33(
         Editor,
         {
           theme: theme === "dark" ? "vs-dark" : "light",
-          loading: /* @__PURE__ */ jsx32(LoadingSpinner, {}),
+          loading: /* @__PURE__ */ jsx33(LoadingSpinner, {}),
           beforeMount: handleBeforeMount,
           onMount: (editor) => {
             editorRef.current = editor;
@@ -5784,12 +5819,12 @@ var handleBeforeMount = (monaco) => {
   monaco.languages.typescript.typescriptDefaults.setEagerModelSync(true);
 };
 var TestEditor = ({ value, onChange, height, testLabel }) => {
-  return /* @__PURE__ */ jsx32(
+  return /* @__PURE__ */ jsx33(
     "div",
     {
       className: cn("group/editor relative", height === void 0 && "h-full"),
       style: { height },
-      children: /* @__PURE__ */ jsx32(
+      children: /* @__PURE__ */ jsx33(
         "textarea",
         {
           "aria-label": testLabel,
@@ -5820,7 +5855,7 @@ type TextFieldBuild<TNoTokenize extends Record<"noTokenize", boolean>, TNoStem e
 } : {}) : TFrom["from"] extends string ? {
     type: "TEXT";
     from: TFrom["from"];
-} : "TEXT";
+} : { type: "TEXT" };
 declare const BUILD: unique symbol;
 declare class TextFieldBuilder<TNoTokenize extends Record<"noTokenize", boolean> = {
     noTokenize: false;
@@ -5888,7 +5923,7 @@ declare class BoolFieldBuilder<Fast extends Record<"fast", boolean> = {
     } : TFrom["from"] extends string ? {
         type: "BOOL";
         from: TFrom["from"];
-    } : "BOOL";
+    } : { type: "BOOL" };
 }
 declare class DateFieldBuilder<Fast extends Record<"fast", boolean> = {
     fast: false;
@@ -5916,7 +5951,13 @@ declare class DateFieldBuilder<Fast extends Record<"fast", boolean> = {
     } : TFrom["from"] extends string ? {
         type: "DATE";
         from: TFrom["from"];
-    } : "DATE";
+    } : { type: "DATE" };
+}
+declare class KeywordFieldBuilder {
+    [BUILD](): { type: "KEYWORD" };
+}
+declare class FacetFieldBuilder {
+    [BUILD](): { type: "FACET" };
 }
 type FieldBuilder = TextFieldBuilder<{
     noTokenize: boolean;
@@ -5934,12 +5975,14 @@ type FieldBuilder = TextFieldBuilder<{
     fast: boolean;
 }, {
     from: string | null;
-}>;
+}> | KeywordFieldBuilder | FacetFieldBuilder;
 declare const s: {
     string(): TextFieldBuilder;
     number<T extends NumericField["type"] = "F64">(type?: T): NumericFieldBuilder<T>;
     boolean(): BoolFieldBuilder;
     date(): DateFieldBuilder;
+    keyword(): KeywordFieldBuilder;
+    facet(): FacetFieldBuilder;
     object<T extends ObjectFieldRecord<T>>(fields: T): { [K in keyof T]: T[K] extends FieldBuilder ? ReturnType<T[K][typeof BUILD]> : T[K]; };
 };
 type ObjectFieldRecord<T> = {
@@ -5957,7 +6000,7 @@ type Schema = NestedIndexSchema | FlatIndexSchema;
 };
 
 // src/components/databrowser/components/search/schema-editor.tsx
-import { jsx as jsx33 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 var SCHEMA_PREFIX = "const schema: Schema = s.object({";
 var SCHEMA_SUFFIX = "})";
 var SCHEMA_DEFAULT = "const schema: Schema = s.object({\n  name: s.string(),\n})";
@@ -5966,7 +6009,7 @@ var isSchemaStringValid = (value) => {
 };
 var SchemaEditor = ({ value, onChange, height }) => {
   const typeDefinitions = useMemo6(() => generateSchemaTypeDefinitions(), []);
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     EditorWithTypes,
     {
       value,
@@ -5982,8 +6025,125 @@ var SchemaEditor = ({ value, onChange, height }) => {
   );
 };
 
+// src/components/databrowser/components/search/schema-stringify.ts
+function schemaToEditorValue(flatSchema) {
+  const nested = unflattenSchema(flatSchema);
+  const body = renderObject(nested, 1);
+  return `const schema: Schema = s.object({
+${body}})`;
+}
+function unflattenSchema(flat) {
+  const result = {};
+  for (const [key, value] of Object.entries(flat)) {
+    const parts = key.split(".");
+    let current = result;
+    for (let i = 0; i < parts.length - 1; i++) {
+      const part = parts[i];
+      if (!current[part] || typeof current[part] !== "object") {
+        current[part] = {};
+      }
+      current = current[part];
+    }
+    current[parts.at(-1)] = value;
+  }
+  return result;
+}
+function renderObject(obj, indent) {
+  const pad = "  ".repeat(indent);
+  const lines = [];
+  for (const [key, value] of Object.entries(obj)) {
+    if (isFieldValue(value)) {
+      lines.push(`${pad}${key}: ${fieldToBuilder(value)},`);
+    } else {
+      const nested = renderObject(value, indent + 1);
+      lines.push(`${pad}${key}: s.object({`);
+      lines.push(nested.trimEnd());
+      lines.push(`${pad}}),`);
+    }
+  }
+  return lines.join("\n") + "\n";
+}
+function isFieldValue(value) {
+  if (typeof value === "string") return true;
+  if (typeof value === "object" && value !== null) {
+    return "type" in value;
+  }
+  return false;
+}
+function fieldToBuilder(value) {
+  if (typeof value === "string") {
+    switch (value) {
+      case "TEXT": {
+        return "s.string()";
+      }
+      case "BOOL": {
+        return "s.boolean()";
+      }
+      case "DATE": {
+        return "s.date()";
+      }
+      case "U64":
+      case "I64":
+      case "F64": {
+        return `s.number("${value}")`;
+      }
+      case "KEYWORD": {
+        return "s.keyword()";
+      }
+      case "FACET": {
+        return "s.facet()";
+      }
+      default: {
+        return "s.string()";
+      }
+    }
+  }
+  const v = value;
+  const type = v.type;
+  let builder = "";
+  switch (type) {
+    case "TEXT": {
+      builder = "s.string()";
+      if (v.noTokenize) builder += ".noTokenize()";
+      if (v.noStem) builder += ".noStem()";
+      break;
+    }
+    case "U64":
+    case "I64":
+    case "F64": {
+      builder = `s.number("${type}")`;
+      break;
+    }
+    case "BOOL": {
+      builder = "s.boolean()";
+      if (v.fast) builder += ".fast()";
+      break;
+    }
+    case "DATE": {
+      builder = "s.date()";
+      if (v.fast) builder += ".fast()";
+      break;
+    }
+    case "KEYWORD": {
+      builder = "s.keyword()";
+      break;
+    }
+    case "FACET": {
+      builder = "s.facet()";
+      break;
+    }
+    default: {
+      builder = "s.string()";
+    }
+  }
+  if (v.from) {
+    builder += `.from("${v.from}")`;
+  }
+  return builder;
+}
+
 // src/components/databrowser/components/search/display-search.tsx
-import { jsx as jsx34, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs17 } from "react/jsx-runtime";
 var SearchDisplay = ({
   indexName,
   isCreateModal,
@@ -6009,6 +6169,7 @@ var SearchDisplay = ({
   const currentIndexName = watch("indexName");
   const effectiveIndexName = isCreateModal ? currentIndexName : indexName ?? "";
   const [pendingFormValues, setPendingFormValues] = useState8();
+  const [parseError, setParseError] = useState8();
   const { data, isLoading } = useFetchSearchIndex(indexName, {
     enabled: !isCreateModal
   });
@@ -6024,6 +6185,7 @@ var SearchDisplay = ({
     });
   }, [data, reset, indexName]);
   const onSubmit = (values) => {
+    setParseError(void 0);
     if (isCreateModal) {
       createSchema.mutate(
         {
@@ -6038,6 +6200,11 @@ var SearchDisplay = ({
         }
       );
     } else {
+      const result = parseSchemaFromEditorValue(values.editorValue);
+      if (!result.success) {
+        setParseError(result.error);
+        return;
+      }
       setPendingFormValues({ ...values, indexName });
     }
   };
@@ -6046,14 +6213,14 @@ var SearchDisplay = ({
     reset();
   };
   if (!isCreateModal && !isLoading && (data === null || data === void 0)) {
-    return /* @__PURE__ */ jsx34(KeyDeleted, {});
-  }
-  return /* @__PURE__ */ jsxs16("div", { className: "flex h-full min-h-0 w-full min-w-0 flex-col gap-2", children: [
-    !isCreateModal && /* @__PURE__ */ jsx34(DisplayHeader, { dataKey: effectiveIndexName, type: "search", hideTypeTag: isEditModal }),
-    /* @__PURE__ */ jsx34("div", { className: "flex min-h-0 min-w-0 grow flex-col gap-2 rounded-md", children: !isCreateModal && isLoading ? /* @__PURE__ */ jsx34(Spinner, { isLoadingText: "", isLoading: true }) : /* @__PURE__ */ jsxs16("div", { className: "flex min-h-0 w-full flex-1 flex-col gap-3", children: [
-      isCreateModal && /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx34(Label, { htmlFor: "index-name", children: "Key" }),
-        /* @__PURE__ */ jsx34(
+    return /* @__PURE__ */ jsx35(KeyDeleted, {});
+  }
+  return /* @__PURE__ */ jsxs17("div", { className: "flex h-full min-h-0 w-full min-w-0 flex-col gap-2", children: [
+    !isCreateModal && /* @__PURE__ */ jsx35(DisplayHeader, { dataKey: effectiveIndexName, type: "search", hideTypeTag: isEditModal }),
+    /* @__PURE__ */ jsx35("div", { className: "flex min-h-0 min-w-0 grow flex-col gap-2 rounded-md", children: !isCreateModal && isLoading ? /* @__PURE__ */ jsx35(Spinner, { isLoadingText: "", isLoading: true }) : /* @__PURE__ */ jsxs17("div", { className: "flex min-h-0 w-full flex-1 flex-col gap-3", children: [
+      isCreateModal && /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-1.5", children: [
+        /* @__PURE__ */ jsx35(Label, { htmlFor: "index-name", children: "Index Key" }),
+        /* @__PURE__ */ jsx35(
           Input,
           {
             id: "index-name",
@@ -6061,42 +6228,42 @@ var SearchDisplay = ({
             placeholder: "idx_users"
           }
         ),
-        errors.indexName && /* @__PURE__ */ jsx34("p", { className: "text-xs text-red-500", children: errors.indexName.message })
+        errors.indexName && /* @__PURE__ */ jsx35("p", { className: "text-xs text-red-500", children: errors.indexName.message })
       ] }),
-      /* @__PURE__ */ jsxs16("div", { className: "shrink-0 rounded-md border border-zinc-300 bg-white p-3", children: [
-        /* @__PURE__ */ jsx34("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsx34("h3", { className: "text-sm font-medium text-zinc-700", children: "Config" }) }),
-        /* @__PURE__ */ jsxs16("div", { className: "mt-2 grid grid-cols-2 gap-4 text-sm lg:grid-cols-4", children: [
-          /* @__PURE__ */ jsxs16("div", { children: [
-            /* @__PURE__ */ jsx34("span", { className: "mb-1.5 block text-xs font-medium text-zinc-500", children: "Data Type" }),
-            /* @__PURE__ */ jsx34(
+      /* @__PURE__ */ jsxs17("div", { className: "shrink-0 rounded-md border border-zinc-300 bg-white p-3", children: [
+        /* @__PURE__ */ jsx35("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsx35("h3", { className: "text-sm font-medium text-zinc-700", children: "Config" }) }),
+        /* @__PURE__ */ jsxs17("div", { className: "mt-2 grid grid-cols-2 gap-4 text-sm lg:grid-cols-4", children: [
+          /* @__PURE__ */ jsxs17("div", { children: [
+            /* @__PURE__ */ jsx35("span", { className: "mb-1.5 block text-xs font-medium text-zinc-500", children: "Data Type" }),
+            /* @__PURE__ */ jsx35(
               Controller2,
               {
                 name: "dataType",
                 control,
-                render: ({ field }) => /* @__PURE__ */ jsxs16(Select, { value: field.value, onValueChange: field.onChange, children: [
-                  /* @__PURE__ */ jsx34(SelectTrigger, { className: "h-8 w-auto pl-[3px] pr-8", children: /* @__PURE__ */ jsx34(SelectValue, { placeholder: "Select type" }) }),
-                  /* @__PURE__ */ jsx34(SelectContent, { children: ["string", "hash", "json"].map((type) => /* @__PURE__ */ jsx34(SelectItem, { value: type, children: /* @__PURE__ */ jsx34(TypeTag, { variant: type, type: "badge" }) }, type)) })
+                render: ({ field }) => /* @__PURE__ */ jsxs17(Select, { value: field.value, onValueChange: field.onChange, children: [
+                  /* @__PURE__ */ jsx35(SelectTrigger, { className: "h-8 w-auto pl-[3px] pr-8", children: /* @__PURE__ */ jsx35(SelectValue, { placeholder: "Select type" }) }),
+                  /* @__PURE__ */ jsx35(SelectContent, { children: ["string", "hash", "json"].map((type) => /* @__PURE__ */ jsx35(SelectItem, { value: type, children: /* @__PURE__ */ jsx35(TypeTag, { variant: type, type: "badge" }) }, type)) })
                 ] })
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs16("div", { children: [
-            /* @__PURE__ */ jsx34("span", { className: "mb-1.5 block text-xs font-medium text-zinc-500", children: "Language" }),
-            /* @__PURE__ */ jsx34(
+          /* @__PURE__ */ jsxs17("div", { children: [
+            /* @__PURE__ */ jsx35("span", { className: "mb-1.5 block text-xs font-medium text-zinc-500", children: "Language" }),
+            /* @__PURE__ */ jsx35(
               Controller2,
               {
                 name: "language",
                 control,
-                render: ({ field }) => /* @__PURE__ */ jsxs16(Select, { value: field.value, onValueChange: field.onChange, children: [
-                  /* @__PURE__ */ jsx34(SelectTrigger, { className: "h-8", children: /* @__PURE__ */ jsx34(SelectValue, { placeholder: "Select language" }) }),
-                  /* @__PURE__ */ jsx34(SelectContent, { children: LANGUAGES.map((lang) => /* @__PURE__ */ jsx34(SelectItem, { value: lang, children: lang.charAt(0).toUpperCase() + lang.slice(1) }, lang)) })
+                render: ({ field }) => /* @__PURE__ */ jsxs17(Select, { value: field.value, onValueChange: field.onChange, children: [
+                  /* @__PURE__ */ jsx35(SelectTrigger, { className: "h-8", children: /* @__PURE__ */ jsx35(SelectValue, { placeholder: "Select language" }) }),
+                  /* @__PURE__ */ jsx35(SelectContent, { children: LANGUAGES.map((lang) => /* @__PURE__ */ jsx35(SelectItem, { value: lang, children: lang.charAt(0).toUpperCase() + lang.slice(1) }, lang)) })
                 ] })
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs16("div", { className: "col-span-2", children: [
-            /* @__PURE__ */ jsx34("span", { className: "mb-1.5 block text-xs font-medium text-zinc-500", children: "Prefixes" }),
-            /* @__PURE__ */ jsx34(
+          /* @__PURE__ */ jsxs17("div", { className: "col-span-2", children: [
+            /* @__PURE__ */ jsx35("span", { className: "mb-1.5 block text-xs font-medium text-zinc-500", children: "Prefixes" }),
+            /* @__PURE__ */ jsx35(
               Input,
               {
                 ...register("prefixes", { required: "Please enter at least one prefix" }),
@@ -6104,18 +6271,18 @@ var SearchDisplay = ({
                 placeholder: "user:, post:"
               }
             ),
-            errors.prefixes && /* @__PURE__ */ jsx34("p", { className: "mt-1 text-xs text-red-500", children: errors.prefixes.message })
+            errors.prefixes && /* @__PURE__ */ jsx35("p", { className: "mt-1 text-xs text-red-500", children: errors.prefixes.message })
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs16("div", { className: "relative flex min-h-0 flex-1 flex-col rounded-md border border-zinc-300 bg-white", children: [
-        /* @__PURE__ */ jsx34("div", { className: "flex items-center justify-between border-b border-zinc-200 px-3 py-2", children: /* @__PURE__ */ jsx34("h3", { className: "text-sm font-medium text-zinc-700", children: "Schema" }) }),
-        /* @__PURE__ */ jsx34("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx34("div", { className: "h-full px-1", children: /* @__PURE__ */ jsx34(
+      /* @__PURE__ */ jsxs17("div", { className: "relative flex min-h-0 flex-1 flex-col rounded-md border border-zinc-300 bg-white", children: [
+        /* @__PURE__ */ jsx35("div", { className: "flex items-center justify-between border-b border-zinc-200 px-3 py-2", children: /* @__PURE__ */ jsx35("h3", { className: "text-sm font-medium text-zinc-700", children: "Schema" }) }),
+        /* @__PURE__ */ jsx35("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx35("div", { className: "h-full px-1", children: /* @__PURE__ */ jsx35(
           Controller2,
           {
             name: "editorValue",
             control,
-            render: ({ field }) => /* @__PURE__ */ jsx34(
+            render: ({ field }) => /* @__PURE__ */ jsx35(
               SchemaEditor,
               {
                 value: field.value,
@@ -6125,7 +6292,7 @@ var SearchDisplay = ({
             )
           }
         ) }) }),
-        /* @__PURE__ */ jsx34(
+        /* @__PURE__ */ jsx35(
           DocsLink,
           {
             className: "absolute bottom-2 right-2 text-sm",
@@ -6133,9 +6300,10 @@ var SearchDisplay = ({
           }
         )
       ] }),
-      isCreateModal && createSchema.error && /* @__PURE__ */ jsx34("div", { className: "w-full break-words text-xs text-red-500", children: createSchema.error.message.startsWith("ERR syntax error") ? "Invalid schema" : formatUpstashErrorMessage(createSchema.error) }),
-      /* @__PURE__ */ jsx34("div", { className: "flex shrink-0 items-center gap-2", children: /* @__PURE__ */ jsxs16("div", { className: "ml-auto flex gap-2", children: [
-        (isDirty || isCreateModal || isEditModal) && /* @__PURE__ */ jsx34(
+      isCreateModal && createSchema.error && /* @__PURE__ */ jsx35("div", { className: "w-full break-words text-xs text-red-500", children: createSchema.error.message.startsWith("ERR syntax error") ? "Invalid schema" : formatUpstashErrorMessage(createSchema.error) }),
+      parseError && /* @__PURE__ */ jsx35("div", { className: "w-full break-words text-xs text-red-500", children: parseError }),
+      /* @__PURE__ */ jsx35("div", { className: "flex shrink-0 items-center gap-2", children: /* @__PURE__ */ jsxs17("div", { className: "ml-auto flex gap-2", children: [
+        (isDirty || isCreateModal || isEditModal) && /* @__PURE__ */ jsx35(
           Button,
           {
             onClick: () => {
@@ -6148,15 +6316,14 @@ var SearchDisplay = ({
             children: "Cancel"
           }
         ),
-        /* @__PURE__ */ jsx34(Button, { variant: "primary", onClick: handleSubmit(onSubmit), disabled: !isDirty, children: /* @__PURE__ */ jsx34(Spinner, { isLoading: createSchema.isPending, isLoadingText: "Saving", children: isCreateModal ? "Create" : "Save..." }) })
+        /* @__PURE__ */ jsx35(Button, { variant: "primary", onClick: handleSubmit(onSubmit), disabled: !isDirty, children: /* @__PURE__ */ jsx35(Spinner, { isLoading: createSchema.isPending, isLoadingText: "Saving", children: isCreateModal ? "Create" : "Save..." }) })
       ] }) }),
-      /* @__PURE__ */ jsx34(
+      /* @__PURE__ */ jsx35(
         SaveSchemaModal,
         {
           values: pendingFormValues,
           onClose: () => {
             setPendingFormValues(void 0);
-            reset();
             if (isEditModal && onClose) onClose();
           }
         }
@@ -6192,63 +6359,6 @@ import { IconTrash as IconTrash2 } from "@tabler/icons-react";
 // src/components/common/infinite-scroll.tsx
 import { useEffect as useEffect10, useRef as useRef3 } from "react";
 import { IconLoader2 } from "@tabler/icons-react";
-
-// src/components/ui/scroll-area.tsx
-import * as React13 from "react";
-import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { jsx as jsx35, jsxs as jsxs17 } from "react/jsx-runtime";
-var ScrollArea = React13.forwardRef(
-  ({
-    className,
-    scrollBarClassName,
-    scrollBarForceMount,
-    children,
-    onScroll,
-    disableRoundedInherit = false,
-    ...props
-  }, ref) => /* @__PURE__ */ jsxs17(
-    ScrollAreaPrimitive.Root,
-    {
-      ref,
-      className: cn("relative overflow-hidden", className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx35(
-          ScrollAreaPrimitive.Viewport,
-          {
-            onScroll,
-            className: cn(
-              "h-full w-full [&>div]:!block",
-              !disableRoundedInherit && "rounded-[inherit]"
-            ),
-            children
-          }
-        ),
-        /* @__PURE__ */ jsx35(ScrollBar, { className: scrollBarClassName, forceMount: scrollBarForceMount }),
-        /* @__PURE__ */ jsx35(ScrollAreaPrimitive.Corner, {})
-      ]
-    }
-  )
-);
-ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBar = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
-  ScrollAreaPrimitive.ScrollAreaScrollbar,
-  {
-    ref,
-    orientation: "vertical",
-    className: cn("mr-1 flex h-full w-2 touch-none select-none transition-colors", className),
-    ...props,
-    children: /* @__PURE__ */ jsx35(
-      ScrollAreaPrimitive.ScrollAreaThumb,
-      {
-        className: cn("relative flex-1 rounded-full bg-zinc-400/70")
-      }
-    )
-  }
-));
-ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
-
-// src/components/common/infinite-scroll.tsx
 import { jsx as jsx36, jsxs as jsxs18 } from "react/jsx-runtime";
 var InfiniteScroll = ({
   query,
@@ -6287,7 +6397,7 @@ var InfiniteScroll = ({
       type: "always",
       onScroll: handleScroll,
       ...props,
-      className: cn("block h-full w-full overflow-visible transition-all", props.className),
+      className: cn("block h-full min-h-0 w-full overflow-hidden transition-all", props.className),
       ref: scrollRef,
       children: /* @__PURE__ */ jsxs18("div", { ref: contentRef, children: [
         children,
@@ -7377,8 +7487,16 @@ import { useMutation as useMutation8 } from "@tanstack/react-query";
 
 // src/components/databrowser/components/search/search-types-file.ts
 var SEARCH_TYPES = `
-
-export const FIELD_TYPES = ["TEXT", "U64", "I64", "F64", "BOOL", "DATE"] as const;
+export const FIELD_TYPES = [
+  "TEXT",
+  "U64",
+  "I64",
+  "F64",
+  "BOOL",
+  "DATE",
+  "KEYWORD",
+  "FACET",
+] as const;
 export type FieldType = (typeof FIELD_TYPES)[number];
 
 export type TextField = {
@@ -7406,7 +7524,21 @@ export type DateField = {
   from?: string;
 };
 
-export type DetailedField = TextField | NumericField | BoolField | DateField;
+export type KeywordField = {
+  type: "KEYWORD";
+};
+
+export type FacetField = {
+  type: "FACET";
+};
+
+export type DetailedField =
+  | TextField
+  | NumericField
+  | BoolField
+  | DateField
+  | KeywordField
+  | FacetField;
 export type NestedIndexSchema = {
   [key: string]: FieldType | DetailedField | NestedIndexSchema;
 };
@@ -7454,7 +7586,11 @@ type FieldValueType<T extends FieldType> = T extends "TEXT"
       ? boolean
       : T extends "DATE"
         ? string
-        : never;
+        : T extends "KEYWORD"
+          ? string
+          : T extends "FACET"
+            ? string
+            : never;
 
 type GetFieldValueType<TSchema, Path extends string> =
   GetFieldAtPath<TSchema, Path> extends infer Field
@@ -7561,7 +7697,7 @@ type PathToNestedObject<
   TSchema,
   Path extends string,
   Value,
-> = Path extends \`\${ infer First }.\${ infer Rest }\`
+> = Path extends \`\${infer First}.\${infer Rest}\`
   ? { [K in First]: PathToNestedObject<TSchema, Rest, Value> }
   : { [K in Path]: Value };
 
@@ -7638,7 +7774,6 @@ export type PublicQueryResult<
 // These are the operations that can be used for each field type
 type StringOperationMap<T extends string> = {
   $eq: T;
-  $ne: T;
   $in: T[];
   $fuzzy: T | { value: T; distance?: number; transpositionCostOne?: boolean };
   $phrase:
@@ -7652,7 +7787,15 @@ type StringOperationMap<T extends string> = {
 
 type NumberOperationMap<T extends number> = {
   $eq: T;
-  $ne: T;
+  $in: T[];
+  $gt: T;
+  $gte: T;
+  $lt: T;
+  $lte: T;
+};
+
+type KeywordOperationMap<T extends string> = {
+  $eq: T;
   $in: T[];
   $gt: T;
   $gte: T;
@@ -7662,13 +7805,11 @@ type NumberOperationMap<T extends number> = {
 
 type BooleanOperationMap<T extends boolean> = {
   $eq: T;
-  $ne: T;
   $in: T[];
 };
 
 type DateOperationMap<T extends string | Date> = {
   $eq: T;
-  $ne: T;
   $in: T[];
   $gt: T;
   $gte: T;
@@ -7676,6 +7817,11 @@ type DateOperationMap<T extends string | Date> = {
   $lt: T;
 };
 
+type FacetOperationMap<T extends string> = {
+  $eq: T;
+  $in: T[];
+};
+
 // Create union types for each field type
 type StringOperations = {
   [K in keyof StringOperationMap<string>]: { [P in K]: StringOperationMap<string>[K] } & {
@@ -7701,6 +7847,18 @@ type DateOperations = {
   };
 }[keyof DateOperationMap<string | Date>];
 
+type KeywordOperations = {
+  [K in keyof KeywordOperationMap<string>]: { [P in K]: KeywordOperationMap<string>[K] } & {
+    $boost?: number;
+  };
+}[keyof KeywordOperationMap<string>];
+
+type FacetOperations = {
+  [K in keyof FacetOperationMap<string>]: { [P in K]: FacetOperationMap<string>[K] } & {
+    $boost?: number;
+  };
+}[keyof FacetOperationMap<string>];
+
 // Create a union type for all operations for a given field type
 type OperationsForFieldType<T extends FieldType> = T extends "TEXT"
   ? StringOperations
@@ -7710,7 +7868,11 @@ type OperationsForFieldType<T extends FieldType> = T extends "TEXT"
       ? BooleanOperations
       : T extends "DATE"
         ? DateOperations
-        : never;
+        : T extends "KEYWORD"
+          ? KeywordOperations
+          : T extends "FACET"
+            ? FacetOperations
+            : never;
 
 // Create a union type for all operations for a given path
 type PathOperations<TSchema, TPath extends string> =
@@ -7878,7 +8040,7 @@ type RootOrNode<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
   $and?: never;
   $must?: never;
   $should?: never;
-  $mustNot?: never;
+  $mustNot?: QueryFilter<TSchema> | QueryFilter<TSchema>[];
 };
 
 export type DescribeFieldInfo = {
@@ -7916,6 +8078,298 @@ export type Language =
   | "tamil"
   | "turkish";
 
+// Helper type to extract only FACET field paths from schema
+export type FacetPaths<T, Prefix extends string = ""> = {
+  [K in keyof T]: K extends string
+    ? T[K] extends "FACET" | { type: "FACET" }
+      ? Prefix extends ""
+        ? K
+        : \`\${Prefix}\${K}\`
+      : T[K] extends FieldType | DetailedField
+        ? never
+        : T[K] extends object
+          ? FacetPaths<T[K], \`\${Prefix}\${K}.\`>
+          : never
+    : never;
+}[keyof T];
+
+// Aggregate Types
+export type AggregateOptions<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
+  filter?: RootQueryFilter<TSchema>;
+  aggregations: {
+    [key: string]: Aggregation<TSchema>;
+  };
+};
+
+export type Aggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  | TermsAggregation<TSchema>
+  | RangeAggregation<TSchema>
+  | HistogramAggregation<TSchema>
+  | StatsAggregation<TSchema>
+  | AvgAggregation<TSchema>
+  | SumAggregation<TSchema>
+  | MinAggregation<TSchema>
+  | MaxAggregation<TSchema>
+  | CountAggregation<TSchema>
+  | ExtendedStatsAggregation<TSchema>
+  | PercentilesAggregation<TSchema>
+  | CardinalityAggregation<TSchema>
+  | FacetAggregation<TSchema>;
+
+type BaseAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> = {
+  $aggs?: {
+    [key: string]: Aggregation<TSchema>;
+  };
+};
+
+export type TermsAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $terms: {
+      field: SchemaPaths<TSchema>;
+      size?: number;
+    };
+  };
+
+export type RangeAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $range: {
+      field: SchemaPaths<TSchema>;
+      ranges: { from?: number; to?: number }[];
+    };
+  };
+
+export type HistogramAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $histogram: {
+      field: SchemaPaths<TSchema>;
+      interval: number;
+    };
+  };
+
+export type StatsAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $stats: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type AvgAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $avg: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type SumAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $sum: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type MinAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $min: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type MaxAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $max: {
+      field: SchemaPaths<TSchema>;
+      missing?: number;
+    };
+  };
+
+export type CountAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $count: {
+      field: SchemaPaths<TSchema>;
+    };
+  };
+
+export type ExtendedStatsAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $extendedStats: {
+      field: SchemaPaths<TSchema>;
+      sigma?: number;
+      missing?: number;
+    };
+  };
+
+export type PercentilesAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $percentiles: {
+      field: SchemaPaths<TSchema>;
+      percents?: number[];
+      keyed?: boolean;
+      missing?: number;
+    };
+  };
+
+export type CardinalityAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $cardinality: {
+      field: SchemaPaths<TSchema>;
+    };
+  };
+
+export type FacetAggregation<TSchema extends NestedIndexSchema | FlatIndexSchema> =
+  BaseAggregation<TSchema> & {
+    $facet: {
+      field: FacetPaths<TSchema>;
+      path: string;
+      depth?: number;
+      size?: number;
+      minDocCount?: number;
+      order?: { count: "desc" | "asc" };
+    };
+  };
+
+export type AggregateResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TOpts extends AggregateOptions<TSchema>,
+> = BuildAggregateResult<TSchema, TOpts["aggregations"]>;
+
+type BuildAggregateResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAggs extends { [key: string]: Aggregation<TSchema> },
+> = {
+  [K in keyof TAggs]: TAggs[K] extends TermsAggregation<TSchema>
+    ? TermsResult<TSchema, TAggs[K]>
+    : TAggs[K] extends RangeAggregation<TSchema>
+      ? RangeResult<TSchema, TAggs[K]>
+      : TAggs[K] extends HistogramAggregation<TSchema>
+        ? HistogramResult<TSchema, TAggs[K]>
+        : TAggs[K] extends StatsAggregation<TSchema>
+          ? StatsResult
+          : TAggs[K] extends AvgAggregation<TSchema>
+            ? MetricValueResult
+            : TAggs[K] extends SumAggregation<TSchema>
+              ? MetricValueResult
+              : TAggs[K] extends MinAggregation<TSchema>
+                ? MetricValueResult
+                : TAggs[K] extends MaxAggregation<TSchema>
+                  ? MetricValueResult
+                  : TAggs[K] extends CountAggregation<TSchema>
+                    ? MetricValueResult
+                    : TAggs[K] extends CardinalityAggregation<TSchema>
+                      ? MetricValueResult
+                      : TAggs[K] extends ExtendedStatsAggregation<TSchema>
+                        ? ExtendedStatsResult<TAggs[K]>
+                        : TAggs[K] extends PercentilesAggregation<TSchema>
+                          ? PercentilesResult<TAggs[K]>
+                          : TAggs[K] extends FacetAggregation<TSchema>
+                            ? FacetResult
+                            : never;
+};
+
+type Bucket<T> = {
+  key: T;
+  docCount: number;
+  from?: number;
+  to?: number;
+};
+
+type TermsResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAgg extends TermsAggregation<TSchema>,
+> = TAgg["$aggs"] extends { [key: string]: Aggregation<TSchema> }
+  ? {
+      buckets: (Bucket<GetFieldValueType<TSchema, TAgg["$terms"]["field"]>> &
+        BuildAggregateResult<TSchema, TAgg["$aggs"]>)[];
+      sumOtherDocCount: number;
+      docCountErrorUpperBound: number;
+    }
+  : {
+      buckets: Bucket<GetFieldValueType<TSchema, TAgg["$terms"]["field"]>>[];
+      sumOtherDocCount: number;
+      docCountErrorUpperBound: number;
+    };
+
+type RangeResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAgg extends RangeAggregation<TSchema>,
+> = TAgg["$aggs"] extends { [key: string]: Aggregation<TSchema> }
+  ? {
+      buckets: (Bucket<string> & BuildAggregateResult<TSchema, TAgg["$aggs"]>)[];
+    }
+  : {
+      buckets: Bucket<string>[];
+    };
+
+type HistogramResult<
+  TSchema extends NestedIndexSchema | FlatIndexSchema,
+  TAgg extends HistogramAggregation<TSchema>,
+> = TAgg["$aggs"] extends { [key: string]: Aggregation<TSchema> }
+  ? {
+      buckets: (Bucket<number> & BuildAggregateResult<TSchema, TAgg["$aggs"]>)[];
+    }
+  : {
+      buckets: Bucket<number>[];
+    };
+
+type MetricValueResult = {
+  value: number;
+};
+
+type StatsResult = {
+  count: number;
+  min: number;
+  max: number;
+  sum: number;
+  avg: number;
+};
+
+type ExtendedStatsResult<_TAgg> = {
+  count: number;
+  min: number;
+  max: number;
+  avg: number;
+  sum: number;
+  sumOfSquares: number;
+  variance: number;
+  variancePopulation: number;
+  varianceSampling: number;
+  stdDeviation: number;
+  stdDeviationPopulation: number;
+  stdDeviationSampling: number;
+  stdDeviationBounds: {
+    upper: number;
+    lower: number;
+    upperSampling: number;
+    lowerSampling: number;
+    upperPopulation: number;
+    lowerPopulation: number;
+  };
+};
+
+type PercentilesResult<TAgg> = TAgg extends { $percentiles: { keyed: false } }
+  ? {
+      values: Array<{ key: number; value: number }>;
+    }
+  : {
+      values: { [key: string]: number };
+    };
+
+type FacetChildNode = {
+  path: string;
+  docCount: number;
+  sumOtherDocCount: number;
+  children?: FacetChildNode[];
+};
+
+type FacetResult = {
+  path: string;
+  sumOtherDocCount: number;
+  children: FacetChildNode[];
+};
+
 `;
 
 // src/components/databrowser/components/query-wizard/use-query-wizard.tsx
@@ -8688,7 +9142,7 @@ var QueryBuilder = () => {
   const { data: indexDetails } = useFetchSearchIndex(valuesSearch.index);
   const editorValue = PREFIX + (valuesSearch.query || "{}");
   if (!indexDetails) return;
-  return /* @__PURE__ */ jsx61("div", { className: "flex h-full flex-col rounded-lg border border-zinc-300 bg-white px-[6px]", children: /* @__PURE__ */ jsx61("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx61(
+  return /* @__PURE__ */ jsx61("div", { className: "flex h-full flex-col rounded-lg border border-zinc-300 bg-white px-[6px]", children: /* @__PURE__ */ jsx61("div", { className: "relative min-h-0 flex-1", children: /* @__PURE__ */ jsx61("div", { className: "absolute inset-0", children: /* @__PURE__ */ jsx61(
     QueryEditor,
     {
       value: editorValue,
@@ -8698,7 +9152,7 @@ var QueryBuilder = () => {
       },
       schema: indexDetails
     }
-  ) }) });
+  ) }) }) });
 };
 
 // src/components/databrowser/components/query-builder-error.tsx
@@ -9260,7 +9714,7 @@ function Sidebar() {
       {
         query,
         disableRoundedInherit: true,
-        className: "min-h-0 rounded-xl bg-zinc-100 px-2 py-5 pr-4 dark:bg-zinc-200",
+        className: "h-full min-h-0 rounded-xl bg-zinc-100 px-2 py-5 pr-4 dark:bg-zinc-200",
         scrollBarClassName: "py-5",
         children: /* @__PURE__ */ jsx69(KeysList, {})
       }
@@ -9275,22 +9729,13 @@ import { useCallback as useCallback4, useEffect as useEffect22, useRef as useRef
 import { createContext as createContext7, useCallback as useCallback2, useContext as useContext7, useMemo as useMemo10 } from "react";
 
 // src/components/databrowser/components/ui-query-builder/types.ts
-var STRING_OPERATORS = [
-  "smart",
-  "eq",
-  "ne",
-  "in",
-  "phrase",
-  "regex",
-  "fuzzy"
-];
-var NUMBER_OPERATORS = ["eq", "ne", "gt", "gte", "lt", "lte"];
-var BOOLEAN_OPERATORS = ["eq", "ne"];
+var STRING_OPERATORS = ["smart", "eq", "in", "phrase", "regex", "fuzzy"];
+var NUMBER_OPERATORS = ["eq", "gt", "gte", "lt", "lte"];
+var BOOLEAN_OPERATORS = ["eq"];
 var DATE_OPERATORS = NUMBER_OPERATORS;
 var ALL_OPERATORS = [
   "smart",
   "eq",
-  "ne",
   "gt",
   "gte",
   "lt",
@@ -9302,7 +9747,6 @@ var ALL_OPERATORS = [
 ];
 var OPERATOR_DESCRIPTIONS = {
   eq: "Equals",
-  ne: "Not equals",
   gt: "Greater than",
   gte: "Greater than or equal",
   lt: "Less than",
@@ -9316,7 +9760,6 @@ var OPERATOR_DESCRIPTIONS = {
 var OPERATOR_OPTIONS = [
   { value: "smart", label: "smart" },
   { value: "eq", label: "eq" },
-  { value: "ne", label: "ne" },
   { value: "gt", label: "gt" },
   { value: "gte", label: "gte" },
   { value: "lt", label: "lt" },
@@ -11089,7 +11532,7 @@ var UIQueryBuilder = () => {
     obs.observe(el);
     return () => obs.disconnect();
   }, [recomputeShadows]);
-  return /* @__PURE__ */ jsx81(QueryBuilderUIProvider, { fieldInfos, setQueryState, children: /* @__PURE__ */ jsxs48("div", { className: "relative h-full rounded-lg bg-zinc-50 dark:bg-zinc-50/40", children: [
+  return /* @__PURE__ */ jsx81(QueryBuilderUIProvider, { fieldInfos, setQueryState, children: /* @__PURE__ */ jsxs48("div", { className: "relative h-full min-h-0 rounded-lg bg-zinc-50 dark:bg-zinc-50/40", children: [
     /* @__PURE__ */ jsx81(
       "div",
       {
@@ -11204,7 +11647,7 @@ var QueryBuilderContent = () => {
     setQueryBuilderMode(newMode);
   };
   const errorMessage = switchError ?? (query.error ? formatUpstashErrorMessage(query.error) : void 0);
-  return /* @__PURE__ */ jsxs49("div", { className: "relative h-full", children: [
+  return /* @__PURE__ */ jsxs49("div", { className: "relative flex h-full min-h-0 flex-col", children: [
     /* @__PURE__ */ jsx82("div", { className: "absolute right-4 top-4 z-[2]", children: /* @__PURE__ */ jsx82(
       Segmented,
       {
@@ -11242,7 +11685,7 @@ var DatabrowserInstance = ({
   tabType,
   allowSearch
 }) => {
-  const { isValuesSearchSelected, setIsValuesSearchSelected } = useTab();
+  const { isValuesSearchSelected, queryBuilderMode, setIsValuesSearchSelected } = useTab();
   const { data: indexes, isLoading } = useFetchSearchIndexes({
     enabled: tabType === "search"
   });
@@ -11271,9 +11714,18 @@ var DatabrowserInstance = ({
           {
             autoSaveId: "search-layout",
             direction: "vertical",
-            className: "h-full w-full text-sm antialiased",
+            className: "h-full w-full !overflow-visible text-sm antialiased",
             children: [
-              /* @__PURE__ */ jsx82(Panel, { defaultSize: 30, minSize: 15, maxSize: 60, children: /* @__PURE__ */ jsx82(SearchContent, {}) }),
+              /* @__PURE__ */ jsx82(
+                Panel,
+                {
+                  defaultSize: 30,
+                  minSize: 15,
+                  maxSize: 60,
+                  className: queryBuilderMode === "code" ? "!overflow-visible" : "",
+                  children: /* @__PURE__ */ jsx82(SearchContent, {})
+                }
+              ),
               /* @__PURE__ */ jsx82(ResizeHandle, { direction: "vertical" }),
               /* @__PURE__ */ jsx82(Panel, { minSize: 30, children: /* @__PURE__ */ jsxs49(PanelGroup, { autoSaveId: "persistence", direction: "horizontal", className: "h-full w-full", children: [
                 /* @__PURE__ */ jsx82(Panel, { defaultSize: 30, minSize: 30, children: /* @__PURE__ */ jsx82(Sidebar, {}) }),