@elizaos/cli 1.0.9 → 1.0.10

package/dist/templates/plugin-starter/src/frontend/index.css

@@ -0,0 +1,77 @@
+@config "../../tailwind.config.js";
+@import 'tailwindcss';
+
+@layer base {
+  :root {
+    --background: 0 0% 97.65%;
+    --foreground: 0 0% 12.55%;
+    --muted: 0 0% 93.73%;
+    --muted-foreground: 0 0% 39.22%;
+    --popover: 0 0% 98.82%;
+    --popover-foreground: 0 0% 12.55%;
+    --card: 0 0% 98.82%;
+    --card-foreground: 0 0% 12.55%;
+    --border: 0 0% 84.71%;
+    --input: 0 0% 94.12%;
+    --primary: 22.93 92.59% 52.35%;
+    --primary-foreground: 44 0% 100%;
+    --secondary: 34.05 100% 85.49%;
+    --secondary-foreground: 16.27 50.43% 22.94%;
+    --accent: 0 0% 90.98%;
+    --accent-foreground: 0 0% 12.55%;
+    --destructive: 10.16 77.87% 53.92%;
+    --destructive-foreground: 0 0% 100%;
+    --ring: 24.8 79.79% 63.14%;
+    --chart-1: 22.93 92.59% 52.35%;
+    --chart-2: 34.05 100% 85.49%;
+    --chart-3: 0 0% 90.98%;
+    --chart-4: 34.05 100% 88.49%;
+    --chart-5: 22.93 95.59% 52.35%;
+    --radius: 0.5rem;
+  }
+
+  .dark {
+    --background: 0 0% 6.67%;
+    --foreground: 0 0% 93.33%;
+    --muted: 0 0% 13.33%;
+    --muted-foreground: 0 0% 70.59%;
+    --popover: 0 0% 9.8%;
+    --popover-foreground: 0 0% 93.33%;
+    --card: 0 0% 9.8%;
+    --card-foreground: 0 0% 93.33%;
+    --border: 44 14% 11%;
+    --input: 0 0% 28.24%;
+    --primary: 22.93 92.59% 52.35%;
+    --primary-foreground: 29.51 0% 100%;
+    --secondary: 28.5 64.52% 12.16%;
+    --secondary-foreground: 29.51 100% 88.04%;
+    --accent: 0 0% 16.47%;
+    --accent-foreground: 0 0% 93.33%;
+    --destructive: 10.16 77.87% 53.92%;
+    --destructive-foreground: 0 0% 100%;
+    --ring: 23.11 59.8% 40%;
+    --chart-1: 22.93 92.59% 52.35%;
+    --chart-2: 28.5 64.52% 12.16%;
+    --chart-3: 0 0% 16.47%;
+    --chart-4: 28.5 64.52% 15.16%;
+    --chart-5: 22.93 95.59% 52.35%;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+}
+
+/* Force dark mode */
+:root {
+  color-scheme: dark;
+}
+
+body {
+  @apply font-mono bg-background text-foreground;
+}

package/dist/templates/plugin-starter/src/frontend/index.tsx

@@ -0,0 +1,164 @@
+import { QueryClient, QueryClientProvider, useQuery } from '@tanstack/react-query';
+import { createRoot } from 'react-dom/client';
+import './index.css';
+import React from 'react';
+import type { UUID } from '@elizaos/core';
+
+const queryClient = new QueryClient();
+
+// Define the interface for the ELIZA_CONFIG
+interface ElizaConfig {
+  agentId: string;
+  apiBase: string;
+}
+
+// Define the interface for time response
+interface TimeResponse {
+  timestamp: string;
+  unix: number;
+  formatted: string;
+  timezone: string;
+}
+
+/**
+ * Time display component that fetches from backend
+ */
+function TimeDisplay({ apiBase }: { apiBase: string }) {
+  const { data, isLoading, error, refetch } = useQuery<TimeResponse>({
+    queryKey: ['currentTime'],
+    queryFn: async () => {
+      const response = await fetch(`${apiBase}/api/time`);
+      if (!response.ok) {
+        throw new Error('Failed to fetch time');
+      }
+      return response.json();
+    },
+    refetchInterval: 1000, // Refresh every second
+  });
+
+  if (isLoading) {
+    return <div className="text-gray-600">Loading time...</div>;
+  }
+
+  if (error) {
+    return (
+      <div className="text-red-600">
+        Error fetching time: {error instanceof Error ? error.message : 'Unknown error'}
+      </div>
+    );
+  }
+
+  return (
+    <div className="space-y-2" data-testid="time-display">
+      <h2 className="text-lg font-semibold">Current Time</h2>
+      <div className="space-y-1 text-sm">
+        <div>
+          <span className="font-medium">Formatted:</span> {data?.formatted}
+        </div>
+        <div>
+          <span className="font-medium">Timezone:</span> {data?.timezone}
+        </div>
+        <div>
+          <span className="font-medium">Unix:</span> {data?.unix}
+        </div>
+      </div>
+      <button
+        onClick={() => refetch()}
+        className="px-3 py-1 text-sm bg-primary text-primary-foreground rounded hover:opacity-90"
+        data-testid="refresh-button"
+      >
+        Refresh
+      </button>
+    </div>
+  );
+}
+
+/**
+ * Main Example route component
+ */
+function ExampleRoute() {
+  const config = (window as any).ELIZA_CONFIG as ElizaConfig | undefined;
+  const agentId = config?.agentId;
+  const apiBase = config?.apiBase || 'http://localhost:3000';
+
+  // Apply dark mode to the root element
+  React.useEffect(() => {
+    document.documentElement.classList.add('dark');
+  }, []);
+
+  if (!agentId) {
+    return (
+      <div className="p-4 text-center">
+        <div className="text-red-600 font-medium">Error: Agent ID not found</div>
+        <div className="text-sm text-gray-600 mt-2">
+          The server should inject the agent ID configuration.
+        </div>
+      </div>
+    );
+  }
+
+  return <ExampleProvider agentId={agentId as UUID} apiBase={apiBase} />;
+}
+
+/**
+ * Example provider component
+ */
+function ExampleProvider({ agentId, apiBase }: { agentId: UUID; apiBase: string }) {
+  return (
+    <QueryClientProvider client={queryClient}>
+      <div className="p-6 space-y-6">
+        <div>
+          <h1 className="text-2xl font-bold mb-2">Plugin Starter Example</h1>
+          <div className="text-sm text-muted-foreground">Agent ID: {agentId}</div>
+        </div>
+        <TimeDisplay apiBase={apiBase} />
+      </div>
+    </QueryClientProvider>
+  );
+}
+
+// Initialize the application - no router needed for iframe
+const rootElement = document.getElementById('root');
+if (rootElement) {
+  createRoot(rootElement).render(<ExampleRoute />);
+}
+
+// Define types for integration with agent UI system
+export interface AgentPanel {
+  name: string;
+  path: string;
+  component: React.ComponentType<any>;
+  icon?: string;
+  public?: boolean;
+  shortLabel?: string; // Optional short label for mobile
+}
+
+interface PanelProps {
+  agentId: string;
+}
+
+/**
+ * Example panel component for the plugin system
+ */
+const PanelComponent: React.FC<PanelProps> = ({ agentId }) => {
+  return (
+    <div className="p-4">
+      <h2 className="text-lg font-semibold mb-2">Example Panel</h2>
+      <div>Hello {agentId}!</div>
+    </div>
+  );
+};
+
+// Export the panel configuration for integration with the agent UI
+export const panels: AgentPanel[] = [
+  {
+    name: 'Example',
+    path: 'example',
+    component: PanelComponent,
+    icon: 'Book',
+    public: false,
+    shortLabel: 'Example',
+  },
+];
+
+export * from './utils';

package/dist/templates/plugin-starter/src/frontend/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}

