@sankhyalabs/sankhyablocks 0.0.0-feat-dev-kb-4158.0

package/dist/collection/components/snk-form/snk-form.js

@@ -0,0 +1,216 @@
+import { ElementIDUtils } from '@sankhyalabs/core';
+import { h } from '@stencil/core';
+import { SnkFormConfigManager } from './SnkFormConfigManager';
+export class SnkForm {
+  constructor() {
+    this._dataUnit = undefined;
+    this._dataState = undefined;
+    this._showFormConfig = false;
+    this._configManager = undefined;
+    this.configName = undefined;
+    this.recordsValidator = undefined;
+    this.messagesBuilder = undefined;
+  }
+  /**
+   * Exibe a janela de configurações do formulário.
+   */
+  async showConfig() {
+    this._showFormConfig = true;
+  }
+  /**
+   * Fecha a janela de configurações do formulário.
+   */
+  async hideConfig() {
+    this._showFormConfig = false;
+  }
+  closeConfig() {
+    this.hideConfig();
+  }
+  dataunitReady() {
+    const dataInfo = { dataUnit: this._dataUnit };
+    ElementIDUtils.addIDInfo(this._element, null, dataInfo);
+  }
+  componentWillLoad() {
+    let parent = this._element.parentElement;
+    while (parent) {
+      if (parent.tagName.toUpperCase() === "SNK-DATA-UNIT") {
+        this._snkDataUnit = parent;
+        this._dataUnit = this._snkDataUnit.dataUnit;
+        this._dataState = this._snkDataUnit.dataState;
+        if (this._dataUnit) {
+          this.dataunitReady();
+        }
+        else {
+          this._snkDataUnit.addEventListener("dataUnitReady", (evt) => {
+            this._dataUnit = evt.detail;
+          });
+        }
+        this._snkDataUnit.addEventListener("dataStateChange", (evt) => {
+          this._dataState = evt.detail;
+        });
+        break;
+      }
+      parent = parent.parentElement;
+    }
+    this._configManager = new SnkFormConfigManager(this.configName);
+    this._configManager.loadConfig();
+  }
+  render() {
+    if (!this._dataUnit || !this._dataState) {
+      return undefined;
+    }
+    return (h("section", null, h("div", { class: "ez-row" }, h("div", { class: "ez-col ez-col--sd-12" }, h("ez-form", { key: "ezForm" + this._snkDataUnit.entityName, "data-element-id": "embedded", dataUnit: this._dataUnit, config: this._configManager.getConfig(this._dataState.insertionMode, this._dataUnit), recordsValidator: this.recordsValidator, class: this._showFormConfig ? 'snk-form__form--hidden' : '' }), this._showFormConfig &&
+      h("snk-form-config", { messagesBuilder: this.messagesBuilder, dataUnit: this._dataUnit, configManager: this._configManager, onConfigClose: () => this.closeConfig() })))));
+  }
+  static get is() { return "snk-form"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["snk-form.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["snk-form.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "configName": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Nome usado para guardar/recuperar as configura\u00E7\u00F5es do formul\u00E1rio."
+        },
+        "attribute": "config-name",
+        "reflect": false
+      },
+      "recordsValidator": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "IRecordValidator",
+          "resolved": "IRecordValidator",
+          "references": {
+            "IRecordValidator": {
+              "location": "import",
+              "path": "@sankhyalabs/ezui/dist/types/utils/form/interfaces"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Validador respons\u00E1vel por checar a integridade das informa\u00E7\u00F5es do registro."
+        }
+      },
+      "messagesBuilder": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "SnkMessageBuilder",
+          "resolved": "SnkMessageBuilder",
+          "references": {
+            "SnkMessageBuilder": {
+              "location": "import",
+              "path": "../../lib/message/SnkMessageBuilder"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Respons\u00E1vel por flexibilizar e padronizar o uso de mensagens nos blocos de constru\u00E7\u00E3o."
+        }
+      }
+    };
+  }
+  static get states() {
+    return {
+      "_dataUnit": {},
+      "_dataState": {},
+      "_showFormConfig": {},
+      "_configManager": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "exit",
+        "name": "exit",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitido quando o bot\u00E3o de voltar \u00E9 acionado."
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "actionClick",
+        "name": "actionClick",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitido sempre que houver click de bot\u00E3o ou a\u00E7\u00E3o."
+        },
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "showConfig": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Exibe a janela de configura\u00E7\u00F5es do formul\u00E1rio.",
+          "tags": []
+        }
+      },
+      "hideConfig": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Fecha a janela de configura\u00E7\u00F5es do formul\u00E1rio.",
+          "tags": []
+        }
+      }
+    };
+  }
+  static get elementRef() { return "_element"; }
+}

package/dist/collection/components/snk-form/subcomponents/snk-config-options/snk-config-options.css

