@ngstarter-ui/components 21.0.46 → 21.0.48

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ngstarter-ui/components",
   "description": "NgStarter - AI-friendly Enterprise Angular UI Components and Admin Panel",
-  "version": "21.0.46",
+  "version": "21.0.48",
   "repository": {
     "type": "git",
     "url": "https://github.com/elementarlabsdev/ngstarter.git"

package/styles/_common.scss

@@ -123,6 +123,7 @@
   --text-md: 0.825rem;
 
   /* --- RADII --- */
+  --radius-current: var(--ngs-control-radius);
   --radius-small: var(--ngs-radius-sm);
   --radius-medium: var(--ngs-radius-md);
   --radius-large: var(--ngs-radius-lg);

package/types/ngstarter-ui-components-form-builder.d.ts

@@ -1,15 +1,15 @@
 import * as _angular_forms from '@angular/forms';
-import { ValidatorFn, FormControl, FormGroup } from '@angular/forms';
+import { ValidatorFn, FormControl, FormGroup, FormArray } from '@angular/forms';
 import * as _angular_core from '@angular/core';
-import { Type, InjectionToken, EnvironmentProviders, TemplateRef } from '@angular/core';
+import { Type, InjectionToken, EnvironmentProviders, Provider, TemplateRef } from '@angular/core';
 import { TreeNodeDropPosition, Tree, TreeNodeDrop } from '@ngstarter-ui/components/tree';
 import { DateRangeInput } from '@ngstarter-ui/components/datepicker';
 import { RadioGroupOrientation } from '@ngstarter-ui/components/radio';
 import { UploadFileSelectedEvent } from '@ngstarter-ui/components/upload';
-import * as _ngstarter_ui_components_form_builder from '@ngstarter-ui/components/form-builder';
 
 type FormBuilderFieldWidth = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
 type FormBuilderItemKind = 'field' | 'layout' | 'static';
+type FormBuilderSettingsInheritance = 'field' | 'input-field' | 'layout' | 'layout-container' | 'static' | 'none';
 interface FormBuilderOption {
     label: string;
     value: any;
@@ -20,12 +20,6 @@ interface FormBuilderValidationRule {
     value?: any;
     message?: string;
 }
-interface FormBuilderVisibility {
-    form?: boolean;
-    email?: boolean;
-    pdf?: boolean;
-    condition?: string;
-}
 interface FormBuilderField {
     id: string;
     name: string;
@@ -43,7 +37,6 @@ interface FormBuilderField {
     width?: FormBuilderFieldWidth;
     options?: FormBuilderOption[];
     validation?: FormBuilderValidationRule[];
-    visibility?: FormBuilderVisibility;
     settings?: Record<string, any>;
     children?: FormBuilderField[];
 }
@@ -78,12 +71,12 @@ interface FormBuilderUploadContext {
     multiple: boolean;
 }
 type FormBuilderUploadCallback = (context: FormBuilderUploadContext) => any | Promise<any>;
+type FormBuilderComponentImporter<T = any> = () => Promise<Type<T>>;
 interface FormBuilderSettingsContext {
     field: FormBuilderField;
     schema: FormBuilderSchema;
     update: (changes: Partial<FormBuilderField>) => void;
 }
-type FormBuilderComponentImporter<T = any> = () => Promise<Type<T>>;
 interface FormBuilderFieldSettingsContext {
     item: FormBuilderField;
     field: FormBuilderField;
@@ -100,6 +93,11 @@ interface FormBuilderSectionSettingsContext {
     update: (changes: Partial<FormBuilderSection>) => void;
     updateSection: (changes: Partial<FormBuilderSection>) => void;
 }
+type FormBuilderSettingsSchemaFactory = (context: FormBuilderFieldSettingsContext | FormBuilderSectionSettingsContext) => FormBuilderSchema;
+interface FormBuilderSettingsConfig {
+    extends?: FormBuilderSettingsInheritance;
+    schema?: FormBuilderSchema | FormBuilderSettingsSchemaFactory;
+}
 interface FormBuilderItemDefinition {
     type: string;
     label: string;
@@ -109,7 +107,7 @@ interface FormBuilderItemDefinition {
     description?: string;
     defaults?: Partial<FormBuilderField>;
     renderer?: FormBuilderComponentImporter;
-    settings?: FormBuilderComponentImporter;
+    settings?: FormBuilderComponentImporter | FormBuilderSettingsConfig;
     acceptsChildren?: boolean;
 }
 interface FormBuilderFieldDefinition extends FormBuilderItemDefinition {
@@ -135,12 +133,20 @@ declare const FORM_BUILDER_UPLOAD_CALLBACK: InjectionToken<FormBuilderUploadCall
 declare function formBuilderField(definition: FormBuilderFieldDefinition): FormBuilderFieldDefinition;
 declare function formBuilderItem(definition: FormBuilderItemDefinition): FormBuilderItemDefinition;
 declare function formBuilderSettings(definition: FormBuilderSettingsDefinition): FormBuilderSettingsDefinition;
+declare function provideFormBuilderField(definition: FormBuilderFieldDefinition): Provider;
+declare function provideFormBuilderFields(definitions: FormBuilderFieldDefinition[]): Provider[];
 declare function provideFormBuilder(config?: {
     items?: FormBuilderItemDefinition[];
     fields?: FormBuilderFieldDefinition[];
     settings?: FormBuilderSettingsDefinition[];
     uploadCallback?: FormBuilderUploadCallback;
 }): EnvironmentProviders;
+declare const FORM_BUILDER_FIELD_BASE_SETTINGS_SCHEMA: FormBuilderSchema;
+declare const FORM_BUILDER_INPUT_FIELD_BASE_SETTINGS_SCHEMA: FormBuilderSchema;
+declare const FORM_BUILDER_LAYOUT_BASE_SETTINGS_SCHEMA: FormBuilderSchema;
+declare const FORM_BUILDER_LAYOUT_CONTAINER_BASE_SETTINGS_SCHEMA: FormBuilderSchema;
+declare const FORM_BUILDER_STATIC_BASE_SETTINGS_SCHEMA: FormBuilderSchema;
+declare const FORM_BUILDER_SECTION_BASE_SETTINGS_SCHEMA: FormBuilderSchema;
 declare const DEFAULT_FORM_BUILDER_FIELDS: FormBuilderFieldDefinition[];
 declare const DEFAULT_FORM_BUILDER_ITEMS: FormBuilderItemDefinition[];
 declare function validatorsFromRules(rules?: FormBuilderValidationRule[], field?: FormBuilderField): _angular_forms.ValidatorFn[];
@@ -330,13 +336,23 @@ declare class FormBuilderRenderer {
     protected readonly visibleCanvasItems: _angular_core.Signal<FormBuilderRendererCanvasItem[]>;
     protected readonly formGroup: _angular_core.Signal<FormGroup<any>>;
     constructor();
-    protected getControl(field: FormBuilderField): FormControl;
+    protected getControl(field: FormBuilderField, formGroup?: FormGroup<any>): FormControl;
     protected isContainerField(field: FormBuilderField): boolean;
     protected visibleChildren(field: FormBuilderField): FormBuilderField[];
+    protected isRepeaterField(field: FormBuilderField): boolean;
+    protected repeaterArray(field: FormBuilderField, formGroup?: FormGroup<any>): FormArray<FormGroup>;
+    protected repeaterGroups(field: FormBuilderField, formGroup?: FormGroup<any>): FormGroup[];
+    protected repeaterEmptyText(field: FormBuilderField): string;
+    protected addRepeaterItem(field: FormBuilderField, formGroup?: FormGroup<any>): void;
+    protected removeRepeaterItem(field: FormBuilderField, index: number, formGroup?: FormGroup<any>): void;
+    protected canRemoveRepeaterItem(field: FormBuilderField, formGroup?: FormGroup<any>): boolean;
     protected submit(): void;
     private createFormGroup;
-    private visibleFields;
+    private addFieldsToControls;
+    private createRepeaterArray;
+    private createRepeaterGroup;
     private fieldInitialValue;
+    private allowsNullValue;
     private resolveCanvasItems;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormBuilderRenderer, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormBuilderRenderer, "ngs-form-renderer", ["ngsFormRenderer"], { "schema": { "alias": "schema"; "required": true; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "showSubmit": { "alias": "showSubmit"; "required": false; "isSignal": true; }; "submitLabel": { "alias": "submitLabel"; "required": false; "isSignal": true; }; "uploadCallback": { "alias": "uploadCallback"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "formSubmit": "formSubmit"; "formReady": "formReady"; }, never, never, true, never>;
@@ -379,12 +395,19 @@ declare class FormBuilderSettingsHost {
     readonly update: _angular_core.InputSignal<((changes: Partial<FormBuilderField>) => void) | undefined>;
     readonly updateSection: _angular_core.InputSignal<((changes: Partial<FormBuilderSection>) => void) | undefined>;
     protected readonly itemDefinition: _angular_core.Signal<FormBuilderFieldDefinition | undefined>;
-    protected readonly fieldDefinition: _angular_core.Signal<FormBuilderFieldDefinition | undefined>;
-    protected readonly fieldKind: _angular_core.Signal<_ngstarter_ui_components_form_builder.FormBuilderItemKind>;
-    protected readonly isLayoutField: _angular_core.Signal<boolean>;
-    protected readonly customLoaded: _angular_core.WritableSignal<boolean>;
+    protected readonly settingsSchema: _angular_core.Signal<FormBuilderSchema | null>;
+    protected readonly settingsValue: _angular_core.Signal<Record<string, any>>;
+    protected readonly legacyLoaded: _angular_core.WritableSignal<boolean>;
     private readonly anchor;
     constructor();
+    protected applySettingsValue(value: Record<string, any>): void;
+    private createSettingsPatch;
+    private readSettingValue;
+    private settingsConfig;
+    private legacySettingsImporter;
+    private resolveOwnSettingsSchema;
+    private inferSettingsInheritance;
+    private baseSettingsSchema;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<FormBuilderSettingsHost, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<FormBuilderSettingsHost, "ngs-form-builder-settings-host", ["ngsFormBuilderSettingsHost"], { "field": { "alias": "field"; "required": false; "isSignal": true; }; "section": { "alias": "section"; "required": false; "isSignal": true; }; "schema": { "alias": "schema"; "required": true; "isSignal": true; }; "definitions": { "alias": "definitions"; "required": false; "isSignal": true; }; "settingsDefinitions": { "alias": "settingsDefinitions"; "required": false; "isSignal": true; }; "update": { "alias": "update"; "required": false; "isSignal": true; }; "updateSection": { "alias": "updateSection"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }
@@ -444,5 +467,5 @@ declare class BasicFormBuilderSectionSettings {
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<BasicFormBuilderSectionSettings, "ngs-basic-form-builder-section-settings", ["ngsBasicFormBuilderSectionSettings"], { "section": { "alias": "section"; "required": true; "isSignal": true; }; "update": { "alias": "update"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
 }
 
-export { BasicFormBuilderFieldSettings, BasicFormBuilderLayoutSettings, BasicFormBuilderSectionSettings, DEFAULT_FORM_BUILDER_FIELDS, DEFAULT_FORM_BUILDER_ITEMS, FORM_BUILDER_FIELDS, FORM_BUILDER_ITEMS, FORM_BUILDER_SETTINGS, FORM_BUILDER_UPLOAD_CALLBACK, FormBuilder, FormBuilderFieldHost, FormBuilderRenderer, FormBuilderSettingsHost, createDefaultFormBuilderSchema, formBuilderField, formBuilderItem, formBuilderSettings, provideFormBuilder, validatorsFromRules };
-export type { FormBuilderComponentImporter, FormBuilderField, FormBuilderFieldChange, FormBuilderFieldDefinition, FormBuilderFieldRenderContext, FormBuilderFieldSettingsContext, FormBuilderFieldWidth, FormBuilderItemDefinition, FormBuilderItemKind, FormBuilderLayoutItem, FormBuilderOption, FormBuilderSchema, FormBuilderSection, FormBuilderSectionSettingsContext, FormBuilderSettingsContext, FormBuilderSettingsDefinition, FormBuilderUploadCallback, FormBuilderUploadContext, FormBuilderValidationRule, FormBuilderVisibility };
+export { BasicFormBuilderFieldSettings, BasicFormBuilderLayoutSettings, BasicFormBuilderSectionSettings, DEFAULT_FORM_BUILDER_FIELDS, DEFAULT_FORM_BUILDER_ITEMS, FORM_BUILDER_FIELDS, FORM_BUILDER_FIELD_BASE_SETTINGS_SCHEMA, FORM_BUILDER_INPUT_FIELD_BASE_SETTINGS_SCHEMA, FORM_BUILDER_ITEMS, FORM_BUILDER_LAYOUT_BASE_SETTINGS_SCHEMA, FORM_BUILDER_LAYOUT_CONTAINER_BASE_SETTINGS_SCHEMA, FORM_BUILDER_SECTION_BASE_SETTINGS_SCHEMA, FORM_BUILDER_SETTINGS, FORM_BUILDER_STATIC_BASE_SETTINGS_SCHEMA, FORM_BUILDER_UPLOAD_CALLBACK, FormBuilder, FormBuilderFieldHost, FormBuilderRenderer, FormBuilderSettingsHost, createDefaultFormBuilderSchema, formBuilderField, formBuilderItem, formBuilderSettings, provideFormBuilder, provideFormBuilderField, provideFormBuilderFields, validatorsFromRules };
+export type { FormBuilderComponentImporter, FormBuilderField, FormBuilderFieldChange, FormBuilderFieldDefinition, FormBuilderFieldRenderContext, FormBuilderFieldSettingsContext, FormBuilderFieldWidth, FormBuilderItemDefinition, FormBuilderItemKind, FormBuilderLayoutItem, FormBuilderOption, FormBuilderSchema, FormBuilderSection, FormBuilderSectionSettingsContext, FormBuilderSettingsConfig, FormBuilderSettingsContext, FormBuilderSettingsDefinition, FormBuilderSettingsInheritance, FormBuilderSettingsSchemaFactory, FormBuilderUploadCallback, FormBuilderUploadContext, FormBuilderValidationRule };