special-forms 1.0.0

package/projects/special-forms/src/lib/core/controls/theme.control.ts

@@ -0,0 +1 @@
+export const THEMES_CONTROL = { control: 'radio', options: ['light-theme', 'dark-theme'] };

package/projects/special-forms/src/lib/core/controls/types.control.ts

@@ -0,0 +1,9 @@
+import { EControlTypes } from '../aux-data/control-types.enum';
+import { EnumToArray } from '../utils/enum-to-array.util';
+
+export const TYPES_CONTROL = {
+  options: EnumToArray(EControlTypes),
+  control: {
+    type: 'select',
+  },
+};

package/projects/special-forms/src/lib/core/directives/control-render.directive.ts

@@ -0,0 +1,19 @@
+import { Directive, Input, ViewContainerRef } from '@angular/core';
+import { SpecialFormControl } from '../forms/special-forms';
+
+@Directive({
+  selector: `[controlRender]`,
+})
+export class FormControlsRenderDirective {
+  @Input('components') componentsBuffer: { [key: string]: any } = {};
+  @Input('control') set controlSetter(control: SpecialFormControl<any>) {
+    this.viewContainer.clear();
+    const component = this.componentsBuffer[control.type];
+    if (component) {
+      const componentRef = this.viewContainer.createComponent(component);
+      (componentRef.instance as any).control = control;
+    }
+  }
+
+  constructor(private viewContainer: ViewContainerRef) {}
+}

package/projects/special-forms/src/lib/core/directives/control-render.module.ts

@@ -0,0 +1,10 @@
+import { CommonModule } from '@angular/common';
+import { NgModule } from '@angular/core';
+import { FormControlsRenderDirective } from './control-render.directive';
+
+@NgModule({
+  declarations: [FormControlsRenderDirective],
+  imports: [CommonModule],
+  exports: [FormControlsRenderDirective],
+})
+export class ControlsRenderDirectiveModule {}

package/projects/special-forms/src/lib/core/forms/special-forms.ts

