import type { Context } from "../context.js"; import { Resource } from "../resource.js"; import type { Secret } from "../secret.js"; import { type ModelConfig } from "./client.js"; /** * Properties for creating or updating a VueFile */ export interface VueFileProps { /** * Path to the Vue file */ path: string; /** * Base URL for the OpenAI API * @default 'https://api.openai.com/v1' */ baseURL?: string; /** * Prompt for generating content * Use alchemy template literals to include file context: * @example * prompt: await alchemy` * Generate a Vue component using: * ${alchemy.file("src/api.ts")} * ` */ prompt: string; /** * System prompt for the model * This is used to provide instructions to the model about how to format the response * The default system prompt instructs the model to return a single Vue component inside ```vue fences * @default "You are a Vue component generator. Create a single Vue component based on the user's requirements. Your response MUST include only a single Vue component inside ```vue fences. Do not include any other text, explanations, or multiple code blocks." */ system?: string; /** * OpenAI API key to use for generating content * If not provided, will use OPENAI_API_KEY environment variable */ apiKey?: Secret; /** * Model configuration */ model?: ModelConfig; /** * Temperature for controlling randomness in generation. * Higher values (e.g., 0.8) make output more random, * lower values (e.g., 0.2) make it more deterministic. * @default 0.7 */ temperature?: number; } /** * A Vue file that can be created, updated, and deleted */ export interface VueFile extends VueFileProps, Resource<"ai::VueFile"> { /** * Content of the Vue file */ content: string; /** * Time at which the file was created */ createdAt: number; /** * Time at which the file was last updated */ updatedAt: number; } /** * Resource for generating Vue files using AI models. * Extracts Vue code from between ```vue fences and validates the response. * * @example * // Create a simple Vue component * const button = await VueFile("button-component", { * path: "./src/components/Button.vue", * prompt: await alchemy` * Generate a customizable button Vue component with: * - Primary, secondary, and outline variants * - Small, medium, and large sizes * - Loading state with spinner * - Disabled state * `, * model: { * id: "gpt-4o", * provider: "openai" * } * }); * * @example * // Generate a Vue component using existing files as reference * const userCard = await VueFile("user-card", { * path: "./src/components/UserCard.vue", * prompt: await alchemy` * Create a UserCard Vue component that displays user information. * Follow the styling patterns from: * ${alchemy.file("src/components/Card.vue")} * * Use the user type from: * ${alchemy.file("src/types/User.ts")} * `, * temperature: 0.2 * }); * * @example * // Generate a complex form component with validation and custom system prompt * const form = await VueFile("registration-form", { * path: "./src/components/RegistrationForm.vue", * prompt: await alchemy` * Generate a registration form Vue component with: * - Email, password, and confirm password fields * - Form validation using Vuelidate or similar * - Error messages for each field * - Submit handler that emits form data * * Follow these style guidelines: * ${alchemy.file("src/styles/guidelines.md")} * `, * system: "You are an expert Vue component creator specializing in form components with validation. Create a single Vue component inside ```vue fences with no additional text.", * model: { * id: "claude-3-opus-20240229", * provider: "anthropic" * } * }); */ export declare const VueFile: (((this: any, id: string, props?: {}) => never) & (new (_: never) => never)) | ((this: Context, id: string, props: VueFileProps) => Promise); //# sourceMappingURL=vue-file.d.ts.map