@glyphtek/unspecd
Version:
A declarative UI framework for building internal tools and dashboards with TypeScript. Create interactive tables, forms, and dashboards using simple specifications.
36 lines • 1.56 kB
TypeScript
/**
* Smart Form Component for Unspec'd Framework
*
* This component renders dynamic forms based on EditFormContent configuration.
* It handles various input types, validation, and styling while providing a
* clean, accessible user interface for data entry and editing.
*/
import type { EditFormContent } from '../dsl-schema.js';
/**
* Renders a smart form component based on the provided configuration.
* This initial version handles static form rendering with various input types
* and proper styling. Data loading and submission will be added in future versions.
*
* @param content - The EditFormContent configuration specifying form structure and behavior
* @param specFunctions - Record of functions available from the ToolSpec
* @param targetElement - The HTML element where the form should be rendered
*
* @example
* ```typescript
* const content: EditFormContent = {
* type: 'editForm',
* formConfig: {
* fields: [
* { field: 'name', label: 'Full Name', editorType: 'text', required: true },
* { field: 'email', label: 'Email Address', editorType: 'email', required: true },
* { field: 'age', label: 'Age', editorType: 'number' }
* ]
* },
* onSubmit: { functionName: 'saveUserData' }
* };
*
* renderSmartFormComponent(content, spec.functions, containerElement);
* ```
*/
export declare function renderSmartFormComponent(content: EditFormContent, specFunctions: Record<string, (params: any) => Promise<any>>, targetElement: HTMLElement): Promise<void>;
//# sourceMappingURL=smart-form.d.ts.map