package/dist/templates/plugin-starter/src/index.ts

@@ -0,0 +1,274 @@
+import type { Plugin } from '@elizaos/core';
+import {
+  type Action,
+  type Content,
+  type GenerateTextParams,
+  type HandlerCallback,
+  type IAgentRuntime,
+  type Memory,
+  ModelType,
+  type Provider,
+  type ProviderResult,
+  Service,
+  type State,
+  logger,
+} from '@elizaos/core';
+import { z } from 'zod';
+import { StarterPluginTestSuite } from './tests';
+
+/**
+ * Defines the configuration schema for a plugin, including the validation rules for the plugin name.
+ *
+ * @type {import('zod').ZodObject<{ EXAMPLE_PLUGIN_VARIABLE: import('zod').ZodString }>}
+ */
+const configSchema = z.object({
+  EXAMPLE_PLUGIN_VARIABLE: z
+    .string()
+    .min(1, 'Example plugin variable is not provided')
+    .optional()
+    .transform((val) => {
+      if (!val) {
+        logger.warn('Example plugin variable is not provided (this is expected)');
+      }
+      return val;
+    }),
+});
+
+/**
+ * Example HelloWorld action
+ * This demonstrates the simplest possible action structure
+ */
+/**
+ * Action representing a hello world message.
+ * @typedef {Object} Action
+ * @property {string} name - The name of the action.
+ * @property {string[]} similes - An array of related actions.
+ * @property {string} description - A brief description of the action.
+ * @property {Function} validate - Asynchronous function to validate the action.
+ * @property {Function} handler - Asynchronous function to handle the action and generate a response.
+ * @property {Object[]} examples - An array of example inputs and expected outputs for the action.
+ */
+const helloWorldAction: Action = {
+  name: 'HELLO_WORLD',
+  similes: ['GREET', 'SAY_HELLO'],
+  description: 'Responds with a simple hello world message',
+
+  validate: async (
+    _runtime: IAgentRuntime,
+    _message: Memory,
+    _state: State | undefined
+  ): Promise<boolean> => {
+    // Always valid
+    return true;
+  },
+
+  handler: async (
+    _runtime: IAgentRuntime,
+    message: Memory,
+    _state: State | undefined,
+    _options: any,
+    callback?: HandlerCallback,
+    _responses?: Memory[]
+  ) => {
+    try {
+      logger.info('Handling HELLO_WORLD action');
+
+      // Simple response content
+      const responseContent: Content = {
+        text: 'hello world!',
+        actions: ['HELLO_WORLD'],
+        source: message.content.source,
+      };
+
+      // Call back with the hello world message if callback is provided
+      if (callback) {
+        await callback(responseContent);
+      }
+
+      return responseContent;
+    } catch (error) {
+      logger.error('Error in HELLO_WORLD action:', error);
+      throw error;
+    }
+  },
+
+  examples: [
+    [
+      {
+        name: '{{name1}}',
+        content: {
+          text: 'Can you say hello?',
+        },
+      },
+      {
+        name: '{{name2}}',
+        content: {
+          text: 'hello world!',
+          actions: ['HELLO_WORLD'],
+        },
+      },
+    ],
+  ],
+};
+
+/**
+ * Example Hello World Provider
+ * This demonstrates the simplest possible provider implementation
+ */
+const helloWorldProvider: Provider = {
+  name: 'HELLO_WORLD_PROVIDER',
+  description: 'A simple example provider',
+
+  get: async (
+    _runtime: IAgentRuntime,
+    _message: Memory,
+    _state: State | undefined
+  ): Promise<ProviderResult> => {
+    return {
+      text: 'I am a provider',
+      values: {},
+      data: {},
+    };
+  },
+};
+
+export class StarterService extends Service {
+  static serviceType = 'starter';
+  capabilityDescription =
+    'This is a starter service which is attached to the agent through the starter plugin.';
+  constructor(protected runtime: IAgentRuntime) {
+    super(runtime);
+  }
+
+  static async start(runtime: IAgentRuntime) {
+    logger.info(`*** Starting starter service - MODIFIED: ${new Date().toISOString()} ***`);
+    const service = new StarterService(runtime);
+    return service;
+  }
+
+  static async stop(runtime: IAgentRuntime) {
+    logger.info('*** TESTING DEV MODE - STOP MESSAGE CHANGED! ***');
+    // get the service from the runtime
+    const service = runtime.getService(StarterService.serviceType);
+    if (!service) {
+      throw new Error('Starter service not found');
+    }
+    service.stop();
+  }
+
+  async stop() {
+    logger.info('*** THIRD CHANGE - TESTING FILE WATCHING! ***');
+  }
+}
+
+export const starterPlugin: Plugin = {
+  name: 'plugin-starter',
+  description: 'Plugin starter for elizaOS',
+  config: {
+    EXAMPLE_PLUGIN_VARIABLE: process.env.EXAMPLE_PLUGIN_VARIABLE,
+  },
+  async init(config: Record<string, string>) {
+    logger.info('*** TESTING DEV MODE - PLUGIN MODIFIED AND RELOADED! ***');
+    try {
+      const validatedConfig = await configSchema.parseAsync(config);
+
+      // Set all environment variables at once
+      for (const [key, value] of Object.entries(validatedConfig)) {
+        if (value) process.env[key] = value;
+      }
+    } catch (error) {
+      if (error instanceof z.ZodError) {
+        throw new Error(
+          `Invalid plugin configuration: ${error.errors.map((e) => e.message).join(', ')}`
+        );
+      }
+      throw error;
+    }
+  },
+  models: {
+    [ModelType.TEXT_SMALL]: async (
+      _runtime,
+      { prompt, stopSequences = [] }: GenerateTextParams
+    ) => {
+      return 'Never gonna give you up, never gonna let you down, never gonna run around and desert you...';
+    },
+    [ModelType.TEXT_LARGE]: async (
+      _runtime,
+      {
+        prompt,
+        stopSequences = [],
+        maxTokens = 8192,
+        temperature = 0.7,
+        frequencyPenalty = 0.7,
+        presencePenalty = 0.7,
+      }: GenerateTextParams
+    ) => {
+      return 'Never gonna make you cry, never gonna say goodbye, never gonna tell a lie and hurt you...';
+    },
+  },
+  routes: [
+    {
+      name: 'hello-world-route',
+      path: '/helloworld',
+      type: 'GET',
+      handler: async (_req: any, res: any) => {
+        // send a response
+        res.json({
+          message: 'Hello World!',
+        });
+      },
+    },
+    {
+      name: 'current-time-route',
+      path: '/api/time',
+      type: 'GET',
+      handler: async (_req: any, res: any) => {
+        // Return current time in various formats
+        const now = new Date();
+        res.json({
+          timestamp: now.toISOString(),
+          unix: Math.floor(now.getTime() / 1000),
+          formatted: now.toLocaleString(),
+          timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+        });
+      },
+    },
+  ],
+  events: {
+    MESSAGE_RECEIVED: [
+      async (params) => {
+        logger.debug('MESSAGE_RECEIVED event received');
+        // print the keys
+        logger.debug(Object.keys(params));
+      },
+    ],
+    VOICE_MESSAGE_RECEIVED: [
+      async (params) => {
+        logger.debug('VOICE_MESSAGE_RECEIVED event received');
+        // print the keys
+        logger.debug(Object.keys(params));
+      },
+    ],
+    WORLD_CONNECTED: [
+      async (params) => {
+        logger.debug('WORLD_CONNECTED event received');
+        // print the keys
+        logger.debug(Object.keys(params));
+      },
+    ],
+    WORLD_JOINED: [
+      async (params) => {
+        logger.debug('WORLD_JOINED event received');
+        // print the keys
+        logger.debug(Object.keys(params));
+      },
+    ],
+  },
+  services: [StarterService],
+  actions: [helloWorldAction],
+  providers: [helloWorldProvider],
+  tests: [StarterPluginTestSuite],
+  // dependencies: ['@elizaos/plugin-knowledge'], <--- plugin dependecies go here (if requires another plugin)
+};
+
+export default starterPlugin;

