@bluefly/openstandardagents 0.2.5-RC → 0.2.8

package/website/components/layout/Header.tsx

@@ -1,168 +0,0 @@
-'use client';
-
-import Link from 'next/link';
-import { useState } from 'react';
-
-export function Header() {
-  const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
-
-  return (
-    <header className="bg-white border-b border-gray-300 sticky top-0 z-50">
-      <nav className="container mx-auto max-w-6xl px-4">
-        <div className="flex items-center justify-between h-16">
-          <Link href="/" className="flex items-center space-x-3 group">
-            <img
-              src="/assets/brand/ossa-logo.svg"
-              alt="OSSA Logo"
-              className="h-10 w-10 transition-transform group-hover:scale-110"
-            />
-            <span className="text-2xl font-bold bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent">
-              OSSA
-            </span>
-          </Link>
-
-          {/* Desktop Navigation */}
-          <div className="hidden md:flex items-center space-x-3 lg:space-x-6 text-sm lg:text-base">
-            <Link href="/about" className="text-gray-600 hover:text-primary transition-colors font-medium whitespace-nowrap">
-              About
-            </Link>
-            <Link href="/specification" className="text-gray-600 hover:text-primary transition-colors font-medium whitespace-nowrap">
-              Specification
-            </Link>
-            <Link href="/schema" className="text-gray-600 hover:text-primary transition-colors font-medium whitespace-nowrap">
-              Schema
-            </Link>
-            <Link href="/docs" className="text-gray-600 hover:text-primary transition-colors font-medium whitespace-nowrap">
-              Docs
-            </Link>
-            <Link href="/blog" className="text-gray-600 hover:text-primary transition-colors font-medium whitespace-nowrap">
-              Blog
-            </Link>
-            <Link href="/playground" className="text-gray-600 hover:text-primary transition-colors font-medium whitespace-nowrap">
-              Playground
-            </Link>
-            <Link href="/examples" className="text-gray-600 hover:text-primary transition-colors font-medium whitespace-nowrap">
-              Examples
-            </Link>
-            <a
-              href="https://github.com/blueflyio/openstandardagents"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="text-gray-600 hover:text-primary transition-colors flex items-center font-medium"
-              title="View on GitHub"
-            >
-              <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
-                <path fillRule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clipRule="evenodd" />
-              </svg>
-            </a>
-          </div>
-
-          {/* Mobile Menu Button */}
-          <button
-            className="md:hidden p-2 focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2 rounded"
-            onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
-            aria-label="Toggle menu"
-            aria-expanded={mobileMenuOpen}
-            aria-controls="mobile-menu"
-          >
-            <svg
-              className="w-6 h-6"
-              fill="none"
-              stroke="currentColor"
-              viewBox="0 0 24 24"
-            >
-              {mobileMenuOpen ? (
-                <path
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  d="M6 18L18 6M6 6l12 12"
-                />
-              ) : (
-                <path
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  d="M4 6h16M4 12h16M4 18h16"
-                />
-              )}
-            </svg>
-          </button>
-        </div>
-
-        {/* Mobile Navigation */}
-        {mobileMenuOpen && (
-          <div
-            id="mobile-menu"
-            className="md:hidden py-4 border-t border-gray-300"
-            role="navigation"
-            aria-label="Mobile navigation"
-          >
-            <Link
-              href="/about"
-              className="block py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-            >
-              About
-            </Link>
-            <Link
-              href="/specification"
-              className="block py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-            >
-              Specification
-            </Link>
-            <Link
-              href="/schema"
-              className="block py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-            >
-              Schema
-            </Link>
-            <Link
-              href="/docs"
-              className="block py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-            >
-              Docs
-            </Link>
-            <Link
-              href="/blog"
-              className="block py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-            >
-              Blog
-            </Link>
-            <Link
-              href="/playground"
-              className="block py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-            >
-              Playground
-            </Link>
-            <Link
-              href="/examples"
-              className="block py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-            >
-              Examples
-            </Link>
-            <a
-              href="https://github.com/blueflyio/openstandardagents"
-              target="_blank"
-              rel="noopener noreferrer"
-              className="flex items-center gap-2 py-2 text-gray-600 hover:text-primary transition-colors font-medium"
-              onClick={() => setMobileMenuOpen(false)}
-              title="View on GitHub"
-            >
-              <svg className="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
-                <path fillRule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clipRule="evenodd" />
-              </svg>
-            </a>
-          </div>
-        )}
-      </nav>
-    </header>
-  );
-}
-

