@opp-oss/react 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 OpenPerps
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,53 @@
+# @opp-oss/react
+
+[![npm](https://img.shields.io/npm/v/@opp-oss/react?logo=npm&label=npm)](https://www.npmjs.com/package/@opp-oss/react)
+[![license](https://img.shields.io/npm/l/@opp-oss/react)](./LICENSE)
+
+Drop-in React components and hooks for embedding OpenPerps trading, charts, and
+positions. Built on [`@opp-oss/sdk`](../sdk) and the Solana wallet adapter.
+
+The SDK is the primary integration surface; these components are the fast path
+for teams that want ready-made UI. `react`, `@solana/web3.js`, and
+`@solana/wallet-adapter-react` are peer dependencies, so the components use your
+app's existing wallet and connection providers.
+
+## Components
+
+```tsx
+import {
+  OpenPerpsTrade,
+  OpenPerpsPosition,
+  OpenPerpsChart,
+  OpenPerpsMarketLauncher,
+} from "@opp-oss/react";
+
+<OpenPerpsTrade market={market} counterparty={house} executionPrice={mark} />
+<OpenPerpsPosition market={market} owner={wallet.publicKey} />
+<OpenPerpsChart market={market} candles={candles} />
+<OpenPerpsMarketLauncher intent={creationIntent} onLaunch={createMarket} />
+```
+
+The host app provides the market config, the resolved House/LP counterparty, the
+execution price (from the keeper/on-chain mark, never a client chart price), and
+chart candles. The components ship no CSS; style them through `className` or the
+default `openperps-*` class names.
+
+## Headless
+
+Skip the UI and drive a trade with the hook:
+
+```tsx
+import { useOpenPerpsTrade } from "@opp-oss/react";
+
+const { placeTrade, pending, error } = useOpenPerpsTrade({ market, counterparty });
+
+await placeTrade({ side: "long", size: "1000000", executionPrice: mark });
+```
+
+`placeTrade` resolves the intent (counterparty, limit, slippage, reduce-only
+guards), builds the `PlaceOrder` transaction, signs it with the connected
+wallet, and confirms it.
+
+## License
+
+MIT.

package/dist/OpenPerpsChart.d.ts

@@ -0,0 +1,19 @@
+import { type ReactElement } from "react";
+import type { OpenPerpsMarketConfig } from "@opp-oss/sdk";
+export type Candle = {
+    time: number;
+    open: number;
+    high: number;
+    low: number;
+    close: number;
+    volume?: number;
+};
+export type OpenPerpsChartProps = {
+    market: OpenPerpsMarketConfig;
+    candles: Candle[];
+    width?: number;
+    height?: number;
+    className?: string;
+};
+export declare function OpenPerpsChart({ candles, width, height, className, }: OpenPerpsChartProps): ReactElement;
+//# sourceMappingURL=OpenPerpsChart.d.ts.map

package/dist/OpenPerpsChart.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsChart.d.ts","sourceRoot":"","sources":["../src/OpenPerpsChart.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAE1D,MAAM,MAAM,MAAM,GAAG;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,MAAM,EAAE,qBAAqB,CAAC;IAC9B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,KAAW,EACX,MAAY,EACZ,SAAS,GACV,EAAE,mBAAmB,GAAG,YAAY,CAgCpC"}

package/dist/OpenPerpsChart.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function OpenPerpsChart({ candles, width = 320, height = 120, className, }) {
+    const closes = candles.map((c) => c.close);
+    let path = "";
+    if (closes.length >= 2) {
+        const min = Math.min(...closes);
+        const max = Math.max(...closes);
+        const span = max - min || 1;
+        const stepX = width / (closes.length - 1);
+        path = closes
+            .map((v, i) => {
+            const x = i * stepX;
+            const y = height - ((v - min) / span) * height;
+            return `${i === 0 ? "M" : "L"}${x.toFixed(2)},${y.toFixed(2)}`;
+        })
+            .join(" ");
+    }
+    return (_jsx("svg", { className: className ?? "openperps-chart", width: width, height: height, viewBox: `0 0 ${width} ${height}`, role: "img", "aria-label": "price chart", children: path ? (_jsx("path", { d: path, fill: "none", stroke: "currentColor", strokeWidth: 2 })) : null }));
+}
+//# sourceMappingURL=OpenPerpsChart.js.map

package/dist/OpenPerpsChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsChart.js","sourceRoot":"","sources":["../src/OpenPerpsChart.tsx"],"names":[],"mappings":";AAyBA,MAAM,UAAU,cAAc,CAAC,EAC7B,OAAO,EACP,KAAK,GAAG,GAAG,EACX,MAAM,GAAG,GAAG,EACZ,SAAS,GACW;IACpB,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;IAE3C,IAAI,IAAI,GAAG,EAAE,CAAC;IACd,IAAI,MAAM,CAAC,MAAM,IAAI,CAAC,EAAE,CAAC;QACvB,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,CAAC;QAChC,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC,CAAC;QAChC,MAAM,IAAI,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC,CAAC;QAC5B,MAAM,KAAK,GAAG,KAAK,GAAG,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC1C,IAAI,GAAG,MAAM;aACV,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACZ,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;YACpB,MAAM,CAAC,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG,MAAM,CAAC;YAC/C,OAAO,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC;QACjE,CAAC,CAAC;aACD,IAAI,CAAC,GAAG,CAAC,CAAC;IACf,CAAC;IAED,OAAO,CACL,cACE,SAAS,EAAE,SAAS,IAAI,iBAAiB,EACzC,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,KAAK,IAAI,MAAM,EAAE,EACjC,IAAI,EAAC,KAAK,gBACC,aAAa,YAEvB,IAAI,CAAC,CAAC,CAAC,CACN,eAAM,CAAC,EAAE,IAAI,EAAE,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,WAAW,EAAE,CAAC,GAAI,CACpE,CAAC,CAAC,CAAC,IAAI,GACJ,CACP,CAAC;AACJ,CAAC"}

package/dist/OpenPerpsMarketLauncher.d.ts

@@ -0,0 +1,10 @@
+import { type ReactElement } from "react";
+import { type OpenPerpsMarketCreationIntent } from "@opp-oss/sdk";
+export type OpenPerpsMarketLauncherProps = {
+    intent: OpenPerpsMarketCreationIntent;
+    includeMockPool?: boolean;
+    onLaunch?: (intent: OpenPerpsMarketCreationIntent) => void;
+    className?: string;
+};
+export declare function OpenPerpsMarketLauncher({ intent, includeMockPool, onLaunch, className, }: OpenPerpsMarketLauncherProps): ReactElement;
+//# sourceMappingURL=OpenPerpsMarketLauncher.d.ts.map

package/dist/OpenPerpsMarketLauncher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsMarketLauncher.d.ts","sourceRoot":"","sources":["../src/OpenPerpsMarketLauncher.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAEL,KAAK,6BAA6B,EACnC,MAAM,cAAc,CAAC;AAEtB,MAAM,MAAM,4BAA4B,GAAG;IACzC,MAAM,EAAE,6BAA6B,CAAC;IACtC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,6BAA6B,KAAK,IAAI,CAAC;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,uBAAuB,CAAC,EACtC,MAAM,EACN,eAAe,EACf,QAAQ,EACR,SAAS,GACV,EAAE,4BAA4B,GAAG,YAAY,CAqB7C"}

package/dist/OpenPerpsMarketLauncher.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { planMarketCreation, } from "@opp-oss/sdk";
+export function OpenPerpsMarketLauncher({ intent, includeMockPool, onLaunch, className, }) {
+    const plan = planMarketCreation(intent, {
+        includeMockPool: includeMockPool ?? false,
+    });
+    return (_jsxs("div", { className: className ?? "openperps-launcher", children: [_jsx("ol", { className: "openperps-launcher-steps", children: plan.steps.map((step, i) => (_jsx("li", { children: step.kind }, `${step.kind}-${i}`))) }), _jsxs("button", { className: "openperps-launcher-create", type: "button", onClick: () => onLaunch?.(intent), children: ["Create ", intent.symbol] })] }));
+}
+//# sourceMappingURL=OpenPerpsMarketLauncher.js.map

package/dist/OpenPerpsMarketLauncher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsMarketLauncher.js","sourceRoot":"","sources":["../src/OpenPerpsMarketLauncher.tsx"],"names":[],"mappings":";AAKA,OAAO,EACL,kBAAkB,GAEnB,MAAM,cAAc,CAAC;AAStB,MAAM,UAAU,uBAAuB,CAAC,EACtC,MAAM,EACN,eAAe,EACf,QAAQ,EACR,SAAS,GACoB;IAC7B,MAAM,IAAI,GAAG,kBAAkB,CAAC,MAAM,EAAE;QACtC,eAAe,EAAE,eAAe,IAAI,KAAK;KAC1C,CAAC,CAAC;IAEH,OAAO,CACL,eAAK,SAAS,EAAE,SAAS,IAAI,oBAAoB,aAC/C,aAAI,SAAS,EAAC,0BAA0B,YACrC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CAC3B,uBAA+B,IAAI,CAAC,IAAI,IAA/B,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,EAAE,CAAkB,CAC/C,CAAC,GACC,EACL,kBACE,SAAS,EAAC,2BAA2B,EACrC,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,MAAM,CAAC,wBAEzB,MAAM,CAAC,MAAM,IACd,IACL,CACP,CAAC;AACJ,CAAC"}

package/dist/OpenPerpsPosition.d.ts

@@ -0,0 +1,12 @@
+import { type ReactElement } from "react";
+import { PublicKey } from "@solana/web3.js";
+import { type OpenPerpsMarketConfig } from "@opp-oss/sdk";
+export type OpenPerpsPositionProps = {
+    market: OpenPerpsMarketConfig;
+    owner: PublicKey;
+    pollMs?: number;
+    formatAmount?: (atoms: bigint) => string;
+    className?: string;
+};
+export declare function OpenPerpsPosition({ market, owner, pollMs, formatAmount, className, }: OpenPerpsPositionProps): ReactElement;
+//# sourceMappingURL=OpenPerpsPosition.d.ts.map

package/dist/OpenPerpsPosition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsPosition.d.ts","sourceRoot":"","sources":["../src/OpenPerpsPosition.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAuB,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,OAAO,EAIL,KAAK,qBAAqB,EAC3B,MAAM,cAAc,CAAC;AAEtB,MAAM,MAAM,sBAAsB,GAAG;IACnC,MAAM,EAAE,qBAAqB,CAAC;IAC9B,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,KAAK,EACL,MAAM,EACN,YAAY,EACZ,SAAS,GACV,EAAE,sBAAsB,GAAG,YAAY,CAoDvC"}

package/dist/OpenPerpsPosition.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/// Show a wallet's position summary in a market: capital, realized pnl, and open
+/// position count, decoded from the portfolio account. Polls on its own.
+import { useEffect, useState } from "react";
+import { PublicKey } from "@solana/web3.js";
+import { useConnection } from "@solana/wallet-adapter-react";
+import { decodePortfolioSummary, portfolioPda, } from "@opp-oss/sdk";
+export function OpenPerpsPosition({ market, owner, pollMs, formatAmount, className, }) {
+    const { connection } = useConnection();
+    const [summary, setSummary] = useState(null);
+    useEffect(() => {
+        let active = true;
+        const programId = new PublicKey(market.programId);
+        const marketAccount = new PublicKey(market.market);
+        const [portfolio] = portfolioPda(programId, owner, marketAccount);
+        const tick = () => {
+            connection
+                .getAccountInfo(portfolio)
+                .then((info) => {
+                if (!active)
+                    return;
+                if (!info) {
+                    setSummary(null);
+                    return;
+                }
+                const u = new Uint8Array(info.data.buffer, info.data.byteOffset, info.data.byteLength);
+                setSummary(decodePortfolioSummary(u));
+            })
+                .catch(() => {
+                /* transient RPC error; keep the last good summary */
+            });
+        };
+        tick();
+        const id = setInterval(tick, pollMs ?? 5000);
+        return () => {
+            active = false;
+            clearInterval(id);
+        };
+    }, [connection, market.programId, market.market, owner, pollMs]);
+    const fmt = formatAmount ?? ((a) => a.toString());
+    return (_jsx("div", { className: className ?? "openperps-position", children: summary ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "openperps-position-capital", children: fmt(summary.capital) }), _jsx("span", { className: "openperps-position-pnl", children: fmt(summary.pnl) }), _jsx("span", { className: "openperps-position-count", children: summary.positions.length })] })) : (_jsx("span", { className: "openperps-position-empty", children: "no position" })) }));
+}
+//# sourceMappingURL=OpenPerpsPosition.js.map

