@vibevibes/sdk 0.1.0

package/dist/index.js

@@ -0,0 +1,720 @@
+// src/define.ts
+function defineTool(config) {
+  return {
+    name: config.name,
+    description: config.description,
+    input_schema: config.input_schema,
+    risk: config.risk ?? "low",
+    capabilities_required: config.capabilities_required ?? [],
+    handler: config.handler
+  };
+}
+function defineTest(config) {
+  return { name: config.name, run: config.run };
+}
+function defineEphemeralAction(config) {
+  return {
+    name: config.name,
+    description: config.description,
+    input_schema: config.input_schema
+  };
+}
+function quickTool(name, description, input_schema, handler) {
+  return {
+    name,
+    description,
+    input_schema,
+    risk: "low",
+    capabilities_required: ["state.write"],
+    handler
+  };
+}
+function defineExperience(module) {
+  const m = module.manifest;
+  return {
+    ...module,
+    manifest: {
+      ...m,
+      version: m.version || "0.0.1",
+      requested_capabilities: m.requested_capabilities || ["state.write"]
+    }
+  };
+}
+function validateExperience(module) {
+  const errors = [];
+  if (!module.manifest?.id) {
+    errors.push("manifest.id is required");
+  }
+  if (!module.manifest?.version) {
+    errors.push("manifest.version is required");
+  }
+  if (!module.manifest?.title) {
+    errors.push("manifest.title is required");
+  }
+  if (!module.Canvas) {
+    errors.push("Canvas component is required");
+  }
+  if (!Array.isArray(module.tools)) {
+    errors.push("tools must be an array");
+  } else {
+    module.tools.forEach((tool, idx) => {
+      if (!tool.name) {
+        errors.push(`tools[${idx}].name is required`);
+      }
+      if (!tool.input_schema) {
+        errors.push(`tools[${idx}].input_schema is required`);
+      }
+      if (typeof tool.handler !== "function") {
+        errors.push(`tools[${idx}].handler must be a function`);
+      }
+    });
+  }
+  return {
+    valid: errors.length === 0,
+    errors
+  };
+}
+
+// src/hooks.ts
+function getReact() {
+  const R = globalThis.React;
+  if (!R) throw new Error("React is not available. Hooks must be used inside a Canvas component.");
+  return R;
+}
+var React = new Proxy({}, {
+  get(_target, prop) {
+    return getReact()[prop];
+  }
+});
+function useToolCall(callTool) {
+  const [loading, setLoading] = React.useState(false);
+  const [error, setError] = React.useState(null);
+  const call = React.useCallback(
+    async (name, input) => {
+      setLoading(true);
+      setError(null);
+      try {
+        const result = await callTool(name, input);
+        return result;
+      } catch (err) {
+        const msg = err instanceof Error ? err.message : String(err);
+        setError(msg);
+        throw err;
+      } finally {
+        setLoading(false);
+      }
+    },
+    [callTool]
+  );
+  return { call, loading, error };
+}
+function useSharedState(sharedState, key, defaultValue) {
+  const value = sharedState[key];
+  if (value === void 0) return defaultValue;
+  return value;
+}
+function useOptimisticTool(callTool, sharedState) {
+  const [optimistic, setOptimistic] = React.useState(null);
+  const [pending, setPending] = React.useState(false);
+  const call = React.useCallback(
+    async (name, input, optimisticState) => {
+      setOptimistic(optimisticState);
+      setPending(true);
+      try {
+        const result = await callTool(name, input);
+        setOptimistic(null);
+        return result;
+      } catch (err) {
+        setOptimistic(null);
+        throw err;
+      } finally {
+        setPending(false);
+      }
+    },
+    [callTool]
+  );
+  const state = optimistic ? { ...sharedState, ...optimistic } : sharedState;
+  return { call, state, pending };
+}
+function useAnimationFrame(sharedState, interpolate) {
+  const prevStateRef = React.useRef(sharedState);
+  const targetStateRef = React.useRef(sharedState);
+  const displayStateRef = React.useRef(sharedState);
+  const [displayState, setDisplayState] = React.useState(sharedState);
+  const rafRef = React.useRef(null);
+  const transitionStartRef = React.useRef(0);
+  const TRANSITION_MS = 50;
+  React.useEffect(() => {
+    prevStateRef.current = displayStateRef.current;
+    targetStateRef.current = sharedState;
+    transitionStartRef.current = performance.now();
+    if (!rafRef.current) {
+      const tick = () => {
+        const now = performance.now();
+        const elapsed = now - transitionStartRef.current;
+        const t = Math.min(elapsed / TRANSITION_MS, 1);
+        let next;
+        if (interpolate && t < 1) {
+          next = interpolate(prevStateRef.current, targetStateRef.current, t);
+        } else {
+          next = targetStateRef.current;
+        }
+        displayStateRef.current = next;
+        setDisplayState(next);
+        if (t < 1 && interpolate) {
+          rafRef.current = requestAnimationFrame(tick);
+        } else {
+          rafRef.current = null;
+        }
+      };
+      rafRef.current = requestAnimationFrame(tick);
+    }
+  }, [sharedState, interpolate]);
+  React.useEffect(() => {
+    return () => {
+      if (rafRef.current) {
+        cancelAnimationFrame(rafRef.current);
+        rafRef.current = null;
+      }
+    };
+  }, []);
+  return displayState;
+}
+function useParticipants(participants) {
+  return React.useMemo(() => {
+    return participants.map((id) => {
+      const match = id.match(/^(.+)-(human|ai)-(\d+)$/);
+      if (match) {
+        return {
+          id,
+          username: match[1],
+          type: match[2],
+          index: parseInt(match[3], 10)
+        };
+      }
+      return { id, username: id, type: "unknown", index: 0 };
+    });
+  }, [participants]);
+}
+function useFollow(actorId, participants, ephemeralState, setEphemeral, _onEphemeralAction, dispatchEphemeralAction) {
+  const myEphemeral = ephemeralState[actorId];
+  const following = myEphemeral?._follow ?? null;
+  const followers = React.useMemo(() => {
+    const result = [];
+    for (const pid of participants) {
+      if (pid === actorId) continue;
+      const peerFollow = ephemeralState[pid]?._follow;
+      if (peerFollow && peerFollow.targetActorId === actorId) {
+        result.push({
+          actorId: pid,
+          mode: peerFollow.mode,
+          since: peerFollow.since
+        });
+      }
+    }
+    return result;
+  }, [participants, ephemeralState, actorId]);
+  const follow = React.useCallback(
+    (targetActorId, mode) => {
+      if (targetActorId === actorId) return;
+      const followData = {
+        targetActorId,
+        mode,
+        since: Date.now()
+      };
+      setEphemeral({ _follow: followData });
+      if (dispatchEphemeralAction) {
+        dispatchEphemeralAction("follow.started", {
+          follower: actorId,
+          target: targetActorId,
+          mode
+        });
+      }
+    },
+    [actorId, setEphemeral, dispatchEphemeralAction]
+  );
+  const unfollow = React.useCallback(() => {
+    const currentTarget = following?.targetActorId;
+    setEphemeral({ _follow: null });
+    if (dispatchEphemeralAction && currentTarget) {
+      dispatchEphemeralAction("follow.stopped", {
+        follower: actorId,
+        target: currentTarget
+      });
+    }
+  }, [actorId, following, setEphemeral, dispatchEphemeralAction]);
+  React.useEffect(() => {
+    if (!following) return;
+    if (!participants.includes(following.targetActorId)) {
+      setEphemeral({ _follow: null });
+    }
+  }, [following, participants, setEphemeral]);
+  return { follow, unfollow, following, followers };
+}
+function useTypingIndicator(actorId, ephemeralState, setEphemeral, timeoutMs = 3e3) {
+  const timerRef = React.useRef(null);
+  const setTyping = React.useCallback((isTyping) => {
+    setEphemeral({ _typing: isTyping ? Date.now() : null });
+    if (timerRef.current) clearTimeout(timerRef.current);
+    if (isTyping) {
+      timerRef.current = setTimeout(() => {
+        setEphemeral({ _typing: null });
+      }, timeoutMs);
+    }
+  }, [setEphemeral, timeoutMs]);
+  React.useEffect(() => {
+    return () => {
+      if (timerRef.current) clearTimeout(timerRef.current);
+    };
+  }, []);
+  const now = Date.now();
+  const typingUsers = Object.entries(ephemeralState).filter(([id, data]) => id !== actorId && data._typing && now - data._typing < timeoutMs + 2e3).map(([id]) => id);
+  return { setTyping, typingUsers };
+}
+
+// src/components.ts
+function getReact2() {
+  const R = globalThis.React;
+  if (!R) throw new Error("React is not available.");
+  return R;
+}
+function h(type, props, ...children) {
+  return getReact2().createElement(type, props, ...children);
+}
+var buttonColors = {
+  primary: { bg: "#6366f1", text: "#fff", hover: "#4f46e5" },
+  secondary: { bg: "#f3f4f6", text: "#374151", hover: "#e5e7eb" },
+  danger: { bg: "#ef4444", text: "#fff", hover: "#dc2626" },
+  ghost: { bg: "transparent", text: "#6b7280", hover: "#f3f4f6" }
+};
+var buttonSizes = {
+  sm: { padding: "0.375rem 0.75rem", fontSize: "0.8125rem" },
+  md: { padding: "0.5rem 1rem", fontSize: "0.875rem" },
+  lg: { padding: "0.625rem 1.25rem", fontSize: "1rem" }
+};
+function Button({ children, onClick, disabled, variant = "primary", size = "md", style }) {
+  const colors = buttonColors[variant];
+  const sizeStyles = buttonSizes[size];
+  return h("button", {
+    onClick,
+    disabled,
+    style: {
+      ...sizeStyles,
+      backgroundColor: colors.bg,
+      color: colors.text,
+      border: "none",
+      borderRadius: "0.5rem",
+      fontWeight: 500,
+      cursor: disabled ? "not-allowed" : "pointer",
+      opacity: disabled ? 0.5 : 1,
+      transition: "background-color 0.15s, opacity 0.15s",
+      fontFamily: "system-ui, -apple-system, sans-serif",
+      lineHeight: 1.5,
+      ...style
+    }
+  }, children);
+}
+function Card({ children, title, style }) {
+  return h(
+    "div",
+    {
+      style: {
+        backgroundColor: "#fff",
+        border: "1px solid #e5e7eb",
+        borderRadius: "0.75rem",
+        padding: "1.25rem",
+        boxShadow: "0 1px 3px rgba(0,0,0,0.08)",
+        ...style
+      }
+    },
+    title ? h("h3", {
+      style: { margin: "0 0 0.75rem 0", fontSize: "1rem", fontWeight: 600, color: "#111827" }
+    }, title) : null,
+    children
+  );
+}
+function Input({ value, onChange, placeholder, type = "text", disabled, style }) {
+  return h("input", {
+    type,
+    value,
+    placeholder,
+    disabled,
+    onChange: onChange ? (e) => onChange(e.target.value) : void 0,
+    style: {
+      width: "100%",
+      padding: "0.5rem 0.75rem",
+      fontSize: "0.875rem",
+      border: "1px solid #d1d5db",
+      borderRadius: "0.5rem",
+      outline: "none",
+      backgroundColor: disabled ? "#f9fafb" : "#fff",
+      color: "#111827",
+      fontFamily: "system-ui, -apple-system, sans-serif",
+      lineHeight: 1.5,
+      boxSizing: "border-box",
+      ...style
+    }
+  });
+}
+var badgeColors = {
+  gray: { bg: "#f3f4f6", text: "#374151" },
+  blue: { bg: "#dbeafe", text: "#1d4ed8" },
+  green: { bg: "#dcfce7", text: "#15803d" },
+  red: { bg: "#fee2e2", text: "#b91c1c" },
+  yellow: { bg: "#fef9c3", text: "#a16207" },
+  purple: { bg: "#f3e8ff", text: "#7e22ce" }
+};
+function Badge({ children, color = "gray", style }) {
+  const colors = badgeColors[color];
+  return h("span", {
+    style: {
+      display: "inline-flex",
+      alignItems: "center",
+      padding: "0.125rem 0.625rem",
+      fontSize: "0.75rem",
+      fontWeight: 500,
+      borderRadius: "9999px",
+      backgroundColor: colors.bg,
+      color: colors.text,
+      fontFamily: "system-ui, -apple-system, sans-serif",
+      lineHeight: 1.5,
+      ...style
+    }
+  }, children);
+}
+function Stack({ children, direction = "column", gap = "0.5rem", align, justify, style }) {
+  return h("div", {
+    style: {
+      display: "flex",
+      flexDirection: direction,
+      gap,
+      alignItems: align,
+      justifyContent: justify,
+      ...style
+    }
+  }, children);
+}
+function Grid({ children, columns = 2, gap = "0.75rem", style }) {
+  return h("div", {
+    style: {
+      display: "grid",
+      gridTemplateColumns: typeof columns === "number" ? `repeat(${columns}, 1fr)` : columns,
+      gap,
+      ...style
+    }
+  }, children);
+}
+
+// src/agent-protocol.ts
+function uid() {
+  return Math.random().toString(36).slice(2, 10) + Date.now().toString(36);
+}
+function capMessages(msgs, max = 100) {
+  return msgs.length > max ? msgs.slice(-max) : msgs;
+}
+function createAgentProtocolTools(namespace, z) {
+  return [
+    {
+      name: `${namespace}.agent.propose`,
+      description: "Propose an action for other agents to vote on",
+      input_schema: z.object({
+        proposal: z.string(),
+        data: z.any().optional(),
+        requiresVotes: z.number().optional()
+      }),
+      risk: "low",
+      capabilities_required: ["state.write"],
+      handler: async (ctx, input) => {
+        const id = uid();
+        const proposals = { ...ctx.state._agentProposals || {} };
+        proposals[id] = {
+          id,
+          from: ctx.actorId,
+          proposal: input.proposal,
+          data: input.data,
+          requiresVotes: input.requiresVotes || 1,
+          votes: [],
+          status: "pending",
+          ts: ctx.timestamp
+        };
+        const messages = capMessages([
+          ...ctx.state._agentMessages || [],
+          { id, from: ctx.actorId, to: "*", type: "proposal", content: input.proposal, data: input.data, ts: ctx.timestamp }
+        ]);
+        ctx.setState({ ...ctx.state, _agentProposals: proposals, _agentMessages: messages });
+        return { proposalId: id };
+      }
+    },
+    {
+      name: `${namespace}.agent.vote`,
+      description: "Vote on a pending proposal (approve or reject)",
+      input_schema: z.object({
+        proposalId: z.string(),
+        vote: z.enum(["approve", "reject"]),
+        reason: z.string().optional()
+      }),
+      risk: "low",
+      capabilities_required: ["state.write"],
+      handler: async (ctx, input) => {
+        const proposals = { ...ctx.state._agentProposals || {} };
+        const proposal = proposals[input.proposalId];
+        if (!proposal) throw new Error(`Proposal ${input.proposalId} not found`);
+        if (proposal.status !== "pending") throw new Error(`Proposal already ${proposal.status}`);
+        if (proposal.votes.some((v) => v.actorId === ctx.actorId)) throw new Error("Already voted");
+        const votes = [...proposal.votes, { actorId: ctx.actorId, vote: input.vote, reason: input.reason }];
+        const approves = votes.filter((v) => v.vote === "approve").length;
+        const rejects = votes.filter((v) => v.vote === "reject").length;
+        let status = "pending";
+        if (approves >= proposal.requiresVotes) status = "approved";
+        else if (rejects >= proposal.requiresVotes) status = "rejected";
+        proposals[input.proposalId] = { ...proposal, votes, status };
+        const messages = capMessages([
+          ...ctx.state._agentMessages || [],
+          { id: uid(), from: ctx.actorId, to: proposal.from, type: "vote", content: `${input.vote}: ${input.reason || ""}`, data: { proposalId: input.proposalId, vote: input.vote }, ts: ctx.timestamp }
+        ]);
+        ctx.setState({ ...ctx.state, _agentProposals: proposals, _agentMessages: messages });
+        return { status, voteCount: votes.length };
+      }
+    },
+    {
+      name: `${namespace}.agent.delegate`,
+      description: "Delegate a task to another agent",
+      input_schema: z.object({
+        targetActorId: z.string(),
+        task: z.string(),
+        data: z.any().optional()
+      }),
+      risk: "low",
+      capabilities_required: ["state.write"],
+      handler: async (ctx, input) => {
+        const id = uid();
+        const messages = capMessages([
+          ...ctx.state._agentMessages || [],
+          { id, from: ctx.actorId, to: input.targetActorId, type: "delegate", content: input.task, data: input.data, ts: ctx.timestamp }
+        ]);
+        ctx.setState({ ...ctx.state, _agentMessages: messages });
+        return { messageId: id };
+      }
+    },
+    {
+      name: `${namespace}.agent.inform`,
+      description: "Share information with other agents",
+      input_schema: z.object({
+        to: z.string(),
+        message: z.string(),
+        data: z.any().optional()
+      }),
+      risk: "low",
+      capabilities_required: ["state.write"],
+      handler: async (ctx, input) => {
+        const id = uid();
+        const messages = capMessages([
+          ...ctx.state._agentMessages || [],
+          { id, from: ctx.actorId, to: input.to, type: "inform", content: input.message, data: input.data, ts: ctx.timestamp }
+        ]);
+        ctx.setState({ ...ctx.state, _agentMessages: messages });
+        return { messageId: id };
+      }
+    },
+    {
+      name: `${namespace}.agent.request`,
+      description: "Request an action from another agent",
+      input_schema: z.object({
+        targetActorId: z.string(),
+        request: z.string(),
+        data: z.any().optional()
+      }),
+      risk: "low",
+      capabilities_required: ["state.write"],
+      handler: async (ctx, input) => {
+        const id = uid();
+        const messages = capMessages([
+          ...ctx.state._agentMessages || [],
+          { id, from: ctx.actorId, to: input.targetActorId, type: "request", content: input.request, data: input.data, ts: ctx.timestamp }
+        ]);
+        ctx.setState({ ...ctx.state, _agentMessages: messages });
+        return { messageId: id };
+      }
+    },
+    {
+      name: `${namespace}.agent.respond`,
+      description: "Respond to a message, request, or delegation from another agent",
+      input_schema: z.object({
+        messageId: z.string(),
+        response: z.string(),
+        data: z.any().optional()
+      }),
+      risk: "low",
+      capabilities_required: ["state.write"],
+      handler: async (ctx, input) => {
+        const id = uid();
+        const messages = capMessages([
+          ...ctx.state._agentMessages || [],
+          { id, from: ctx.actorId, to: "*", type: "inform", content: input.response, data: { ...input.data, inReplyTo: input.messageId }, ts: ctx.timestamp }
+        ]);
+        ctx.setState({ ...ctx.state, _agentMessages: messages });
+        return { messageId: id };
+      }
+    }
+  ];
+}
+
+// src/agent-hints.ts
+function createAgentProtocolHints(namespace) {
+  return [
+    {
+      trigger: "A proposal is pending and you have not voted on it yet",
+      condition: `Object.values(state._agentProposals || {}).some(p => p.status === 'pending' && !p.votes.some(v => v.actorId === actorId))`,
+      suggestedTools: [`${namespace}.agent.vote`],
+      priority: "high",
+      cooldownMs: 2e3
+    },
+    {
+      trigger: "You received a delegation addressed to you",
+      condition: `(state._agentMessages || []).some(m => m.type === 'delegate' && m.to === actorId)`,
+      suggestedTools: [`${namespace}.agent.respond`],
+      priority: "high",
+      cooldownMs: 3e3
+    },
+    {
+      trigger: "You received a request addressed to you",
+      condition: `(state._agentMessages || []).some(m => m.type === 'request' && m.to === actorId)`,
+      suggestedTools: [`${namespace}.agent.respond`],
+      priority: "medium",
+      cooldownMs: 2e3
+    },
+    {
+      trigger: "You have useful information to share with other agents",
+      suggestedTools: [`${namespace}.agent.inform`],
+      priority: "low",
+      cooldownMs: 5e3
+    },
+    {
+      trigger: "You want to propose a collaborative action for the group",
+      suggestedTools: [`${namespace}.agent.propose`],
+      priority: "low",
+      cooldownMs: 1e4
+    }
+  ];
+}
+
+// src/migrations.ts
+function getStateVersion(state) {
+  return typeof state._version === "string" ? state._version : "0.0.0";
+}
+function compareSemver(a, b) {
+  const pa = a.split(".").map((n) => parseInt(n, 10) || 0);
+  const pb = b.split(".").map((n) => parseInt(n, 10) || 0);
+  const len = Math.max(pa.length, pb.length);
+  for (let i = 0; i < len; i++) {
+    const va = pa[i] || 0;
+    const vb = pb[i] || 0;
+    if (va < vb) return -1;
+    if (va > vb) return 1;
+  }
+  return 0;
+}
+function migrateState(state, migrations, currentVersion) {
+  const fromVersion = getStateVersion(state);
+  if (compareSemver(fromVersion, currentVersion) >= 0) {
+    return {
+      migrated: false,
+      fromVersion,
+      toVersion: fromVersion,
+      state
+    };
+  }
+  if (!migrations || migrations.length === 0) {
+    return {
+      migrated: false,
+      fromVersion,
+      toVersion: currentVersion,
+      state: { ...state, _version: currentVersion }
+    };
+  }
+  const sorted = [...migrations].sort((a, b) => compareSemver(a.to, b.to));
+  const applicable = sorted.filter(
+    (m) => compareSemver(m.to, fromVersion) > 0 && compareSemver(m.to, currentVersion) <= 0
+  );
+  if (applicable.length === 0) {
+    return {
+      migrated: false,
+      fromVersion,
+      toVersion: currentVersion,
+      state: { ...state, _version: currentVersion }
+    };
+  }
+  let migratedState = { ...state };
+  for (const migration of applicable) {
+    migratedState = migration.migrate(migratedState);
+  }
+  migratedState._version = currentVersion;
+  return {
+    migrated: true,
+    fromVersion,
+    toVersion: currentVersion,
+    state: migratedState
+  };
+}
+
+// src/storage.ts
+var InMemoryAdapter = class {
+  roomStates = /* @__PURE__ */ new Map();
+  events = /* @__PURE__ */ new Map();
+  profiles = /* @__PURE__ */ new Map();
+  async saveRoomState(roomId, state) {
+    this.roomStates.set(roomId, state);
+  }
+  async loadRoomState(roomId) {
+    return this.roomStates.get(roomId) || null;
+  }
+  async appendEvent(roomId, event) {
+    if (!this.events.has(roomId)) {
+      this.events.set(roomId, []);
+    }
+    this.events.get(roomId).push(event);
+  }
+  async loadEvents(roomId, limit) {
+    const events = this.events.get(roomId) || [];
+    if (limit) {
+      return events.slice(-limit);
+    }
+    return events;
+  }
+  async listExperiences(_userId) {
+    return [];
+  }
+  async saveUserProfile(userId, profile) {
+    this.profiles.set(userId, profile);
+  }
+  async loadUserProfile(userId) {
+    return this.profiles.get(userId) || null;
+  }
+};
+export {
+  Badge,
+  Button,
+  Card,
+  Grid,
+  InMemoryAdapter,
+  Input,
+  Stack,
+  compareSemver,
+  createAgentProtocolHints,
+  createAgentProtocolTools,
+  defineEphemeralAction,
+  defineExperience,
+  defineTest,
+  defineTool,
+  getStateVersion,
+  migrateState,
+  quickTool,
+  useAnimationFrame,
+  useFollow,
+  useOptimisticTool,
+  useParticipants,
+  useSharedState,
+  useToolCall,
+  useTypingIndicator,
+  validateExperience
+};