@ngx-uk-frontend/core
Version:
Core utilities and shared functionality for ngx-uk-frontend libraries
44 lines • 2.58 kB
JavaScript
import { afterNextRender, contentChildren, Directive, ElementRef, inject, input, } from '@angular/core';
import { ErrorSummaryItemDirective } from './error-summary-item.directive';
import * as i0 from "@angular/core";
/**
* Base directive for error summary components
*
* This directive provides common functionality for error summary components
* across different design systems. It handles:
* - Auto-focus on render
* - Title property with default value
* - Content children query for error items
*
* Components should extend this directive and provide their own templates
* with design system-specific CSS classes.
*/
export class ErrorSummaryDirective {
elementRef = inject(ElementRef);
/**
* Query for all error summary item directives using signal-based query
* This allows the component to iterate through the child error items
*/
errorItems = contentChildren(ErrorSummaryItemDirective, ...(ngDevMode ? [{ debugName: "errorItems" }] : []));
/**
* Text to use for the heading of the error summary block
*/
title = input('There is a problem', ...(ngDevMode ? [{ debugName: "title" }] : []));
constructor() {
// Focus on the error summary when it's rendered
afterNextRender(() => {
const element = this.elementRef.nativeElement;
element.focus();
});
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ErrorSummaryDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.0.6", type: ErrorSummaryDirective, isStandalone: true, selector: "[libErrorSummary]", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "errorItems", predicate: ErrorSummaryItemDirective, isSignal: true }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ErrorSummaryDirective, decorators: [{
type: Directive,
args: [{
selector: '[libErrorSummary]',
standalone: true,
}]
}], ctorParameters: () => [], propDecorators: { errorItems: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => ErrorSummaryItemDirective), { isSignal: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }] } });
//# sourceMappingURL=error-summary.directive.js.map