import { KbqInlineEditModule } from '@koobiq/components/inline-edit';Directive for easy using styles of inline edit placeholder publicly.
Selector: [kbqInlineEditPlaceholder]
Exported as: kbqInlineEditPlaceholderThis directive enhances element acting as dropdown trigger, visually indicating the active state with the `kbq-active` class. Also, it prevents click/keydown events from being propagated to disable mode toggling of parent component.
Selector: [kbqInlineEditMenu]
Exported as: kbqInlineEditMenuCustomizable component that enables edit-in-place logic for specified control and it's view. This component is projecting edit/view mode templates and adds keyboard/pointer handlers. Edit mode opens in a positioned overlay that matches the view mode width or can be customized.
Selector: kbq-inline-edit
Exported as: kbqInlineEdit| Name | Description |
|---|---|
@Input() canSaveOnEnter: InputSignal<(event: KeyboardEvent) => boolean>
|
Customizable function that checks if saving on enter available. |
@Input() disabled: InputSignalWithTransform |
Disables the component, preventing interaction and mode switching. Only allows menu dropdown. |
@Input() editModeWidth: InputSignalWithTransform |
Custom width in pixels for the edit mode overlay. Auto-calculated if not set. |
@Input() getValueHandler: InputSignal<() => unknown>
|
Handler function to retrieve the current value |
@Input() interactiveSelectors: InputSignal |
CSS selectors for elements in view mode that should handle clicks instead of opening edit mode. Override to replace or extend the default list. |
@Input() setValueHandler: InputSignal<(value: any) => void>
|
Handler function to update the value |
@Input() showActions: InputSignalWithTransform |
Whether to show save/cancel action buttons in edit mode. |
@Input() showTooltipOnError: InputSignalWithTransform |
Whether to automatically show validation error tooltips on save attempts. |
@Input() tooltipPlacement: InputSignal |
User-defined tooltip placement |
@Input() validationTooltip: InputSignal |
Custom validation tooltip message. |
@Output('canceled')
canceled: OutputEmitterRef |
Emitted when the inline edit is canceled and changes are discarded. |
@Output('modeChange')
modeChange: OutputEmitterRef |
Emitted when mode switched to edit/view |
@Output('saved')
saved: OutputEmitterRef |
Emitted when the inline edit is saved successfully. |
| elementRef: ElementRef |
type KbqInlineEditMode = 'view' | 'edit';