package/dist/OpenPerpsPosition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsPosition.js","sourceRoot":"","sources":["../src/OpenPerpsPosition.tsx"],"names":[],"mappings":";AAAA,iFAAiF;AACjF,yEAAyE;AAEzE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAqB,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EACL,sBAAsB,EACtB,YAAY,GAGb,MAAM,cAAc,CAAC;AAWtB,MAAM,UAAU,iBAAiB,CAAC,EAChC,MAAM,EACN,KAAK,EACL,MAAM,EACN,YAAY,EACZ,SAAS,GACc;IACvB,MAAM,EAAE,UAAU,EAAE,GAAG,aAAa,EAAE,CAAC;IACvC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAiC,IAAI,CAAC,CAAC;IAE7E,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,GAAG,IAAI,CAAC;QAClB,MAAM,SAAS,GAAG,IAAI,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;QAClD,MAAM,aAAa,GAAG,IAAI,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QACnD,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,CAAC,SAAS,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC;QAClE,MAAM,IAAI,GAAG,GAAS,EAAE;YACtB,UAAU;iBACP,cAAc,CAAC,SAAS,CAAC;iBACzB,IAAI,CAAC,CAAC,IAAI,EAAE,EAAE;gBACb,IAAI,CAAC,MAAM;oBAAE,OAAO;gBACpB,IAAI,CAAC,IAAI,EAAE,CAAC;oBACV,UAAU,CAAC,IAAI,CAAC,CAAC;oBACjB,OAAO;gBACT,CAAC;gBACD,MAAM,CAAC,GAAG,IAAI,UAAU,CACtB,IAAI,CAAC,IAAI,CAAC,MAAM,EAChB,IAAI,CAAC,IAAI,CAAC,UAAU,EACpB,IAAI,CAAC,IAAI,CAAC,UAAU,CACrB,CAAC;gBACF,UAAU,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC;YACxC,CAAC,CAAC;iBACD,KAAK,CAAC,GAAG,EAAE;gBACV,qDAAqD;YACvD,CAAC,CAAC,CAAC;QACP,CAAC,CAAC;QACF,IAAI,EAAE,CAAC;QACP,MAAM,EAAE,GAAG,WAAW,CAAC,IAAI,EAAE,MAAM,IAAI,IAAI,CAAC,CAAC;QAC7C,OAAO,GAAG,EAAE;YACV,MAAM,GAAG,KAAK,CAAC;YACf,aAAa,CAAC,EAAE,CAAC,CAAC;QACpB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;IAEjE,MAAM,GAAG,GAAG,YAAY,IAAI,CAAC,CAAC,CAAS,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;IAE1D,OAAO,CACL,cAAK,SAAS,EAAE,SAAS,IAAI,oBAAoB,YAC9C,OAAO,CAAC,CAAC,CAAC,CACT,8BACE,eAAM,SAAS,EAAC,4BAA4B,YAAE,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,GAAQ,EAC1E,eAAM,SAAS,EAAC,wBAAwB,YAAE,GAAG,CAAC,OAAO,CAAC,GAAG,CAAC,GAAQ,EAClE,eAAM,SAAS,EAAC,0BAA0B,YAAE,OAAO,CAAC,SAAS,CAAC,MAAM,GAAQ,IAC3E,CACJ,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAC,0BAA0B,4BAAmB,CAC9D,GACG,CACP,CAAC;AACJ,CAAC"}