package/website/components/schema/SchemaComponentsAccordion.tsx

@@ -1,84 +0,0 @@
-'use client';
-
-import { useState } from 'react';
-
-interface AccordionItemProps {
-  title: string;
-  children: React.ReactNode;
-  isOpen: boolean;
-  onToggle: () => void;
-  borderColor: string;
-  bgColor: string;
-}
-
-function AccordionItem({ title, children, isOpen, onToggle, borderColor, bgColor }: AccordionItemProps) {
-  return (
-    <div className={`bg-white rounded-lg border-l-4 ${borderColor} shadow-md transition-all`}>
-      <button
-        onClick={onToggle}
-        className="w-full flex items-center justify-between p-6 text-left hover:bg-gray-50 transition-colors"
-        aria-expanded={isOpen}
-      >
-        <h3 className="text-xl font-bold text-gray-900">{title}</h3>
-        <svg
-          className={`w-5 h-5 text-gray-600 transition-transform ${isOpen ? 'rotate-180' : ''}`}
-          fill="none"
-          stroke="currentColor"
-          viewBox="0 0 24 24"
-        >
-          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
-        </svg>
-      </button>
-      {isOpen && (
-        <div className="px-6 pb-6 border-t border-gray-200">
-          <div className="pt-4">
-            {children}
-          </div>
-        </div>
-      )}
-    </div>
-  );
-}
-
-interface SchemaComponentsAccordionProps {
-  items: Array<{
-    id: string;
-    title: string;
-    content: React.ReactNode;
-    borderColor: string;
-  }>;
-}
-
-export function SchemaComponentsAccordion({ items }: SchemaComponentsAccordionProps) {
-  const [openItems, setOpenItems] = useState<Set<string>>(new Set([items[0]?.id]));
-
-  const toggleItem = (id: string) => {
-    setOpenItems(prev => {
-      const next = new Set(prev);
-      if (next.has(id)) {
-        next.delete(id);
-      } else {
-        next.add(id);
-      }
-      return next;
-    });
-  };
-
-  return (
-    <div className="space-y-4">
-      {items.map((item) => (
-        <AccordionItem
-          key={item.id}
-          title={item.title}
-          isOpen={openItems.has(item.id)}
-          onToggle={() => toggleItem(item.id)}
-          borderColor={item.borderColor}
-          bgColor="bg-white"
-        >
-          {item.content}
-        </AccordionItem>
-      ))}
-    </div>
-  );
-}
-

package/website/components/schema/SchemaExplorer.tsx