@@ -0,0 +1,395 @@
+import {
+  AbstractControl,
+  FormArray,
+  FormControl,
+  FormGroup,
+} from '@angular/forms';
+import { EControlTypes } from '../aux-data/control-types.enum';
+import { IFieldBasicData } from '../interfaces/field-basics.interfaces';
+import {
+  IArraySettings,
+  IFormSettings,
+  TSpecialFields,
+  TSpecialForm,
+  TSpecialArray,
+} from '../interfaces/form.interfaces';
+export class SpecialFormControl<T>
+  extends FormControl
+  implements IFieldBasicData
+{
+  public name: string;
+  public placeholder: string;
+  public label: string;
+  public tooltip: string;
+  public icon: string;
+  public elementId: string;
+  public styleClasses: string;
+  public length: number;
+  public required: boolean;
+  public hidden: boolean;
+  public readOnly: boolean;
+  public settings: T;
+  public type: EControlTypes;
+  public errorMessages: { [key: string]: string };
+
+  constructor({
+    name,
+    settings,
+    type,
+    validators,
+    asyncValidators,
+    elementId,
+    styleClasses,
+    defaultValue,
+    hidden,
+    icon,
+    label,
+    length,
+    placeholder,
+    readOnly,
+    required,
+    tooltip,
+    errorMessages,
+    disabled,
+  }: TSpecialFields) {
+    super(defaultValue, validators, asyncValidators);
+
+    this.name = name;
+    this.placeholder = placeholder;
+    this.label = label;
+    this.tooltip = tooltip;
+    this.icon = icon;
+    this.elementId = elementId;
+    this.settings = settings as T;
+    this.type = type;
+    this.styleClasses = styleClasses;
+    this.hidden = hidden;
+    this.length = length;
+    this.readOnly = readOnly;
+    this.required = required;
+    this.errorMessages = errorMessages;
+    disabled ? this.disable() : this.enable();
+  }
+
+  setReadOnly(status: boolean = true) {
+    this.readOnly = status;
+  }
+
+  setDisabled(status: boolean = true) {
+    status ? this.disable() : this.enable();
+  }
+
+  setHidden(status = true) {
+    this.hidden = status;
+  }
+}
+export class SpecialFormGroup extends FormGroup implements IFieldBasicData {
+  public name: string;
+  public placeholder: string;
+  public label: string;
+  public tooltip: string;
+  public icon: string;
+  public elementId: string;
+  public styleClasses: string;
+  public length: number;
+  public required: boolean;
+  public hidden: boolean;
+  public readOnly: boolean;
+  public settings: IFormSettings;
+  public type: EControlTypes.form;
+  public defaultValue: any;
+  public errorMessages: { [key: string]: string };
+
+  constructor(
+    {
+      name,
+      settings,
+      type,
+      validators,
+      asyncValidators,
+      elementId,
+      styleClasses,
+      defaultValue,
+      hidden,
+      icon,
+      label,
+      length,
+      placeholder,
+      readOnly,
+      required,
+      tooltip,
+      disabled,
+    }: TSpecialForm,
+    controls: {
+      [key: string]: SpecialFormControl<any>;
+    },
+  ) {
+    super(controls, validators, asyncValidators);
+
+    this.name = name;
+    this.placeholder = placeholder;
+    this.label = label;
+    this.tooltip = tooltip;
+    this.icon = icon;
+    this.elementId = elementId;
+    this.settings = settings;
+    this.type = type;
+    this.styleClasses = styleClasses;
+    this.hidden = hidden;
+    this.length = length;
+    this.readOnly = readOnly;
+    this.required = required;
+    this.defaultValue = defaultValue;
+    disabled ? this.disable() : this.enable();
+  }
+
+  unpristineRequired() {
+    Object.values(this.controls).forEach((control) => {
+      if (control instanceof SpecialFormControl) {
+        control.markAsDirty();
+      } else if (control instanceof SpecialFormGroup) {
+        control.unpristineRequired();
+      } else if (control instanceof SpecialFormArray) {
+        control.unpristineRequired();
+      }
+    });
+  }
+
+  specialReset(value = {}) {
+    const aux: any = {};
+    Object.entries(this.controls).map(([key, control]) => {
+      if (control instanceof SpecialFormControl) {
+        aux[key] = control.defaultValue;
+      } else if (control instanceof SpecialFormArray) {
+        control.clear();
+      }
+    });
+
+    this.reset({ ...aux, ...value });
+  }
+  setReadOnly(status: boolean = true) {
+    Object.values(this.controls).map((value) => {
+      if (
+        value instanceof SpecialFormControl ||
+        value instanceof SpecialFormArray ||
+        value instanceof SpecialFormGroup
+      ) {
+        value.setReadOnly(status);
+      }
+    });
+  }
+  setReadOnlyByFields(fieldsObject: { [key: string]: boolean }) {
+    Object.entries(fieldsObject).map(([key, value]) => {
+      const control = this.controls[key];
+      if (control instanceof SpecialFormControl) {
+        control.readOnly = value;
+      }
+    });
+  }
+
+  setHiddenByFields(fields: { [key: string]: boolean }) {
+    Object.entries(fields).map(([key, value]) => {
+      const control = this.controls[key];
+      if (control instanceof SpecialFormControl) {
+        control.hidden = value;
+      }
+    });
+  }
+  setDisabled(status: boolean) {
+    Object.values(this.controls).map((value) => {
+      if (
+        value instanceof SpecialFormControl ||
+        value instanceof SpecialFormArray ||
+        value instanceof SpecialFormGroup
+      ) {
+        value.setDisabled(status);
+      }
+    });
+  }
+
+  setDisabledByFields(fieldsObject: any) {
+    Object.entries(fieldsObject).map((entries) => {
+      if (this.controls[entries[0]] instanceof SpecialFormControl) {
+        entries[1]
+          ? this.controls[entries[0]].enable()
+          : this.controls[entries[0]].disable();
+      }
+    });
+  }
+
+  /**
+   * donde value es el objeto semilla y detailForm es un arreglo de form key para dar un marco al formarray
+   */
+
+  setFormValue(value: any) {
+    this.specialReset(value);
+    Object.entries(this.controls)
+      .filter(([_key, control]) => control instanceof SpecialFormArray)
+      .map(([key, control]) => {
+        (control as SpecialFormArray).fillFormArray(value[key]);
+      });
+  }
+
+  /**
+   * Método que retorna
+   */
+
+  getIdPkey(): SpecialFormControl<any> | undefined {
+    return Object.values(this.controls).find(
+      (control) =>
+        control instanceof SpecialFormControl && control.type === 'PRIMARY-KEY'
+    ) as SpecialFormControl<any> | undefined;
+  }
+}
+
+export class SpecialFormArray extends FormArray implements IFieldBasicData {
+  public name: string;
+  public placeholder: string;
+  public label: string;
+  public tooltip: string;
+  public icon: string;
+  public elementId: string;
+  public styleClasses: string;
+  public required: boolean;
+  public hidden: boolean;
+  public readOnly: boolean;
+  public settings: IArraySettings;
+  public type: EControlTypes;
+  public defaultValue: any;
+  public form: SpecialFormGroup;
+  private formCreation: (value?: any) => SpecialFormGroup;
+  public errorMessages: { [key: string]: string };
+
+  constructor(
+    {
+      name,
+      settings,
+      type,
+      validators,
+      asyncValidators,
+      elementId,
+      styleClasses,
+      defaultValue,
+      hidden,
+      icon,
+      label,
+      placeholder,
+      readOnly,
+      required,
+      tooltip,
+      errorMessages,
+      disabled,
+    }: TSpecialArray,
+    formCreation: () => SpecialFormGroup,
+    controls: AbstractControl[]
+  ) {
+    super(controls, validators, asyncValidators);
+    this.formCreation = formCreation;
+    this.form = this.formCreation();
+    this.name = name;
+    this.placeholder = placeholder;
+    this.label = label;
+    this.tooltip = tooltip;
+    this.icon = icon;
+    this.elementId = elementId;
+    this.settings = settings;
+    this.type = type;
+    this.styleClasses = styleClasses;
+    this.hidden = hidden;
+    this.readOnly = readOnly;
+    this.required = required;
+    this.defaultValue = defaultValue;
+    this.errorMessages = errorMessages;
+    disabled ? this.disable() : this.enable();
+  }
+
+  fillFormArray(data: any[]) {
+    this.form.reset();
+    this.clear();
+    data.forEach((item) => {
+      const form = this.formCreation(item);
+      this.push(form);
+    });
+  }
+
+  addItem() {
+    const form = this.formCreation(this.form.value);
+
+    this.form.specialReset();
+    this.push(form);
+    this.markAsDirty();
+  }
+
+  specialPush(index?: number) {
+    const form = this.formCreation(this.form.value);
+    if (!index) this.push(form);
+    else this.controls[index].reset(this.form.value);
+  }
+
+  specialInsert(index = 0) {
+    const form = this.formCreation(this.form.value);
+    this.insert(index, form);
+  }
+
+  specialEdit(index: number, newValue: Object) {
+    this.controls[index].reset({ ...this.controls[index].value, ...newValue });
+    this.markAsDirty();
+  }
+
+  /**
+   * Vuelve todos los controles del formArray de lectura o de sololectura
+   * @param status
+   */
+
+  setReadOnly(status: boolean) {
+    this.readOnly = status;
+    this.controls.forEach((control) => {
+      if (control instanceof SpecialFormGroup) {
+        control.setReadOnly(status);
+      }
+    });
+  }
+
+  /**
+   * Vuelve todos los controles del formArray habilitados o deshabilitados
+   * @param status
+   */
+
+  setDisabled(status: boolean) {
+    status ? this.disable() : this.enable();
+    this.controls.forEach((control) => {
+      if (control instanceof SpecialFormGroup) {
+        control.setDisabled(status);
+      }
+    });
+  }
+
+  /**
+   * Permite editar un control especifico.
+   * @param index
+   */
+
+  editControl(index: number) {
+    this.form.reset(this.controls[index].value);
+  }
+
+  unpristineRequired() {
+    this.markAsDirty();
+    this.controls.forEach((item) => {
+      (<SpecialFormGroup>item).unpristineRequired();
+    });
+  }
+
+  recursiveFillForm(form: FormGroup, data: any): FormGroup {
+    Object.entries(form.controls).map(([key, control]) => {
+      if (control instanceof FormControl) {
+        control.setValue(data[key]);
+      } else if (control instanceof FormArray) {
+        data[key].forEach(() => {});
+      } else if (control instanceof FormGroup) {
+        control.reset(data[key]);
+      }
+    });
+    return form;
+  }
+}