package/dist/OpenPerpsTrade.d.ts

@@ -0,0 +1,14 @@
+import { type ReactElement } from "react";
+import type { Commitment } from "@solana/web3.js";
+import type { OpenPerpsMarketConfig, TradeCounterparty } from "@opp-oss/sdk";
+export type OpenPerpsTradeProps = {
+    market: OpenPerpsMarketConfig;
+    counterparty: TradeCounterparty;
+    executionPrice: bigint;
+    defaultSize?: string;
+    commitment?: Commitment;
+    onFilled?: (signature: string) => void;
+    className?: string;
+};
+export declare function OpenPerpsTrade({ market, counterparty, executionPrice, defaultSize, commitment, onFilled, className, }: OpenPerpsTradeProps): ReactElement;
+//# sourceMappingURL=OpenPerpsTrade.d.ts.map

package/dist/OpenPerpsTrade.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsTrade.d.ts","sourceRoot":"","sources":["../src/OpenPerpsTrade.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAY,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,EAAE,qBAAqB,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAG7E,MAAM,MAAM,mBAAmB,GAAG;IAChC,MAAM,EAAE,qBAAqB,CAAC;IAC9B,YAAY,EAAE,iBAAiB,CAAC;IAEhC,cAAc,EAAE,MAAM,CAAC;IAEvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,YAAY,EACZ,cAAc,EACd,WAAW,EACX,UAAU,EACV,QAAQ,EACR,SAAS,GACV,EAAE,mBAAmB,GAAG,YAAY,CAkDpC"}