@@ -1,213 +0,0 @@
-'use client';
-
-import { useState } from 'react';
-import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
-import { vscDarkPlus } from 'react-syntax-highlighter/dist/cjs/styles/prism';
-
-interface SchemaExplorerProps {
-  schema: any;
-}
-
-interface PropertyInfo {
-  name: string;
-  type: string;
-  description?: string;
-  required?: boolean;
-  properties?: PropertyInfo[];
-}
-
-function extractProperties(schema: any, path = ''): PropertyInfo[] {
-  if (!schema || typeof schema !== 'object') {
-    return [];
-  }
-
-  const properties: PropertyInfo[] = [];
-
-  if (schema.properties) {
-    for (const [key, value] of Object.entries(schema.properties)) {
-      const prop = value as any;
-      const propInfo: PropertyInfo = {
-        name: key,
-        type: prop.type || 'object',
-        description: prop.description,
-        required: schema.required?.includes(key),
-      };
-
-      if (prop.properties || prop.items) {
-        propInfo.properties = extractProperties(
-          prop.properties || prop.items,
-          `${path}.${key}`
-        );
-      }
-
-      properties.push(propInfo);
-    }
-  }
-
-  return properties;
-}
-
-export function SchemaExplorer({ schema }: SchemaExplorerProps) {
-  const [selectedPath, setSelectedPath] = useState<string>('');
-  const [expandedPaths, setExpandedPaths] = useState<Set<string>>(
-    new Set([''])
-  );
-
-  const rootProperties = extractProperties(schema);
-
-  const togglePath = (path: string): void => {
-    setExpandedPaths((prev) => {
-      const next = new Set(prev);
-      if (next.has(path)) {
-        next.delete(path);
-      } else {
-        next.add(path);
-      }
-      return next;
-    });
-  };
-
-  const renderProperty = (
-    prop: PropertyInfo,
-    depth = 0,
-    currentPath = ''
-  ) => {
-    const fullPath = currentPath ? `${currentPath}.${prop.name}` : prop.name;
-    const isExpanded = expandedPaths.has(fullPath);
-    const hasChildren = prop.properties && prop.properties.length > 0;
-
-    return (
-      <div key={prop.name} className="ml-4">
-        <div
-          className={`flex items-start py-2 ${
-            selectedPath === fullPath ? 'bg-primary/10' : ''
-          }`}
-        >
-          {hasChildren && (
-            <button
-              onClick={() => togglePath(fullPath)}
-              className="mr-2 text-gray-500 hover:text-gray-700"
-              aria-label={isExpanded ? 'Collapse' : 'Expand'}
-            >
-              {isExpanded ? '−' : '+'}
-            </button>
-          )}
-          <div
-            className="flex-1 cursor-pointer"
-            onClick={() => setSelectedPath(fullPath)}
-          >
-            <div className="flex items-center gap-2">
-              <span className="font-semibold text-gray-900">{prop.name}</span>
-              <span className="text-sm text-gray-500">({prop.type})</span>
-              {prop.required && (
-                <span className="text-xs bg-error/20 text-error px-2 py-0.5 rounded">
-                  required
-                </span>
-              )}
-            </div>
-            {prop.description && (
-              <p className="text-sm text-gray-600 mt-1">{prop.description}</p>
-            )}
-          </div>
-        </div>
-        {hasChildren && isExpanded && (
-          <div className="ml-6 border-l-2 border-gray-200">
-            {prop.properties?.map((child) =>
-              renderProperty(child, depth + 1, fullPath)
-            )}
-          </div>
-        )}
-      </div>
-    );
-  };
-
-  const getPropertyAtPath = (path: string): any => {
-    const parts = path.split('.').filter(Boolean);
-    let current: any = schema;
-
-    for (const part of parts) {
-      if (current?.properties?.[part]) {
-        current = current.properties[part];
-      } else {
-        return null;
-      }
-    }
-
-    return current;
-  };
-
-  const selectedProperty = selectedPath
-    ? getPropertyAtPath(selectedPath)
-    : schema;
-
-  return (
-    <div className="space-y-6">
-      {/* Property Tree - Row 1 */}
-      <div className="card">
-        <h2 className="text-xl font-semibold mb-4">Schema Structure</h2>
-        <div className="space-y-1 max-h-[400px] overflow-y-auto">
-          {rootProperties.map((prop) => renderProperty(prop))}
-        </div>
-      </div>
-
-      {/* Property Details - Row 2 */}
-      <div className="card">
-        <h2 className="text-xl font-semibold mb-4">
-          {selectedPath || 'Schema Overview'}
-        </h2>
-        {selectedProperty && (
-          <div className="space-y-4">
-            <div>
-              <h3 className="font-semibold mb-2">Type</h3>
-              <p className="text-gray-700">{selectedProperty.type || 'object'}</p>
-            </div>
-
-            {selectedProperty.description && (
-              <div>
-                <h3 className="font-semibold mb-2">Description</h3>
-                <p className="text-gray-700">{selectedProperty.description}</p>
-              </div>
-            )}
-
-            {selectedProperty.enum && (
-              <div>
-                <h3 className="font-semibold mb-2">Allowed Values</h3>
-                <ul className="list-disc list-inside text-gray-700">
-                  {selectedProperty.enum.map((value: any, index: number) => (
-                    <li key={index}>{String(value)}</li>
-                  ))}
-                </ul>
-              </div>
-            )}
-
-            {selectedProperty.default !== undefined && (
-              <div>
-                <h3 className="font-semibold mb-2">Default Value</h3>
-                <p className="text-gray-700">
-                  {JSON.stringify(selectedProperty.default)}
-                </p>
-              </div>
-            )}
-
-            <div>
-              <h3 className="font-semibold mb-2">JSON Schema</h3>
-              <div className="border border-gray-300 rounded-lg overflow-hidden">
-                <SyntaxHighlighter
-                  language="json"
-                  style={vscDarkPlus}
-                  customStyle={{
-                    margin: 0,
-                    fontSize: '12px',
-                  }}
-                >
-                  {JSON.stringify(selectedProperty, null, 2)}
-                </SyntaxHighlighter>
-              </div>
-            </div>
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}
-