@stigmer/react 0.0.36 → 0.0.40

package/src/internal/button.tsx

@@ -1,60 +0,0 @@
-"use client";
-
-import { Button as ButtonPrimitive } from "@base-ui/react/button";
-import { cva, type VariantProps } from "class-variance-authority";
-
-import { cn } from "@stigmer/theme";
-
-const buttonVariants = cva(
-  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground [a]:hover:bg-primary/80",
-        outline:
-          "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
-        secondary:
-          "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
-        ghost:
-          "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
-        destructive:
-          "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
-        link: "text-primary underline-offset-4 hover:underline",
-      },
-      size: {
-        default:
-          "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
-        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
-        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
-        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-3 has-data-[icon=inline-start]:pl-3",
-        icon: "size-8",
-        "icon-xs":
-          "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
-        "icon-sm":
-          "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
-        "icon-lg": "size-9",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  },
-);
-
-function Button({
-  className,
-  variant = "default",
-  size = "default",
-  ...props
-}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {
-  return (
-    <ButtonPrimitive
-      data-slot="button"
-      className={cn(buttonVariants({ variant, size, className }))}
-      {...props}
-    />
-  );
-}
-
-export { Button, buttonVariants };

package/src/internal/collapsible.tsx

@@ -1,21 +0,0 @@
-"use client";
-
-import { Collapsible as CollapsiblePrimitive } from "@base-ui/react/collapsible";
-
-function Collapsible({ ...props }: CollapsiblePrimitive.Root.Props) {
-  return <CollapsiblePrimitive.Root data-slot="collapsible" {...props} />;
-}
-
-function CollapsibleTrigger({ ...props }: CollapsiblePrimitive.Trigger.Props) {
-  return (
-    <CollapsiblePrimitive.Trigger data-slot="collapsible-trigger" {...props} />
-  );
-}
-
-function CollapsibleContent({ ...props }: CollapsiblePrimitive.Panel.Props) {
-  return (
-    <CollapsiblePrimitive.Panel data-slot="collapsible-content" {...props} />
-  );
-}
-
-export { Collapsible, CollapsibleTrigger, CollapsibleContent };

package/src/internal/section.tsx

@@ -1,18 +0,0 @@
-interface SectionProps {
-  title: string;
-  children: React.ReactNode;
-}
-
-function Section({ title, children }: SectionProps) {
-  return (
-    <section>
-      <h3 className="text-muted-foreground mb-3 text-sm font-semibold tracking-wider uppercase">
-        {title}
-      </h3>
-      {children}
-    </section>
-  );
-}
-
-export { Section };
-export type { SectionProps };

package/src/internal/textarea.tsx

@@ -1,23 +0,0 @@
-import * as React from "react";
-
-import { cn } from "@stigmer/theme";
-
-const Textarea = React.forwardRef<
-  HTMLTextAreaElement,
-  React.ComponentProps<"textarea">
->(({ className, ...props }, ref) => {
-  return (
-    <textarea
-      ref={ref}
-      data-slot="textarea"
-      className={cn(
-        "border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 disabled:bg-input/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 flex field-sizing-content min-h-16 w-full rounded-lg border bg-transparent px-2.5 py-2 text-base transition-colors outline-none focus-visible:ring-3 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-3 md:text-sm",
-        className,
-      )}
-      {...props}
-    />
-  );
-});
-Textarea.displayName = "Textarea";
-
-export { Textarea };

package/src/mcp-server/hooks/useMcpServerSearch.ts

@@ -1,79 +0,0 @@
-"use client";
-
-import { useEffect, useRef, useState } from "react";
-import { useStigmer } from "../../hooks";
-import type { SearchResult } from "@stigmer/protos/ai/stigmer/search/v1/io_pb";
-
-const DEBOUNCE_MS = 300;
-const DEFAULT_PAGE_SIZE = 20;
-
-export interface UseMcpServerSearchOptions {
-  org: string;
-  debounceMs?: number;
-  pageSize?: number;
-}
-
-export interface UseMcpServerSearchReturn {
-  query: string;
-  setQuery: (query: string) => void;
-  results: SearchResult[];
-  isLoading: boolean;
-  error: string | null;
-}
-
-/**
- * Debounced MCP server search scoped to a specific organization.
- *
- * On mount fetches all accessible MCP servers (empty query). Typing fires at
- * most one request per debounce interval. Stale responses from out-of-order
- * requests are discarded.
- *
- * Returns full {@link SearchResult} objects suitable for use with
- * `ResourceSearchCard`.
- */
-export function useMcpServerSearch(options: UseMcpServerSearchOptions): UseMcpServerSearchReturn {
-  const { org, debounceMs = DEBOUNCE_MS, pageSize = DEFAULT_PAGE_SIZE } = options;
-  const stigmer = useStigmer();
-
-  const [query, setQuery] = useState("");
-  const [results, setResults] = useState<SearchResult[]>([]);
-  const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const latestRequestId = useRef(0);
-  const debouncedQuery = useDebouncedValue(query, debounceMs);
-
-  useEffect(() => {
-    const requestId = ++latestRequestId.current;
-    setIsLoading(true);
-    setError(null);
-
-    stigmer.mcpServer
-      .list({ query: debouncedQuery, org, page: { num: 1, size: pageSize } })
-      .then((response) => {
-        if (requestId !== latestRequestId.current) return;
-        setResults(response.entries);
-      })
-      .catch((err: unknown) => {
-        if (requestId !== latestRequestId.current) return;
-        setError(err instanceof Error ? err.message : "Search failed");
-      })
-      .finally(() => {
-        if (requestId !== latestRequestId.current) return;
-        setIsLoading(false);
-      });
-  }, [debouncedQuery, org, pageSize, stigmer]);
-
-  return { query, setQuery, results, isLoading, error };
-}
-
-function useDebouncedValue<T>(value: T, delayMs: number): T {
-  const [debounced, setDebounced] = useState(value);
-
-  useEffect(() => {
-    const timer = setTimeout(() => setDebounced(value), delayMs);
-    return () => clearTimeout(timer);
-  }, [value, delayMs]);
-
-  return debounced;
-}

package/src/session/components/AgentSessionHistory.tsx

@@ -1,109 +0,0 @@
-"use client";
-
-import { History, Loader2, AlertCircle, RotateCw } from "lucide-react";
-import { cn } from "@stigmer/theme";
-import { SessionCard } from "./SessionCard";
-import { useAgentSessionList } from "../hooks/useAgentSessionList";
-
-export interface AgentSessionHistoryProps {
-  agentId: string;
-  onSessionSelect?: (sessionId: string) => void;
-  pageSize?: number;
-  className?: string;
-}
-
-export function AgentSessionHistory({
-  agentId,
-  onSessionSelect,
-  pageSize = 5,
-  className,
-}: AgentSessionHistoryProps) {
-  const {
-    sessions,
-    isLoading,
-    error,
-    hasMore,
-    isLoadingMore,
-    loadMore,
-    retry,
-  } = useAgentSessionList(agentId, { pageSize });
-
-  return (
-    <section className={cn("stgm-agent-session-history", className)}>
-      <h3 className="text-muted-foreground mb-3 text-sm font-semibold tracking-wider uppercase">
-        Recent Sessions
-      </h3>
-
-      {error && (
-        <div className="bg-destructive/10 text-destructive flex items-center gap-2 rounded-lg px-3 py-2 text-sm">
-          <AlertCircle className="size-4 shrink-0" />
-          <span className="min-w-0 flex-1 truncate">
-            {error.message || "Something went wrong"}
-          </span>
-          <button
-            type="button"
-            onClick={retry}
-            className="text-destructive hover:text-destructive/80 inline-flex shrink-0 items-center gap-1 text-xs font-medium transition-colors"
-          >
-            <RotateCw className="size-3" />
-            Retry
-          </button>
-        </div>
-      )}
-
-      {isLoading && sessions.length === 0 && !error && (
-        <div className="space-y-3">
-          {Array.from({ length: 3 }).map((_, i) => (
-            <div
-              key={i}
-              className="bg-muted/50 h-[52px] animate-pulse rounded-xl"
-            />
-          ))}
-        </div>
-      )}
-
-      {!isLoading && sessions.length === 0 && !error && (
-        <div className="border-border flex flex-col items-center justify-center rounded-lg border border-dashed py-12 text-center">
-          <History className="text-muted-foreground/40 mb-3 size-10" />
-          <p className="text-sm font-medium">No sessions yet</p>
-          <p className="text-muted-foreground mt-1 text-xs">
-            Run this agent to create your first session.
-          </p>
-        </div>
-      )}
-
-      {sessions.length > 0 && (
-        <div className="space-y-2">
-          {sessions.map((session) => (
-            <SessionCard
-              key={session.metadata?.id}
-              session={session}
-              onNavigate={onSessionSelect}
-            />
-          ))}
-        </div>
-      )}
-
-      {hasMore && (
-        <div className="flex justify-center pt-3">
-          <button
-            type="button"
-            onClick={loadMore}
-            disabled={isLoadingMore}
-            className={cn(
-              "border-border inline-flex h-8 items-center gap-1.5 rounded-lg border px-3 text-sm font-medium",
-              "bg-background hover:bg-accent hover:text-accent-foreground transition-colors",
-              "disabled:pointer-events-none disabled:opacity-50",
-              "focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none",
-            )}
-          >
-            {isLoadingMore && (
-              <Loader2 className="size-3.5 animate-spin" />
-            )}
-            Load more
-          </button>
-        </div>
-      )}
-    </section>
-  );
-}

package/src/session/components/SessionCard.tsx

@@ -1,113 +0,0 @@
-"use client";
-
-import type { Session } from "@stigmer/protos/ai/stigmer/agentic/session/v1/api_pb";
-import type { Timestamp } from "@bufbuild/protobuf/wkt";
-import { MessageSquare, ChevronRight } from "lucide-react";
-import { cn } from "@stigmer/theme";
-
-export interface SessionCardProps {
-  session: Session;
-  onNavigate?: (sessionId: string) => void;
-  className?: string;
-}
-
-export function SessionCard({ session, onNavigate, className }: SessionCardProps) {
-  const id = session.metadata?.id ?? "";
-  const displayName =
-    session.spec?.subject || session.metadata?.name || "Untitled session";
-
-  const createdAt = session.status?.audit?.specAudit?.createdAt;
-  const updatedAt = session.status?.audit?.specAudit?.updatedAt;
-
-  const interactive = !!onNavigate;
-
-  return (
-    <div
-      role={interactive ? "button" : undefined}
-      tabIndex={interactive ? 0 : undefined}
-      onClick={interactive ? () => onNavigate(id) : undefined}
-      onKeyDown={
-        interactive
-          ? (e) => {
-              if (e.key === "Enter" || e.key === " ") {
-                e.preventDefault();
-                onNavigate(id);
-              }
-            }
-          : undefined
-      }
-      className={cn(
-        "stgm-session-card",
-        "bg-card text-card-foreground ring-foreground/10 flex flex-col gap-3 overflow-hidden rounded-xl py-3 text-sm ring-1",
-        interactive && "cursor-pointer hover:bg-accent/50 transition-colors",
-        "focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none",
-        className,
-      )}
-    >
-      <div className="grid auto-rows-min grid-cols-[1fr_auto] items-start gap-1 px-3">
-        <div className="flex items-center gap-2 text-sm font-medium leading-snug">
-          <MessageSquare className="text-muted-foreground size-4 shrink-0" />
-          <span className="truncate">{displayName}</span>
-        </div>
-
-        {interactive && (
-          <div className="col-start-2 row-span-2 row-start-1 self-start justify-self-end">
-            <ChevronRight className="text-muted-foreground size-4" />
-          </div>
-        )}
-
-        <div className="text-muted-foreground col-start-1 text-sm">
-          <span className="flex items-center gap-3">
-            {createdAt && (
-              <time dateTime={toISOString(createdAt)}>
-                {formatRelativeTime(createdAt)}
-              </time>
-            )}
-            {updatedAt && createdAt && (
-              <span className="text-muted-foreground/60">
-                updated {formatRelativeTime(updatedAt)}
-              </span>
-            )}
-          </span>
-        </div>
-      </div>
-    </div>
-  );
-}
-
-function toDate(ts: Timestamp | undefined): Date | null {
-  if (!ts) return null;
-  const seconds = Number(ts.seconds);
-  if (!seconds && seconds !== 0) return null;
-  return new Date(seconds * 1000 + Math.floor(ts.nanos / 1_000_000));
-}
-
-function toISOString(ts: Timestamp | undefined): string {
-  return toDate(ts)?.toISOString() ?? "";
-}
-
-function formatRelativeTime(ts: Timestamp | undefined): string {
-  const date = toDate(ts);
-  if (!date) return "";
-
-  const now = Date.now();
-  const diffMs = now - date.getTime();
-
-  if (diffMs < 0) return "just now";
-  if (diffMs < 60_000) return "just now";
-
-  const minutes = Math.floor(diffMs / 60_000);
-  if (minutes < 60) return `${minutes}m ago`;
-
-  const hours = Math.floor(minutes / 60);
-  if (hours < 24) return `${hours}h ago`;
-
-  const days = Math.floor(hours / 24);
-  if (days === 1) return "yesterday";
-  if (days < 7) return `${days}d ago`;
-
-  return date.toLocaleDateString(undefined, {
-    month: "short",
-    day: "numeric",
-  });
-}

package/src/session/hooks/useAgentSessionList.ts

@@ -1,117 +0,0 @@
-"use client";
-
-import { useCallback, useEffect, useRef, useState } from "react";
-import type { Session } from "@stigmer/protos/ai/stigmer/agentic/session/v1/api_pb";
-import { create } from "@bufbuild/protobuf";
-import { ListSessionsByAgentRequestSchema } from "@stigmer/protos/ai/stigmer/agentic/session/v1/io_pb";
-import { useStigmer } from "../../hooks";
-
-const DEFAULT_PAGE_SIZE = 5;
-
-export interface UseAgentSessionListOptions {
-  pageSize?: number;
-}
-
-export interface UseAgentSessionListReturn {
-  sessions: Session[];
-  isLoading: boolean;
-  error: Error | null;
-  hasMore: boolean;
-  isLoadingMore: boolean;
-  loadMore: () => void;
-  retry: () => void;
-}
-
-/**
- * Fetches sessions scoped to a specific agent with "load more" pagination.
- *
- * Returns sessions sorted by creation time descending (most recent first).
- * Automatically resets when `agentId` changes.
- */
-export function useAgentSessionList(
-  agentId: string,
-  options?: UseAgentSessionListOptions,
-): UseAgentSessionListReturn {
-  const pageSize = options?.pageSize ?? DEFAULT_PAGE_SIZE;
-  const stigmer = useStigmer();
-
-  const [sessions, setSessions] = useState<Session[]>([]);
-  const [isLoading, setIsLoading] = useState(false);
-  const [isLoadingMore, setIsLoadingMore] = useState(false);
-  const [error, setError] = useState<Error | null>(null);
-  const [currentPage, setCurrentPage] = useState(0);
-  const [totalPages, setTotalPages] = useState(0);
-
-  const hasMore = currentPage + 1 < totalPages;
-  const latestAgentId = useRef(agentId);
-
-  const fetchPage = useCallback(
-    async (page: number, append: boolean) => {
-      if (!agentId) return;
-
-      const isInitial = !append;
-      if (isInitial) setIsLoading(true);
-      else setIsLoadingMore(true);
-      setError(null);
-
-      try {
-        const result = await stigmer.session.listByAgent(
-          create(ListSessionsByAgentRequestSchema, {
-            agentId,
-            pageSize,
-            pageToken: page > 0 ? String(page) : "",
-          }),
-        );
-
-        if (latestAgentId.current !== agentId) return;
-
-        setTotalPages(result.totalPages);
-        setCurrentPage(page);
-
-        if (append) {
-          setSessions((prev) => [...prev, ...result.entries]);
-        } else {
-          setSessions(result.entries);
-        }
-      } catch (err) {
-        if (latestAgentId.current !== agentId) return;
-        setError(err instanceof Error ? err : new Error("Failed to load sessions"));
-      } finally {
-        if (latestAgentId.current !== agentId) return;
-        setIsLoading(false);
-        setIsLoadingMore(false);
-      }
-    },
-    [agentId, pageSize, stigmer],
-  );
-
-  useEffect(() => {
-    latestAgentId.current = agentId;
-    setSessions([]);
-    setCurrentPage(0);
-    setTotalPages(0);
-    fetchPage(0, false);
-  }, [agentId, fetchPage]);
-
-  const loadMore = useCallback(() => {
-    if (!hasMore || isLoadingMore) return;
-    fetchPage(currentPage + 1, true);
-  }, [hasMore, isLoadingMore, currentPage, fetchPage]);
-
-  const retry = useCallback(() => {
-    setSessions([]);
-    setCurrentPage(0);
-    setTotalPages(0);
-    fetchPage(0, false);
-  }, [fetchPage]);
-
-  return {
-    sessions,
-    isLoading,
-    error,
-    hasMore,
-    isLoadingMore,
-    loadMore,
-    retry,
-  };
-}

package/src/skill/hooks/useSkillSearch.ts

@@ -1,79 +0,0 @@
-"use client";
-
-import { useEffect, useRef, useState } from "react";
-import { useStigmer } from "../../hooks";
-import type { SearchResult } from "@stigmer/protos/ai/stigmer/search/v1/io_pb";
-
-const DEBOUNCE_MS = 300;
-const DEFAULT_PAGE_SIZE = 20;
-
-export interface UseSkillSearchOptions {
-  org: string;
-  debounceMs?: number;
-  pageSize?: number;
-}
-
-export interface UseSkillSearchReturn {
-  query: string;
-  setQuery: (query: string) => void;
-  results: SearchResult[];
-  isLoading: boolean;
-  error: string | null;
-}
-
-/**
- * Debounced skill search scoped to a specific organization.
- *
- * On mount fetches all accessible skills (empty query). Typing fires at most
- * one request per debounce interval. Stale responses from out-of-order
- * requests are discarded.
- *
- * Returns full {@link SearchResult} objects suitable for use with
- * `ResourceSearchCard`.
- */
-export function useSkillSearch(options: UseSkillSearchOptions): UseSkillSearchReturn {
-  const { org, debounceMs = DEBOUNCE_MS, pageSize = DEFAULT_PAGE_SIZE } = options;
-  const stigmer = useStigmer();
-
-  const [query, setQuery] = useState("");
-  const [results, setResults] = useState<SearchResult[]>([]);
-  const [isLoading, setIsLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-
-  const latestRequestId = useRef(0);
-  const debouncedQuery = useDebouncedValue(query, debounceMs);
-
-  useEffect(() => {
-    const requestId = ++latestRequestId.current;
-    setIsLoading(true);
-    setError(null);
-
-    stigmer.skill
-      .list({ query: debouncedQuery, org, page: { num: 1, size: pageSize } })
-      .then((response) => {
-        if (requestId !== latestRequestId.current) return;
-        setResults(response.entries);
-      })
-      .catch((err: unknown) => {
-        if (requestId !== latestRequestId.current) return;
-        setError(err instanceof Error ? err.message : "Search failed");
-      })
-      .finally(() => {
-        if (requestId !== latestRequestId.current) return;
-        setIsLoading(false);
-      });
-  }, [debouncedQuery, org, pageSize, stigmer]);
-
-  return { query, setQuery, results, isLoading, error };
-}
-
-function useDebouncedValue<T>(value: T, delayMs: number): T {
-  const [debounced, setDebounced] = useState(value);
-
-  useEffect(() => {
-    const timer = setTimeout(() => setDebounced(value), delayMs);
-    return () => clearTimeout(timer);
-  }, [value, delayMs]);
-
-  return debounced;
-}