package/dist/templates/plugin-starter/src/tests.ts

@@ -0,0 +1,6 @@
+/**
+ * Test exports for the starter plugin
+ * This file exports the test suite so it can be included in the plugin build
+ */
+
+export { StarterPluginTestSuite } from './__tests__/e2e/starter-plugin';

package/dist/templates/plugin-starter/tailwind.config.js

@@ -0,0 +1,62 @@
+import tailwindcssAnimate from 'tailwindcss-animate';
+
+/** @type {import('tailwindcss').Config} */
+export default {
+  darkMode: ['class'],
+  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
+  theme: {
+    extend: {
+      container: {
+        center: true,
+      },
+      borderRadius: {
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+      colors: {
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        card: {
+          DEFAULT: 'hsl(var(--card))',
+          foreground: 'hsl(var(--card-foreground))',
+        },
+        popover: {
+          DEFAULT: 'hsl(var(--popover))',
+          foreground: 'hsl(var(--popover-foreground))',
+        },
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+        muted: {
+          DEFAULT: 'hsl(var(--muted))',
+          foreground: 'hsl(var(--muted-foreground))',
+        },
+        accent: {
+          DEFAULT: 'hsl(var(--accent))',
+          foreground: 'hsl(var(--accent-foreground))',
+        },
+        destructive: {
+          DEFAULT: 'hsl(var(--destructive))',
+          foreground: 'hsl(var(--destructive-foreground))',
+        },
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+        chart: {
+          1: 'hsl(var(--chart-1))',
+          2: 'hsl(var(--chart-2))',
+          3: 'hsl(var(--chart-3))',
+          4: 'hsl(var(--chart-4))',
+          5: 'hsl(var(--chart-5))',
+        },
+      },
+    },
+  },
+  plugins: [tailwindcssAnimate],
+};

package/dist/templates/plugin-starter/tsconfig.build.json

@@ -0,0 +1,11 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./dist",
+    "sourceMap": true,
+    "inlineSources": true,
+    "declaration": true
+  },
+  "include": ["src/**/*.ts"],
+  "exclude": ["node_modules", "dist", "**/*.test.ts", "**/*.spec.ts"]
+}

