circuit-bricks
Version:
A modular, Lego-style SVG circuit component system for React (ALPHA - Not for production use)
49 lines • 1.98 kB
TypeScript
/**
* HeadlessCircuitToolbar Component
*
* A headless (unstyled) toolbar for circuit operations like delete, copy, etc.
* This component provides all the functionality without any styling, allowing users
* to apply their own styling using their preferred method.
*/
import React from 'react';
export type ToolbarAction = 'delete' | 'copy' | 'paste' | 'undo' | 'redo' | 'zoom-in' | 'zoom-out' | 'zoom-fit' | 'grid-toggle' | 'rotate-cw' | 'rotate-ccw' | 'validate';
export interface HeadlessCircuitToolbarProps {
/** Callback when a toolbar action is triggered */
onAction: (action: ToolbarAction) => void;
/** Whether there is a selection (affects button states) */
hasSelection?: boolean;
/** Whether undo is available */
canUndo?: boolean;
/** Whether redo is available */
canRedo?: boolean;
/** Whether the grid is currently shown */
showGrid?: boolean;
/** Number of validation issues */
validationIssues?: number;
/** Additional class name for the root element */
className?: string;
/** Additional class names for sub-components */
classNames?: {
/** Class for the toolbar container */
toolbar?: string;
/** Class for each toolbar group */
group?: string;
/** Class for each toolbar button */
button?: string;
/** Class for disabled buttons */
disabledButton?: string;
/** Class for the validation button */
validationButton?: string;
/** Class for the validation button with issues */
validationButtonWithIssues?: string;
};
/** Additional inline styles for the root element */
style?: React.CSSProperties;
/** Additional inline styles for sub-components */
styles?: {
[key: string]: React.CSSProperties;
};
}
declare const HeadlessCircuitToolbar: React.FC<HeadlessCircuitToolbarProps>;
export default HeadlessCircuitToolbar;
//# sourceMappingURL=HeadlessCircuitToolbar.d.ts.map