package/dist/OpenPerpsTrade.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/// A minimal, unstyled Long/Short widget built on `useOpenPerpsTrade`. The host
+/// app supplies the market config, the resolved counterparty, and the current
+/// execution price (from the keeper/on-chain mark). Styling is left to the host
+/// via `className`; the default class names carry no built-in CSS.
+import { useState } from "react";
+import { useOpenPerpsTrade } from "./useOpenPerpsTrade.js";
+export function OpenPerpsTrade({ market, counterparty, executionPrice, defaultSize, commitment, onFilled, className, }) {
+    const { placeTrade, pending, error } = useOpenPerpsTrade({
+        market,
+        counterparty,
+        commitment,
+    });
+    const [size, setSize] = useState(
+    // BigInt, not `10 ** n`, so a large `sizeDecimals` keeps integer precision
+    // instead of overflowing Number's 2^53 safe-integer range.
+    defaultSize ?? (10n ** BigInt(market.sizeDecimals)).toString());
+    const submit = async (side) => {
+        const signature = await placeTrade({ side, size, executionPrice });
+        onFilled?.(signature);
+    };
+    return (_jsxs("div", { className: className ?? "openperps-trade", children: [_jsx("input", { className: "openperps-trade-size", type: "text", inputMode: "numeric", value: size, disabled: pending, onChange: (e) => setSize(e.target.value.replace(/[^0-9]/g, "")) }), _jsx("button", { className: "openperps-trade-long", type: "button", disabled: pending || size.length === 0, onClick: () => void submit("long"), children: "Long" }), _jsx("button", { className: "openperps-trade-short", type: "button", disabled: pending || size.length === 0, onClick: () => void submit("short"), children: "Short" }), error ? (_jsx("p", { className: "openperps-trade-error", role: "alert", children: error })) : null] }));
+}
+//# sourceMappingURL=OpenPerpsTrade.js.map

