@gnggln/ng-ui-system 1.0.0-alpha.0

package/lib/components/form-builder-editor/sub-components/validation-editor/validation-editor.component.d.ts

@@ -0,0 +1,112 @@
+import { EventEmitter } from '@angular/core';
+import { UiValidationRule, UiValidationType, UiCrossFieldOperator } from '../../../form-builder/types/index';
+import * as i0 from "@angular/core";
+/**
+ * Interfaccia per le opzioni dei tipi di validazione nella select.
+ */
+interface ValidationTypeOption {
+    /** Valore del tipo di validazione. */
+    value: UiValidationType;
+    /** Etichetta visualizzata nella select. */
+    label: string;
+}
+/**
+ * Interfaccia per le opzioni degli operatori cross-field nella select.
+ */
+interface CrossFieldOperatorOption {
+    /** Valore dell'operatore. */
+    value: UiCrossFieldOperator;
+    /** Etichetta visualizzata nella select. */
+    label: string;
+}
+/**
+ * Editor per le regole di validazione dei campi.
+ *
+ * Permette di aggiungere, modificare e rimuovere regole di validazione
+ * per un campo del form builder. Supporta validazioni standard,
+ * cross-field, date e file.
+ *
+ * @selector ui-validation-editor
+ */
+export declare class UiValidationEditorComponent {
+    /** Lista delle regole di validazione da editare. */
+    validations: UiValidationRule[];
+    /** Emesso quando la lista di regole viene modificata. */
+    validationsChange: EventEmitter<UiValidationRule[]>;
+    /** Opzioni disponibili per il tipo di validazione. */
+    readonly validationTypes: ValidationTypeOption[];
+    /** Opzioni per gli operatori di confronto cross-field. */
+    readonly crossFieldOperators: CrossFieldOperatorOption[];
+    /**
+     * Verifica se il tipo di validazione richiede un campo valore.
+     * @param type - Tipo di validazione da verificare
+     * @returns true se il tipo richiede un valore
+     */
+    requiresValue(type: UiValidationType): boolean;
+    /**
+     * Restituisce il placeholder appropriato per il campo valore
+     * in base al tipo di validazione selezionato.
+     * @param type - Tipo di validazione
+     * @returns Stringa placeholder
+     */
+    getValuePlaceholder(type: UiValidationType): string;
+    /**
+     * Aggiunge una nuova regola di validazione con valori predefiniti.
+     */
+    addValidation(): void;
+    /**
+     * Rimuove la regola di validazione all'indice specificato.
+     * @param index - Indice della regola da rimuovere
+     */
+    removeValidation(index: number): void;
+    /**
+     * Gestisce il cambio del tipo di validazione.
+     * Se il tipo diventa 'crossField', inizializza la configurazione cross-field.
+     * @param index - Indice della regola
+     * @param type - Nuovo tipo di validazione
+     */
+    onTypeChange(index: number, type: UiValidationType): void;
+    /**
+     * Gestisce il cambio del valore della regola.
+     * @param index - Indice della regola
+     * @param value - Nuovo valore
+     */
+    onValueChange(index: number, value: any): void;
+    /**
+     * Gestisce il cambio del messaggio di errore.
+     * @param index - Indice della regola
+     * @param message - Nuovo messaggio
+     */
+    onMessageChange(index: number, message: string): void;
+    /**
+     * Gestisce il cambio del campo target nella configurazione cross-field.
+     * @param index - Indice della regola
+     * @param targetField - Nuova chiave del campo target
+     */
+    onCrossFieldTargetChange(index: number, targetField: string): void;
+    /**
+     * Gestisce il cambio dell'operatore nella configurazione cross-field.
+     * @param index - Indice della regola
+     * @param operator - Nuovo operatore
+     */
+    onCrossFieldOperatorChange(index: number, operator: UiCrossFieldOperator): void;
+    /**
+     * Gestisce il cambio del tipo di dato nella configurazione cross-field.
+     * @param index - Indice della regola
+     * @param dataType - Nuovo tipo di dato ('date' | 'number')
+     */
+    onCrossFieldDataTypeChange(index: number, dataType: 'date' | 'number'): void;
+    /**
+     * Clona l'array delle validazioni per garantire immutabilita.
+     * @returns Copia superficiale dell'array di validazioni
+     */
+    private cloneValidations;
+    /**
+     * Emette l'evento di cambio validazioni.
+     * @param validations - Nuova lista di validazioni
+     */
+    private emitChange;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UiValidationEditorComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UiValidationEditorComponent, "ui-validation-editor", never, { "validations": { "alias": "validations"; "required": false; }; }, { "validationsChange": "validationsChange"; }, never, never, true, never>;
+}
+export {};

package/lib/components/form-builder-editor/types/editor.types.d.ts