@@ -0,0 +1,16 @@
+:host {
+    /*@doc Define o espaçamento interno direito do componente arrastável.*/
+    --snk-config-options--border: 2px solid var(--color--secondary-200, #D2D3DA);
+
+    /*private*/
+    width: 100%;
+    border-radius: 15px;
+
+    /*public*/
+    border: var(--snk-config-options--border);
+}
+
+.config-options__switch-row {
+    /*private*/
+    margin-top: -30px;
+}

package/dist/collection/components/snk-form/subcomponents/snk-config-options/snk-config-options.js

@@ -0,0 +1,344 @@
+import { h, Host } from "@stencil/core";
+import { ApplicationContext, UserInterface, ObjectUtils, StringUtils, ElementIDUtils } from '@sankhyalabs/core';
+import { DataType, getConvertedValue } from "@sankhyalabs/core/dist/dataunit/metadata/DataType";
+import { CheckMode } from "@sankhyalabs/ezui/dist/collection/utils";
+import { DEFAULT_TYPE, TAGS_BY_TYPE, VARS_BY_TYPE } from "../../../../lib/utils/constants";
+export class SnkConfigOptions {
+  constructor() {
+    this._defaultType = undefined;
+    this.fieldConfig = {};
+    this.idConfig = undefined;
+    this.dataUnit = undefined;
+    this.messagesBuilder = undefined;
+  }
+  onConfigDefault(optionSelected) {
+    if (optionSelected != undefined) {
+      this._defaultType = optionSelected;
+      this.fieldConfig.defaultValue = {
+        type: this._defaultType
+      };
+      this.configOptionsChanged.emit(this.fieldConfig);
+    }
+  }
+  buildOptions() {
+    var _a, _b, _c;
+    let interfaceField = (_c = (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField((_b = this.fieldConfig) === null || _b === void 0 ? void 0 : _b.name)) === null || _c === void 0 ? void 0 : _c.userInterface;
+    if (interfaceField === UserInterface.SEARCH) {
+      interfaceField = UserInterface.INTEGERNUMBER;
+    }
+    return VARS_BY_TYPE.UserInterface[interfaceField];
+  }
+  enabledValueDefault() {
+    var _a, _b, _c;
+    const field = (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField((_b = this.fieldConfig) === null || _b === void 0 ? void 0 : _b.name);
+    const allowDefault = (_c = field === null || field === void 0 ? void 0 : field.properties) === null || _c === void 0 ? void 0 : _c.allowDefault;
+    const hasVariableVar = VARS_BY_TYPE.UserInterface.hasOwnProperty(field === null || field === void 0 ? void 0 : field.userInterface)
+      || (field === null || field === void 0 ? void 0 : field.userInterface) === UserInterface.SEARCH;
+    if ((allowDefault == undefined || allowDefault === "true") && hasVariableVar) {
+      return true;
+    }
+    return false;
+  }
+  isAllowDefault() {
+    var _a, _b;
+    const allowDefault = (_b = (_a = this._fieldProperties) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.allowDefault;
+    if (allowDefault == undefined) {
+      return true;
+    }
+    return allowDefault === "true";
+  }
+  loadDefaultValue() {
+    var _a;
+    if (this.fieldConfig == undefined) {
+      this._defaultType = DEFAULT_TYPE.fixed;
+      this.fieldConfig = {
+        defaultValue: {
+          type: this._defaultType
+        }
+      };
+    }
+    else if (((_a = this.fieldConfig.defaultValue) === null || _a === void 0 ? void 0 : _a.type) == undefined) {
+      this._defaultType = DEFAULT_TYPE.fixed;
+      this.fieldConfig.defaultValue = {
+        type: this._defaultType
+      };
+    }
+    else {
+      this._defaultType = this.fieldConfig.defaultValue.type;
+    }
+  }
+  getFieldProperties(field) {
+    var _a;
+    if (field != undefined) {
+      return (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField(field);
+    }
+  }
+  getMessage(key, params) {
+    return this.messagesBuilder.getMessage(key, params);
+  }
+  getDefaultType() {
+    var _a;
+    return (_a = this.fieldConfig.defaultValue.type) !== null && _a !== void 0 ? _a : DEFAULT_TYPE.fixed;
+  }
+  getEnabledByProperty(attribName, propertyName) {
+    const fieldDescriptor = this._fieldProperties;
+    if (fieldDescriptor == undefined) {
+      return true;
+    }
+    const fieldProperties = fieldDescriptor.properties || {};
+    return fieldProperties.hasOwnProperty(propertyName) ? fieldProperties[propertyName] !== "S" : fieldDescriptor[attribName] !== true;
+  }
+  getValueByProperty(property) {
+    const properties = this._fieldProperties;
+    if (properties != undefined && properties[property] === true) {
+      return true;
+    }
+    return this.fieldConfig[property];
+  }
+  getValidatedValue(fieldValue) {
+    var _a, _b;
+    if (fieldValue == undefined) {
+      return;
+    }
+    const field = (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField((_b = this.fieldConfig) === null || _b === void 0 ? void 0 : _b.name);
+    const dataType = field === null || field === void 0 ? void 0 : field.dataType;
+    if (dataType == undefined) {
+      return;
+    }
+    const value = (fieldValue === null || fieldValue === void 0 ? void 0 : fieldValue.waitmessage) != undefined ? undefined :
+      dataType !== DataType.OBJECT && dataType !== DataType.DATE
+        && typeof fieldValue === "object"
+        ? fieldValue.value
+        : fieldValue;
+    return dataType === DataType.OBJECT ? JSON.stringify(value) : value;
+  }
+  buildInputDefault({ value, enabled, label, name, required, userInterface }, properties = undefined, mode = undefined) {
+    let options;
+    let precision = 0;
+    let prettyPrecision = 0;
+    const TagName = userInterface == undefined || TAGS_BY_TYPE[userInterface] == undefined
+      ? TAGS_BY_TYPE.DEFAULT
+      : TAGS_BY_TYPE[userInterface];
+    if (userInterface === UserInterface.OPTIONSELECTOR) {
+      const prop = properties === null || properties === void 0 ? void 0 : properties.options;
+      if (typeof prop === "string") {
+        const parsed = ObjectUtils.stringToObject(prop);
+        options = Object.keys(parsed).map(key => { return { value: key, label: parsed[key] }; });
+      }
+      else {
+        options = prop;
+      }
+    }
+    else if (userInterface === UserInterface.DECIMALNUMBER) {
+      precision = Number((properties === null || properties === void 0 ? void 0 : properties.precision) || 2);
+      prettyPrecision = Number((properties === null || properties === void 0 ? void 0 : properties.prettyPrecision) || precision);
+    }
+    return h(TagName, Object.assign({ value: value, enabled: enabled, label: label, "data-field-name": name, key: name, onEzChange: (evt) => this.onChange(evt === null || evt === void 0 ? void 0 : evt.detail) }, (this.getConditionalAttributes(userInterface, required, options, precision, prettyPrecision, mode))));
+  }
+  getConditionalAttributes(userInterface, required, options, precision, prettyPrecision, mode) {
+    switch (userInterface) {
+      case UserInterface.SEARCH:
+        return {
+          suppressEmptyOption: required,
+          optionLoader: (searchArgument) => this.onSearch(searchArgument)
+        };
+      case UserInterface.OPTIONSELECTOR:
+        return {
+          suppressEmptyOption: required,
+          options
+        };
+      case UserInterface.CHECKBOX:
+      case UserInterface.SWITCH:
+        return {
+          mode
+        };
+      case UserInterface.INTEGERNUMBER:
+      case UserInterface.DECIMALNUMBER:
+        return {
+          precision,
+          prettyPrecision,
+          onEzStartChange: (evt) => this.onChange(evt === null || evt === void 0 ? void 0 : evt.detail)
+        };
+      case UserInterface.DATE:
+      case UserInterface.DATETIME:
+      case UserInterface.TIME:
+        return {
+          onEzStartChange: (evt) => this.onChange(evt === null || evt === void 0 ? void 0 : evt.detail)
+        };
+      default:
+        return {};
+    }
+  }
+  onChange(fieldValue) {
+    this.fieldConfig.defaultValue.value = this.getValidatedValue(fieldValue);
+    this.configOptionsChanged.emit(this.fieldConfig);
+  }
+  onSearch(searchArgument) {
+    if (this._application != undefined && this.fieldConfig != undefined) {
+      return this._application.executeSearch(searchArgument, this.fieldConfig.name, this.dataUnit);
+    }
+  }
+  buildField(descriptor, config) {
+    const { name, label, readOnly, required, defaultValue } = config;
+    const { userInterface, properties } = descriptor;
+    const allowDefault = properties === null || properties === void 0 ? void 0 : properties.allowDefault;
+    let value;
+    let enabled = StringUtils.getBooleanValue(allowDefault, !readOnly);
+    if (userInterface === UserInterface.FILE) {
+      enabled = false;
+    }
+    if (enabled) {
+      value = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value;
+      if (value != undefined) {
+        value = getConvertedValue(descriptor === null || descriptor === void 0 ? void 0 : descriptor.dataType, value);
+      }
+    }
+    const configField = { value, enabled, label, name, required, userInterface };
+    switch (userInterface) {
+      case UserInterface.SWITCH:
+        return this.buildInputDefault(configField, undefined, CheckMode.SWITCH);
+      case UserInterface.CHECKBOX:
+        return this.buildInputDefault(configField, undefined, CheckMode.REGULAR);
+      case UserInterface.OPTIONSELECTOR:
+      case UserInterface.DECIMALNUMBER:
+        return this.buildInputDefault(configField, properties);
+      default:
+        return this.buildInputDefault(configField);
+    }
+  }
+  componentWillLoad() {
+    var _a;
+    this.loadDefaultValue();
+    this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+    this._fieldProperties = this.getFieldProperties((_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.name);
+  }
+  componentDidLoad() {
+    ElementIDUtils.addIDInfo(this._element, this.fieldConfig.name);
+  }
+  render() {
+    var _a, _b;
+    return (h(Host, null, h("div", { id: this.idConfig }, h("div", { class: "ez-row ez-padding--medium" }, h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-text-input", { label: this.getMessage("snkConfigOptions.label.nameField"), value: (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.label, onEzChange: (evt) => { this.fieldConfig.label = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } })), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-combo-box", { label: this.getMessage("snkConfigOptions.label.typeValueDefault"), suppressEmptyOption: true, enabled: this.enabledValueDefault(), onEzChange: (evt) => { var _a; return this.onConfigDefault((_a = evt.detail) === null || _a === void 0 ? void 0 : _a.value); }, value: this.getDefaultType() }, h("option", { value: DEFAULT_TYPE.fixed }, this.getMessage("snkConfigOptions.options.valueFixed")), h("option", { value: DEFAULT_TYPE.variable }, this.getMessage("snkConfigOptions.options.variable")))), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, this._defaultType === DEFAULT_TYPE.variable ?
+      h("ez-combo-box", { label: this.getMessage("snkConfigOptions.label.valueDefault"), enabled: this.isAllowDefault(), onEzChange: (evt) => { var _a; this.fieldConfig.defaultValue.value = (_a = evt.detail) === null || _a === void 0 ? void 0 : _a.value; this.configOptionsChanged.emit(this.fieldConfig); }, value: this.fieldConfig.defaultValue.value, options: this.buildOptions() })
+      :
+        ((_b = this._fieldProperties) === null || _b === void 0 ? void 0 : _b.userInterface) &&
+          this.buildField(this._fieldProperties, this.fieldConfig))), h("div", { class: "ez-row ez-padding--medium config-options__switch-row" }, h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-check", { mode: CheckMode.SWITCH, label: this.getMessage("snkConfigOptions.label.clearDuplicate"), value: this.fieldConfig.cleanOnCopy, onEzChange: (evt) => { this.fieldConfig.cleanOnCopy = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } })), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-check", { mode: CheckMode.SWITCH, label: this.getMessage("snkConfigOptions.label.requiredField"), enabled: this.getEnabledByProperty("required", "systemRequired"), value: this.getValueByProperty("required"), onEzChange: (evt) => { this.fieldConfig.required = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } })), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-check", { mode: CheckMode.SWITCH, label: this.getMessage("snkConfigOptions.label.protectedField"), enabled: this.getEnabledByProperty("readOnly", "systemReadOnly"), value: this.getValueByProperty("readOnly"), onEzChange: (evt) => { this.fieldConfig.readOnly = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } }))))));
+  }
+  static get is() { return "snk-config-options"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["snk-config-options.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["snk-config-options.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "fieldConfig": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "IFieldConfig",
+          "resolved": "IFieldConfig",
+          "references": {
+            "IFieldConfig": {
+              "location": "import",
+              "path": "@sankhyalabs/ezui/dist/types/utils/form/interfaces"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Armazena as propriedades do campo."
+        },
+        "defaultValue": "{} as IFieldConfig"
+      },
+      "idConfig": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Armazena a chave de op\u00E7\u00F5es de configura\u00E7\u00E3o."
+        },
+        "attribute": "id-config",
+        "reflect": true
+      },
+      "dataUnit": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "DataUnit",
+          "resolved": "DataUnit",
+          "references": {
+            "DataUnit": {
+              "location": "import",
+              "path": "@sankhyalabs/core"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Reposit\u00F3rio de dados respons\u00E1vel por controlar a manipula\u00E7\u00E3o dos dados."
+        }
+      },
+      "messagesBuilder": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "SnkMessageBuilder",
+          "resolved": "SnkMessageBuilder",
+          "references": {
+            "SnkMessageBuilder": {
+              "location": "import",
+              "path": "../../../../lib/message/SnkMessageBuilder"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Respons\u00E1vel por flexibilizar e padronizar o uso de mensagens nos blocos de constru\u00E7\u00E3o."
+        }
+      }
+    };
+  }
+  static get states() {
+    return {
+      "_defaultType": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "configOptionsChanged",
+        "name": "configOptionsChanged",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitido ao realizar alguma altera\u00E7\u00E3o nos campos."
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get elementRef() { return "_element"; }
+}