@buoy-gg/network 7.0.40 → 7.0.42

package/lib/module/network/components/NetworkOverrideEditor.web.js

@@ -1,939 +1 @@
-"use strict";
-
-/**
- * NetworkOverrideEditor.web — DOM twin of NetworkOverrideEditor.tsx.
- *
- * The rule form — one decision, everything else out of the way. Same shape as
- * native: a collapsed "Applies to" disclosure (URL pattern + method chips),
- * the OUTCOME grid (kind + status + failKind folded into one list), the
- * collapsed "Response body" disclosure (the response-editor Explorer tree, or
- * the empty "Edit all" paste buffer), always-visible Delay and Fires rows,
- * the top-pinned NetworkNumberPrompt for custom numbers, and the
- * Cancel/Save footer (Save disabled until a URL pattern exists).
- *
- * REUSED, not forked (all platform-free): `OverrideRuleDraft`,
- * `STATUS_MIN`/`STATUS_MAX`, `ResponseEditorContext` — plus the response
- * tree itself via the Explorer DOM twin (which reuses the pure nested-data
- * ops).
- *
- * shared-ui RN chrome is replicated as DOM with provenance (web consumers
- * resolve `@buoy-gg/shared-ui` to a minimal shim):
- *  - `macOSColors` — inlined verbatim subset from
- *    shared/src/ui/gameUI/constants/macOSDesignSystemColors.ts.
- *  - Icons — inline lucide SVGs (shared-ui's icons are lucide re-exports).
- *
- * Intentional deviations (all logged):
- *  - `useSafeAreaInsets` is not ported: `applySafeAreaInset` is accepted for
- *    API compatibility and ignored — a floating web panel (and a desktop
- *    window) has no home indicator to clear, the exact case native gates OFF.
- *  - `keyboardShouldPersistTaps` is a RN-keyboard concern with no DOM
- *    equivalent.
- *
- * @platform React DOM Web
- */
-
-import { useMemo, useState } from "react";
-import Explorer from "./response-editor/Explorer.web";
-import { ResponseEditorContext } from "./response-editor/editorContext";
-import { NetworkNumberPrompt } from "./NetworkNumberPrompt.web";
-import { STATUS_MAX, STATUS_MIN } from "../overrides/types";
-
-// =============================
-// Native palette (provenance)
-// =============================
-
-/** macOSColors subset — shared/src/ui/gameUI/constants/macOSDesignSystemColors.ts, verbatim. */
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const macOSColors = {
-  background: {
-    base: "#0A0A0C",
-    card: "#1A1A1C",
-    input: "#26262A"
-  },
-  border: {
-    default: "#2D2D2F",
-    input: "#3D3D42"
-  },
-  text: {
-    primary: "#F5F5F7",
-    secondary: "#A1A1A6",
-    muted: "#8E8E93"
-  },
-  semantic: {
-    error: "#FF453A",
-    info: "#00B8E6"
-  }
-};
-
-// =============================
-// Inline lucide icons (shared-ui icons are lucide re-exports)
-// =============================
-
-function Svg({
-  size = 14,
-  color = "currentColor",
-  children
-}) {
-  return /*#__PURE__*/_jsx("svg", {
-    width: size,
-    height: size,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: color,
-    strokeWidth: 2,
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    style: {
-      flexShrink: 0,
-      display: "block"
-    },
-    children: children
-  });
-}
-const ChevronDown = p => /*#__PURE__*/_jsx(Svg, {
-  ...p,
-  children: /*#__PURE__*/_jsx("path", {
-    d: "m6 9 6 6 6-6"
-  })
-});
-const ChevronRight = p => /*#__PURE__*/_jsx(Svg, {
-  ...p,
-  children: /*#__PURE__*/_jsx("path", {
-    d: "m9 18 6-6-6-6"
-  })
-});
-const METHODS = ["GET", "POST", "PUT", "PATCH", "DELETE"];
-const DELAY_PRESETS = [0, 500, 1000, 3000, 10000];
-
-/**
- * The single decision, ordered by how often a developer reaches for it — the
- * OUTCOMES list, native verbatim (plain-language name AND status code).
- */
-
-const OUTCOMES = [{
-  id: "500",
-  label: "Server error",
-  code: "500",
-  danger: true,
-  patch: {
-    kind: "respond",
-    status: 500,
-    statusText: "Internal Server Error"
-  }
-}, {
-  id: "401",
-  label: "Unauthorized",
-  code: "401",
-  danger: true,
-  patch: {
-    kind: "respond",
-    status: 401,
-    statusText: "Unauthorized"
-  }
-}, {
-  id: "404",
-  label: "Not found",
-  code: "404",
-  danger: true,
-  patch: {
-    kind: "respond",
-    status: 404,
-    statusText: "Not Found"
-  }
-}, {
-  id: "403",
-  label: "Forbidden",
-  code: "403",
-  danger: true,
-  patch: {
-    kind: "respond",
-    status: 403,
-    statusText: "Forbidden"
-  }
-}, {
-  id: "429",
-  label: "Rate limited",
-  code: "429",
-  danger: true,
-  patch: {
-    kind: "respond",
-    status: 429,
-    statusText: "Too Many Requests"
-  }
-}, {
-  id: "503",
-  label: "Unavailable",
-  code: "503",
-  danger: true,
-  patch: {
-    kind: "respond",
-    status: 503,
-    statusText: "Service Unavailable"
-  }
-}, {
-  id: "400",
-  label: "Bad request",
-  code: "400",
-  danger: true,
-  patch: {
-    kind: "respond",
-    status: 400,
-    statusText: "Bad Request"
-  }
-}, {
-  id: "200",
-  label: "Success",
-  code: "200",
-  patch: {
-    kind: "respond",
-    status: 200,
-    statusText: "OK"
-  }
-}, {
-  id: "offline",
-  label: "Offline",
-  danger: true,
-  patch: {
-    kind: "fail",
-    failKind: "network"
-  }
-}, {
-  id: "timeout",
-  label: "Timeout",
-  danger: true,
-  patch: {
-    kind: "fail",
-    failKind: "timeout"
-  }
-}, {
-  id: "passthrough",
-  label: "Real response",
-  patch: {
-    kind: "delay"
-  }
-}];
-function outcomeIdFor(draft) {
-  if (draft.kind === "delay") return "passthrough";
-  if (draft.kind === "fail") {
-    return draft.failKind === "timeout" ? "timeout" : "offline";
-  }
-  return String(draft.status ?? 200);
-}
-function OutcomeChip({
-  outcome,
-  active,
-  onPress
-}) {
-  const accent = outcome.danger ? macOSColors.semantic.error : macOSColors.semantic.info;
-  return /*#__PURE__*/_jsxs("button", {
-    type: "button",
-    onClick: onPress,
-    "aria-label": `${outcome.label}${outcome.code ? ` ${outcome.code}` : ""}`,
-    "aria-pressed": active,
-    style: {
-      ...styles.outcome,
-      ...(active ? {
-        border: `1px solid ${accent}`,
-        backgroundColor: `${accent}1F`
-      } : null)
-    },
-    children: [/*#__PURE__*/_jsx("span", {
-      style: {
-        ...styles.outcomeLabel,
-        ...(active ? {
-          color: accent
-        } : null)
-      },
-      children: outcome.label
-    }), outcome.code ? /*#__PURE__*/_jsx("span", {
-      style: {
-        ...styles.outcomeCode,
-        ...(active ? {
-          color: accent
-        } : null)
-      },
-      children: outcome.code
-    }) : null]
-  });
-}
-
-/** A collapsed row that opens to reveal its controls. */
-function Disclosure({
-  title,
-  summary,
-  open,
-  onToggle,
-  children
-}) {
-  return /*#__PURE__*/_jsxs("div", {
-    style: styles.disclosure,
-    children: [/*#__PURE__*/_jsxs("button", {
-      type: "button",
-      onClick: onToggle,
-      "aria-expanded": open,
-      style: styles.disclosureHeader,
-      children: [open ? /*#__PURE__*/_jsx(ChevronDown, {
-        size: 12,
-        color: macOSColors.text.muted
-      }) : /*#__PURE__*/_jsx(ChevronRight, {
-        size: 12,
-        color: macOSColors.text.muted
-      }), /*#__PURE__*/_jsx("span", {
-        style: styles.disclosureTitle,
-        children: title
-      }), summary && !open ? /*#__PURE__*/_jsx("span", {
-        style: styles.disclosureSummary,
-        children: summary
-      }) : null]
-    }), open ? /*#__PURE__*/_jsx("div", {
-      style: styles.disclosureBody,
-      children: children
-    }) : null]
-  });
-}
-function Chip({
-  label,
-  active,
-  onPress
-}) {
-  return /*#__PURE__*/_jsx("button", {
-    type: "button",
-    onClick: onPress,
-    "aria-pressed": active,
-    style: {
-      ...styles.chip,
-      ...(active ? styles.chipActive : null)
-    },
-    children: /*#__PURE__*/_jsx("span", {
-      style: {
-        ...styles.chipText,
-        ...(active ? styles.chipTextActive : null)
-      },
-      children: label
-    })
-  });
-}
-export function NetworkOverrideEditor({
-  draft,
-  onChange,
-  onSave,
-  onCancel,
-  saveLabel = "Save",
-  applySafeAreaInset: _applySafeAreaInset = false
-}) {
-  const patch = next => onChange({
-    ...draft,
-    ...next
-  });
-
-  // A rule made from a request arrives with its scope already right, so it
-  // starts closed. A blank one has nothing to match on yet, so it starts open.
-  const [scopeOpen, setScopeOpen] = useState(!draft.urlPattern.trim());
-  const [bodyOpen, setBodyOpen] = useState(false);
-  /**
-   * The "Edit all" buffer — deliberately NOT seeded with the current body
-   * (native comment: you only reach for this to REPLACE the whole thing, and
-   * starting empty means paste-and-go).
-   */
-  const [pasteText, setPasteText] = useState(null);
-  /** Which custom number the top-of-screen prompt is asking for, if any. */
-  const [prompt, setPrompt] = useState(null);
-  const activeOutcome = outcomeIdFor(draft);
-  /** True when the status is a real one that no listed outcome covers. */
-  const customStatusActive = draft.kind === "respond" && typeof draft.status === "number" && !OUTCOMES.some(outcome => outcome.code === String(draft.status));
-  const showsBody = draft.kind === "respond";
-  const method = draft.methods?.[0];
-  const scopeSummary = `${method ?? "Any"}  ${draft.urlPattern || "No URL yet"}`;
-  const bodySummary = useMemo(() => {
-    const body = (draft.body ?? "").trim();
-    if (!body) return "Empty";
-    const lines = body.split("\n").length;
-    return `${lines} line${lines === 1 ? "" : "s"}`;
-  }, [draft.body]);
-
-  /**
-   * The body as a tree, or null when it can't be one (empty, or not JSON).
-   * Memoized on the raw string — an override body can be large.
-   */
-  const parsedBody = useMemo(() => {
-    const body = (draft.body ?? "").trim();
-    if (!body) return null;
-    try {
-      return JSON.parse(body);
-    } catch {
-      return null;
-    }
-  }, [draft.body]);
-  const bodyIsNonJsonText = (draft.body ?? "").trim().length > 0 && !parsedBody;
-  const delayMs = draft.delayMs ?? 0;
-  /** Custom fields own the value only when no preset chip already claims it. */
-  const customDelayActive = delayMs > 0 && !DELAY_PRESETS.includes(delayMs);
-  const customTimesActive = !draft.alternate && typeof draft.times === "number" && draft.times !== 1;
-  return /*#__PURE__*/_jsxs("div", {
-    style: styles.root,
-    children: [/*#__PURE__*/_jsx("div", {
-      style: styles.scroll,
-      children: /*#__PURE__*/_jsxs("div", {
-        style: styles.scrollContent,
-        children: [/*#__PURE__*/_jsxs(Disclosure, {
-          title: "Applies to",
-          summary: scopeSummary,
-          open: scopeOpen,
-          onToggle: () => setScopeOpen(v => !v),
-          children: [/*#__PURE__*/_jsx("textarea", {
-            style: styles.input,
-            value: draft.urlPattern,
-            onChange: e => patch({
-              urlPattern: e.target.value
-            }),
-            placeholder: "https://api.example.com/v1/users*",
-            autoCapitalize: "none",
-            autoCorrect: "off",
-            spellCheck: false,
-            rows: 2,
-            "aria-label": "URL pattern"
-          }), /*#__PURE__*/_jsxs("div", {
-            style: styles.chipRow,
-            children: [/*#__PURE__*/_jsx(Chip, {
-              label: "Any",
-              active: !method,
-              onPress: () => patch({
-                methods: undefined
-              })
-            }), METHODS.map(m => /*#__PURE__*/_jsx(Chip, {
-              label: m,
-              active: method === m,
-              onPress: () => patch({
-                methods: [m]
-              })
-            }, m))]
-          })]
-        }), /*#__PURE__*/_jsxs("div", {
-          style: styles.outcomeGrid,
-          children: [OUTCOMES.map(outcome => /*#__PURE__*/_jsx(OutcomeChip, {
-            outcome: outcome,
-            active: activeOutcome === outcome.id,
-            onPress: () => patch(outcome.patch)
-          }, outcome.id)), /*#__PURE__*/_jsx("button", {
-            type: "button",
-            onClick: () => setPrompt("status"),
-            "aria-label": "Custom status code",
-            style: {
-              ...styles.customField,
-              ...(customStatusActive ? styles.customFieldActive : null)
-            },
-            children: /*#__PURE__*/_jsx("span", {
-              style: {
-                ...styles.customValue,
-                ...(customStatusActive ? styles.customInputActive : null)
-              },
-              children: customStatusActive ? String(draft.status) : "Custom"
-            })
-          })]
-        }), showsBody ? /*#__PURE__*/_jsx(Disclosure, {
-          title: "Response body",
-          summary: bodySummary,
-          open: bodyOpen,
-          onToggle: () => setBodyOpen(v => !v),
-          children: pasteText !== null ?
-          /*#__PURE__*/
-          /* Replace-the-whole-thing mode. Starts empty — see `pasteText`. */
-          _jsxs(_Fragment, {
-            children: [/*#__PURE__*/_jsx("textarea", {
-              style: {
-                ...styles.input,
-                ...styles.bodyInput
-              },
-              value: pasteText,
-              onChange: e => setPasteText(e.target.value),
-              placeholder: "Paste a new body\u2026",
-              autoCapitalize: "none",
-              autoCorrect: "off",
-              spellCheck: false,
-              autoFocus: true,
-              "aria-label": "New response body"
-            }), /*#__PURE__*/_jsxs("div", {
-              style: styles.inlineActions,
-              children: [/*#__PURE__*/_jsx("button", {
-                type: "button",
-                onClick: () => setPasteText(null),
-                style: styles.textButton,
-                children: /*#__PURE__*/_jsx("span", {
-                  style: styles.textButtonMuted,
-                  children: "Cancel"
-                })
-              }), /*#__PURE__*/_jsx("button", {
-                type: "button",
-                onClick: () => {
-                  const next = pasteText.trim();
-                  // Pretty-print JSON on the way in so the tree it
-                  // becomes is readable; anything else is kept exactly
-                  // as pasted.
-                  try {
-                    patch({
-                      body: JSON.stringify(JSON.parse(next), null, 2)
-                    });
-                  } catch {
-                    patch({
-                      body: next
-                    });
-                  }
-                  setPasteText(null);
-                },
-                disabled: !pasteText.trim(),
-                style: styles.textButton,
-                children: /*#__PURE__*/_jsx("span", {
-                  style: {
-                    ...styles.textButtonLabel,
-                    ...(!pasteText.trim() ? styles.textButtonDisabled : null)
-                  },
-                  children: "Replace"
-                })
-              })]
-            })]
-          }) : /*#__PURE__*/_jsxs(_Fragment, {
-            children: [parsedBody !== null ?
-            /*#__PURE__*/
-            /* The SAME tree as the request detail — type into a value
-               to edit it. Editing writes the whole document back as
-               the rule's body, so the two surfaces behave
-               identically. */
-            _jsx(ResponseEditorContext.Provider, {
-              value: {
-                root: parsedBody,
-                onChange: next => patch({
-                  body: JSON.stringify(next, null, 2)
-                })
-              },
-              children: /*#__PURE__*/_jsx(Explorer, {
-                editable: true,
-                label: "",
-                value: parsedBody,
-                defaultExpanded: [""]
-              })
-            }) : /*#__PURE__*/_jsx("span", {
-              style: styles.emptyBody,
-              children: bodyIsNonJsonText ? "This body isn't JSON, so there's no tree to show." : "No body yet."
-            }), /*#__PURE__*/_jsx("button", {
-              type: "button",
-              onClick: () => setPasteText(""),
-              style: styles.textButton,
-              children: /*#__PURE__*/_jsx("span", {
-                style: styles.textButtonLabel,
-                children: "Edit all"
-              })
-            })]
-          })
-        }) : null, /*#__PURE__*/_jsxs("div", {
-          style: styles.field,
-          children: [/*#__PURE__*/_jsx("span", {
-            style: styles.subLabel,
-            children: "Delay"
-          }), /*#__PURE__*/_jsxs("div", {
-            style: styles.chipRow,
-            children: [DELAY_PRESETS.map(ms => /*#__PURE__*/_jsx(Chip, {
-              label: ms === 0 ? "None" : `${ms / 1000}s`,
-              active: delayMs === ms,
-              onPress: () => patch({
-                delayMs: ms
-              })
-            }, ms)), /*#__PURE__*/_jsx("button", {
-              type: "button",
-              onClick: () => setPrompt("delay"),
-              "aria-label": "Custom delay in seconds",
-              style: {
-                ...styles.customField,
-                ...(customDelayActive ? styles.customFieldActive : null)
-              },
-              children: /*#__PURE__*/_jsx("span", {
-                style: {
-                  ...styles.customValue,
-                  ...(customDelayActive ? styles.customInputActive : null)
-                },
-                children: customDelayActive ? `${delayMs / 1000}s` : "Custom"
-              })
-            })]
-          })]
-        }), /*#__PURE__*/_jsxs("div", {
-          style: styles.field,
-          children: [/*#__PURE__*/_jsx("span", {
-            style: styles.subLabel,
-            children: "Fires"
-          }), /*#__PURE__*/_jsx("span", {
-            style: styles.subHint,
-            children: "A limited rule switches itself off once it's used up. Every other alternates forever \u2014 the first request through, the next overridden."
-          }), /*#__PURE__*/_jsxs("div", {
-            style: styles.chipRow,
-            children: [/*#__PURE__*/_jsx(Chip, {
-              label: "Always",
-              active: !draft.alternate && draft.times == null,
-              onPress: () => patch({
-                alternate: false,
-                times: null
-              })
-            }), /*#__PURE__*/_jsx(Chip, {
-              label: "Once",
-              active: !draft.alternate && draft.times === 1,
-              onPress: () => patch({
-                alternate: false,
-                times: 1
-              })
-            }), /*#__PURE__*/_jsx(Chip, {
-              label: "Every other",
-              active: draft.alternate === true,
-              onPress: () => patch({
-                alternate: true,
-                times: null
-              })
-            }), /*#__PURE__*/_jsx("button", {
-              type: "button",
-              onClick: () => {
-                patch({
-                  alternate: false
-                });
-                setPrompt("times");
-              },
-              "aria-label": "Custom number of times",
-              style: {
-                ...styles.customField,
-                ...(customTimesActive ? styles.customFieldActive : null)
-              },
-              children: /*#__PURE__*/_jsx("span", {
-                style: {
-                  ...styles.customValue,
-                  ...(customTimesActive ? styles.customInputActive : null)
-                },
-                children: customTimesActive ? `${draft.times}×` : "Custom"
-              })
-            })]
-          })]
-        })]
-      })
-    }), prompt === "status" ? /*#__PURE__*/_jsx(NetworkNumberPrompt, {
-      title: "Custom status code",
-      hint: `${STATUS_MIN}–${STATUS_MAX}`,
-      value: customStatusActive ? draft.status : undefined,
-      min: STATUS_MIN,
-      max: STATUS_MAX,
-      onSubmit: next => {
-        patch({
-          kind: "respond",
-          status: next ?? undefined,
-          statusText: undefined
-        });
-        setPrompt(null);
-      },
-      onCancel: () => setPrompt(null)
-    }) : null, prompt === "delay" ? /*#__PURE__*/_jsx(NetworkNumberPrompt, {
-      title: "Custom delay",
-      hint: "Seconds",
-      value: customDelayActive ? delayMs / 1000 : undefined,
-      min: 0,
-      onSubmit: next => {
-        patch({
-          delayMs: next != null ? Math.round(next * 1000) : 0
-        });
-        setPrompt(null);
-      },
-      onCancel: () => setPrompt(null)
-    }) : null, prompt === "times" ? /*#__PURE__*/_jsx(NetworkNumberPrompt, {
-      title: "Fires how many times",
-      hint: "Leave empty for always",
-      value: customTimesActive ? draft.times : undefined,
-      min: 1,
-      onSubmit: next => {
-        // Empty or zero means "no limit" rather than a rule that is spent
-        // before it ever fires.
-        patch({
-          alternate: false,
-          times: next && next > 0 ? next : null
-        });
-        setPrompt(null);
-      },
-      onCancel: () => setPrompt(null)
-    }) : null, /*#__PURE__*/_jsxs("div", {
-      style: styles.footer,
-      children: [/*#__PURE__*/_jsx("button", {
-        type: "button",
-        onClick: onCancel,
-        style: {
-          ...styles.footerButton,
-          ...styles.cancelButton
-        },
-        children: /*#__PURE__*/_jsx("span", {
-          style: styles.cancelText,
-          children: "Cancel"
-        })
-      }), /*#__PURE__*/_jsx("button", {
-        type: "button",
-        onClick: onSave,
-        disabled: !draft.urlPattern.trim(),
-        style: {
-          ...styles.footerButton,
-          ...styles.saveButton,
-          ...(!draft.urlPattern.trim() ? styles.saveButtonDisabled : null)
-        },
-        children: /*#__PURE__*/_jsx("span", {
-          style: styles.saveText,
-          children: saveLabel
-        })
-      })]
-    })]
-  });
-}
-
-// Values mirror the native StyleSheet block 1:1.
-const styles = {
-  root: {
-    position: "relative",
-    display: "flex",
-    flexDirection: "column",
-    flex: 1,
-    minHeight: 0
-  },
-  scroll: {
-    flex: 1,
-    minHeight: 0,
-    overflowY: "auto"
-  },
-  scrollContent: {
-    padding: "12px 12px 24px",
-    display: "flex",
-    flexDirection: "column",
-    gap: 4
-  },
-  field: {
-    display: "flex",
-    flexDirection: "column",
-    gap: 8,
-    padding: "6px 0"
-  },
-  outcomeGrid: {
-    display: "flex",
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 6,
-    padding: "10px 0"
-  },
-  outcome: {
-    display: "inline-flex",
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    padding: "9px 10px",
-    borderRadius: 6,
-    border: `1px solid ${macOSColors.border.default}`,
-    backgroundColor: macOSColors.background.card,
-    cursor: "pointer",
-    margin: 0,
-    boxSizing: "border-box"
-  },
-  outcomeLabel: {
-    fontSize: 12,
-    fontWeight: 600,
-    color: macOSColors.text.primary
-  },
-  outcomeCode: {
-    fontSize: 10,
-    fontWeight: 700,
-    color: macOSColors.text.muted
-  },
-  disclosure: {
-    borderRadius: 6,
-    border: `1px solid ${macOSColors.border.default}`,
-    backgroundColor: macOSColors.background.card,
-    overflow: "hidden"
-  },
-  disclosureHeader: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    padding: "10px 10px",
-    width: "100%",
-    boxSizing: "border-box",
-    background: "none",
-    border: "none",
-    cursor: "pointer",
-    margin: 0,
-    textAlign: "left",
-    font: "inherit"
-  },
-  disclosureTitle: {
-    fontSize: 12,
-    fontWeight: 600,
-    color: macOSColors.text.primary,
-    whiteSpace: "nowrap"
-  },
-  disclosureSummary: {
-    flex: 1,
-    minWidth: 0,
-    textAlign: "right",
-    fontSize: 11,
-    color: macOSColors.text.muted,
-    whiteSpace: "nowrap",
-    overflow: "hidden",
-    textOverflow: "ellipsis"
-  },
-  disclosureBody: {
-    padding: "0 10px 10px",
-    display: "flex",
-    flexDirection: "column",
-    gap: 8
-  },
-  input: {
-    backgroundColor: macOSColors.background.input,
-    border: `1px solid ${macOSColors.border.input}`,
-    borderRadius: 6,
-    padding: "8px 10px",
-    color: macOSColors.text.primary,
-    fontSize: 12,
-    fontFamily: "ui-monospace, Menlo, monospace",
-    minHeight: 40,
-    outline: "none",
-    resize: "vertical",
-    boxSizing: "border-box",
-    width: "100%"
-  },
-  bodyInput: {
-    minHeight: 140
-  },
-  chipRow: {
-    display: "flex",
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 6
-  },
-  chip: {
-    padding: "6px 10px",
-    borderRadius: 5,
-    border: `1px solid ${macOSColors.border.default}`,
-    backgroundColor: macOSColors.background.base,
-    cursor: "pointer",
-    margin: 0,
-    boxSizing: "border-box"
-  },
-  chipActive: {
-    border: `1px solid ${macOSColors.semantic.info}`,
-    backgroundColor: `${macOSColors.semantic.info}1F`
-  },
-  chipText: {
-    fontSize: 11,
-    fontWeight: 600,
-    color: macOSColors.text.secondary
-  },
-  chipTextActive: {
-    color: macOSColors.semantic.info
-  },
-  customField: {
-    display: "inline-flex",
-    flexDirection: "row",
-    alignItems: "center",
-    padding: "0 8px",
-    borderRadius: 5,
-    border: `1px solid ${macOSColors.border.default}`,
-    backgroundColor: macOSColors.background.base,
-    cursor: "pointer",
-    margin: 0,
-    boxSizing: "border-box"
-  },
-  customFieldActive: {
-    border: `1px solid ${macOSColors.semantic.info}`,
-    backgroundColor: `${macOSColors.semantic.info}1F`
-  },
-  customValue: {
-    padding: "6px 0",
-    fontSize: 11,
-    fontWeight: 600,
-    color: macOSColors.text.secondary
-  },
-  customInputActive: {
-    color: macOSColors.semantic.info
-  },
-  subHint: {
-    fontSize: 10,
-    lineHeight: "14px",
-    color: macOSColors.text.muted,
-    marginTop: -2
-  },
-  subLabel: {
-    fontSize: 10,
-    fontWeight: 700,
-    letterSpacing: 0.6,
-    color: macOSColors.text.muted,
-    textTransform: "uppercase"
-  },
-  textButton: {
-    alignSelf: "flex-start",
-    padding: "4px 0",
-    background: "none",
-    border: "none",
-    cursor: "pointer",
-    margin: 0
-  },
-  textButtonLabel: {
-    fontSize: 11,
-    fontWeight: 600,
-    color: macOSColors.semantic.info
-  },
-  textButtonMuted: {
-    fontSize: 11,
-    fontWeight: 600,
-    color: macOSColors.text.secondary
-  },
-  textButtonDisabled: {
-    opacity: 0.4
-  },
-  inlineActions: {
-    display: "flex",
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between"
-  },
-  emptyBody: {
-    fontSize: 11,
-    color: macOSColors.text.muted,
-    padding: "6px 0"
-  },
-  footer: {
-    display: "flex",
-    flexDirection: "row",
-    gap: 8,
-    padding: 12,
-    borderTop: `1px solid ${macOSColors.border.default}`,
-    backgroundColor: macOSColors.background.base
-  },
-  footerButton: {
-    flex: 1,
-    padding: "11px 0",
-    borderRadius: 6,
-    display: "inline-flex",
-    alignItems: "center",
-    justifyContent: "center",
-    cursor: "pointer",
-    margin: 0,
-    boxSizing: "border-box"
-  },
-  cancelButton: {
-    border: `1px solid ${macOSColors.border.default}`,
-    backgroundColor: macOSColors.background.card
-  },
-  cancelText: {
-    fontSize: 12,
-    fontWeight: 600,
-    color: macOSColors.text.secondary
-  },
-  saveButton: {
-    border: `1px solid ${macOSColors.semantic.info}`,
-    backgroundColor: `${macOSColors.semantic.info}22`
-  },
-  saveButtonDisabled: {
-    opacity: 0.4,
-    cursor: "default"
-  },
-  saveText: {
-    fontSize: 12,
-    fontWeight: 700,
-    color: macOSColors.semantic.info
-  }
-};
+"use strict";import{useMemo as A,useState as g}from"react";import U from"./response-editor/Explorer.web";import{ResponseEditorContext as j}from"./response-editor/editorContext";import{NetworkNumberPrompt as k}from"./NetworkNumberPrompt.web";import{STATUS_MAX as w,STATUS_MIN as B}from"../overrides/types";import{jsx as o,jsxs as i,Fragment as F}from"react/jsx-runtime";const l={background:{base:"#0A0A0C",card:"#1A1A1C",input:"#26262A"},border:{default:"#2D2D2F",input:"#3D3D42"},text:{primary:"#F5F5F7",secondary:"#A1A1A6",muted:"#8E8E93"},semantic:{error:"#FF453A",info:"#00B8E6"}};function $({size:t=14,color:r="currentColor",children:a}){return o("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",stroke:r,strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round",style:{flexShrink:0,display:"block"},children:a})}const _=t=>o($,{...t,children:o("path",{d:"m6 9 6 6 6-6"})});const J=t=>o($,{...t,children:o("path",{d:"m9 18 6-6-6-6"})});const q=["GET","POST","PUT","PATCH","DELETE"];const z=[0,500,1e3,3e3,1e4];const D=[{id:"500",label:"Server error",code:"500",danger:true,patch:{kind:"respond",status:500,statusText:"Internal Server Error"}},{id:"401",label:"Unauthorized",code:"401",danger:true,patch:{kind:"respond",status:401,statusText:"Unauthorized"}},{id:"404",label:"Not found",code:"404",danger:true,patch:{kind:"respond",status:404,statusText:"Not Found"}},{id:"403",label:"Forbidden",code:"403",danger:true,patch:{kind:"respond",status:403,statusText:"Forbidden"}},{id:"429",label:"Rate limited",code:"429",danger:true,patch:{kind:"respond",status:429,statusText:"Too Many Requests"}},{id:"503",label:"Unavailable",code:"503",danger:true,patch:{kind:"respond",status:503,statusText:"Service Unavailable"}},{id:"400",label:"Bad request",code:"400",danger:true,patch:{kind:"respond",status:400,statusText:"Bad Request"}},{id:"200",label:"Success",code:"200",patch:{kind:"respond",status:200,statusText:"OK"}},{id:"offline",label:"Offline",danger:true,patch:{kind:"fail",failKind:"network"}},{id:"timeout",label:"Timeout",danger:true,patch:{kind:"fail",failKind:"timeout"}},{id:"passthrough",label:"Real response",patch:{kind:"delay"}}];function K(t){if(t.kind==="delay")return"passthrough";if(t.kind==="fail"){return t.failKind==="timeout"?"timeout":"offline"}return String(t.status??200)}function V({outcome:t,active:r,onPress:a}){const u=t.danger?l.semantic.error:l.semantic.info;return i("button",{type:"button",onClick:a,"aria-label":`${t.label}${t.code?` ${t.code}`:""}`,"aria-pressed":r,style:{...e.outcome,...r?{border:`1px solid ${u}`,backgroundColor:`${u}1F`}:null},children:[o("span",{style:{...e.outcomeLabel,...r?{color:u}:null},children:t.label}),t.code?o("span",{style:{...e.outcomeCode,...r?{color:u}:null},children:t.code}):null]})}function P({title:t,summary:r,open:a,onToggle:u,children:v}){return i("div",{style:e.disclosure,children:[i("button",{type:"button",onClick:u,"aria-expanded":a,style:e.disclosureHeader,children:[a?o(_,{size:12,color:l.text.muted}):o(J,{size:12,color:l.text.muted}),o("span",{style:e.disclosureTitle,children:t}),r&&!a?o("span",{style:e.disclosureSummary,children:r}):null]}),a?o("div",{style:e.disclosureBody,children:v}):null]})}function c({label:t,active:r,onPress:a}){return o("button",{type:"button",onClick:a,"aria-pressed":r,style:{...e.chip,...r?e.chipActive:null},children:o("span",{style:{...e.chipText,...r?e.chipTextActive:null},children:t})})}export function NetworkOverrideEditor({draft:t,onChange:r,onSave:a,onCancel:u,saveLabel:v="Save",applySafeAreaInset:G=false}){const s=n=>r({...t,...n});const[E,O]=g(!t.urlPattern.trim());const[R,I]=g(false);const[p,m]=g(null);const[S,d]=g(null);const N=K(t);const y=t.kind==="respond"&&typeof t.status==="number"&&!D.some(n=>n.code===String(t.status));const L=t.kind==="respond";const C=t.methods?.[0];const M=`${C??"Any"}  ${t.urlPattern||"No URL yet"}`;const W=A(()=>{const n=(t.body??"").trim();if(!n)return"Empty";const T=n.split("\n").length;return`${T} line${T===1?"":"s"}`},[t.body]);const h=A(()=>{const n=(t.body??"").trim();if(!n)return null;try{return JSON.parse(n)}catch{return null}},[t.body]);const H=(t.body??"").trim().length>0&&!h;const b=t.delayMs??0;const x=b>0&&!z.includes(b);const f=!t.alternate&&typeof t.times==="number"&&t.times!==1;return i("div",{style:e.root,children:[o("div",{style:e.scroll,children:i("div",{style:e.scrollContent,children:[i(P,{title:"Applies to",summary:M,open:E,onToggle:()=>O(n=>!n),children:[o("textarea",{style:e.input,value:t.urlPattern,onChange:n=>s({urlPattern:n.target.value}),placeholder:"https://api.example.com/v1/users*",autoCapitalize:"none",autoCorrect:"off",spellCheck:false,rows:2,"aria-label":"URL pattern"}),i("div",{style:e.chipRow,children:[o(c,{label:"Any",active:!C,onPress:()=>s({methods:void 0})}),q.map(n=>o(c,{label:n,active:C===n,onPress:()=>s({methods:[n]})},n))]})]}),i("div",{style:e.outcomeGrid,children:[D.map(n=>o(V,{outcome:n,active:N===n.id,onPress:()=>s(n.patch)},n.id)),o("button",{type:"button",onClick:()=>d("status"),"aria-label":"Custom status code",style:{...e.customField,...y?e.customFieldActive:null},children:o("span",{style:{...e.customValue,...y?e.customInputActive:null},children:y?String(t.status):"Custom"})})]}),L?o(P,{title:"Response body",summary:W,open:R,onToggle:()=>I(n=>!n),children:p!==null?i(F,{children:[o("textarea",{style:{...e.input,...e.bodyInput},value:p,onChange:n=>m(n.target.value),placeholder:"Paste a new body\u2026",autoCapitalize:"none",autoCorrect:"off",spellCheck:false,autoFocus:true,"aria-label":"New response body"}),i("div",{style:e.inlineActions,children:[o("button",{type:"button",onClick:()=>m(null),style:e.textButton,children:o("span",{style:e.textButtonMuted,children:"Cancel"})}),o("button",{type:"button",onClick:()=>{const n=p.trim();try{s({body:JSON.stringify(JSON.parse(n),null,2)})}catch{s({body:n})}m(null)},disabled:!p.trim(),style:e.textButton,children:o("span",{style:{...e.textButtonLabel,...!p.trim()?e.textButtonDisabled:null},children:"Replace"})})]})]}):i(F,{children:[h!==null?o(j.Provider,{value:{root:h,onChange:n=>s({body:JSON.stringify(n,null,2)})},children:o(U,{editable:true,label:"",value:h,defaultExpanded:[""]})}):o("span",{style:e.emptyBody,children:H?"This body isn't JSON, so there's no tree to show.":"No body yet."}),o("button",{type:"button",onClick:()=>m(""),style:e.textButton,children:o("span",{style:e.textButtonLabel,children:"Edit all"})})]})}):null,i("div",{style:e.field,children:[o("span",{style:e.subLabel,children:"Delay"}),i("div",{style:e.chipRow,children:[z.map(n=>o(c,{label:n===0?"None":`${n/1e3}s`,active:b===n,onPress:()=>s({delayMs:n})},n)),o("button",{type:"button",onClick:()=>d("delay"),"aria-label":"Custom delay in seconds",style:{...e.customField,...x?e.customFieldActive:null},children:o("span",{style:{...e.customValue,...x?e.customInputActive:null},children:x?`${b/1e3}s`:"Custom"})})]})]}),i("div",{style:e.field,children:[o("span",{style:e.subLabel,children:"Fires"}),o("span",{style:e.subHint,children:"A limited rule switches itself off once it's used up. Every other alternates forever \u2014 the first request through, the next overridden."}),i("div",{style:e.chipRow,children:[o(c,{label:"Always",active:!t.alternate&&t.times==null,onPress:()=>s({alternate:false,times:null})}),o(c,{label:"Once",active:!t.alternate&&t.times===1,onPress:()=>s({alternate:false,times:1})}),o(c,{label:"Every other",active:t.alternate===true,onPress:()=>s({alternate:true,times:null})}),o("button",{type:"button",onClick:()=>{s({alternate:false});d("times")},"aria-label":"Custom number of times",style:{...e.customField,...f?e.customFieldActive:null},children:o("span",{style:{...e.customValue,...f?e.customInputActive:null},children:f?`${t.times}\xD7`:"Custom"})})]})]})]})}),S==="status"?o(k,{title:"Custom status code",hint:`${B}\u2013${w}`,value:y?t.status:void 0,min:B,max:w,onSubmit:n=>{s({kind:"respond",status:n??void 0,statusText:void 0});d(null)},onCancel:()=>d(null)}):null,S==="delay"?o(k,{title:"Custom delay",hint:"Seconds",value:x?b/1e3:void 0,min:0,onSubmit:n=>{s({delayMs:n!=null?Math.round(n*1e3):0});d(null)},onCancel:()=>d(null)}):null,S==="times"?o(k,{title:"Fires how many times",hint:"Leave empty for always",value:f?t.times:void 0,min:1,onSubmit:n=>{s({alternate:false,times:n&&n>0?n:null});d(null)},onCancel:()=>d(null)}):null,i("div",{style:e.footer,children:[o("button",{type:"button",onClick:u,style:{...e.footerButton,...e.cancelButton},children:o("span",{style:e.cancelText,children:"Cancel"})}),o("button",{type:"button",onClick:a,disabled:!t.urlPattern.trim(),style:{...e.footerButton,...e.saveButton,...!t.urlPattern.trim()?e.saveButtonDisabled:null},children:o("span",{style:e.saveText,children:v})})]})]})}const e={root:{position:"relative",display:"flex",flexDirection:"column",flex:1,minHeight:0},scroll:{flex:1,minHeight:0,overflowY:"auto"},scrollContent:{padding:"12px 12px 24px",display:"flex",flexDirection:"column",gap:4},field:{display:"flex",flexDirection:"column",gap:8,padding:"6px 0"},outcomeGrid:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:6,padding:"10px 0"},outcome:{display:"inline-flex",flexDirection:"row",alignItems:"center",gap:6,padding:"9px 10px",borderRadius:6,border:`1px solid ${l.border.default}`,backgroundColor:l.background.card,cursor:"pointer",margin:0,boxSizing:"border-box"},outcomeLabel:{fontSize:12,fontWeight:600,color:l.text.primary},outcomeCode:{fontSize:10,fontWeight:700,color:l.text.muted},disclosure:{borderRadius:6,border:`1px solid ${l.border.default}`,backgroundColor:l.background.card,overflow:"hidden"},disclosureHeader:{display:"flex",flexDirection:"row",alignItems:"center",gap:6,padding:"10px 10px",width:"100%",boxSizing:"border-box",background:"none",border:"none",cursor:"pointer",margin:0,textAlign:"left",font:"inherit"},disclosureTitle:{fontSize:12,fontWeight:600,color:l.text.primary,whiteSpace:"nowrap"},disclosureSummary:{flex:1,minWidth:0,textAlign:"right",fontSize:11,color:l.text.muted,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},disclosureBody:{padding:"0 10px 10px",display:"flex",flexDirection:"column",gap:8},input:{backgroundColor:l.background.input,border:`1px solid ${l.border.input}`,borderRadius:6,padding:"8px 10px",color:l.text.primary,fontSize:12,fontFamily:"ui-monospace, Menlo, monospace",minHeight:40,outline:"none",resize:"vertical",boxSizing:"border-box",width:"100%"},bodyInput:{minHeight:140},chipRow:{display:"flex",flexDirection:"row",flexWrap:"wrap",gap:6},chip:{padding:"6px 10px",borderRadius:5,border:`1px solid ${l.border.default}`,backgroundColor:l.background.base,cursor:"pointer",margin:0,boxSizing:"border-box"},chipActive:{border:`1px solid ${l.semantic.info}`,backgroundColor:`${l.semantic.info}1F`},chipText:{fontSize:11,fontWeight:600,color:l.text.secondary},chipTextActive:{color:l.semantic.info},customField:{display:"inline-flex",flexDirection:"row",alignItems:"center",padding:"0 8px",borderRadius:5,border:`1px solid ${l.border.default}`,backgroundColor:l.background.base,cursor:"pointer",margin:0,boxSizing:"border-box"},customFieldActive:{border:`1px solid ${l.semantic.info}`,backgroundColor:`${l.semantic.info}1F`},customValue:{padding:"6px 0",fontSize:11,fontWeight:600,color:l.text.secondary},customInputActive:{color:l.semantic.info},subHint:{fontSize:10,lineHeight:"14px",color:l.text.muted,marginTop:-2},subLabel:{fontSize:10,fontWeight:700,letterSpacing:.6,color:l.text.muted,textTransform:"uppercase"},textButton:{alignSelf:"flex-start",padding:"4px 0",background:"none",border:"none",cursor:"pointer",margin:0},textButtonLabel:{fontSize:11,fontWeight:600,color:l.semantic.info},textButtonMuted:{fontSize:11,fontWeight:600,color:l.text.secondary},textButtonDisabled:{opacity:.4},inlineActions:{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"space-between"},emptyBody:{fontSize:11,color:l.text.muted,padding:"6px 0"},footer:{display:"flex",flexDirection:"row",gap:8,padding:12,borderTop:`1px solid ${l.border.default}`,backgroundColor:l.background.base},footerButton:{flex:1,padding:"11px 0",borderRadius:6,display:"inline-flex",alignItems:"center",justifyContent:"center",cursor:"pointer",margin:0,boxSizing:"border-box"},cancelButton:{border:`1px solid ${l.border.default}`,backgroundColor:l.background.card},cancelText:{fontSize:12,fontWeight:600,color:l.text.secondary},saveButton:{border:`1px solid ${l.semantic.info}`,backgroundColor:`${l.semantic.info}22`},saveButtonDisabled:{opacity:.4,cursor:"default"},saveText:{fontSize:12,fontWeight:700,color:l.semantic.info}};