@@ -0,0 +1,124 @@
+/**
+ * @module ng-ui-system/form-builder-editor
+ * Tipi e interfacce per l'editor visuale del form builder.
+ */
+import { UiFieldType, UiFormSchema } from '../../form-builder/types/index';
+import { UiIconName } from '../../../core/types';
+/**
+ * Stato corrente dell'editor.
+ * Gestito dal servizio UiEditorStateService tramite BehaviorSubject.
+ */
+export interface UiEditorState {
+    /** Schema del form in fase di editing. */
+    schema: UiFormSchema;
+    /** ID della sezione attualmente selezionata. */
+    selectedSectionId: string | null;
+    /** Chiave del campo attualmente selezionato. */
+    selectedFieldKey: string | null;
+    /** Indica se lo schema e stato modificato dall'ultimo salvataggio. */
+    isDirty: boolean;
+    /** Data dell'ultimo salvataggio. */
+    lastSaved: Date | null;
+}
+/**
+ * Categorie per raggruppare i tipi di campo nella palette.
+ */
+export type UiEditorFieldCategory = 'basic' | 'choice' | 'datetime' | 'advanced' | 'custom';
+/**
+ * Elemento della palette dei tipi di campo.
+ * Rappresenta un tipo di campo trascinabile nella palette laterale.
+ */
+export interface UiEditorFieldPaletteItem {
+    /** Tipo di campo. */
+    type: UiFieldType;
+    /** Nome visualizzato nella palette. */
+    label: string;
+    /** Icona Lucide da mostrare. */
+    icon: UiIconName;
+    /** Descrizione breve del tipo di campo. */
+    description: string;
+    /** Categoria di appartenenza. */
+    category: UiEditorFieldCategory;
+}
+/**
+ * Campo disponibile per la selezione nelle condizioni.
+ * Versione semplificata del field descriptor per le select.
+ */
+export interface UiEditorAvailableField {
+    /** Chiave univoca del campo. */
+    key: string;
+    /** Label visualizzata. */
+    label: string;
+    /** Tipo di campo. */
+    type: string;
+    /** Opzioni (per campi select, radio, etc.). */
+    options?: {
+        value: any;
+        label: string;
+    }[];
+}
+/**
+ * Elemento del breadcrumb di navigazione dell'editor.
+ */
+export interface UiEditorBreadcrumbItem {
+    /** Label visualizzata. */
+    label: string;
+    /** ID dell'elemento (form, sezione o campo). */
+    id: string;
+    /** Tipo di elemento. */
+    type: 'form' | 'section' | 'field';
+    /** Se e l'elemento attualmente attivo. */
+    active: boolean;
+}
+/**
+ * Struttura dati per il salvataggio nel localStorage.
+ */
+export interface UiEditorStorageData {
+    /** Schema salvato. */
+    schema: UiFormSchema;
+    /** Timestamp del salvataggio (epoch ms). */
+    timestamp: number;
+    /** Versione dello storage per compatibilita futura. */
+    version: string;
+}
+/**
+ * Risultato della validazione dello schema nell'editor.
+ */
+export interface UiEditorSchemaValidationResult {
+    /** Se lo schema e valido. */
+    valid: boolean;
+    /** Errori di validazione. */
+    errors: UiEditorSchemaValidationError[];
+    /** Warning di validazione. */
+    warnings: UiEditorSchemaValidationWarning[];
+}
+/**
+ * Errore di validazione dello schema.
+ */
+export interface UiEditorSchemaValidationError {
+    /** Tipo di errore. */
+    type: 'duplicate_key' | 'invalid_type' | 'missing_required' | 'invalid_reference' | 'invalid_format';
+    /** Messaggio di errore. */
+    message: string;
+    /** Path dell'elemento con errore (es. `sections[0].fields[2].key`). */
+    path: string;
+}
+/**
+ * Warning di validazione dello schema.
+ */
+export interface UiEditorSchemaValidationWarning {
+    /** Tipo di warning. */
+    type: 'missing_label' | 'empty_options' | 'unused_field' | 'circular_condition';
+    /** Messaggio di warning. */
+    message: string;
+    /** Path dell'elemento con warning. */
+    path: string;
+}
+/**
+ * Dati passati alla modale dell'editor.
+ * Iniettabili tramite MAT_DIALOG_DATA.
+ */
+export interface UiEditorDialogData {
+    /** Schema iniziale da caricare nell'editor. */
+    initialSchema?: UiFormSchema;
+}