package/projects/special-forms/src/lib/core/interfaces/field-basics.interfaces.ts

@@ -0,0 +1,22 @@
+import { AsyncValidatorFn, ValidatorFn } from '@angular/forms';
+
+export interface IFieldBasicData {
+  placeholder: string;
+  label: string;
+  tooltip: string;
+  icon: string;
+  elementId: string;
+  styleClasses: string;
+  length: number;
+  required: boolean;
+  hidden: boolean;
+  readOnly: boolean;
+  disabled:boolean;
+  errorMessages: { [key: string]: string };
+}
+
+export interface IFieldData extends IFieldBasicData {
+  validators: ValidatorFn | ValidatorFn[] | null;
+  asyncValidators: AsyncValidatorFn | AsyncValidatorFn[] | null;
+  defaultValue: any;
+}

package/projects/special-forms/src/lib/core/interfaces/form.interfaces.ts

@@ -0,0 +1,83 @@
+import { IAutocompleteField } from '../../components/special-autocomplete/special-autocomplete.interface';
+import { IDatePickerField } from '../../components/special-datepicker/special-datepicker.interface';
+import { IDropdownField } from '../../components/special-dropdown/special-dropdown.interface';
+import { IInputField } from '../../components/special-input/special-input.interface';
+import { ICheckboxField } from '../../components/special-checkbox/special-checkbox.interface';
+import { IMultipleAutocompleteField } from '../../components/special-multiple-autocomplete/special-multiple-autocomplete.interface';
+import { EControlTypes } from '../aux-data/control-types.enum';
+import { IFieldData } from './field-basics.interfaces';
+import { ITextAreaField } from '../../components/special-text-area/special-text-area.interface';
+import { IUploadField } from '../../components/special-upload/special-upload.interface';
+import { ILabelField } from '../../components/special-label/special-label.interface';
+
+interface IcontrolName {
+  name: string;
+}
+
+export type IFormSettings = {
+  formFields: IFormStructure;
+};
+
+export interface IFormField extends IFieldData {
+  settings: IFormSettings;
+  type: EControlTypes.form;
+}
+
+export type IArraySettings = {
+  formFields: IFormStructure;
+  withFormHeader?: boolean;
+  withActionButtons?: boolean;
+};
+
+export interface IArrayField extends IFieldData {
+  settings: IArraySettings;
+  type: EControlTypes.array;
+}
+
+export interface IDefaultField extends IFieldData {
+  settings: any;
+  type: EControlTypes.default;
+}
+
+export type TRawFields =
+  | IDefaultField
+  | IInputField
+  | IDropdownField
+  | IArrayField
+  | IFormField
+  | IAutocompleteField
+  | IMultipleAutocompleteField
+  | IDatePickerField
+  | ITextAreaField
+  | IUploadField
+  | ILabelField
+  | ICheckboxField;
+
+export type TSpecialInput = IInputField & IcontrolName;
+export type TSpecialDefault = IDefaultField & IcontrolName;
+export type TSpecialDropdown = IDropdownField & IcontrolName;
+export type TSpecialArray = IArrayField & IcontrolName;
+export type TSpecialForm = IFormField & IcontrolName;
+export type TSpecialAutocomplete = IAutocompleteField & IcontrolName;
+export type TSpecialDatepicker = IDatePickerField & IcontrolName;
+export type ISpecialCheckbox = ICheckboxField & IcontrolName;
+export type ISpecialTextArea = ITextAreaField & IcontrolName;
+export type ISpecialLabel = ILabelField & IcontrolName;
+export type ISpecialUpload = IUploadField & IcontrolName;
+
+export type TSpecialFields =
+  | TSpecialDefault
+  | TSpecialInput
+  | TSpecialDropdown
+  | TSpecialArray
+  | TSpecialForm
+  | TSpecialAutocomplete
+  | ISpecialCheckbox
+  | ISpecialTextArea
+  | ISpecialUpload
+  | ISpecialLabel
+  | TSpecialDatepicker;
+
+export interface IFormStructure {
+  [name: string]: Partial<TRawFields>;
+}

