tuain-ng-forms-lib 14.0.0 → 14.0.1

package/src/lib/classes/forms/form.constants.ts

@@ -0,0 +1,28 @@
+export const NO_ERROR = '00';
+export const HEADER = 'HEADER';
+
+export const elementTypes = {
+  action: 'ACTION',
+  field: 'FIELD',
+  table: 'TABLE',
+};
+
+export const formActions = {
+  tableAction: 'TABLEACTION',
+  getData: 'GETDATA',
+  getTableData: 'GETTABLEDATA',
+  validate: 'VALIDATE',
+};
+
+export const operators = {
+  G: 'G',
+  L: 'L',
+  GE: 'GE',
+  LE: 'LE',
+  EQ: 'EQ',
+  NEQ: 'NEQ',
+  HAS: 'HAS',
+  NOTHAS: 'NOTHAS',
+  BETWEEN: 'BETWEEN',
+  IN: 'IN',
+};

package/src/lib/classes/forms/form.ts

@@ -0,0 +1,495 @@
+import { FormAction } from './action';
+import { FieldDescriptor, FieldOption } from './field';
+import { RecordTable } from './table/table';
+import { RecordFormSection } from './section';
+import { RecordFormSubSection } from './subsection';
+import { NO_ERROR, HEADER } from './form.constants';
+import { TableRecordData } from './table/row-data';
+
+const ACTIVE = 'active';
+const SHOW = 'show';
+const HIDE = 'hide';
+const ENABLE = 'enable';
+const DISABLE = 'disable';
+const CLEAN = 'clean';
+interface Transition {
+  name: string;
+  source: string;
+  destination: string;
+}
+
+interface StateFlow {
+  defaultState: string;
+  states: string[];
+  transitions: Transition[];
+}
+
+export interface FieldPayload {
+  fieldCode: string;
+  fieldValue: any;
+  editable: boolean;
+  visible: boolean;
+  required: boolean;
+  fieldOptions: string,
+}
+
+export interface TablePayload {
+  tableCode: string;
+  visible: boolean;
+  currentPage: number;
+  requestedPage: number;
+  recordsPerPage: number;
+  currentFilter: any,
+  sortingColumn: string;
+  sortingDirection: string;
+}
+
+interface FormPayload {
+  fields: FieldPayload[],
+  tables: TablePayload[],
+}
+
+export class FormStructureAndData {
+  state: string;
+  _name: string = '';
+  _formConfig: any;
+  private _title: string = '';
+  private _stateFlow: StateFlow;
+  private _fieldArray: FieldDescriptor[];
+  private _fields = {};
+  private _actionArray: FormAction[];
+  private _actions = {};
+  private _tableArray: RecordTable[];
+  private _tables = {};
+  private _sectionArray: RecordFormSection[];
+  private _sections = {};
+  private _immutableData = {};
+  private _extraInfo = {};
+  private _exclusiveSectionsByAttr = {};
+
+  constructor(definitionReceived, formConfig) {
+    this._formConfig = formConfig;
+    this.state = '';
+    this._actionArray = [];
+    this._fieldArray = [];
+    this._tableArray = [];
+    this._sectionArray = [];
+    this._stateFlow = {
+      defaultState: '',
+      states: [],
+      transitions: [],
+    };
+    if (!definitionReceived) { return; }
+    this._name = (definitionReceived.form && definitionReceived.form.formCode)
+      ? definitionReceived.form.formCode : this._name;
+    this._title = (definitionReceived.form && definitionReceived.form.formTitle)
+      ? definitionReceived.form.formTitle : '';
+    this.setStateFlow(definitionReceived?.states, definitionReceived?.transitions,
+      definitionReceived?.defaultState);
+    this.immutableData = definitionReceived.immutableData;
+    this.extraInfo = definitionReceived.extraInfo;
+
+    if (definitionReceived.actions) {
+      const formActions = definitionReceived.actions.map(objDef => {
+        let visibleStates = objDef.visibleStates;
+        let enabledStates = objDef.enabledStates;
+        if (!visibleStates) {
+          visibleStates = (objDef.actionModes || '').split(',')
+            .map(state => state.trim())
+            .filter(state => state.length > 0) || [];
+          enabledStates = [...visibleStates];
+        }
+        return { ...objDef, visibleStates, enabledStates };
+      });
+      for (const actionReceived of formActions) {
+        const globalAction = new FormAction(actionReceived, this._formConfig);
+        const globalActionCode = globalAction.actionCode;
+        if (globalActionCode) {
+          this._actionArray.push(globalAction);
+          this._actions[globalActionCode] = globalAction;
+        }
+      }
+    }
+
+    if (definitionReceived.fields) {
+      const formFields = definitionReceived.fields.map(objDef => {
+        let visibleStates = objDef.visibleStates;
+        let enabledStates = objDef.enabledStates || objDef.editableStates;
+        if (!visibleStates) {
+          visibleStates = (objDef.fieldModes || '').split(',')
+            .map(state => state.trim())
+            .filter(state => state.length > 0) || [];
+          enabledStates = [...visibleStates];
+        }
+        return { ...objDef, visibleStates, enabledStates };
+      });
+      for (const fieldReceived of formFields) {
+        const fieldToAdd = new FieldDescriptor(fieldReceived, this._formConfig);
+        const fieldCode = fieldToAdd.fieldCode;
+        if (fieldCode) {
+          this._fieldArray.push(fieldToAdd);
+          this._fields[fieldCode] = fieldToAdd;
+        }
+      }
+    }
+
+    if (definitionReceived.tables) {
+      const tables = definitionReceived.tables.map(objDef => {
+        let visibleStates = objDef.visibleStates;
+        let enabledStates = objDef.enabledStates || objDef.editableStates;
+        if (!visibleStates) {
+          visibleStates = (objDef.tableModes || '').split(',')
+            .map(state => state.trim())
+            .filter(state => state.length > 0) || [];
+          enabledStates = [...visibleStates];
+        }
+        if (!visibleStates || visibleStates.length === 0) {
+          visibleStates = this._formConfig.defaultStateFlow.states;
+        }
+        return { ...objDef, visibleStates, enabledStates };
+      });
+      for (const tableReceived of tables) {
+        const tableToAdd = new RecordTable(tableReceived, this._formConfig);
+        const tableCode = tableToAdd.tableCode;
+        if (tableCode) {
+          this._tableArray.push(tableToAdd);
+          this._tables[tableCode] = tableToAdd;
+        }
+      }
+    }
+
+    if (definitionReceived.sections) {
+      const formSections = definitionReceived.sections.map(objDef => {
+        let visibleStates = objDef.visibleStates;
+        if (!visibleStates) {
+          visibleStates = (objDef.sectionModes || '').split(',')
+            .map(state => state.trim())
+            .filter(state => state.length > 0) || [];
+        }
+        return { ...objDef, visibleStates };
+      });
+      for (const sectionReceived of formSections) {
+        const sectionToAdd = new RecordFormSection(sectionReceived, this);
+        const sectionCode = sectionToAdd.sectionCode;
+        if (sectionCode) {
+          this._sectionArray.push(sectionToAdd);
+          this._sections[sectionCode] = sectionToAdd;
+        }
+      }
+    }
+  }
+
+  getTitle(): string { return this._title; }
+  setTitle(title: string): void { this._title = title; }
+  get name(): string { return this._name; }
+  set name(name) { this._name = name; }
+
+  // Estados
+  get defaultState(): string { return this._stateFlow.defaultState; }
+  supportState(state: string): boolean { return this._stateFlow.states?.includes(state); }
+  supportMode(state: string): boolean { return this.supportState(state); }
+  get states(): any[] { return this._stateFlow.states; }
+
+  getCurrentState(): string { return this.state; }
+
+  changeState(newState: string): boolean {
+    if (!newState || !this.supportState(newState)) {
+      return false;
+    }
+    if (!this.state) {
+      this.state = newState;
+    } else {
+      const transitionToChange = this._stateFlow.transitions.find(trns =>
+        trns.source === this.state && trns.destination === newState);
+      if (transitionToChange) {
+        this.state = newState;
+      }
+    }
+    return (this.state === newState);
+  }
+
+  setStateFlow(states?, transitions?, defaultState?: string): void {
+    if (!states || !transitions) {
+      this._stateFlow = JSON.parse(JSON.stringify(this._formConfig.defaultStateFlow));
+      return;
+    }
+    this._stateFlow.states = states;
+    this._stateFlow.defaultState = defaultState || this._stateFlow.states[0];
+    this._stateFlow.transitions = transitions.map(transition => {
+      const name = transition.name;
+      const source = (this._stateFlow.states.includes(transition.source)) ? transition.source : '';
+      const destination = (this._stateFlow.states.includes(transition.destination)) ? transition.destination : '';
+      return { name, source, destination };
+    }).filter(item => item.name && item.source && item.destination);
+  }
+
+  // immutable Data
+  getImmutableElement(name: string): any { return this._immutableData?.[name]?.value ?? null; }
+  set immutableData(immutableData) { Object.assign(this._immutableData, immutableData); }
+  get immutableData(): any { return JSON.parse(JSON.stringify(this._immutableData)); }
+
+  // extra Info
+  getExtraInfo(name: string): any { return this._extraInfo?.[name]?.value ?? null; }
+  set extraInfo(extraInfo) { Object.assign(this._extraInfo, extraInfo); }
+  get extraInfo(): any { return JSON.parse(JSON.stringify(this._extraInfo)); }
+
+  // Fields
+  get fields(): any { return this._fields; }
+  get fieldNames(): string[] { return this.getFieldNames(); }
+  getFields(): FieldDescriptor[] { return this._fieldArray; }
+  getFieldNames(): string[] { return this._fieldArray.map(field => field.fieldCode); }
+  getField(code: string): FieldDescriptor { return (code && this._fields?.[code]) ? this._fields[code] : null; }
+  enableField(code: string): void { this.getField(code)?.enable(); }
+  disableField(code: string): void { this.getField(code)?.disable(); }
+  getFieldValue(code: string): any { return this.getField(code)?.getValue(); }
+  getFieldOptionText(code: string): any { return this.getField(code)?.getOptionText(); }
+  getFieldOptions(code: string): FieldOption[] { return this.getField(code)?.getFieldOptions() ?? null; }
+  setFieldValue(code: string, value: any): any { this.getField(code)?.setValue(value); }
+  setFieldError(code: string, errorCode: string, message: string, type: string = 'error'): any { this.getField(code)?.setError(errorCode, message, type); }
+  setFieldIntrinsicErrorMessage(code: string, message: string): any { this.getField(code)?.setIntrinsicErrorMessage(message); }
+  setFieldRequired(code: string, required: boolean): any { this.getField(code)?.setRequired(required); }
+  setFieldErrorMessage(code: string, message: string): any { this.getField(code)?.setErrorMessage(message); }
+
+  setFieldOptions(code: string, optionsArray: any[], idAttribute: string, nameAttribute: string): any {
+    const field = this.getField(code);
+    if (field && optionsArray?.length > 0) {
+      const fieldOptions = optionsArray.map(item => ({
+        fieldOptionId: item[idAttribute],
+        fieldOptionValue: item[nameAttribute]
+      }));
+      field.setFieldOptions(fieldOptions);
+    }
+  }
+
+  getFieldSet(filter, inputCodes: string[] | string | null, secCode?: string | null, subCode?: string | null): string[] {
+    let codes: any[] = [];
+    if (typeof inputCodes === 'string' && inputCodes) {
+      codes = [inputCodes];
+    } else if (Array.isArray(inputCodes) && inputCodes.length > 0) {
+      codes = inputCodes ?? [];
+    } else if (secCode && !subCode) {
+      codes = this.getSection(secCode)?.getFieldNames() ?? [];
+    } else if (secCode && subCode) {
+      codes = this.getSubSection(secCode, subCode)?.getFieldNames() ?? [];
+    } else {
+      codes = this.getFieldNames() ?? [];
+    }
+    return (filter) ? codes.filter(fld => filter(this.getField(fld))) : codes;
+  }
+
+  applyOnFields(processFunc, inputCodes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    if (!processFunc) { return 0; }
+    const codes = this.getFieldSet(null, inputCodes ?? null, secCode, subCode);
+    let processedFields = 0;
+    for (const code of codes) {
+      const field = this.getField(code);
+      if (field) {
+        try {
+          processFunc(field);
+          processedFields += 1;
+        } catch (e) {
+          console.log(`Error procesando funcion en campo ${field}: ${e}`);
+        }
+      }
+    }
+    return processedFields;
+  }
+
+  enableFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.enable(), codes, secCode, subCode);
+  }
+
+  showFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.show(), codes, secCode, subCode);
+  }
+
+  hideFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.hide(), codes, secCode, subCode);
+  }
+
+  showLabelFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.showLablel(), codes, secCode, subCode);
+  }
+
+  hideLabelFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.hideLabel(), codes, secCode, subCode);
+  }
+
+  disableFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.disable(), codes, secCode, subCode);
+  }
+
+  cleanFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.clean(), codes, secCode, subCode);
+  }
+
+  tagFieldsWithError(message: string, codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.applyOnFields(fld => fld.setErrorMessage(message), codes, secCode, subCode);
+  }
+
+  cleanErrorFields(codes?: string[] | string | null, secCode?: string, subCode?: string): number {
+    return this.tagFieldsWithError('', codes, secCode, subCode);
+  }
+
+  tagEmptyRequiredFields(message: string, codes = null, secCode?: string, subCode?: string): boolean {
+    return this.tagFieldsWithError(message, this.getRequiredEmptyFields(codes, secCode, subCode)) > 0;
+  }
+
+  getRequiredFields(codes?: string[] | string | null, secCode?: string, subCode?: string): string[] {
+    return this.getFieldSet(fld => fld.required, codes ?? null, secCode, subCode);
+  }
+
+  getRequiredEmptyFields(codes?: string[] | string | null, secCode?: string, subCode?: string): string[] {
+    return this.getFieldSet(fld => fld.required && fld.empty, codes ?? null, secCode, subCode);
+  }
+
+  getChangedFields(codes?: string[] | string | null, secCode?: string, subCode?: string): string[] {
+    return this.getFieldSet(fld => !fld.outputOnly && fld.hasChanged(), codes ?? null, secCode, subCode);
+  }
+
+  getFieldsWithValidationIssues(codes?: string[] | string | null, secCode?: string, subCode?: string): string[] {
+    return this.getFieldSet(fld => fld.errorCode !== NO_ERROR, codes ?? null, secCode, subCode);
+  }
+
+  getFieldsValues(inputCodes?: string[] | string | null, secCode?: string, subCode?: string): any {
+    const codes = this.getFieldSet(null, inputCodes ?? null, secCode, subCode);
+    const resultObject = {};
+    for (let index = 0; index < codes.length; index++) {
+      const code = codes[index];
+      if (code) {
+        resultObject[code] = this._fields?.[code]?.getValue() ?? null;
+      }
+    }
+    return resultObject;
+  }
+
+  // Acciones
+  get actions() { return this._actions; }
+
+  getActionsByAttribute(name: string, value): FormAction[] { return this._actionArray.filter(actionItem => actionItem.matchAttribute(name, value)); }
+  getActions(): FormAction[] { return this._actionArray; }
+  getAction(code: string): FormAction { return (code && this._actions?.[code]) ? this._actions[code] : null; }
+  showActions(codes: string[] | string): void { return this.execOnActions(codes, SHOW); }
+  hideActions(codes: string[] | string): void { return this.execOnActions(codes, HIDE); }
+  enableActions(codes: string[] | string): void { return this.execOnActions(codes, ENABLE); }
+  disableActions(codes: string[] | string): void { return this.execOnActions(codes, DISABLE); }
+
+  execOnActions(codes: string[] | string | null, functionName: string): void {
+    const actionCodes = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
+    if (!functionName || actionCodes.length === 0) { return; }
+    actionCodes.forEach(code => {
+      const action = this.getAction(code);
+      action?.[functionName]?.();
+    });
+  }
+
+  // Tablas
+  get tables(): any { return this.tables; }
+  getTables(): RecordTable[] { return this._tableArray; }
+  getTable(code: string): RecordTable { return (code && this._tables?.[code]) ? this._tables[code] : null; }
+  getTableRecord(code: string, id: string): TableRecordData { return this.getTable(code)?.getTableRecord(id) }
+
+  enableTables(codes: string[] | string): void { return this.execOnTables(codes, ENABLE); }
+  disableTables(codes: string[] | string): void { return this.execOnTables(codes, DISABLE); }
+  showTables(codes: string[] | string): void { return this.execOnTables(codes, SHOW); }
+  hideTables(codes: string[] | string): void { return this.execOnTables(codes, HIDE); }
+  cleanTables(codes: string[] | string): void { return this.execOnTables(codes, CLEAN); }
+
+  execOnTables(codes: string[] | string | null, functionName: string) {
+    const tableCodes = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
+    if (!functionName || tableCodes.length === 0) { return; }
+    tableCodes.forEach(code => {
+      const table = this.getTable(code);
+      table?.[functionName]?.();
+    });
+  }
+
+  // Secciones
+  get sections(): any { return this._sections; }
+  getSections(): RecordFormSection[] { return this._sectionArray; }
+  getSectionsByAttribute(name, value): RecordFormSection[] { return this._sectionArray.filter(item => item.matchAttribute(name, value)); }
+  get sectionTitles(): string[] { return this._sectionArray.map(formSection => formSection.sectionTitle); }
+  get visibleSections(): RecordFormSection[] { return this._sectionArray.filter(sec => sec.visible); }
+  getSection(code: string): RecordFormSection { return (code && this._sections?.[code]) ? this._sections[code] : null; }
+  showSections(codes: string[] | string): void { this.execOnSections(codes, SHOW); }
+  hideSections(codes: string[] | string): void { this.execOnSections(codes, HIDE); }
+  activeSection(): string { return this._exclusiveSectionsByAttr[ACTIVE]; }
+  getSubSection(code: string, subCode): RecordFormSubSection { return this.getSection(code)?.getSubsection(subCode) ?? null; }
+  showSubSections(code: string, subCodes: string[] | string): void { return this.execOnSubSections(code, subCodes, SHOW); }
+  hideSubSections(code: string, subCodes: string[] | string): void { return this.execOnSubSections(code, subCodes, HIDE); }
+  getSectionActions(code): FormAction[] { return this.getSection(code)?.getActions() ?? null; }
+  getSectionActionNames(code): string[] { return this.getSection(code)?.getActionNames() ?? null; }
+
+  activateSection(code: string): void {
+    if (code === this._exclusiveSectionsByAttr[ACTIVE]) { return; }
+    this.getSection(this.activeSection())?.inactivate();
+    this.getSection(code)?.activate();
+    this._exclusiveSectionsByAttr[ACTIVE] = code;
+  }
+
+  execOnSections(codes: string[] | string | null, functionName: string): void {
+    const sectionCodes = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
+    if (!functionName || sectionCodes.length === 0) { return; }
+    sectionCodes.forEach(code => {
+      const section = this.getSection(code);
+      section?.[functionName]?.();
+    });
+  }
+
+  execOnSubSections(code: string, subNames: string[] | string | null, functionName: string): void {
+    const subCodes = (Array.isArray(subNames)) ? subNames : (subNames ? [subNames] : []);
+    const section = this.getSection(code);
+    if (!functionName || !section || subCodes.length === 0) { return; }
+    for (const subCode of subCodes) {
+      const subSection = this.getSubSection(code, subCode);
+      subSection?.[functionName]?.();
+    }
+  }
+
+  /**
+   * Métodos propios de gestión del formulario
+   */
+
+  cleanData(): void {
+    for (const field of this._fieldArray) {
+      field.setValue(field.defaultValue);
+    }
+    for (const table of this._tableArray) {
+      table.clean();
+    }
+  }
+
+  getPayload(): any {
+    const formData: FormPayload = {
+      fields: [],
+      tables: [],
+    };
+    formData.fields = this.getFields().filter(fld => !fld.outputOnly)
+      .map(fld => {
+        const fieldPayload: FieldPayload = {
+          fieldCode: fld.fieldCode,
+          fieldValue: fld.getValue(),
+          editable: !fld.disabled,
+          visible: fld.visible,
+          required: fld.required,
+          fieldOptions: '',
+        }
+        return fieldPayload;
+      });
+
+    formData.tables = this.getTables().map(tbl => {
+      const tablePayload: TablePayload = {
+        tableCode: tbl.tableCode,
+        visible: tbl.visible,
+        currentPage: tbl.currentPage,
+        requestedPage: tbl.requestedPage,
+        recordsPerPage: tbl.recordsPerPage,
+        currentFilter: tbl.currentFilter,
+        sortingColumn: tbl.sorting.columnName,
+        sortingDirection: tbl.sorting.direction,
+      };
+      return tablePayload
+    })
+    return formData;
+  }
+}