package/lib/components/layout-builder/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * ng-ui-system — Layout Builder entry point.
+ *
+ * @example
+ * ```typescript
+ * import {
+ *   UiLayoutBuilderComponent,
+ *   UiLayoutService,
+ *   UiLayoutSchema,
+ *   UiNavItem,
+ * } from 'ng-ui-system';
+ * ```
+ */
+export { UiLayoutBuilderComponent } from './layout-builder.component';
+export { UiLayoutService } from './layout.service';
+export { UiLayoutMode, UiContentType, UiLayoutBreadcrumb, UiLayoutSchema, UiNavItem, UiNavItemType, UiNavGroup, UiNavSection, UiNavAutoDiscoveryConfig, UiLayoutNavigationConfig, UiLayoutLogo, UiLayoutHeaderConfig, UiFooterLink, UiLayoutFooterConfig, UiFabAction, UiLayoutFabConfig, UiLayoutPageHeaderConfig, UiLayoutLoaderConfig, UiBarType, UiBarConfig, UiTopbarConfig, UiNotificationBarConfig, UiBrandBarConfig, UiUserDropdownConfig, UiDropdownItem, UiNavigationBarConfig, UiLinksBarConfig, UiBarLinkItem, } from './layout-builder.types';

package/lib/components/layout-builder/layout-builder.component.d.ts

@@ -0,0 +1,85 @@
+/**
+ * Schema-driven application shell that materializes a full responsive layout
+ * from a single `UiLayoutSchema` descriptor.
+ *
+ * Features:
+ * - Two layout modes: sidebar (collapsible) and topbar (multi-bar stack)
+ * - Programmatic mode switching with loader masking
+ * - Content type: fluid, boxed, fullscreen
+ * - Speed-dial FAB with context-sensitive actions
+ * - Overlay loader with body-scroll locking
+ * - Auto-derived breadcrumbs from navigation schema
+ * - Skip-to-content link and full keyboard navigation
+ *
+ * @selector ui-layout-builder
+ *
+ * @example
+ * ```html
+ * <ui-layout-builder [schema]="layoutSchema" />
+ * ```
+ */
+import { OnInit, OnDestroy } from '@angular/core';
+import { UiLayoutService } from './layout.service';
+import { UiLayoutSchema, UiLayoutMode, UiContentType, UiLayoutBreadcrumb, UiNavItem, UiNavSection, UiLayoutFabConfig, UiFabAction, UiBarConfig } from './layout-builder.types';
+import * as i0 from "@angular/core";
+export declare class UiLayoutBuilderComponent implements OnInit, OnDestroy {
+    /** Full layout descriptor. */
+    schema: UiLayoutSchema;
+    readonly layoutService: UiLayoutService;
+    private readonly router;
+    private readonly cdr;
+    private subs;
+    currentUrl: string;
+    expandedIds: Set<string>;
+    fabOpen: boolean;
+    currentFabConfig: UiLayoutFabConfig | null;
+    loading: boolean;
+    sidebarOpen: boolean;
+    sidebarCollapsed: boolean;
+    layoutMode: UiLayoutMode;
+    contentType: UiContentType;
+    contentTransitioning: boolean;
+    breadcrumbs: UiLayoutBreadcrumb[];
+    userDropdownOpen: boolean;
+    hnavDropdownId: string | null;
+    private navBadges;
+    private navVisibility;
+    private barVisibility;
+    /** Resolved page title from the last breadcrumb. */
+    get pageTitle(): string;
+    /** Items flagged for the mobile bottom navigation bar (max 5). */
+    get bottomNavItems(): UiNavItem[];
+    get mobileMode(): string;
+    /** Topbar bars filtered by visibility (schema default + service overrides). */
+    get visibleBars(): UiBarConfig[];
+    ngOnInit(): void;
+    ngOnDestroy(): void;
+    onEscape(): void;
+    onDocumentClick(event: MouseEvent): void;
+    getItemsForSection(section: UiNavSection): UiNavItem[];
+    isItemHidden(item: UiNavItem): boolean;
+    getItemBadge(item: UiNavItem): string | number | null;
+    isParentActive(item: UiNavItem): boolean;
+    isRouteActive(item: UiNavItem): boolean;
+    toggleExpand(item: UiNavItem): void;
+    onNavClick(): void;
+    onFabMainClick(): void;
+    onFabAction(action: UiFabAction): void;
+    getTopbarNavItems(bar: UiBarConfig): UiNavItem[];
+    toggleHnavDropdown(itemId: string): void;
+    dismissBar(barId: string): void;
+    onDropdownAction(item: {
+        action?: () => void;
+    }): void;
+    /**
+     * Derives breadcrumbs by matching the current URL against the
+     * navigation schema. Walks top-level items, sections, and children
+     * to build a trail from root to current page.
+     */
+    private computeBreadcrumbs;
+    private urlMatches;
+    private findSectionLabel;
+    private autoExpandFromUrl;
+    static ɵfac: i0.ɵɵFactoryDeclaration<UiLayoutBuilderComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<UiLayoutBuilderComponent, "ui-layout-builder", never, { "schema": { "alias": "schema"; "required": true; }; }, {}, never, never, true, never>;
+}