@djangocfg/ui-tools 2.1.268 → 2.1.270

package/dist/PlaygroundLayout-FKXSULJ3.cjs

@@ -1,971 +0,0 @@
-'use strict';
-
-var chunkCRHHUOVJ_cjs = require('./chunk-CRHHUOVJ.cjs');
-var chunk33AMWFBZ_cjs = require('./chunk-33AMWFBZ.cjs');
-require('./chunk-2SMCH62O.cjs');
-var chunkWGEGR3DF_cjs = require('./chunk-WGEGR3DF.cjs');
-var lucideReact = require('lucide-react');
-var components = require('@djangocfg/ui-core/components');
-var hooks = require('@djangocfg/ui-core/hooks');
-var React = require('react');
-var consola = require('consola');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-var consola__default = /*#__PURE__*/_interopDefault(consola);
-
-var useMobile = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const isMobile = hooks.useIsMobile();
-  return {
-    isMobile,
-    isDesktop: !isMobile
-  };
-}, "useMobile");
-var HTTP_METHODS = ["get", "post", "put", "patch", "delete"];
-var extractEndpoints = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((schema) => {
-  const endpoints = [];
-  if (!schema.paths) return [];
-  const baseUrl = schema.servers && schema.servers.length > 0 ? schema.servers[0].url : "";
-  for (const [path, methods] of Object.entries(schema.paths)) {
-    for (const method of HTTP_METHODS) {
-      const op = methods[method];
-      if (!op) continue;
-      const methodUpper = method.toUpperCase();
-      const description = op.description || op.summary || `${methodUpper} ${path}`;
-      const category = op.tags?.[0] || "Other";
-      const parameters = [];
-      const allParams = [...methods.parameters || [], ...op.parameters || []];
-      for (const param of allParams) {
-        parameters.push({
-          name: param.name,
-          type: param.schema?.type || "string",
-          required: param.required || false,
-          description: param.description
-        });
-      }
-      const responses = [];
-      if (op.responses) {
-        for (const [code, response] of Object.entries(op.responses)) {
-          responses.push({
-            code,
-            description: response.description || `Response ${code}`
-          });
-        }
-      }
-      let requestBody;
-      if (op.requestBody) {
-        const content = op.requestBody.content;
-        const mediaType = content?.["application/json"] || content?.[Object.keys(content || {})[0]];
-        requestBody = {
-          type: mediaType?.schema?.type || "object",
-          description: op.requestBody.description
-        };
-      }
-      const endpoint = {
-        name: path.split("/").pop() || path,
-        method: methodUpper,
-        path: baseUrl + path,
-        description,
-        category,
-        parameters: parameters.length > 0 ? parameters : void 0,
-        requestBody,
-        responses: responses.length > 0 ? responses : void 0
-      };
-      endpoints.push(endpoint);
-    }
-  }
-  return endpoints;
-}, "extractEndpoints");
-var getCategories = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((endpoints) => {
-  const categories = /* @__PURE__ */ new Set();
-  endpoints.forEach((endpoint) => categories.add(endpoint.category));
-  return Array.from(categories).sort();
-}, "getCategories");
-var fetchSchema = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(async (url) => {
-  const response = await fetch(url, {
-    headers: {
-      "Accept": "application/json"
-    }
-  });
-  if (!response.ok) {
-    throw new Error(`Failed to fetch schema: ${response.statusText}`);
-  }
-  return response.json();
-}, "fetchSchema");
-function useOpenApiSchema({
-  schemas,
-  defaultSchemaId
-}) {
-  const [loading, setLoading] = React.useState(true);
-  const [error, setError] = React.useState(null);
-  const [currentSchemaId, setCurrentSchemaId] = React.useState(
-    defaultSchemaId || schemas[0]?.id
-  );
-  const [loadedSchemas, setLoadedSchemas] = React.useState(
-    /* @__PURE__ */ new Map()
-  );
-  const currentSchema = React.useMemo(
-    () => schemas.find((s) => s.id === currentSchemaId) || null,
-    [schemas, currentSchemaId]
-  );
-  const currentOpenApiSchema = React.useMemo(
-    () => currentSchemaId ? loadedSchemas.get(currentSchemaId) : null,
-    [loadedSchemas, currentSchemaId]
-  );
-  const endpoints = React.useMemo(
-    () => currentOpenApiSchema ? extractEndpoints(currentOpenApiSchema) : [],
-    [currentOpenApiSchema]
-  );
-  const categories = React.useMemo(() => getCategories(endpoints), [endpoints]);
-  React.useEffect(() => {
-    if (!currentSchema) return;
-    if (loadedSchemas.has(currentSchema.id)) {
-      setLoading(false);
-      return;
-    }
-    setLoading(true);
-    setError(null);
-    fetchSchema(currentSchema.url).then((schema) => {
-      setLoadedSchemas((prev) => new Map(prev).set(currentSchema.id, schema));
-      consola__default.default.success(`Schema loaded: ${currentSchema.name}`);
-      setLoading(false);
-    }).catch((err) => {
-      consola__default.default.error(`Error loading schema from ${currentSchema.url}:`, err);
-      setError(err instanceof Error ? err.message : "Failed to load schema");
-      setLoading(false);
-    });
-  }, [currentSchema, loadedSchemas]);
-  const setCurrentSchema = React.useCallback((schemaId) => {
-    setCurrentSchemaId(schemaId);
-  }, []);
-  const refresh = React.useCallback(() => {
-    if (!currentSchema) return;
-    setLoading(true);
-    setError(null);
-    setLoadedSchemas((prev) => {
-      const next = new Map(prev);
-      next.delete(currentSchema.id);
-      return next;
-    });
-    fetchSchema(currentSchema.url).then((schema) => {
-      setLoadedSchemas((prev) => new Map(prev).set(currentSchema.id, schema));
-      consola__default.default.success(`Schema refreshed: ${currentSchema.name}`);
-      setLoading(false);
-    }).catch((err) => {
-      consola__default.default.error(`Error refreshing schema from ${currentSchema.url}:`, err);
-      setError(err instanceof Error ? err.message : "Failed to refresh schema");
-      setLoading(false);
-    });
-  }, [currentSchema]);
-  return {
-    loading,
-    error,
-    endpoints,
-    categories,
-    schemas,
-    currentSchema,
-    setCurrentSchema,
-    refresh
-  };
-}
-chunkWGEGR3DF_cjs.__name(useOpenApiSchema, "useOpenApiSchema");
-var METHOD_BADGE_VARIANTS = {
-  GET: "bg-emerald-500/15 text-emerald-600 dark:text-emerald-400 border-emerald-500/20",
-  POST: "bg-blue-500/15 text-blue-600 dark:text-blue-400 border-blue-500/20",
-  PUT: "bg-amber-500/15 text-amber-600 dark:text-amber-400 border-amber-500/20",
-  PATCH: "bg-orange-500/15 text-orange-600 dark:text-orange-400 border-orange-500/20",
-  DELETE: "bg-red-500/15 text-red-600 dark:text-red-400 border-red-500/20"
-};
-var EndpointsLibrary = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const { state, config, setSelectedEndpoint, setSelectedCategory, setSearchTerm } = chunkCRHHUOVJ_cjs.usePlaygroundContext();
-  const { endpoints, categories, loading, error, schemas, currentSchema, setCurrentSchema } = useOpenApiSchema({
-    schemas: config.schemas,
-    defaultSchemaId: config.defaultSchemaId
-  });
-  const [viewMode, setViewMode] = React__default.default.useState("table");
-  const getRelativePath = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((fullPath) => {
-    try {
-      const url = new URL(fullPath);
-      return url.pathname;
-    } catch {
-      return fullPath;
-    }
-  }, "getRelativePath");
-  const filteredEndpoints = React.useMemo(() => {
-    let filtered = chunkCRHHUOVJ_cjs.deduplicateEndpoints(endpoints, state.selectedVersion);
-    if (state.selectedCategory && state.selectedCategory !== "All") {
-      filtered = filtered.filter((endpoint) => endpoint.category === state.selectedCategory);
-    }
-    if (state.searchTerm) {
-      const searchLower = state.searchTerm.toLowerCase();
-      filtered = filtered.filter(
-        (endpoint) => endpoint.name.toLowerCase().includes(searchLower) || endpoint.description.toLowerCase().includes(searchLower) || endpoint.path.toLowerCase().includes(searchLower)
-      );
-    }
-    return filtered;
-  }, [endpoints, state.selectedCategory, state.searchTerm, state.selectedVersion]);
-  const schemaOptions = React.useMemo(
-    () => schemas.map((s) => ({ value: s.id, label: s.name })),
-    [schemas]
-  );
-  const getMethodBadge = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((method) => /* @__PURE__ */ jsxRuntime.jsx(
-    components.Badge,
-    {
-      variant: "outline",
-      className: `text-xs font-mono font-semibold ${METHOD_BADGE_VARIANTS[method.toUpperCase()] || ""}`,
-      children: method
-    },
-    method
-  ), "getMethodBadge");
-  if (loading) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.Skeleton, { className: "h-9 w-44" }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.Skeleton, { className: "h-9 flex-1 max-w-xs" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.Skeleton, { className: "h-9 w-24" })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: Array.from({ length: 8 }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(components.Skeleton, { className: "h-12 w-full" }, i)) })
-    ] });
-  }
-  if (error) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-3", children: /* @__PURE__ */ jsxRuntime.jsx(components.Card, { className: "bg-destructive/10 border-destructive/20", children: /* @__PURE__ */ jsxRuntime.jsx(components.CardContent, { className: "p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-sm text-destructive", children: [
-      "Failed to load schema: ",
-      error
-    ] }) }) }) });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 flex-wrap", children: [
-      schemas.length > 1 && /* @__PURE__ */ jsxRuntime.jsx(
-        components.Combobox,
-        {
-          options: schemaOptions,
-          value: currentSchema?.id || "",
-          onValueChange: (id) => id && setCurrentSchema(id),
-          placeholder: "Select API",
-          searchPlaceholder: "Search APIs...",
-          emptyText: "No APIs found",
-          className: "w-44"
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex-1 max-w-xs", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-2.5 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-muted-foreground" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.Input,
-          {
-            placeholder: "Search...",
-            value: state.searchTerm,
-            onChange: (e) => setSearchTerm(e.target.value),
-            className: "h-9 pl-8 text-sm"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs(components.Select, { value: state.selectedCategory, onValueChange: setSelectedCategory, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(components.SelectTrigger, { className: "w-auto h-9 gap-1.5", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Filter, { className: "h-3.5 w-3.5" }),
-          /* @__PURE__ */ jsxRuntime.jsx(components.SelectValue, {})
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(components.SelectContent, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(components.SelectItem, { value: "All", children: "All" }),
-          categories.map((category) => /* @__PURE__ */ jsxRuntime.jsx(components.SelectItem, { value: category, children: category }, category))
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground tabular-nums hidden sm:inline", children: [
-        filteredEndpoints.length,
-        " endpoint",
-        filteredEndpoints.length !== 1 ? "s" : ""
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center border rounded-md", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.Button,
-          {
-            variant: viewMode === "table" ? "default" : "ghost",
-            size: "icon",
-            className: "h-8 w-8 rounded-r-none",
-            onClick: () => setViewMode("table"),
-            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.List, { className: "h-3.5 w-3.5" })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.Button,
-          {
-            variant: viewMode === "grid" ? "default" : "ghost",
-            size: "icon",
-            className: "h-8 w-8 rounded-l-none",
-            onClick: () => setViewMode("grid"),
-            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Grid3X3, { className: "h-3.5 w-3.5" })
-          }
-        )
-      ] }),
-      currentSchema && /* @__PURE__ */ jsxRuntime.jsx(
-        components.DownloadButton,
-        {
-          url: currentSchema.url,
-          filename: `${currentSchema.id}-openapi.json`,
-          variant: "outline",
-          size: "sm",
-          className: "h-8",
-          children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Schema" })
-        }
-      )
-    ] }),
-    viewMode === "table" ? /* @__PURE__ */ jsxRuntime.jsx(components.Card, { children: /* @__PURE__ */ jsxRuntime.jsxs(components.Table, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.TableHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(components.TableRow, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.TableHead, { className: "w-20 text-foreground", children: "Method" }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.TableHead, { className: "text-foreground", children: "Path" }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.TableHead, { className: "text-foreground hidden lg:table-cell", children: "Description" })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(components.TableBody, { children: filteredEndpoints.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(components.TableRow, { children: /* @__PURE__ */ jsxRuntime.jsx(components.TableCell, { colSpan: 3, className: "text-center py-12 text-muted-foreground", children: "No endpoints found" }) }) : filteredEndpoints.map((endpoint) => /* @__PURE__ */ jsxRuntime.jsxs(
-        components.TableRow,
-        {
-          className: `cursor-pointer transition-colors hover:bg-muted/50 ${state.selectedEndpoint?.path === endpoint.path && state.selectedEndpoint?.method === endpoint.method ? "bg-primary/5" : ""}`,
-          onClick: () => setSelectedEndpoint(endpoint),
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(components.TableCell, { className: "py-2.5", children: getMethodBadge(endpoint.method) }),
-            /* @__PURE__ */ jsxRuntime.jsx(components.TableCell, { className: "font-mono text-sm text-muted-foreground py-2.5", children: getRelativePath(endpoint.path) }),
-            /* @__PURE__ */ jsxRuntime.jsx(components.TableCell, { className: "text-sm text-muted-foreground max-w-sm truncate py-2.5 hidden lg:table-cell", children: endpoint.description })
-          ]
-        },
-        `${endpoint.method}-${endpoint.path}`
-      )) })
-    ] }) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-3", children: filteredEndpoints.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-span-full text-center py-12 text-muted-foreground", children: "No endpoints found" }) : filteredEndpoints.map((endpoint) => /* @__PURE__ */ jsxRuntime.jsxs(
-      components.Card,
-      {
-        className: `cursor-pointer transition-all hover:shadow-md ${state.selectedEndpoint?.path === endpoint.path && state.selectedEndpoint?.method === endpoint.method ? "ring-2 ring-primary" : ""}`,
-        onClick: () => setSelectedEndpoint(endpoint),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(components.CardHeader, { className: "pb-2 pt-3 px-4", children: /* @__PURE__ */ jsxRuntime.jsxs(components.CardTitle, { className: "flex items-center justify-between text-sm", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-xs text-muted-foreground truncate", children: getRelativePath(endpoint.path) }),
-            getMethodBadge(endpoint.method)
-          ] }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(components.CardContent, { className: "px-4 pb-3 pt-0", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground line-clamp-2", children: endpoint.description }) })
-        ]
-      },
-      `${endpoint.method}-${endpoint.path}`
-    )) })
-  ] });
-}, "EndpointsLibrary");
-var stepConfig = {
-  endpoints: {
-    title: "Endpoints",
-    icon: lucideReact.Code,
-    description: "Select API endpoint"
-  },
-  request: {
-    title: "Request",
-    icon: lucideReact.Send,
-    description: "Configure request"
-  },
-  response: {
-    title: "Response",
-    icon: lucideReact.FileText,
-    description: "View response"
-  }
-};
-var PlaygroundStepper = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const { state, setCurrentStep, goToNextStep, goToPreviousStep } = chunkCRHHUOVJ_cjs.usePlaygroundContext();
-  const { currentStep, steps } = state;
-  const currentIndex = steps.indexOf(currentStep);
-  const canGoNext = currentIndex < steps.length - 1;
-  const canGoPrevious = currentIndex > 0;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between w-full", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center space-x-4", children: steps.map((step, index) => {
-      const config = stepConfig[step];
-      const Icon = config.icon;
-      const isActive = step === currentStep;
-      const isCompleted = index < currentIndex;
-      const isClickable = index <= currentIndex + 1;
-      return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          components.Button,
-          {
-            variant: isActive ? "default" : "ghost",
-            size: "sm",
-            onClick: () => isClickable && setCurrentStep(step),
-            className: `flex items-center space-x-2 ${isClickable ? "cursor-pointer" : "cursor-not-allowed opacity-50"}`,
-            disabled: !isClickable,
-            children: [
-              isCompleted ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) : /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: config.title })
-            ]
-          }
-        ),
-        index < steps.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-8 h-px bg-border" })
-      ] }, step);
-    }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        components.Button,
-        {
-          variant: "outline",
-          size: "sm",
-          onClick: goToPreviousStep,
-          disabled: !canGoPrevious,
-          className: "flex items-center space-x-1",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Previous" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        components.Button,
-        {
-          variant: "outline",
-          size: "sm",
-          onClick: goToNextStep,
-          disabled: !canGoNext,
-          className: "flex items-center space-x-1",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Next" }),
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
-          ]
-        }
-      )
-    ] })
-  ] });
-}, "PlaygroundStepper");
-var EndpointInfo = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const { state } = chunkCRHHUOVJ_cjs.usePlaygroundContext();
-  const { selectedEndpoint } = state;
-  const endpointJson = React.useMemo(() => {
-    if (!selectedEndpoint) return "";
-    return JSON.stringify({
-      name: selectedEndpoint.name,
-      method: selectedEndpoint.method,
-      path: selectedEndpoint.path,
-      description: selectedEndpoint.description,
-      parameters: selectedEndpoint.parameters,
-      requestBody: selectedEndpoint.requestBody,
-      responses: selectedEndpoint.responses
-    }, null, 2);
-  }, [selectedEndpoint]);
-  if (!selectedEndpoint) {
-    return null;
-  }
-  const getMethodBadges = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((methods) => {
-    return methods.split(", ").map((method) => /* @__PURE__ */ jsxRuntime.jsx(components.Badge, { variant: chunkCRHHUOVJ_cjs.getMethodColor(method) === "success" ? "default" : "secondary", className: "text-xs", children: method }, method));
-  }, "getMethodBadges");
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-foreground", children: "Selected Endpoint" }),
-      /* @__PURE__ */ jsxRuntime.jsx(components.CopyButton, { value: endpointJson, variant: "outline", size: "sm", children: "Copy" })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(components.Card, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(components.CardTitle, { className: "flex items-center justify-between text-sm text-foreground", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Code, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium", children: selectedEndpoint.name })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex space-x-1", children: getMethodBadges(selectedEndpoint.method) })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsxs(components.CardContent, { className: "space-y-4", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-mono text-muted-foreground break-all", children: selectedEndpoint.path }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground mt-1", children: selectedEndpoint.description })
-        ] }),
-        selectedEndpoint.parameters && selectedEndpoint.parameters.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(components.Collapsible, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(components.CollapsibleTrigger, { className: "flex items-center space-x-2 text-sm font-medium text-foreground", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Database, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-              "Parameters (",
-              selectedEndpoint.parameters.length,
-              ")"
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(components.CollapsibleContent, { className: "mt-2 space-y-2", children: selectedEndpoint.parameters.map((param, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2 text-xs", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(components.Badge, { variant: param.required ? "destructive" : "secondary", className: "text-xs", children: param.required ? "Required" : "Optional" }),
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-mono text-muted-foreground", children: [
-              param.name,
-              ": ",
-              param.type
-            ] }),
-            param.description && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground", children: [
-              "- ",
-              param.description
-            ] })
-          ] }, index)) })
-        ] }),
-        selectedEndpoint.requestBody && /* @__PURE__ */ jsxRuntime.jsxs(components.Collapsible, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(components.CollapsibleTrigger, { className: "flex items-center space-x-2 text-sm font-medium text-foreground", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Request Body" }),
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(components.CollapsibleContent, { className: "mt-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-muted-foreground", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("p", { children: [
-              "Type: ",
-              selectedEndpoint.requestBody.type
-            ] }),
-            selectedEndpoint.requestBody.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1", children: selectedEndpoint.requestBody.description })
-          ] }) })
-        ] }),
-        selectedEndpoint.responses && selectedEndpoint.responses.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(components.Collapsible, { children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(components.CollapsibleTrigger, { className: "flex items-center space-x-2 text-sm font-medium text-foreground", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.AlertCircle, { className: "h-4 w-4" }),
-            /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-              "Responses (",
-              selectedEndpoint.responses.length,
-              ")"
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4" })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(components.CollapsibleContent, { className: "mt-2 space-y-2", children: selectedEndpoint.responses.map((response, index) => {
-            const statusColor = chunkCRHHUOVJ_cjs.getStatusColor(parseInt(response.code));
-            const badgeVariant = statusColor === "success" ? "default" : statusColor === "error" ? "destructive" : "secondary";
-            return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2 text-xs", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(components.Badge, { variant: badgeVariant, className: "text-xs", children: response.code }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: response.description })
-            ] }, index);
-          }) })
-        ] })
-      ] })
-    ] })
-  ] });
-}, "EndpointInfo");
-var RequestParametersForm = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const { state, setParameters } = chunkCRHHUOVJ_cjs.usePlaygroundContext();
-  const [formData, setFormData] = React.useState({});
-  const [activeTab, setActiveTab] = React.useState("required");
-  React.useEffect(() => {
-    if (state.selectedEndpoint?.parameters) {
-      const initialData = {};
-      state.selectedEndpoint.parameters.forEach((param) => {
-        initialData[param.name] = "";
-      });
-      setFormData(initialData);
-    }
-  }, [state.selectedEndpoint?.path, state.selectedEndpoint?.parameters]);
-  const handleInputChange = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name((name, value) => {
-    const newFormData = {
-      ...formData,
-      [name]: value
-    };
-    setFormData(newFormData);
-    setParameters(newFormData);
-  }, "handleInputChange");
-  const handleClearForm = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-    setFormData({});
-    setParameters({});
-  }, "handleClearForm");
-  const handleGenerateJson = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-    const hasData = Object.values(formData).some((value) => value !== "" && value !== null && value !== void 0);
-    if (hasData) {
-      const jsonString = JSON.stringify(formData, null, 2);
-      navigator.clipboard.writeText(jsonString);
-    }
-  }, "handleGenerateJson");
-  if (!state.selectedEndpoint) return null;
-  const requiredParams = state.selectedEndpoint.parameters?.filter((param) => param.required) || [];
-  const optionalParams = state.selectedEndpoint.parameters?.filter((param) => !param.required) || [];
-  const hasParameters = (state.selectedEndpoint.parameters?.length || 0) > 0;
-  if (!hasParameters) {
-    return null;
-  }
-  const hasFormData = Object.values(formData).some((value) => value !== "" && value !== null && value !== void 0);
-  const ParameterField = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(({ param }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-1", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(components.Label, { htmlFor: param.name, className: "text-xs font-medium text-foreground", children: [
-        param.name,
-        param.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", children: "*" })
-      ] }),
-      param.description && /* @__PURE__ */ jsxRuntime.jsx(components.TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(components.Tooltip, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.HelpCircle, { className: "h-3 w-3 text-muted-foreground hover:text-foreground cursor-help" }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.TooltipContent, { side: "top", className: "max-w-xs", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs", children: param.description }) })
-      ] }) })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      components.Input,
-      {
-        id: param.name,
-        value: formData[param.name] || "",
-        onChange: (e) => handleInputChange(param.name, e.target.value),
-        placeholder: `Enter ${param.name}${param.required ? "" : " (optional)"}`,
-        className: "text-sm"
-      }
-    )
-  ] }), "ParameterField");
-  const ParametersGrid = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(({ params, title, badgeVariant }) => {
-    if (params.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.Badge, { variant: badgeVariant, className: "text-xs", children: title }),
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
-          params.length,
-          " parameter",
-          params.length !== 1 ? "s" : ""
-        ] })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", children: params.map((param) => /* @__PURE__ */ jsxRuntime.jsx(ParameterField, { param }, param.name)) })
-    ] });
-  }, "ParametersGrid");
-  return /* @__PURE__ */ jsxRuntime.jsx(components.TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(components.Card, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(components.CardHeader, { className: "pb-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardTitle, { className: "text-sm text-foreground", children: "Request Parameters" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-        hasFormData && /* @__PURE__ */ jsxRuntime.jsx(
-          components.Button,
-          {
-            variant: "default",
-            size: "sm",
-            onClick: handleGenerateJson,
-            className: "text-xs",
-            children: "Copy JSON"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.Button,
-          {
-            variant: "outline",
-            size: "sm",
-            onClick: handleClearForm,
-            className: "text-xs",
-            children: "Clear"
-          }
-        )
-      ] })
-    ] }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(components.CardContent, { className: "space-y-4", children: [
-      requiredParams.length + optionalParams.length > 10 ? /* @__PURE__ */ jsxRuntime.jsxs(components.Tabs, { value: activeTab, onValueChange: setActiveTab, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(components.TabsList, { className: "grid w-full grid-cols-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(components.TabsTrigger, { value: "required", className: "text-xs", children: [
-            "Required (",
-            requiredParams.length,
-            ")"
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs(components.TabsTrigger, { value: "optional", className: "text-xs", children: [
-            "Optional (",
-            optionalParams.length,
-            ")"
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.TabsContent, { value: "required", className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-          ParametersGrid,
-          {
-            params: requiredParams,
-            title: "Required",
-            badgeVariant: "destructive"
-          }
-        ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.TabsContent, { value: "optional", className: "space-y-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-          ParametersGrid,
-          {
-            params: optionalParams,
-            title: "Optional",
-            badgeVariant: "secondary"
-          }
-        ) })
-      ] }) : (
-        /* Use Accordion for smaller parameter sets */
-        /* @__PURE__ */ jsxRuntime.jsxs(components.Accordion, { type: "multiple", defaultValue: requiredParams.length > 0 ? ["required"] : ["optional"], children: [
-          requiredParams.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(components.AccordionItem, { value: "required", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(components.AccordionTrigger, { className: "text-sm text-foreground", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(components.Badge, { variant: "destructive", className: "text-xs", children: "Required" }),
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
-                requiredParams.length,
-                " parameter",
-                requiredParams.length !== 1 ? "s" : ""
-              ] })
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(components.AccordionContent, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 pt-2", children: requiredParams.map((param) => /* @__PURE__ */ jsxRuntime.jsx(ParameterField, { param }, param.name)) }) })
-          ] }),
-          optionalParams.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(components.AccordionItem, { value: "optional", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(components.AccordionTrigger, { className: "text-sm text-foreground", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(components.Badge, { variant: "secondary", className: "text-xs", children: "Optional" }),
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
-                optionalParams.length,
-                " parameter",
-                optionalParams.length !== 1 ? "s" : ""
-              ] })
-            ] }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(components.AccordionContent, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 pt-2", children: optionalParams.map((param) => /* @__PURE__ */ jsxRuntime.jsx(ParameterField, { param }, param.name)) }) })
-          ] })
-        ] })
-      ),
-      hasFormData && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2 mt-6 pt-4 border-t", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.Label, { className: "text-xs text-foreground", children: "Generated JSON" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.Textarea,
-          {
-            value: JSON.stringify(formData, null, 2),
-            readOnly: true,
-            className: "text-xs font-mono",
-            rows: 4
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: 'Click "Copy JSON" to copy this to clipboard, then paste it into the Request Body field above.' })
-      ] })
-    ] })
-  ] }) });
-}, "RequestParametersForm");
-var RequestBuilder = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const {
-    state,
-    apiKeys,
-    setRequestBody,
-    setManualApiToken,
-    sendRequest
-  } = chunkCRHHUOVJ_cjs.usePlaygroundContext();
-  const isJsonValid = state.requestBody ? chunkCRHHUOVJ_cjs.isValidJson(state.requestBody) : true;
-  const generateCurlCommand = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-    if (!state.requestUrl) return "";
-    const apiKey = state.selectedApiKey ? chunkCRHHUOVJ_cjs.findApiKeyById(apiKeys, state.selectedApiKey) : null;
-    const headers = chunkCRHHUOVJ_cjs.parseRequestHeaders(state.requestHeaders);
-    if (apiKey) {
-      headers["X-API-Key"] = apiKey.id || "";
-    }
-    let curl = `curl -X ${state.requestMethod} "${state.requestUrl}"`;
-    Object.entries(headers).forEach(([key, value]) => {
-      curl += ` \\
-  -H "${key}: ${value}"`;
-    });
-    if (state.requestBody && state.requestMethod !== "GET" && isJsonValid) {
-      curl += ` \\
-  -d '${state.requestBody}'`;
-    }
-    return curl;
-  }, "generateCurlCommand");
-  const curlCommand = generateCurlCommand();
-  const handleSendRequest = React.useCallback(async () => {
-    await sendRequest();
-  }, [sendRequest]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-    state.selectedEndpoint && /* @__PURE__ */ jsxRuntime.jsx(EndpointInfo, {}),
-    state.selectedEndpoint && /* @__PURE__ */ jsxRuntime.jsx(RequestParametersForm, {}),
-    state.requestMethod !== "GET" && /* @__PURE__ */ jsxRuntime.jsxs(components.Card, { className: "", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(components.CardTitle, { className: "text-sm text-foreground", children: "Request Body" }) }),
-      /* @__PURE__ */ jsxRuntime.jsxs(components.CardContent, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.Textarea,
-          {
-            placeholder: '{\\n  "key": "value"\\n}',
-            value: state.requestBody,
-            onChange: (e) => setRequestBody(e.target.value),
-            className: `font-mono text-sm  ${!isJsonValid ? "border-destructive" : ""}`,
-            rows: 6
-          }
-        ),
-        !isJsonValid && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-destructive", children: "Invalid JSON format" })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(components.Card, { className: "", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(components.CardTitle, { className: "flex items-center space-x-2 text-sm text-foreground", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Key, { className: "h-4 w-4" }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Bearer Token" })
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col sm:flex-row sm:items-center gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            components.Input,
-            {
-              type: "password",
-              placeholder: "Enter Bearer token (optional, uses JWT if empty)",
-              value: state.manualApiToken,
-              onChange: (e) => setManualApiToken(e.target.value),
-              className: "font-mono text-sm"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: "Leave empty to use JWT token from localStorage" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.Button,
-          {
-            onClick: handleSendRequest,
-            disabled: state.loading || !state.requestUrl || !isJsonValid,
-            className: "bg-primary hover:bg-primary/90 text-primary-foreground flex items-center gap-2",
-            children: state.loading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Loader2, { className: "h-4 w-4 animate-spin" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Sending..." })
-            ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Send, { className: "h-4 w-4" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Send Request" })
-            ] })
-          }
-        )
-      ] }) })
-    ] }),
-    curlCommand && /* @__PURE__ */ jsxRuntime.jsxs(components.Card, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.CardTitle, { className: "text-sm text-foreground", children: "cURL Command" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          components.CopyButton,
-          {
-            value: curlCommand,
-            variant: "outline",
-            size: "sm",
-            children: "Copy cURL"
-          }
-        )
-      ] }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(chunkCRHHUOVJ_cjs.PrettyCode_default, { data: curlCommand, language: "bash" }) })
-    ] })
-  ] });
-}, "RequestBuilder");
-var ResponseViewer = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const { state } = chunkCRHHUOVJ_cjs.usePlaygroundContext();
-  const { response } = state;
-  const responseText = React.useMemo(() => {
-    if (!response?.data) return "";
-    return typeof response.data === "string" ? response.data : JSON.stringify(response.data, null, 2);
-  }, [response?.data]);
-  const handleDownloadResponse = React.useCallback(() => {
-    if (!responseText) return;
-    const blob = new Blob([responseText], { type: "application/json" });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement("a");
-    a.href = url;
-    a.download = "response.json";
-    document.body.appendChild(a);
-    a.click();
-    document.body.removeChild(a);
-    URL.revokeObjectURL(url);
-  }, [responseText]);
-  if (!response) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-foreground", children: "Response" }) }),
-      /* @__PURE__ */ jsxRuntime.jsx(components.Card, { children: /* @__PURE__ */ jsxRuntime.jsx(components.CardContent, { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No response yet. Send a request to see the response here." }) }) })
-    ] });
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-foreground", children: "Response" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.CopyButton, { value: responseText, variant: "outline", size: "sm", children: "Copy" }),
-        /* @__PURE__ */ jsxRuntime.jsxs(components.Button, { variant: "outline", size: "sm", onClick: handleDownloadResponse, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "hidden sm:inline", children: "Download" })
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(components.Card, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(components.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(components.CardTitle, { className: "text-sm text-foreground", children: "Response Information" }) }),
-      /* @__PURE__ */ jsxRuntime.jsxs(components.CardContent, { className: "space-y-4", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-foreground", children: "Status Code:" }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                components.Badge,
-                {
-                  variant: chunkCRHHUOVJ_cjs.getStatusColor(response.status || 0) === "success" ? "default" : chunkCRHHUOVJ_cjs.getStatusColor(response.status || 0) === "error" ? "destructive" : "secondary",
-                  className: "text-xs",
-                  children: response.status
-                }
-              )
-            ] }),
-            response.statusText && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-foreground", children: "Status Text:" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: response.statusText })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-foreground", children: "Response Type:" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: typeof response.data === "string" ? "Text" : "JSON" })
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-foreground", children: "Data Size:" }),
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm text-muted-foreground", children: [
-                typeof response.data === "string" ? response.data.length : JSON.stringify(response.data).length,
-                " chars"
-              ] })
-            ] })
-          ] })
-        ] }),
-        response.error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-destructive/10 border border-destructive/20 rounded p-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center space-x-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.XCircle, { className: "h-4 w-4 text-destructive" }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-destructive", children: response.error })
-        ] }) })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(components.Card, { children: /* @__PURE__ */ jsxRuntime.jsx(components.CardContent, { className: "p-0", children: (() => {
-      const is404 = response.status === 404;
-      const isNonJson = typeof response.data === "string";
-      if (is404 || isNonJson) {
-        return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-8 text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: is404 ? "Response body hidden for 404 Not Found status" : "Response body hidden for non-JSON responses" }) });
-      }
-      if (response.data) {
-        return /* @__PURE__ */ jsxRuntime.jsx(
-          chunk33AMWFBZ_cjs.JsonTree_default,
-          {
-            title: "Response Body",
-            data: response.data,
-            config: {
-              // Smart defaults for API responses
-              maxAutoExpandDepth: 2,
-              maxAutoExpandArrayItems: 10,
-              maxAutoExpandObjectKeys: 5,
-              maxStringLength: 200,
-              collectionLimit: 50,
-              showCollectionInfo: true,
-              showExpandControls: true,
-              showActionButtons: false,
-              // We have our own copy/download buttons above
-              preserveKeyOrder: true,
-              className: "border-0 rounded-none"
-            }
-          }
-        );
-      }
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-8 text-center", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No response body available" }) });
-    })() }) })
-  ] });
-}, "ResponseViewer");
-var PlaygroundLayout = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-  const { state, setSidebarOpen } = chunkCRHHUOVJ_cjs.usePlaygroundContext();
-  const { isMobile } = useMobile();
-  const renderStepContent = /* @__PURE__ */ chunkWGEGR3DF_cjs.__name(() => {
-    switch (state.currentStep) {
-      case "endpoints":
-        return /* @__PURE__ */ jsxRuntime.jsx(EndpointsLibrary, {});
-      case "request":
-        return /* @__PURE__ */ jsxRuntime.jsx(RequestBuilder, {});
-      case "response":
-        return /* @__PURE__ */ jsxRuntime.jsx(ResponseViewer, {});
-      default:
-        return /* @__PURE__ */ jsxRuntime.jsx(EndpointsLibrary, {});
-    }
-  }, "renderStepContent");
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "container mx-auto px-6 py-3", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between", children: isMobile ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(components.Sheet, { open: state.sidebarOpen, onOpenChange: setSidebarOpen, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(components.SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(components.Button, { variant: "ghost", size: "sm", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Menu, { className: "h-4 w-4" }) }) }),
-        /* @__PURE__ */ jsxRuntime.jsx(components.SheetContent, { side: "left", className: "w-80", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-foreground", children: "Navigation" }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              components.Button,
-              {
-                variant: "ghost",
-                size: "sm",
-                onClick: () => setSidebarOpen(false),
-                children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(PlaygroundStepper, {})
-        ] }) })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-foreground capitalize", children: state.currentStep }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-8" }),
-      " "
-    ] }) : /* @__PURE__ */ jsxRuntime.jsx(PlaygroundStepper, {}) }) }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "container mx-auto px-6 py-6", children: renderStepContent() }),
-    isMobile && state.currentStep === "request" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed bottom-4 right-4 z-50", children: /* @__PURE__ */ jsxRuntime.jsx(
-      components.Button,
-      {
-        size: "lg",
-        className: "rounded-full shadow-lg",
-        children: "Send Request"
-      }
-    ) })
-  ] });
-}, "PlaygroundLayout");
-
-exports.PlaygroundLayout = PlaygroundLayout;
-//# sourceMappingURL=PlaygroundLayout-FKXSULJ3.cjs.map
-//# sourceMappingURL=PlaygroundLayout-FKXSULJ3.cjs.map