package/dist/templates/plugin-starter/tsconfig.json

@@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    "outDir": "dist",
+    "lib": ["ESNext", "dom"],
+    "target": "ESNext",
+    "module": "Preserve",
+    "moduleResolution": "Bundler",
+    "strict": false,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": false,
+    "allowImportingTsExtensions": true,
+    "emitDeclarationOnly": true,
+    "declaration": true,
+    "resolveJsonModule": true,
+    "noImplicitAny": false,
+    "allowJs": true,
+    "checkJs": false,
+    "noEmitOnError": false,
+    "moduleDetection": "force",
+    "allowArbitraryExtensions": true,
+    "jsx": "react",
+    "isolatedModules": false,
+    "noEmit": true
+  },
+  "include": ["src/**/*.ts"],
+  "exclude": ["src/__tests__/**/*", "e2e/**/*", "**/*.test.ts", "**/*.spec.ts"]
+}

package/dist/templates/plugin-starter/tsup.config.ts

@@ -0,0 +1,20 @@
+import { defineConfig } from 'tsup';
+
+export default defineConfig({
+  entry: ['src/index.ts'],
+  outDir: 'dist',
+  tsconfig: './tsconfig.build.json', // Use build-specific tsconfig
+  sourcemap: true,
+  clean: true,
+  format: ['esm'], // Ensure you're targeting CommonJS
+  dts: true, // require DTS so we get d.ts in the dist folder on npm
+  external: [
+    'dotenv', // Externalize dotenv to prevent bundling
+    'fs', // Externalize fs to use Node.js built-in module
+    'path', // Externalize other built-ins if necessary
+    'https',
+    'http',
+    '@elizaos/core',
+    'zod',
+  ],
+});

package/dist/templates/plugin-starter/vite.config.ts

@@ -0,0 +1,20 @@
+import react from '@vitejs/plugin-react-swc';
+import { defineConfig } from 'vite';
+import path from 'path';
+import tailwindcss from '@tailwindcss/vite';
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [tailwindcss(), react()],
+  base: './',
+  build: {
+    emptyOutDir: false,
+    outDir: 'dist',
+    manifest: true,
+  },
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, 'src'),
+    },
+  },
+});