package/dist/OpenPerpsTrade.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OpenPerpsTrade.js","sourceRoot":"","sources":["../src/OpenPerpsTrade.tsx"],"names":[],"mappings":";AAAA,gFAAgF;AAChF,8EAA8E;AAC9E,gFAAgF;AAChF,mEAAmE;AAEnE,OAAO,EAAE,QAAQ,EAAqB,MAAM,OAAO,CAAC;AAGpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAc3D,MAAM,UAAU,cAAc,CAAC,EAC7B,MAAM,EACN,YAAY,EACZ,cAAc,EACd,WAAW,EACX,UAAU,EACV,QAAQ,EACR,SAAS,GACW;IACpB,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,iBAAiB,CAAC;QACvD,MAAM;QACN,YAAY;QACZ,UAAU;KACX,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ;IAC9B,2EAA2E;IAC3E,2DAA2D;IAC3D,WAAW,IAAI,CAAC,GAAG,IAAI,MAAM,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ,EAAE,CAC/D,CAAC;IAEF,MAAM,MAAM,GAAG,KAAK,EAAE,IAAsB,EAAiB,EAAE;QAC7D,MAAM,SAAS,GAAG,MAAM,UAAU,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAC;QACnE,QAAQ,EAAE,CAAC,SAAS,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAE,SAAS,IAAI,iBAAiB,aAC5C,gBACE,SAAS,EAAC,sBAAsB,EAChC,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,SAAS,EACnB,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,OAAO,EACjB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,GAC/D,EACF,iBACE,SAAS,EAAC,sBAAsB,EAChC,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,OAAO,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,EACtC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,MAAM,CAAC,MAAM,CAAC,qBAG3B,EACT,iBACE,SAAS,EAAC,uBAAuB,EACjC,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,OAAO,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,EACtC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,MAAM,CAAC,OAAO,CAAC,sBAG5B,EACR,KAAK,CAAC,CAAC,CAAC,CACP,YAAG,SAAS,EAAC,uBAAuB,EAAC,IAAI,EAAC,OAAO,YAC9C,KAAK,GACJ,CACL,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;AACJ,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,12 @@
+export { useOpenPerpsTrade } from "./useOpenPerpsTrade.js";
+export type { PlaceTradeInput, UseOpenPerpsTradeResult, } from "./useOpenPerpsTrade.js";
+export { OpenPerpsTrade } from "./OpenPerpsTrade.js";
+export type { OpenPerpsTradeProps } from "./OpenPerpsTrade.js";
+export { OpenPerpsPosition } from "./OpenPerpsPosition.js";
+export type { OpenPerpsPositionProps } from "./OpenPerpsPosition.js";
+export { OpenPerpsChart } from "./OpenPerpsChart.js";
+export type { Candle, OpenPerpsChartProps } from "./OpenPerpsChart.js";
+export { OpenPerpsMarketLauncher } from "./OpenPerpsMarketLauncher.js";
+export type { OpenPerpsMarketLauncherProps } from "./OpenPerpsMarketLauncher.js";
+export { buildTradeFromIntent, planMarketCreation, resolveTradeIntent, portfolioPda, type OpenPerpsMarketConfig, type OpenPerpsTradeIntent, type OpenPerpsTradeSide, type OpenPerpsMarketCreationIntent, type TradeCounterparty, } from "@opp-oss/sdk";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EACV,eAAe,EACf,uBAAuB,GACxB,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,YAAY,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAEhE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,YAAY,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAEtE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,YAAY,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAExE,OAAO,EAAE,uBAAuB,EAAE,MAAM,+BAA+B,CAAC;AACxE,YAAY,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAC;AAGlF,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,YAAY,EACZ,KAAK,qBAAqB,EAC1B,KAAK,oBAAoB,EACzB,KAAK,kBAAkB,EACvB,KAAK,6BAA6B,EAClC,KAAK,iBAAiB,GACvB,MAAM,cAAc,CAAC"}

