@forgecharts/sdk 1.4.3 → 1.5.0

package/dist/forgecharts.css

@@ -4083,6 +4083,10 @@ select {
   background: rgba(88, 166, 255, 0.18);
   color: var(--accent, #58a6ff);
 }
+.broker-logo--topstep {
+  background: rgba(74, 222, 128, 0.18);
+  color: var(--color-success, #4ade80);
+}
 
 /* ── Rithmic / broker connect form ────────────────────────────────────────── */
 

package/dist/react/internal.js

@@ -33507,6 +33507,7 @@ var BROKERS = [
   { id: "ninjabrokerage", name: "NinjaTrader Brokerage", description: "Futures & Forex", status: "coming-soon" },
   { id: "rithmic", name: "Rithmic", description: "Futures & Forex", status: "available" },
   { id: "tastytrade", name: "tastytrade", description: "Options & Futures", status: "coming-soon" },
+  { id: "topstep", name: "TopStep", description: "Futures (TopstepX)", status: "available" },
   { id: "tradestation", name: "TradeStation", description: "Stocks, Futures & Options", status: "coming-soon" },
   { id: "tradier", name: "Tradier", description: "Stocks & Options", status: "coming-soon" },
   { id: "tradovate", name: "Tradovate", description: "Futures & Options", status: "coming-soon" }
@@ -33867,6 +33868,255 @@ function RithmicConnectDrawer({ onClose, onConnected, getAuthToken, savedConnect
     ] })
   ] });
 }