package/src/lib/classes/forms/section.ts

@@ -0,0 +1,154 @@
+import { Subject } from 'rxjs';
+import { FormAction } from './action';
+import { RecordFormSubSection } from './subsection';
+
+export class RecordFormSection {
+  private readonly _activation = new Subject<string>();
+  private readonly _inactivation = new Subject<string>();
+  visible: boolean;
+  visibleStates: string[];
+
+  active = false;
+  sectionId: string;
+  sectionCode: string;
+  sectionTitle: string;
+  customAttributes: any = {};
+
+  subSections: RecordFormSubSection[];
+  subSectionsObj: any;
+
+  constructor(sectionReceived, formObject) {
+    if (!sectionReceived) { return; }
+    this.visible = true;
+    this.sectionId = (sectionReceived.sectionId) ? sectionReceived.sectionId.toString() : '';
+    this.sectionCode = (sectionReceived.sectionCode) ? sectionReceived.sectionCode : '';
+    this.sectionTitle = (sectionReceived.sectionTitle) ? sectionReceived.sectionTitle : '';
+    this.visibleStates = sectionReceived.visibleStates || [];
+    this.subSections = [];
+    this.subSectionsObj = {};
+    if (sectionReceived.subsections) {
+      const subsections = sectionReceived.subsections.map(objDef => {
+        let visibleStates = objDef.visibleStates;
+        if (!visibleStates) {
+          visibleStates = (objDef.subsectionModes || '').split(',')
+            .map(state => state.trim())
+            .filter(state => state.length > 0);
+        }
+        if (!visibleStates || visibleStates.length === 0) {
+          visibleStates = this.visibleStates;
+        }
+        if (objDef.elements && Array.isArray(objDef.elements)) {
+          objDef.elements = objDef.elements.map(elm => ({ code: elm.elementCode, type: elm.elementTypeName }));
+        }
+        return { ...objDef, visibleStates };
+      });
+      for (const subsectionReceived of subsections) {
+        const subSectionToAdd = new RecordFormSubSection(subsectionReceived, formObject);
+        const subsectionCode = subSectionToAdd.subsectionCode;
+        if (subsectionCode) {
+          this.subSections.push(subSectionToAdd);
+          this.subSectionsObj[subsectionCode] = subSectionToAdd;
+        }
+      }
+    }
+    if (sectionReceived?.customAttributes) {
+      Object.keys(sectionReceived?.customAttributes)
+        ?.forEach(attr => this.customAttributes[attr] = sectionReceived?.customAttributes[attr])
+    }
+  }
+
+  getCustomAttribute(name) { return this.customAttributes?.[name] ?? null; }
+  setCustomAttribute(name, value) { return name && (this.customAttributes[name] = value); }
+  matchAttribute(name, value) { return this.customAttributes?.[name] === value; }
+
+  get code() { return this.sectionCode; }
+  get activation() { return this._activation; }
+  get inactivation() { return this._inactivation; }
+
+  activate() {
+    if (!this.active) {
+      this.active = true;
+      this._activation.next(this.sectionCode);
+    }
+  }
+
+  inactivate() {
+    if (this.active) {
+      this.active = false;
+      this._inactivation.next(this.sectionCode);
+    }
+  }
+
+  show() { this.visible = true; }
+  hide() { this.visible = false; }
+  get title() { return this.sectionTitle; }
+  set title(title) { this.sectionTitle = title; }
+
+  getVisibleSubsections(state) {
+    return this.subSections.filter(subSection => {
+      return subSection.visible && subSection.viewOnState(state);
+    });
+  }
+
+  getSubsection(subSectionCode) {
+    return (this.subSectionsObj && this.subSectionsObj[subSectionCode])
+      ? this.subSectionsObj[subSectionCode] : null;
+  }
+
+  getFields() {
+    let fieldsArray = [];
+    if (this.subSections && this.subSections.length > 0) {
+      for (const subSection of this.subSections) {
+        fieldsArray = fieldsArray.concat(subSection.getFields());
+      }
+    }
+    return fieldsArray;
+  }
+
+  getActions(): FormAction[] {
+    let actionArray = [];
+    if (this.subSections && this.subSections.length > 0) {
+      for (const subSection of this.subSections) {
+        actionArray = actionArray.concat(subSection.getActions());
+      }
+    }
+    return actionArray;
+  }
+
+  getActionNames(): string[] {
+    let actionArray = [];
+    if (this.subSections && this.subSections.length > 0) {
+      for (const subSection of this.subSections) {
+        actionArray = actionArray.concat(subSection.getActionNames());
+      }
+    }
+    return actionArray;
+  }
+
+  getFieldNames() {
+    let fieldsArray = [];
+    if (this.subSections && this.subSections.length > 0) {
+      for (const subSection of this.subSections) {
+        fieldsArray = fieldsArray.concat(subSection.getFieldNames());
+      }
+    }
+    return fieldsArray;
+  }
+
+  getField(name) {
+    let field = null;
+    if (this.subSections && this.subSections.length > 0) {
+      for (const subSection of this.subSections) {
+        field = subSection.getField(name);
+        if (field) {
+          return field;
+        }
+      }
+    }
+    return null;
+  }
+
+  supportState(state) { return this.viewOnState(state); }
+  viewOnState(state) { return this.visibleStates.includes(state); }
+  supportMode(state) { return this.viewOnState(state); }
+}