package/dist/index.js

@@ -0,0 +1,8 @@
+export { useOpenPerpsTrade } from "./useOpenPerpsTrade.js";
+export { OpenPerpsTrade } from "./OpenPerpsTrade.js";
+export { OpenPerpsPosition } from "./OpenPerpsPosition.js";
+export { OpenPerpsChart } from "./OpenPerpsChart.js";
+export { OpenPerpsMarketLauncher } from "./OpenPerpsMarketLauncher.js";
+// Re-export the SDK pieces an embedder needs alongside the components.
+export { buildTradeFromIntent, planMarketCreation, resolveTradeIntent, portfolioPda, } from "@opp-oss/sdk";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAM3D,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAsB,CAAC;AAGtD,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAyB,CAAC;AAG5D,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAsB,CAAC;AAGtD,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA+B,CAAC;AAGxE,uEAAuE;AACvE,OAAO,EACL,oBAAoB,EACpB,kBAAkB,EAClB,kBAAkB,EAClB,YAAY,GAMb,MAAM,cAAc,CAAC"}

package/dist/useOpenPerpsTrade.d.ts

@@ -0,0 +1,19 @@
+import { type Commitment } from "@solana/web3.js";
+import { type OpenPerpsMarketConfig, type OpenPerpsTradeSide, type TradeCounterparty } from "@opp-oss/sdk";
+export type PlaceTradeInput = {
+    side: OpenPerpsTradeSide;
+    size: string;
+    executionPrice: bigint;
+    feeBps?: bigint;
+};
+export type UseOpenPerpsTradeResult = {
+    placeTrade: (input: PlaceTradeInput) => Promise<string>;
+    pending: boolean;
+    error: string | null;
+};
+export declare function useOpenPerpsTrade(args: {
+    market: OpenPerpsMarketConfig;
+    counterparty: TradeCounterparty;
+    commitment?: Commitment;
+}): UseOpenPerpsTradeResult;
+//# sourceMappingURL=useOpenPerpsTrade.d.ts.map

package/dist/useOpenPerpsTrade.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOpenPerpsTrade.d.ts","sourceRoot":"","sources":["../src/useOpenPerpsTrade.ts"],"names":[],"mappings":"AAMA,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE/D,OAAO,EAEL,KAAK,qBAAqB,EAC1B,KAAK,kBAAkB,EACvB,KAAK,iBAAiB,EACvB,MAAM,cAAc,CAAC;AAEtB,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,kBAAkB,CAAC;IAEzB,IAAI,EAAE,MAAM,CAAC;IAEb,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,UAAU,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;IACxD,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,IAAI,EAAE;IACtC,MAAM,EAAE,qBAAqB,CAAC;IAC9B,YAAY,EAAE,iBAAiB,CAAC;IAChC,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,GAAG,uBAAuB,CAsD1B"}

