@sankhyalabs/sankhyablocks 1.4.0-beta.7 → 1.4.0-beta.9

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

@@ -0,0 +1,315 @@
+import { h, Host } from "@stencil/core";
+import { ApplicationContext, UserInterface, ObjectUtils } 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() {
+    /**
+     * Armazena as propriedades do campo
+     */
+    this.fieldConfig = {};
+  }
+  onConfigDefault(optionSelected) {
+    if (optionSelected != undefined) {
+      this._defaultType = optionSelected;
+      this.fieldConfig.defaultValue = {
+        type: this._defaultType
+      };
+      this.configOptionsChanged.emit(this.fieldConfig);
+    }
+  }
+  buildOptions() {
+    var _a, _b, _c;
+    const 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;
+    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);
+    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._application.messagesBuilder.getMessage(key, params);
+  }
+  getDefaultType() {
+    var _a;
+    return (_a = this.fieldConfig.defaultValue.type) !== null && _a !== void 0 ? _a : DEFAULT_TYPE.fixed;
+  }
+  getEnabledByProperty(property) {
+    const properties = this._fieldProperties;
+    if (properties != undefined && properties[property] === true) {
+      return false;
+    }
+    return 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(field) {
+    const { config, descriptor } = field;
+    const { name, label, readOnly, required, defaultValue } = config;
+    const { userInterface, properties } = descriptor;
+    const enabled = (properties === null || properties === void 0 ? void 0 : properties.allowDefault) != undefined ? properties.allowDefault === "true" : !readOnly;
+    let value;
+    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);
+  }
+  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({
+            descriptor: this._fieldProperties,
+            config: 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"), 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"), 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/components/ez-form/ez-form"
+            }
+          }
+        },
+        "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"
+        }
+      }
+    };
+  }
+  static get states() {
+    return {
+      "_defaultType": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "configOptionsChanged",
+        "name": "configOptionsChanged",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Evento disparado ao realizar alguma altera\u00E7\u00E3o nos campos"
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get elementRef() { return "_element"; }
+}

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

@@ -0,0 +1,164 @@
+:host {
+  /* dimensions */
+  /*@doc Define a altura do componente.*/
+  --snk-field-config--height: 42px;
+  /*@doc Define a largura do componente.*/
+  --snk-field-config--width: 100%;
+  /*@doc Define a largura do slot que contém o ícone.*/
+  --snk-field-config__icon--width: 48px;
+  /*@doc Define a altura do componente em modo "slim".*/
+  --snk-field-config--height--slim: 32px;
+
+  /* general */
+  /*@doc Define o raio da borda do input do componente.*/
+  --snk-field-config--border-radius: var(--border--radius-medium, 12px);
+  /*@doc Define o tamanho da fonte do input e label do componente.*/
+  --snk-field-config--font-size: var(--text--medium, 14px);
+  /*@doc Define a família da fonte do input, label e caixa de mensagem do componente.*/
+  --snk-field-config--font-family: var(--font-pattern, Arial);
+  /*@doc Define o peso da fonte do label do componente.*/
+  --snk-field-config--font-weight: var(--text-weight--medium, 400);
+  /*@doc Define a cor da fonte do input e label do componente.*/
+  --snk-field-config--color: var(--title--primary, #000);
+
+  /* input */
+  /*@doc Define a cor de fundo do input.*/
+  --snk-field-config__input--background-color: var(--background--medium, #e0e0e0);
+  /*@doc Define o estilo da borda do input.*/
+  --snk-field-config__input--border: var(--border--medium, 2px solid);
+  /*@doc Define a cor da borda do input.*/
+  --snk-field-config__input--border-color: var(--background--xlight, #fff);
+  /*no modo normal usamos a borda com a mesma cor do bg*/
+  --snk-field-config__required--color: var(--color--error, #FF0000);
+
+   /*no modo normal usamos a borda com a mesma cor do bg*/
+   --snk-field-config__transition--visibility: var(--transition, 0.2s linear);
+   --snk-field-config__transition--opacity: var(--transition, 0.15s linear);
+
+  /***************
+  host style  
+  ***************/
+  /*private*/
+  display: flex;
+  flex-wrap: wrap;
+  position: relative;
+
+  /*public*/
+  width: var(--snk-field-config--width);
+}
+
+.field-config {
+  /*private*/
+  width: 100%;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+
+  /*public*/
+  padding-left: var(--space--medium, 6px);
+  font-weight: var(--snk-field-config--font-weight);
+  height: var(--snk-field-config--height);
+  border-radius: var(--snk-field-config--border-radius);
+  font-family: var(--snk-field-config--font-family);
+  font-size: var(--snk-field-config--font-size);
+  border: var(--snk-field-config__input--border);
+  border-color: var(--snk-field-config__input--border-color);
+  background-color: var(--snk-field-config__input--background-color);
+  color: var(--snk-field-config--color);
+}
+
+.field-config__config-popover {
+  width: 40px;
+  margin-left: auto;
+  z-index: var(--more-visible, 2);
+}
+
+.field-config__required-label {
+  padding-left: var(--space--extra-small, 3px);
+
+  /*public*/
+  color: var(--snk-field-config__required--color);
+}
+
+.field-config__add {
+  display: flex;
+  margin-left: auto;
+
+  visibility:hidden;
+  opacity:0;
+  transition: visibility var(--snk-field-config__transition--visibility), opacity var(--snk-field-config__transition--opacity);
+}
+
+
+.field-config__options {
+  display: flex;
+  margin-left: auto;
+
+  visibility:hidden;
+  opacity:0;
+  transition: visibility var(--snk-field-config__transition--visibility), opacity var(--snk-field-config__transition--opacity);
+}
+
+.field-config__options--is-active {
+  display: flex;
+  visibility:visible;
+  opacity:1;
+}
+
+.field-config__remove-icon {
+  margin-right: -15px;
+}
+
+.field-config:hover .field-config__options {
+  display: flex;
+  visibility:visible;
+  opacity:1;
+}
+
+.field-config:hover .field-config__add {
+  visibility:visible;
+  opacity:1;
+}
+
+
+.field-config__draggable {
+  padding-right: var(--space--small, 6px);
+}
+
+.field-config__config-outer-arrow {
+  background-color: var(--color--secondary-200);
+  clip-path: polygon(50% 0, 90% 100%, 10% 100%);
+  border-radius: 0.25em 0 0 0;
+  width: 30px;
+  height: 15px;
+  padding-top: 3px;
+  border-bottom: 1px solid #FFFFFF;
+}
+
+.field-config__config-inner-arrow {
+  background-color: #FFFFFF;
+  clip-path: polygon(50% 0, 90% 100%, 10% 100%);
+  border-radius: 0.25em 0 0 0;
+  width: 30px;
+  height: 15px;
+}
+
+.ez-box__container ez-collapsible-box {
+  --snk-collapsible-box__header--padding-left: 6px;
+}
+
+ez-icon {
+  /*public*/
+  --snk-icon--color: var(--snk-field-config--color)
+}
+
+ez-popover {
+  --snk-popover__box--background-color: transparent;
+  --snk-popover__box--box-shadow: none
+}
+
+.field-config__options ez-button {
+  --snk-button--background-color: transparent;
+  --snk-button--focus--border: none;
+  --snk-button--focus--box-shadow: none;
+}

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

@@ -0,0 +1,140 @@
+import { ApplicationContext } from "@sankhyalabs/core";
+import { h, Host } from "@stencil/core";
+import { ACTION_CONFIG } from "../../../../lib/utils/constants";
+export class SnkFieldConfig {
+  constructor() {
+    /**
+     * Define se o popover de configuração está ativo.
+     */
+    this.isConfigActive = false;
+    /**
+     * Define se o componente está em modo de inserção
+     */
+    this.modeInsertion = true;
+  }
+  handleAction(evt, type) {
+    evt.preventDefault();
+    evt.stopPropagation();
+    const field = this.fieldConfig;
+    if (type !== ACTION_CONFIG.configuration) {
+      field.group = undefined;
+    }
+    this.ezClickIcon.emit({ field, type });
+  }
+  /**
+   * Conforme mecanismo de mensagens, é possível customizar as mensagens dos blocos de construção
+   * através de um pequeno modulo na estrutura da aplicação:
+   * - Criar um arquivo no seguinte caminho: /messages/appmessages.msg.js.
+   * Para conhecer os detalhes do módulo, vide o arquivo neste projeto "/src/lib/message/resources/snk-form.msg.ts"
+   */
+  getMessage(key) {
+    return this._application.messagesBuilder.getMessage(key, {});
+  }
+  componentWillLoad() {
+    this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+  }
+  render() {
+    if (this.fieldConfig == undefined) {
+      return;
+    }
+    return (h(Host, null, h("div", { class: "field-config" }, h("div", { class: "field-config__draggable" }, h("ez-icon", { iconName: "drag-indicator", size: "small" })), h("div", null, this.fieldConfig.label, this.fieldConfig.required && h("span", { class: "field-config__required-label" }, "*")), this.modeInsertion ?
+      h("div", { class: "field-config__add" }, h("ez-button", { onClick: (evt) => this.handleAction(evt, ACTION_CONFIG.add), mode: "icon", class: "ez-button--tertiary", iconName: "plus", size: "large", title: this.getMessage("snkFieldConfig.titleAdd") })) :
+      h("div", { class: "field-config__options" + (this.isConfigActive ? " field-config__options--is-active" : " ") }, h("ez-button", { mode: "icon", class: "ez-button--tertiary field-config__remove-icon", onClick: (evt) => this.handleAction(evt, ACTION_CONFIG.remove), iconName: "minus", size: "large", title: this.getMessage("snkFieldConfig.titleRemove") }), h("ez-button", { id: "buttonConfig_" + this.fieldConfig.name, mode: "icon", class: "ez-button--tertiary", onClick: (evt) => this.handleAction(evt, ACTION_CONFIG.configuration), iconName: this.isConfigActive ? "chevron-up" : "settings-inverted", size: "large", title: this.getMessage("snkFieldConfig.titleConfigurations") }))), this.isConfigActive && h("div", { class: "field-config__config-popover" }, h("div", { class: "field-config__config-outer-arrow" }, h("div", { class: "field-config__config-inner-arrow" })))));
+  }
+  static get is() { return "snk-field-config"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["snk-field-config.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["snk-field-config.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "isConfigActive": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "Boolean",
+          "resolved": "Boolean",
+          "references": {
+            "Boolean": {
+              "location": "global"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Define se o popover de configura\u00E7\u00E3o est\u00E1 ativo."
+        },
+        "defaultValue": "false"
+      },
+      "fieldConfig": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "IFieldConfig",
+          "resolved": "IFieldConfig",
+          "references": {
+            "IFieldConfig": {
+              "location": "import",
+              "path": "@sankhyalabs/ezui/dist/types/components/ez-form/ez-form"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Armazena as propriedades do campo"
+        }
+      },
+      "modeInsertion": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Define se o componente est\u00E1 em modo de inser\u00E7\u00E3o"
+        },
+        "attribute": "mode-insertion",
+        "reflect": true,
+        "defaultValue": "true"
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "ezClickIcon",
+        "name": "ezClickIcon",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Evento disparado ao pressionar button icon(onEzClickIcon)"
+        },
+        "complexType": {
+          "original": "Object",
+          "resolved": "Object",
+          "references": {
+            "Object": {
+              "location": "global"
+            }
+          }
+        }
+      }];
+  }
+}