@glyphtek/unspecd
Version:
A declarative UI framework for building internal tools and dashboards with TypeScript. Create interactive tables, forms, and dashboards using simple specifications.
39 lines • 1.53 kB
TypeScript
/**
* Action Button Component for Unspec'd Framework
*
* This component renders an interactive button that executes developer-defined
* actions when clicked. It handles confirmation dialogs, loading states, and
* provides user feedback for action results.
*/
import type { ActionButtonContent } from '../dsl-schema.js';
/**
* Renders an action button component that executes a specified function when clicked.
* This component handles the complete user interaction flow from click to completion,
* including optional confirmation dialogs and comprehensive state management.
*
* @param content - The ActionButtonContent configuration specifying button behavior
* @param specFunctions - Record of functions available from the ToolSpec
* @param targetElement - The HTML element where the component should be rendered
*
* @example
* ```typescript
* const content: ActionButtonContent = {
* type: 'actionButton',
* description: 'Clear all cached data from the system',
* buttonConfig: {
* label: 'Clear Cache',
* needsConfirmation: true
* },
* action: {
* functionName: 'clearCache',
* onSuccess: {
* message: 'Cache cleared successfully!'
* }
* }
* };
*
* renderActionButtonComponent(content, spec.functions, containerElement);
* ```
*/
export declare function renderActionButtonComponent(content: ActionButtonContent, specFunctions: Record<string, (params: any) => Promise<any>>, targetElement: HTMLElement): void;
//# sourceMappingURL=action-button.d.ts.map