+function validateTopStepCreds(f) {
+  const errs = {};
+  if (!f.username.trim()) errs.username = "Username is required";
+  if (!f.apiKey.trim()) errs.apiKey = "API key is required";
+  return errs;
+}
+function TopStepConnectDrawer({ onClose, onConnected, getAuthToken, savedConnection }) {
+  const [overrideCredentials, setOverrideCredentials] = useState(false);
+  const [step, setStep] = useState("credentials");
+  const [fields, setFields] = useState({
+    username: savedConnection?.username ?? "",
+    apiKey: ""
+  });
+  const [errors, setErrors] = useState({});
+  const [loading, setLoading] = useState(false);
+  const [accounts, setAccounts] = useState([]);
+  const [apiError, setApiError] = useState("");
+  const shouldAutoConnect = !!savedConnection && !savedConnection.isExpired && !overrideCredentials;
+  const [autoConnecting, setAutoConnecting] = useState(shouldAutoConnect);
+  function handleUseNewCredentials() {
+    setFields({ username: "", apiKey: "" });
+    setErrors({});
+    setApiError("");
+    setOverrideCredentials(true);
+    setStep("credentials");
+  }
+  React11.useEffect(() => {
+    if (!shouldAutoConnect) return;
+    let cancelled = false;
+    (async () => {
+      const h = await authHeaders();
+      try {
+        const res = await fetch("/api/broker/user-sessions", {
+          method: "POST",
+          headers: h,
+          body: JSON.stringify({ connectionId: savedConnection.id })
+        });
+        if (cancelled) return;
+        const body = await res.json().catch(() => ({}));
+        if (res.ok && body.sessionId) {
+          onConnected(savedConnection.id);
+          setStep("done");
+        } else {
+          setApiError(body.error ?? "Auto-connect failed \u2014 please re-enter your API key");
+        }
+      } catch {
+        if (!cancelled) setApiError("Network error during auto-connect \u2014 please try again");
+      } finally {
+        if (!cancelled) setAutoConnecting(false);
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [shouldAutoConnect]);
+  function set(key, value) {
+    setFields((prev) => ({ ...prev, [key]: value }));
+    if (errors[key]) setErrors((prev) => ({ ...prev, [key]: void 0 }));
+    setApiError("");
+  }
+  async function authHeaders() {
+    const h = { "Content-Type": "application/json" };
+    if (getAuthToken) {
+      try {
+        h["Authorization"] = `Bearer ${await getAuthToken()}`;
+      } catch {
+      }
+    }
+    return h;
+  }
+  async function handleConnect(e) {
+    e.preventDefault();
+    const errs = validateTopStepCreds(fields);
+    if (Object.keys(errs).length > 0) {
+      setErrors(errs);
+      return;
+    }
+    setLoading(true);
+    setApiError("");
+    try {
+      const res = await fetch("/api/broker/topstep/verify", {
+        method: "POST",
+        headers: await authHeaders(),
+        body: JSON.stringify({
+          username: fields.username,
+          apiKey: fields.apiKey
+        })
+      });
+      const body = await res.json().catch(() => ({}));
+      if (!res.ok) {
+        setApiError(body.error ?? `Error ${res.status} \u2014 check your credentials and try again`);
+        return;
+      }
+      setAccounts(body.accounts ?? []);
+      setStep("accounts");
+    } catch {
+      setApiError("Network error \u2014 please try again");
+    } finally {
+      setLoading(false);
+    }
+  }
+  async function handleSelectAccount(account) {
+    setLoading(true);
+    setApiError("");
+    try {
+      const res = await fetch("/api/broker/credentials", {
+        method: "POST",
+        headers: await authHeaders(),
+        body: JSON.stringify({
+          broker: "topstep",
+          propFirm: "topstep",
+          username: fields.username,
+          password: fields.apiKey,
+          gatewayId: "topstepx",
+          accountId: account.id,
+          accountName: account.name
+        })
+      });
+      if (!res.ok) {
+        const body2 = await res.json().catch(() => ({}));
+        setApiError(body2.error ?? `Error ${res.status}`);
+        return;
+      }
+      const body = await res.json().catch(() => ({}));
+      onConnected(body.connectionId ?? "");
+      setStep("done");
+    } catch {
+      setApiError("Network error \u2014 please try again");
+    } finally {
+      setLoading(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "trade-drawer trade-drawer--connect", children: [
+    /* @__PURE__ */ jsxs("div", { className: "trade-drawer-header", children: [
+      /* @__PURE__ */ jsxs("span", { className: "trade-drawer-title", children: [
+        /* @__PURE__ */ jsx("span", { className: "broker-logo broker-logo--topstep", children: "T" }),
+        "TopStep \u2014 Connect"
+      ] }),
+      /* @__PURE__ */ jsxs("button", { className: "trade-drawer-close", onClick: onClose, title: "Close drawer", children: [
+        /* @__PURE__ */ jsx(BackIcon, {}),
+        /* @__PURE__ */ jsx("span", { style: { fontSize: 11, marginLeft: 3 }, children: "Close drawer" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "trade-drawer-body trade-drawer-body--form", children: [
+      autoConnecting && /* @__PURE__ */ jsxs("div", { className: "broker-connect-form", children: [
+        /* @__PURE__ */ jsx("div", { className: "bcf-section-label", children: "Reconnecting\u2026" }),
+        /* @__PURE__ */ jsxs("p", { style: { fontSize: 12, color: "var(--text-muted)", marginTop: 8 }, children: [
+          "Connecting with saved credentials for ",
+          /* @__PURE__ */ jsx("strong", { children: savedConnection?.username }),
+          "."
+        ] })
+      ] }),
+      !autoConnecting && step === "credentials" && /* @__PURE__ */ jsxs("form", { className: "broker-connect-form", onSubmit: handleConnect, noValidate: true, children: [
+        savedConnection && !overrideCredentials && /* @__PURE__ */ jsxs("div", { className: "bcf-saved-notice", children: [
+          /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 14 14", width: "11", height: "11", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", style: { flexShrink: 0, opacity: 0.7 }, children: [
+            /* @__PURE__ */ jsx("circle", { cx: "7", cy: "5", r: "2.5" }),
+            /* @__PURE__ */ jsx("path", { d: "M1.5 13c0-3.04 2.46-5.5 5.5-5.5s5.5 2.46 5.5 5.5" })
+          ] }),
+          /* @__PURE__ */ jsxs("span", { children: [
+            "Saved as ",
+            /* @__PURE__ */ jsx("strong", { children: savedConnection.username }),
+            savedConnection.isExpired && /* @__PURE__ */ jsx("span", { style: { color: "var(--color-warning, #f59e0b)", marginLeft: 4 }, children: "\xB7 session expired" })
+          ] }),
+          /* @__PURE__ */ jsx("button", { type: "button", className: "bcf-link-btn", onClick: handleUseNewCredentials, children: "Use different credentials" })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "bcf-section-label", children: "TopstepX credentials" }),
+        /* @__PURE__ */ jsxs("div", { className: "bcf-row", children: [
+          /* @__PURE__ */ jsxs("label", { className: "bcf-label", children: [
+            "Username ",
+            /* @__PURE__ */ jsx("span", { className: "bcf-req", children: "*" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              className: `bcf-input${errors.username ? " bcf-input--error" : ""}`,
+              type: "text",
+              value: fields.username,
+              autoComplete: "username",
+              onChange: (e) => set("username", e.target.value)
+            }
+          ),
+          errors.username && /* @__PURE__ */ jsx("span", { className: "bcf-error", children: errors.username })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "bcf-row", children: [
+          /* @__PURE__ */ jsxs("label", { className: "bcf-label", children: [
+            "API key ",
+            /* @__PURE__ */ jsx("span", { className: "bcf-req", children: "*" })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              className: `bcf-input${errors.apiKey ? " bcf-input--error" : ""}`,
+              type: "password",
+              value: fields.apiKey,
+              autoComplete: "off",
+              onChange: (e) => set("apiKey", e.target.value)
+            }
+          ),
+          errors.apiKey && /* @__PURE__ */ jsx("span", { className: "bcf-error", children: errors.apiKey }),
+          /* @__PURE__ */ jsx("span", { style: { fontSize: 11, color: "var(--text-muted)", marginTop: 4, display: "block" }, children: "Generate an API key in TopstepX under Settings \u2192 API Access." })
+        ] }),
+        apiError && /* @__PURE__ */ jsx("div", { className: "bcf-api-error", children: apiError }),
+        /* @__PURE__ */ jsx("div", { className: "bcf-actions", children: /* @__PURE__ */ jsx("button", { type: "submit", className: "bcf-btn-save", disabled: loading, children: loading ? "Connecting\u2026" : "Connect & Fetch Accounts" }) })
+      ] }),
+      !autoConnecting && step === "accounts" && /* @__PURE__ */ jsxs("div", { className: "broker-connect-form", children: [
+        /* @__PURE__ */ jsx("div", { className: "bcf-section-label", children: "Select your trading account" }),
+        accounts.length === 0 ? /* @__PURE__ */ jsx("p", { className: "bcf-empty", children: "No accounts found for these credentials." }) : /* @__PURE__ */ jsx("div", { className: "bcf-account-list", children: accounts.map((acct) => /* @__PURE__ */ jsxs("div", { className: "bcf-account-row", children: [
+          /* @__PURE__ */ jsxs("div", { className: "bcf-account-info", children: [
+            /* @__PURE__ */ jsx("span", { className: "bcf-account-name", children: acct.name }),
+            acct.type && /* @__PURE__ */ jsx("span", { className: "bcf-account-type", children: acct.type })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              className: "bcf-btn-select",
+              disabled: loading,
+              onClick: () => handleSelectAccount(acct),
+              children: loading ? "\u2026" : "Select"
+            }
+          )
+        ] }, acct.id)) }),
+        apiError && /* @__PURE__ */ jsx("div", { className: "bcf-api-error", children: apiError }),
+        /* @__PURE__ */ jsx("div", { className: "bcf-actions", children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: "bcf-btn-back",
+            onClick: () => {
+              setStep("credentials");
+              setApiError("");
+            },
+            children: "\u2190 Back"
+          }
+        ) })
+      ] }),
+      !autoConnecting && step === "done" && /* @__PURE__ */ jsxs("div", { className: "broker-connect-form", children: [
+        /* @__PURE__ */ jsxs("div", { className: "bcf-success", children: [
+          /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 20 20", width: "28", height: "28", fill: "none", stroke: "#22c55e", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+            /* @__PURE__ */ jsx("circle", { cx: "10", cy: "10", r: "8" }),
+            /* @__PURE__ */ jsx("polyline", { points: "6,10 9,13 14,7" })
+          ] }),
+          /* @__PURE__ */ jsx("span", { children: "TopStep account connected successfully." })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "bcf-actions", children: /* @__PURE__ */ jsx("button", { type: "button", className: "bcf-btn-save", onClick: onClose, children: "Done" }) }),
+        /* @__PURE__ */ jsx("div", { style: { textAlign: "center", marginTop: 12 }, children: /* @__PURE__ */ jsx("button", { type: "button", className: "bcf-link-btn", onClick: handleUseNewCredentials, children: "Use different credentials" }) })
+      ] })
+    ] })
+  ] });
+}
 function BrokerCard({ broker, savedConnection, justConnected, onConnect, onStartTrading, onDisconnect, onUseNewCredentials, activeConnectionId }) {
   const isConnected = !!(justConnected || savedConnection && savedConnection.id === activeConnectionId);
   const isExpired2 = !isConnected && !!savedConnection?.isExpired;
@@ -33990,6 +34240,21 @@ function TradeDrawer({ onClose, savedConnections = [], onBrokerConnected, onDisc
         );
       }) }) })
     ] }),
+    connectingBroker === "topstep" && (() => {
+      const topstepSaved = newCredsBroker !== "topstep" ? savedConnections.find((c) => c.broker === "topstep") : void 0;
+      return /* @__PURE__ */ jsx(
+        TopStepConnectDrawer,
+        {
+          onClose: () => {
+            setConnectingBroker(null);
+            setNewCredsBroker(null);
+          },
+          onConnected: (connId) => markConnected("topstep", connId),
+          ...getAuthToken ? { getAuthToken } : {},
+          ...topstepSaved ? { savedConnection: topstepSaved } : {}
+        }
+      );
+    })(),
     connectingBroker === "rithmic" && (() => {
       const rithmicSaved = newCredsBroker !== "rithmic" ? savedConnections.find((c) => c.broker === "rithmic") : void 0;
       return /* @__PURE__ */ jsx(