package/projects/special-forms/src/lib/core/interfaces/special-control.interface.ts

@@ -0,0 +1,9 @@
+import {
+  SpecialFormControl,
+  SpecialFormArray,
+  SpecialFormGroup,
+} from '../forms/special-forms';
+
+export abstract class ISpecialControl {
+  control: SpecialFormControl<any> | SpecialFormArray | SpecialFormGroup;
+}

package/projects/special-forms/src/lib/core/masks/currency.mask.ts

@@ -0,0 +1,11 @@
+import { createMask } from '@ngneat/input-mask';
+
+export const currencyInputMask = createMask({
+  alias: 'numeric',
+  groupSeparator: ',',
+  autoUnmask: true,
+  digits: 2,
+  digitsOptional: false,
+  prefix: '$ ',
+  placeholder: '0',
+});

package/projects/special-forms/src/lib/core/masks/maks.enum.ts

@@ -0,0 +1,12 @@
+import { currencyInputMask } from './currency.mask';
+import { numberMask } from './number.mask';
+
+export enum MasksEnum {
+  currency = 'CURRENCY',
+  numeric = 'NUMERIC',
+}
+
+export const Masks = {
+  [MasksEnum.currency]: currencyInputMask,
+  [MasksEnum.numeric]: numberMask(1000),
+};

package/projects/special-forms/src/lib/core/masks/number.mask.ts

@@ -0,0 +1,4 @@
+import { createMask } from '@ngneat/input-mask';
+
+export const numberMask = (max = 1000) =>
+  createMask({ alias: 'numeric', min: 0, max });

package/projects/special-forms/src/lib/core/services/index.ts

@@ -0,0 +1,3 @@
+import { SpecialFormBuilderService } from './special-form-builder/special-form-builder.service';
+
+export { SpecialFormBuilderService };

package/projects/special-forms/src/lib/core/services/special-form-builder/special-form-builder.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { SpecialFormBuilderService } from './special-form-builder.service';
+
+describe('SpecialFormBuilderService', () => {
+  let service: SpecialFormBuilderService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(SpecialFormBuilderService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});