package/dist/useOpenPerpsTrade.js

@@ -0,0 +1,57 @@
+/// Headless trade hook. Wraps the SDK's `buildTradeFromIntent` with the app's
+/// wallet adapter: build, sign, confirm. Returns `placeTrade` plus pending and
+/// error state. The host app supplies the resolved counterparty and the
+/// execution price (from the keeper/on-chain mark, never a client chart price).
+import { useCallback, useState } from "react";
+import { Transaction } from "@solana/web3.js";
+import { useConnection, useWallet } from "@solana/wallet-adapter-react";
+import { buildTradeFromIntent, } from "@opp-oss/sdk";
+export function useOpenPerpsTrade(args) {
+    const { market, counterparty } = args;
+    const commitment = args.commitment ?? "confirmed";
+    const { connection } = useConnection();
+    const wallet = useWallet();
+    const [pending, setPending] = useState(false);
+    const [error, setError] = useState(null);
+    const placeTrade = useCallback(async (input) => {
+        setPending(true);
+        setError(null);
+        try {
+            // Inside the try so a disconnected wallet sets `error` (and clears
+            // `pending` via finally) instead of throwing past the error state.
+            if (!wallet.publicKey || !wallet.sendTransaction) {
+                throw new Error("Wallet is not connected.");
+            }
+            const built = buildTradeFromIntent({
+                intent: {
+                    schemaVersion: 1,
+                    marketId: market.id,
+                    side: input.side,
+                    size: input.size,
+                },
+                market,
+                counterparty,
+                executionPrice: input.executionPrice,
+                owner: wallet.publicKey,
+                feeBps: input.feeBps,
+            });
+            const tx = new Transaction().add(...built.instructions);
+            const { blockhash, lastValidBlockHeight } = await connection.getLatestBlockhash(commitment);
+            tx.recentBlockhash = blockhash;
+            tx.feePayer = wallet.publicKey;
+            const signature = await wallet.sendTransaction(tx, connection);
+            await connection.confirmTransaction({ signature, blockhash, lastValidBlockHeight }, commitment);
+            return signature;
+        }
+        catch (e) {
+            const message = e instanceof Error ? e.message : String(e);
+            setError(message);
+            throw e;
+        }
+        finally {
+            setPending(false);
+        }
+    }, [connection, wallet, market, counterparty, commitment]);
+    return { placeTrade, pending, error };
+}
+//# sourceMappingURL=useOpenPerpsTrade.js.map

package/dist/useOpenPerpsTrade.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOpenPerpsTrade.js","sourceRoot":"","sources":["../src/useOpenPerpsTrade.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "@opp-oss/react",
+  "version": "1.0.0",
+  "description": "Drop-in React components and hooks for embedding OpenPerps trading, charts, and positions.",
+  "license": "MIT",
+  "author": "itsbenjiidunn",
+  "homepage": "https://github.com/itsbenjiidunn/openperps-oss/tree/main/packages/react#readme",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/itsbenjiidunn/openperps-oss.git",
+    "directory": "packages/react"
+  },
+  "bugs": {
+    "url": "https://github.com/itsbenjiidunn/openperps-oss/issues"
+  },
+  "keywords": [
+    "solana",
+    "perpetuals",
+    "perps",
+    "defi",
+    "trading",
+    "react",
+    "components",
+    "hooks"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json && node ../../scripts/rewrite-dts-extensions.mjs dist",
+    "clean": "node -e \"require('fs').rmSync('dist',{recursive:true,force:true})\"",
+    "typecheck": "tsc --noEmit",
+    "prepublishOnly": "npm run clean && npm run build"
+  },
+  "peerDependencies": {
+    "@solana/wallet-adapter-react": "^0.15.0",
+    "@solana/web3.js": "^1.95.0",
+    "react": ">=18"
+  },
+  "dependencies": {
+    "@opp-oss/sdk": "^1.0.0"
+  },
+  "devDependencies": {
+    "@solana/wallet-adapter-base": "^0.9.23",
+    "@solana/wallet-adapter-react": "^0.15.35",
+    "@solana/web3.js": "^1.95.0",
+    "@types/react": "^18.3.0",
+    "react": "^18.3.1",
+    "typescript": "^5.6.0"
+  }
+}