@orbs-network/spot-react 0.0.3

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './spot-react/src/index'
+export {}

package/dist/spot-react/src/components/SpotEventList.d.ts

@@ -0,0 +1,7 @@
+interface SpotEventListProps {
+    maxEvents?: number;
+    className?: string;
+}
+export declare function SpotEventList({ maxEvents, className }: SpotEventListProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SpotEventList.d.ts.map

package/dist/spot-react/src/components/SpotEventList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpotEventList.d.ts","sourceRoot":"","sources":["../../../../src/components/SpotEventList.tsx"],"names":[],"mappings":"AAGA,OAAO,qBAAqB,CAAA;AAE5B,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,aAAa,CAAC,EAAE,SAAc,EAAE,SAAc,EAAE,EAAE,kBAAkB,2CAwCnF"}

package/dist/spot-react/src/components/SpotTracker.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+interface SpotTrackerProps {
+    eventType?: string;
+    children: ReactNode;
+    className?: string;
+}
+export declare function SpotTracker({ eventType, children, className, }: SpotTrackerProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=SpotTracker.d.ts.map

package/dist/spot-react/src/components/SpotTracker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpotTracker.d.ts","sourceRoot":"","sources":["../../../../src/components/SpotTracker.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAEhD,OAAO,mBAAmB,CAAA;AAE1B,UAAU,gBAAgB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,SAAS,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,WAAW,CAAC,EAC1B,SAAmB,EACnB,QAAQ,EACR,SAAc,GACf,EAAE,gBAAgB,2CAkBlB"}

package/dist/spot-react/src/context/SpotContext.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { Spot, SpotConfig, SpotEvent } from '../../../spot-sdk/src/index.ts';
+interface SpotContextValue {
+    spot: Spot;
+    track: (type: string, payload?: Record<string, unknown>) => SpotEvent;
+    getEvents: () => SpotEvent[];
+    clearEvents: () => void;
+}
+interface SpotProviderProps {
+    config?: SpotConfig;
+    children: ReactNode;
+}
+export declare function SpotProvider({ config, children }: SpotProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useSpot(): SpotContextValue;
+export {};
+//# sourceMappingURL=SpotContext.d.ts.map

package/dist/spot-react/src/context/SpotContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpotContext.d.ts","sourceRoot":"","sources":["../../../../src/context/SpotContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAC1E,OAAO,EAAE,IAAI,EAAc,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAE1F,UAAU,gBAAgB;IACxB,IAAI,EAAE,IAAI,CAAA;IACV,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,SAAS,CAAA;IACrE,SAAS,EAAE,MAAM,SAAS,EAAE,CAAA;IAC5B,WAAW,EAAE,MAAM,IAAI,CAAA;CACxB;AAID,UAAU,iBAAiB;IACzB,MAAM,CAAC,EAAE,UAAU,CAAA;IACnB,QAAQ,EAAE,SAAS,CAAA;CACpB;AAED,wBAAgB,YAAY,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,iBAAiB,2CAanE;AAED,wBAAgB,OAAO,IAAI,gBAAgB,CAM1C"}

package/dist/spot-react/src/index.d.ts

@@ -0,0 +1,5 @@
+export { SpotProvider, useSpot } from './context/SpotContext';
+export { SpotTracker } from './components/SpotTracker';
+export { SpotEventList } from './components/SpotEventList';
+export type { SpotConfig, SpotEvent } from '../../spot-sdk/src/index.ts';
+//# sourceMappingURL=index.d.ts.map

package/dist/spot-react/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAG1D,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA"}

package/dist/spot-react.css

@@ -0,0 +1 @@
+.spot-tracker{cursor:pointer;transition:transform .15s ease-out}.spot-tracker--tracked{transform:scale(.98)}.spot-event-list{font-family:system-ui,-apple-system,sans-serif;border:1px solid #e0e0e0;border-radius:8px;padding:16px;background:#fafafa}.spot-event-list__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.spot-event-list__header h3{margin:0;font-size:14px;font-weight:600;color:#333}.spot-event-list__clear{padding:4px 12px;font-size:12px;border:1px solid #ddd;border-radius:4px;background:#fff;cursor:pointer;transition:background .15s}.spot-event-list__clear:hover{background:#f0f0f0}.spot-event-list__empty{color:#888;font-size:13px;text-align:center;padding:20px;margin:0}.spot-event-list__items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.spot-event-list__item{background:#fff;border:1px solid #eee;border-radius:6px;padding:10px}.spot-event-list__type{font-weight:600;color:#2563eb;font-size:13px}.spot-event-list__time{font-size:11px;color:#888;margin-left:8px}.spot-event-list__payload{margin:6px 0 0;font-size:11px;background:#f5f5f5;padding:6px;border-radius:4px;overflow-x:auto;color:#555}

package/dist/spot-react.js

@@ -0,0 +1,66 @@
+import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import { createContext as d, useMemo as h, useContext as _, useState as p, useEffect as k } from "react";
+import { createSpot as f } from "@orbs-network/spot-sdk";
+const m = d(null);
+function y({ config: t, children: a }) {
+  const r = h(() => {
+    const s = f(t);
+    return {
+      spot: s,
+      track: (o, c) => s.track(o, c),
+      getEvents: () => s.getEvents(),
+      clearEvents: () => s.clearEvents()
+    };
+  }, [t]);
+  return /* @__PURE__ */ e(m.Provider, { value: r, children: a });
+}
+function u() {
+  const t = _(m);
+  if (!t)
+    throw new Error("useSpot must be used within a SpotProvider");
+  return t;
+}
+function C({
+  eventType: t = "click",
+  children: a,
+  className: r = ""
+}) {
+  const { track: s } = u(), [o, c] = p(!1), l = () => {
+    s(t, { component: "SpotTracker" }), c(!0), setTimeout(() => c(!1), 300);
+  };
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: `spot-tracker ${o ? "spot-tracker--tracked" : ""} ${r}`,
+      onClick: l,
+      children: a
+    }
+  );
+}
+function x({ maxEvents: t = 10, className: a = "" }) {
+  const { getEvents: r, clearEvents: s } = u(), [o, c] = p([]);
+  k(() => {
+    const n = setInterval(() => {
+      c(r().slice(-t));
+    }, 100);
+    return () => clearInterval(n);
+  }, [r, t]);
+  const l = (n) => new Date(n).toLocaleTimeString();
+  return /* @__PURE__ */ i("div", { className: `spot-event-list ${a}`, children: [
+    /* @__PURE__ */ i("div", { className: "spot-event-list__header", children: [
+      /* @__PURE__ */ e("h3", { children: "Spot Events" }),
+      /* @__PURE__ */ e("button", { onClick: s, className: "spot-event-list__clear", children: "Clear" })
+    ] }),
+    o.length === 0 ? /* @__PURE__ */ e("p", { className: "spot-event-list__empty", children: "No events tracked yet" }) : /* @__PURE__ */ e("ul", { className: "spot-event-list__items", children: o.map((n, v) => /* @__PURE__ */ i("li", { className: "spot-event-list__item", children: [
+      /* @__PURE__ */ e("span", { className: "spot-event-list__type", children: n.type }),
+      /* @__PURE__ */ e("span", { className: "spot-event-list__time", children: l(n.timestamp) }),
+      /* @__PURE__ */ e("pre", { className: "spot-event-list__payload", children: JSON.stringify(n.payload, null, 2) })
+    ] }, `${n.timestamp}-${v}`)) })
+  ] });
+}
+export {
+  x as SpotEventList,
+  y as SpotProvider,
+  C as SpotTracker,
+  u as useSpot
+};

package/dist/spot-react.umd.cjs

@@ -0,0 +1 @@
+(function(t,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("react/jsx-runtime"),require("react"),require("@orbs-network/spot-sdk")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@orbs-network/spot-sdk"],e):(t=typeof globalThis<"u"?globalThis:t||self,e(t.SpotReact={},t.jsxRuntime,t.React,t.SpotSDK))})(this,(function(t,e,o,v){"use strict";const u=o.createContext(null);function S({config:s,children:l}){const c=o.useMemo(()=>{const n=v.createSpot(s);return{spot:n,track:(a,i)=>n.track(a,i),getEvents:()=>n.getEvents(),clearEvents:()=>n.clearEvents()}},[s]);return e.jsx(u.Provider,{value:c,children:l})}function p(){const s=o.useContext(u);if(!s)throw new Error("useSpot must be used within a SpotProvider");return s}function f({eventType:s="click",children:l,className:c=""}){const{track:n}=p(),[a,i]=o.useState(!1),d=()=>{n(s,{component:"SpotTracker"}),i(!0),setTimeout(()=>i(!1),300)};return e.jsx("div",{className:`spot-tracker ${a?"spot-tracker--tracked":""} ${c}`,onClick:d,children:l})}function k({maxEvents:s=10,className:l=""}){const{getEvents:c,clearEvents:n}=p(),[a,i]=o.useState([]);o.useEffect(()=>{const r=setInterval(()=>{i(c().slice(-s))},100);return()=>clearInterval(r)},[c,s]);const d=r=>new Date(r).toLocaleTimeString();return e.jsxs("div",{className:`spot-event-list ${l}`,children:[e.jsxs("div",{className:"spot-event-list__header",children:[e.jsx("h3",{children:"Spot Events"}),e.jsx("button",{onClick:n,className:"spot-event-list__clear",children:"Clear"})]}),a.length===0?e.jsx("p",{className:"spot-event-list__empty",children:"No events tracked yet"}):e.jsx("ul",{className:"spot-event-list__items",children:a.map((r,m)=>e.jsxs("li",{className:"spot-event-list__item",children:[e.jsx("span",{className:"spot-event-list__type",children:r.type}),e.jsx("span",{className:"spot-event-list__time",children:d(r.timestamp)}),e.jsx("pre",{className:"spot-event-list__payload",children:JSON.stringify(r.payload,null,2)})]},`${r.timestamp}-${m}`))})]})}t.SpotEventList=k,t.SpotProvider=S,t.SpotTracker=f,t.useSpot=p,Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@orbs-network/spot-react",
+  "version": "0.0.3",
+  "description": "Spot React Components - React components for Spot SDK",
+  "type": "module",
+  "main": "./dist/spot-react.umd.cjs",
+  "module": "./dist/spot-react.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/spot-react.js",
+      "require": "./dist/spot-react.umd.cjs"
+    },
+    "./styles.css": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "keywords": [
+    "spot",
+    "ui",
+    "react",
+    "components"
+  ],
+  "license": "MIT",
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "dependencies": {
+    "@orbs-network/spot-sdk": "0.0.3"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.2",
+    "@types/react-dom": "^19.0.2",
+    "@vitejs/plugin-react": "^4.3.4",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "typescript": "^5.7.2",
+    "vite": "^6.0.5",
+    "vite-plugin-dts": "^4.4.0"
+  },
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "tsc && vite build"
+  }
+}