@sankhyalabs/sankhyablocks 6.9.2 → 7.0.0

package/dist/collection/components/snk-personalized-filter/snk-personalized-filter.js

@@ -3,7 +3,7 @@ import { ApplicationContext, StringUtils } from '@sankhyalabs/core';
 import { PersonalizedFilterUtils } from './subcomponents/snk-filter-param-config/utils/PersonalizedFilterUtils';
 import { ConfigStorage } from "../../lib/configs/ConfigStorage";
 import { ApplicationUtils } from "@sankhyalabs/ezui/dist/collection/utils";
-import { ObjectUtils } from "@sankhyalabs/core";
+import { ObjectUtils, ElementIDUtils } from "@sankhyalabs/core";
 import { FilterGroupCondition } from './interfaces/IExpressionItem';
 import store from '../../lib/store';
 import PersonalizedFilterFetcher from "../../lib/http/data-fetcher/fetchers/personalized-filter-fetcher";
@@ -90,6 +90,13 @@ export class SnkPersonalizedFilter {
     }
     this.loadFilter(this.filterId, undefined);
   }
+  componentDidRender() {
+    var _a;
+    (_a = this._viewStackRef) === null || _a === void 0 ? void 0 : _a.show(this._filterAssistentMode ? 0 : 1);
+    if (this._elButtonMode) {
+      this._elButtonMode.setAttribute(ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME, ElementIDUtils.getInternalIDInfo(`${this._filterAssistentMode ? "advancedMode_ezButton" : "assistentMode_ezButton"}`));
+    }
+  }
   getMessage(key, params) {
     return this._application.messagesBuilder.getMessage(key, params);
   }
@@ -107,26 +114,55 @@ export class SnkPersonalizedFilter {
   removeFilter() {
     ConfigStorage.removePersonalizedFilter(this._filterAssistent, this.configName);
   }
-  async handleFilterGroupChange() {
-    const assistent = await this._mainExpressionGroup.getExpressionGroup();
-    this._filterAssistent = Object.assign(Object.assign({}, this._filterAssistent), { assistent });
-    this._filterAssistent.parameters = PersonalizedFilterUtils.buildVariableParameters(this._filterAssistent.assistent);
-    this._elTextAreaExpression.value = PersonalizedFilterUtils.buildGroupExpression(this._filterAssistent.assistent, true);
-    this._elButtonSave.enabled = !this.hasChangesToSave();
-  }
   hasChangesToSave() {
     return JSON.stringify(this._filterAssistent) === JSON.stringify(this._originalFilterAssistent);
   }
-  handleSave() {
+  async handleSave() {
+    if (this._filterAssistentMode) {
+      const isValid = PersonalizedFilterUtils.validateFields(this._filterAssistent.assistent);
+      if (!isValid || !this._filterAssistent.name)
+        return this._application.error(this.getMessage("snkPersonalizedFilter.error.title"), this.getMessage("snkPersonalizedFilter.error.description"));
+      this.saveAssistentMode();
+    }
+    else {
+      if (!this._filterAssistent.expression || !this._filterAssistent.name)
+        return this._application.error(this.getMessage("snkPersonalizedFilter.error.title"), this.getMessage("snkPersonalizedFilter.error.description"));
+      const isValidExpressionForAdvancedMode = await this.validateExpressionBeforeSaving();
+      if (!isValidExpressionForAdvancedMode)
+        return;
+      this.saveAdvancedMode();
+    }
+  }
+  saveAssistentMode() {
     const { assistent, expression } = this._filterAssistent;
-    const isValid = PersonalizedFilterUtils.validateFields(assistent);
-    if (!isValid || !this._filterAssistent.name)
-      return this._application.error(this.getMessage("snkPersonalizedFilter.error.title"), this.getMessage("snkPersonalizedFilter.error.description"));
     const expressionQuery = !!assistent ? PersonalizedFilterUtils.buildGroupExpression(assistent) : expression;
     this._filterAssistent.expression = expressionQuery;
     this.ezSave.emit(expressionQuery);
     this.saveFilter();
   }
+  saveAdvancedMode() {
+    if (this._filterAssistent.assistent) {
+      ApplicationUtils.confirm(this.getMessage("snkPersonalizedFilter.confirmSaveModeAdvanced.title"), this.getMessage("snkPersonalizedFilter.confirmSaveModeAdvanced.description"))
+        .then((confirm) => {
+        if (!confirm)
+          return;
+        this.saveAndTransformToAdvancedMode();
+      });
+    }
+    else {
+      this.saveAndTransformToAdvancedMode();
+    }
+  }
+  saveAndTransformToAdvancedMode() {
+    this._filterAssistent.assistent = undefined;
+    this.ezSave.emit(this._filterAssistent.expression);
+    this.saveFilter();
+  }
+  async validateExpressionBeforeSaving() {
+    const { valid, message } = await this._personalizedFilterFetcher.validatePersonalizedFilter(this.entityUri, this._filterAssistent.expression);
+    valid || this._application.error(this.getMessage("snkPersonalizedFilter.error.title"), message);
+    return valid;
+  }
   handleCancel() {
     if (this.hasChangesToSave()) {
       return this.ezCancel.emit();
@@ -160,32 +196,87 @@ export class SnkPersonalizedFilter {
     }
     return resp;
   }
-  handleExpressionChange(expression) {
+  handleExpressionChangeAdvancedMode(expression) {
     this._filterAssistent = Object.assign(Object.assign({}, this._filterAssistent), { expression });
     this._elButtonSave.enabled = !this.hasChangesToSave();
   }
-  getWarningMessageComponent() {
-    var _a;
-    if (StringUtils.isEmpty((_a = this._filterAssistent) === null || _a === void 0 ? void 0 : _a.warningMessage)) {
-      return undefined;
+  handleChangeFilterAssistentMode(filterAssistent) {
+    this._elButtonSave.enabled = !this.hasChangesToSave();
+    this._filterAssistent = Object.assign({}, filterAssistent);
+  }
+  selectField(fieldName) {
+    if (!('name' in fieldName))
+      return;
+    const fieldExpression = this.buildExpression(fieldName.entityName, fieldName.name, fieldName.entityPath);
+    const textAreaElement = this._elAdvancedMode.querySelector('ez-text-area');
+    textAreaElement.appendTextToSelection(fieldExpression);
+  }
+  buildExpression(entityName, fieldName, entityPath) {
+    if (entityPath.length > 0) {
+      entityPath.shift();
     }
-    return (h("div", { class: "ez-flex" }, h("ez-alert", { alertType: "warn" }, this._filterAssistent.warningMessage)));
+    return entityPath.length > 0 ? `${entityPath.join("->")}->${fieldName}` : `${entityName}.${fieldName}`;
+  }
+  onAddField(target) {
+    const textAreaElement = this._elAdvancedMode.querySelector('ez-text-area');
+    const options = { horizontalGap: 0, verticalGap: 12, fromRight: true };
+    textAreaElement.setFocus();
+    target.setBlur();
+    if (this._elFilterFieldSearch)
+      this._elFilterFieldSearch.show(target, options);
+  }
+  renderButtonAddField() {
+    if (this._filterAssistentMode)
+      return;
+    return (h(Fragment, null, h("ez-button", { class: "snk-personalized-filter__button-mode", label: this.getMessage("snkPersonalizedFilter.info.addField"), enabled: true, onClick: (evt) => this.onAddField(evt.target) }, h("ez-icon", { class: "ez-padding-right--small", slot: "leftIcon", iconName: "plus" })), h("snk-filter-field-search", { class: "ez-padding-left--medium", ref: ref => this._elFilterFieldSearch = ref, onEzSelectFilterItem: (evt) => this.selectField(evt.detail), fieldsDataSource: this._dataSourceFetcher })));
   }
   buildContainerPersonalizedFilter() {
-    var _a, _b, _c;
+    return (h("ez-view-stack", { ref: (ref) => this._viewStackRef = ref }, h("stack-item", null, this._filterAssistentMode &&
+      h("snk-filter-assistent-mode", { filterAssistent: this._filterAssistent, messagesBuilder: this.messagesBuilder, filterId: this.filterId, entityUri: this.entityUri, application: this._application, onEzChangeFilter: (ev) => this.handleChangeFilterAssistentMode(ev.detail) })), h("stack-item", null, h("snk-filter-advanced-mode", { ref: (ref) => this._elAdvancedMode = ref, filterAssistent: this._filterAssistent, application: this._application, onEzExpressionChange: (ev) => this.handleExpressionChangeAdvancedMode(ev.detail) }))));
+  }
+  handleModeChange() {
+    var _a, _b;
     if (this._filterAssistentMode) {
-      return (h(Fragment, null, h("div", { class: "ez-padding-top--small snk-personalized-filter__group" }, h("snk-expression-group", { ref: (el) => this._mainExpressionGroup = el, group: (_a = this._filterAssistent) === null || _a === void 0 ? void 0 : _a.assistent, messagesBuilder: this.messagesBuilder, onEzFilterGroupChange: this.handleFilterGroupChange.bind(this), filterId: this.filterId, entityURI: this.entityUri })), h("div", null, h("div", { class: "snk-personalized-filter__expression-input--line" }), h("ez-collapsible-box", { label: this.getMessage("snkPersonalizedFilter.info.titleCollapsible"), headerSize: "medium", value: true }, h("div", { class: "ez-box" }, h("div", { class: "ez-box__container" }, h("ez-text-area", { ref: (el) => this._elTextAreaExpression = el, enabled: false, label: this.getMessage("snkPersonalizedFilter.info.labelExpression"), value: (_b = this._filterAssistent) === null || _b === void 0 ? void 0 : _b.expression })))))));
+      ApplicationUtils.confirm(this.getMessage("snkPersonalizedFilter.confirmChangeModeAssistent.title"), this.getMessage("snkPersonalizedFilter.confirmChangeModeAssistent.description"))
+        .then((canCancel) => {
+        if (!canCancel)
+          return;
+        this._filterAssistentMode = !this._filterAssistentMode;
+        if (!this.hasChangesToSave()) {
+          const expression = PersonalizedFilterUtils.buildGroupExpression(this._filterAssistent.assistent);
+          this._filterAssistent.expression = expression;
+          this._elButtonSave.enabled = !this.hasChangesToSave();
+        }
+      });
     }
     else {
-      return (h(Fragment, null, h("span", { class: "ez-text ez-text--small ez-text--bold ez-padding-bottom--medium" }, this.getMessage("snkPersonalizedFilter.info.applyExpression")), h("ez-text-area", { label: this.getMessage("snkPersonalizedFilter.info.labelExpression"), value: (_c = this._filterAssistent) === null || _c === void 0 ? void 0 : _c.expression, onEzChange: (evt) => this.handleExpressionChange(evt.detail) }), this.getWarningMessageComponent()));
+      if (((_a = this._filterAssistent) === null || _a === void 0 ? void 0 : _a.expression) === ((_b = this._originalFilterAssistent) === null || _b === void 0 ? void 0 : _b.expression)) {
+        this._filterAssistentMode = !this._filterAssistentMode;
+      }
+      else {
+        const expressionBefore = this._filterAssistent.expression;
+        const expression = PersonalizedFilterUtils.buildGroupExpression(this._filterAssistent.assistent);
+        if (expressionBefore !== expression) {
+          ApplicationUtils.confirm(this.getMessage("snkPersonalizedFilter.confirmChangeModeAdvanced.title"), this.getMessage("snkPersonalizedFilter.confirmChangeModeAdvanced.description"))
+            .then((canCancel) => {
+            if (!canCancel)
+              return;
+            this._filterAssistent = Object.assign(Object.assign({}, this._filterAssistent), { expression });
+            this._filterAssistentMode = !this._filterAssistentMode;
+          });
+        }
+        else {
+          this._filterAssistentMode = !this._filterAssistentMode;
+        }
+      }
     }
   }
   render() {
-    var _a, _b;
+    var _a, _b, _c, _d;
     if (!((_a = this._filterAssistent) === null || _a === void 0 ? void 0 : _a.assistent) && this._filterAssistentMode) {
       return;
     }
-    return (h(Host, null, h("div", { class: "snk-personalized-filter" }, h("div", null, h("snk-simple-bar", { label: this.filterId ? this.getMessage("snkPersonalizedFilter.info.titleEdit") : this.getMessage("snkPersonalizedFilter.info.titleAdd"), onExit: () => this.handleCancel() }, h("div", { class: "snk-personalized-filter__header-actions", slot: "rightSlot" }, h("ez-button", { size: "small", label: this.getMessage("snkPersonalizedFilter.info.labelCancel"), onClick: () => this.handleCancel() }), h("ez-button", { size: "small", ref: (el) => this._elButtonSave = el, enabled: false, class: "ez-button--primary", label: this.getMessage("snkPersonalizedFilter.info.labelSave"), onClick: this.handleSave.bind(this) })))), h("div", { class: "ez-box ez-margin-bottom--medium ez-box__main" }, h("div", { class: "ez-box__container" }, h("div", { class: "ez-flex ez-flex--column ez-size-width--full" }, h("div", { class: "ez-flex" }, h("ez-text-input", { class: "ez-padding-right--medium", label: this.getMessage("snkPersonalizedFilter.info.labelNameFilter"), value: (_b = this._filterAssistent) === null || _b === void 0 ? void 0 : _b.name, onEzChange: (evt) => this.handleTitleChange(evt.detail) })), this.buildContainerPersonalizedFilter()))))));
+    return (h(Host, null, h("div", { class: "snk-personalized-filter" }, h("div", null, h("snk-simple-bar", { label: this.filterId ? this.getMessage("snkPersonalizedFilter.info.titleEdit") : this.getMessage("snkPersonalizedFilter.info.titleAdd"), onExit: () => this.handleCancel() }, h("div", { class: "snk-personalized-filter__header-actions", slot: "rightSlot" }, h("ez-button", { size: "small", label: this.getMessage("snkPersonalizedFilter.info.labelCancel"), onClick: () => this.handleCancel() }), h("ez-button", { size: "small", ref: (el) => this._elButtonSave = el, enabled: false, class: "ez-button--primary", label: this.getMessage("snkPersonalizedFilter.info.labelSave"), onClick: this.handleSave.bind(this) })))), h("div", { class: "ez-box ez-margin-bottom--medium ez-box__main" }, h("div", { class: "ez-box__container" }, h("div", { class: "ez-flex ez-flex--column ez-size-width--full" }, h("div", { class: "ez-flex" }, h("ez-text-input", { class: "ez-padding-right--medium", label: this.getMessage("snkPersonalizedFilter.info.labelNameFilter"), value: (_b = this._filterAssistent) === null || _b === void 0 ? void 0 : _b.name, onEzChange: (evt) => this.handleTitleChange(evt.detail) }), this.renderButtonAddField(), h("ez-button", { ref: (el) => this._elButtonMode = el, class: "snk-personalized-filter__button-mode", label: this._filterAssistentMode ? this.getMessage("snkPersonalizedFilter.info.activeModeAdvanced") : this.getMessage("snkPersonalizedFilter.info.activeModeAssistent"), onClick: () => this.handleModeChange(), "data-tooltip": !(this._filterAssistentMode || ((_c = this._filterAssistent) === null || _c === void 0 ? void 0 : _c.assistent)) ? this.getMessage("snkPersonalizedFilter.info.tooltipDisabledAssistentMode") : undefined, "data-flow": "bottom", enabled: (!this._filterAssistent.name || Boolean(this._filterAssistentMode || ((_d = this._filterAssistent) === null || _d === void 0 ? void 0 : _d.assistent))) })), this.buildContainerPersonalizedFilter()))))));
   }
   static get is() { return "snk-personalized-filter"; }
   static get encapsulation() { return "scoped"; }

package/dist/collection/components/snk-personalized-filter/subcomponents/snk-expression-group/snk-expression-group.js

@@ -25,8 +25,8 @@ export class SnkExpressionGroup {
     this.updateDashes();
   }
   /*
-  * Retorna o grupo da expressão.
-  */
+   * Retorna o grupo da expressão.
+   */
   async getExpressionGroup() {
     return this._group;
   }
@@ -40,9 +40,7 @@ export class SnkExpressionGroup {
     if (!this.getDataGroupLevel()) {
       this._element.setAttribute('data-group-level', this.FIRST_LEVEL);
     }
-    if (!this.filterId) {
-      this.canAddExpression = false;
-    }
+    this.canAddExpression = this.group.items.every(this.isFilledItem);
   }
   componentDidRender() {
     this.setSelfTop();
@@ -227,7 +225,7 @@ export class SnkExpressionGroup {
   }
   render() {
     const canAddGroup = this.canAddGroup();
-    return (h(Host, null, h("div", { class: !this.isFirstLevel() && this._showDashes ? 'dashes' : 'hidden', style: this.buildGroupStyle() }), h("div", { class: !this.isFirstLevel() && this._showDashes ? 'horizontal-dashes' : 'hidden' }), h("div", { class: 'ez-flex ez-flex--align-items-center' }, h("div", { class: 'snk-expression-group__container-condition ez-flex ez-flex-item--align-center ez-flex--align-items-center', "data-condition": this._conditionOperator, title: this.getTooltipMessageForOperator() }, h("label", { class: "ez-label ez-padding-right--medium ez-padding-left--medium ez-title--primary" }, this.getMessage("snkPersonalizedFilter.info.condition")), h("div", null, h("ez-combo-box", Object.assign({ class: "snk-expression-group__container-option", canShowError: false, mode: "slim", suppressEmptyOption: true, enabled: this.canChangeGroupCondition(), value: this._conditionOperator, onEzChange: (evt) => this.handleConditionOperatorChange(evt.detail.value) }, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: `comboBoxConditions_level_${this.getDataGroupLevel()}` }), h("option", { value: FilterGroupCondition.AND }, "E"), h("option", { value: FilterGroupCondition.OR }, "OU")))), h("ez-button", { class: "ez-padding-right--medium ez-padding-left--medium", mode: "icon", iconName: "plus", size: "small", enabled: this.canAddExpression, title: this.getMessageAddTooltip(), onClick: () => this.handleAddExpression() }), h("ez-button", { label: this.getMessage("snkPersonalizedFilter.info.addGroup"), size: "small", enabled: canAddGroup, title: !canAddGroup ? this.getMessage('snkPersonalizedFilter.info.labelDisabledAddGroupButton', { LIMIT_GROUP_LEVEL: this.LIMIT_GROUP_LEVEL + 1 }) : '', onClick: () => this.handleAddGroup() }, h("ez-icon", { slot: "leftIcon", iconName: "plus" })), !this.isFirstLevel() && h("ez-button", { title: this.getMessage("snkPersonalizedFilter.info.labelDeleteExpression"), class: "ez-padding-left--medium", mode: "icon", iconName: "delete", size: "small", onClick: (evt) => this.confirmRemoveGroup(evt) })), h("div", { class: "ez-padding-top--small snk-expression-group__container-expression" }, h("div", { class: "ez-padding-top--small" }, this.renderExpressionItems())), h("div", { class: "ez-padding-top--small snk-expression-group__container-expression" }, h("div", { class: "ez-padding-top--small" }, this.renderGroups()))));
+    return (h(Host, null, h("div", { class: !this.isFirstLevel() && this._showDashes ? 'dashes' : 'hidden', style: this.buildGroupStyle() }), h("div", { class: !this.isFirstLevel() && this._showDashes ? 'horizontal-dashes' : 'hidden' }), h("div", { class: 'ez-flex ez-flex--align-items-center' }, h("div", { class: 'snk-expression-group__container-condition ez-flex ez-flex-item--align-center ez-flex--align-items-center', "data-condition": this._conditionOperator, title: this.getTooltipMessageForOperator() }, h("label", { class: "ez-label ez-padding-right--medium ez-padding-left--medium ez-title--primary" }, this.getMessage("snkPersonalizedFilter.info.condition")), h("div", null, h("ez-combo-box", Object.assign({ class: "snk-expression-group__container-option", canShowError: false, mode: "slim", suppressEmptyOption: true, enabled: this.canChangeGroupCondition(), value: this._conditionOperator, onEzChange: (evt) => this.handleConditionOperatorChange(evt.detail.value) }, { [ElementIDUtils.DATA_ELEMENT_ID_ATTRIBUTE_NAME]: `comboBoxConditions_level_${this.getDataGroupLevel()}` }), h("option", { value: FilterGroupCondition.AND }, "E"), h("option", { value: FilterGroupCondition.OR }, "OU")))), h("ez-button", { class: "ez-padding-right--medium ez-padding-left--medium", mode: "icon", iconName: "plus", size: "small", enabled: this.canAddExpression, title: this.getMessageAddTooltip(), onClick: () => this.handleAddExpression() }), h("ez-button", { label: this.getMessage("snkPersonalizedFilter.info.addGroup"), size: "small", enabled: canAddGroup, title: !canAddGroup ? this.getMessage('snkPersonalizedFilter.info.labelDisabledAddGroupButton', { LIMIT_GROUP_LEVEL: this.LIMIT_GROUP_LEVEL + 1 }) : '', onClick: () => this.handleAddGroup() }, h("ez-icon", { class: "ez-padding-right--small", slot: "leftIcon", iconName: "plus" })), !this.isFirstLevel() && h("ez-button", { title: this.getMessage("snkPersonalizedFilter.info.labelDeleteExpression"), class: "ez-padding-left--medium", mode: "icon", iconName: "delete", size: "small", onClick: (evt) => this.confirmRemoveGroup(evt) })), h("div", { class: "ez-padding-top--small snk-expression-group__container-expression" }, h("div", { class: "ez-padding-top--small" }, this.renderExpressionItems())), h("div", { class: "ez-padding-top--small snk-expression-group__container-expression" }, h("div", { class: "ez-padding-top--small" }, this.renderGroups()))));
   }
   static get is() { return "snk-expression-group"; }
   static get encapsulation() { return "scoped"; }

package/dist/collection/components/snk-personalized-filter/subcomponents/snk-expression-item/snk-expression-item.js

@@ -38,7 +38,8 @@ export class SnkExpressionItem {
     }
   }
   componentDidRender() {
-    this._showValueVariable = this._elValueVariable.value;
+    var _a;
+    this._showValueVariable = (_a = this._elValueVariable) === null || _a === void 0 ? void 0 : _a.value;
   }
   updateFieldSelected() {
     const field = {

package/dist/collection/components/snk-personalized-filter/subcomponents/snk-filter-advanced-mode/snk-filter-advanced-mode.css

@@ -0,0 +1,10 @@
+:host {
+  display: block;
+
+  /*@doc Define a cor da fonte do título.*/
+  --snk-personalized-filter--title--color: var(--title--primary, #2B3A54);
+}
+
+.snk-filter-advanced-mode__title {
+  color: var(--snk-personalized-filter--title--color);
+}

package/dist/collection/components/snk-personalized-filter/subcomponents/snk-filter-advanced-mode/snk-filter-advanced-mode.js

@@ -0,0 +1,95 @@
+import { Host, h } from '@stencil/core';
+import { StringUtils } from '@sankhyalabs/core';
+export class SnkFilterAdvancedMode {
+  constructor() {
+    this.filterAssistent = undefined;
+    this.application = undefined;
+  }
+  getMessage(key, params) {
+    return this.application.messagesBuilder.getMessage(key, params);
+  }
+  getWarningMessageComponent() {
+    var _a;
+    if (StringUtils.isEmpty((_a = this.filterAssistent) === null || _a === void 0 ? void 0 : _a.warningMessage))
+      return undefined;
+    return (h("div", { class: "ez-flex" }, h("ez-alert", { alertType: "warn" }, this.filterAssistent.warningMessage)));
+  }
+  render() {
+    var _a;
+    return (h(Host, null, h("span", { class: "ez-title ez-title--small ez-padding-bottom--small snk-filter-advanced-mode__title" }, this.getMessage("snkPersonalizedFilter.info.applyExpression")), h("ez-text-area", { rows: 9, label: this.getMessage("snkPersonalizedFilter.info.labelExpression"), value: (_a = this.filterAssistent) === null || _a === void 0 ? void 0 : _a.expression, onEzChange: (evt) => this.ezExpressionChange.emit(evt.detail) }), this.getWarningMessageComponent()));
+  }
+  static get is() { return "snk-filter-advanced-mode"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["snk-filter-advanced-mode.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["snk-filter-advanced-mode.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "filterAssistent": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "IPersonalizedFilter",
+          "resolved": "IPersonalizedFilter",
+          "references": {
+            "IPersonalizedFilter": {
+              "location": "import",
+              "path": "../../interfaces/IPersonalizedFilter"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Propriedade que cont\u00E9m informa\u00E7\u00F5es do filtro personalizado."
+        }
+      },
+      "application": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "SnkApplication",
+          "resolved": "SnkApplication",
+          "references": {
+            "SnkApplication": {
+              "location": "import",
+              "path": "../../../snk-application/snk-application"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Propriedade que mant\u00E9m informa\u00E7\u00F5es relacionadas ao SnkApplication."
+        }
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "ezExpressionChange",
+        "name": "ezExpressionChange",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Evento emitido sempre que uma edi\u00E7\u00E3o na express\u00E3o \u00E9 realizada."
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+}

package/dist/collection/components/snk-personalized-filter/subcomponents/snk-filter-assistent-mode/snk-filter-assistent-mode.css

@@ -0,0 +1,66 @@
+:host {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+
+  /*@doc Define a família da fonte.*/
+  --text-area--font-family: var(--font-pattern, Arial);
+  /*@doc Define o posicionamento do label.*/
+  --text-area__label--floating--top: var(--space--small, 6px);
+  /*@doc Define o raio da borda do container*/
+  --snk-filter-assistent-mode__container--border-radius: var(--border--radius-medium, 12px);
+  /*@doc Define a cor de fundo do container.*/
+  --snk-filter-assistent-mode__container--background: var(--background--medium, #f0f3f7);
+  /*@doc Define a margem interna do container*/
+  --snk-filter-assistent-mode__container--margin: var(--space--small, 6px) var(--space--medium, 12px);
+}
+
+.ez-box__container--external {
+  /*private*/
+  height: 100px;
+  width: 100%;
+  overflow-y: auto;
+
+  /*public*/
+  background-color: var(--snk-filter-assistent-mode__container--background);
+  border-radius: var(--snk-filter-assistent-mode__container--border-radius);
+}
+
+.ez-box__container--internal {
+  /*public*/
+  margin: var(--snk-filter-assistent-mode__container--margin);
+}
+
+.ez-box__container--title{
+  /*private*/
+  display: block;
+  user-select: none;
+
+  /*public*/
+  font-family: var(--text-area--font-family);
+  font-size: var(--text--extra-small);
+  color: var(--title--primary);
+  top: var(--text-area__label--floating--top);
+}
+
+.ez-box__container--expression{
+  /*private*/
+  display: block;
+
+  /*public*/
+  font-family: var(--text-area--font-family);
+  font-size: var(--text--medium);
+  color: var(--title--primary);
+  top: var(--text-area__label--floating--top);
+}
+
+.snk-personalized-filter__expression-input--line {
+  /*private*/
+  width: 100%;
+  height: 2px; 
+
+  /*public*/
+  background-color: var(--snk-personalized-filter--background-color-line);
+  margin-top: var(--snk-personalized-filter--margin-line);
+  margin-bottom: var(--snk-personalized-filter--margin-line);
+}

package/dist/collection/components/snk-personalized-filter/subcomponents/snk-filter-assistent-mode/snk-filter-assistent-mode.js

@@ -0,0 +1,158 @@
+import { Host, h } from '@stencil/core';
+import { PersonalizedFilterUtils } from '../../subcomponents/snk-filter-param-config/utils/PersonalizedFilterUtils';
+export class SnkFilterAssistentMode {
+  constructor() {
+    this.filterAssistent = undefined;
+    this.messagesBuilder = undefined;
+    this.filterId = undefined;
+    this.entityUri = undefined;
+    this.application = undefined;
+  }
+  getMessage(key, params) {
+    return this.application.messagesBuilder.getMessage(key, params);
+  }
+  async handleFilterGroupChange() {
+    const assistent = await this._mainExpressionGroup.getExpressionGroup();
+    this.filterAssistent = Object.assign(Object.assign({}, this.filterAssistent), { assistent });
+    this.filterAssistent.parameters = PersonalizedFilterUtils.buildVariableParameters(this.filterAssistent.assistent);
+    this.filterAssistent.expression = PersonalizedFilterUtils.buildGroupExpression(this.filterAssistent.assistent);
+    this.ezChangeFilter.emit(this.filterAssistent);
+  }
+  render() {
+    var _a, _b;
+    return (h(Host, null, h("div", { class: "ez-padding-top--small snk-personalized-filter__group" }, h("snk-expression-group", { ref: (el) => this._mainExpressionGroup = el, group: (_a = this.filterAssistent) === null || _a === void 0 ? void 0 : _a.assistent, messagesBuilder: this.messagesBuilder, onEzFilterGroupChange: this.handleFilterGroupChange.bind(this), filterId: this.filterId, entityURI: this.entityUri })), h("div", { class: "ez-margin-top--auto" }, h("div", { class: "snk-personalized-filter__expression-input--line" }), h("ez-collapsible-box", { label: this.getMessage("snkPersonalizedFilter.info.titleCollapsible"), headerSize: "medium", value: true }, h("div", { class: "ez-box" }, h("div", { class: "ez-box__container--external" }, h("div", { class: "ez-box__container--internal" }, h("span", { class: "ez-box__container--title" }, this.getMessage("snkPersonalizedFilter.info.labelExpression")), h("span", { class: "ez-box__container--expression" }, (_b = this.filterAssistent) === null || _b === void 0 ? void 0 : _b.expression))))))));
+  }
+  static get is() { return "snk-filter-assistent-mode"; }
+  static get encapsulation() { return "scoped"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["snk-filter-assistent-mode.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["snk-filter-assistent-mode.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "filterAssistent": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "IPersonalizedFilter",
+          "resolved": "IPersonalizedFilter",
+          "references": {
+            "IPersonalizedFilter": {
+              "location": "import",
+              "path": "../../interfaces/IPersonalizedFilter"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Propriedade que cont\u00E9m informa\u00E7\u00F5es do filtro personalizado."
+        }
+      },
+      "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."
+        }
+      },
+      "filterId": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Id do filtro que ser\u00E1 carregado."
+        },
+        "attribute": "filter-id",
+        "reflect": false
+      },
+      "entityUri": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Respons\u00E1vel por receber a URI da entidade."
+        },
+        "attribute": "entity-uri",
+        "reflect": false
+      },
+      "application": {
+        "type": "unknown",
+        "mutable": true,
+        "complexType": {
+          "original": "SnkApplication",
+          "resolved": "SnkApplication",
+          "references": {
+            "SnkApplication": {
+              "location": "import",
+              "path": "../../../snk-application/snk-application"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Propriedade que mant\u00E9m informa\u00E7\u00F5es relacionadas ao SnkApplication."
+        }
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "ezChangeFilter",
+        "name": "ezChangeFilter",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "IPersonalizedFilter",
+          "resolved": "IPersonalizedFilter",
+          "references": {
+            "IPersonalizedFilter": {
+              "location": "import",
+              "path": "../../interfaces/IPersonalizedFilter"
+            }
+          }
+        }
+      }];
+  }
+}

package/dist/collection/components/snk-personalized-filter/subcomponents/snk-filter-param-config/snk-filter-param-config.js

@@ -12,6 +12,9 @@ export class SnkFilterParamConfig {
     this._canSave = false;
     this.messagesBuilder = undefined;
   }
+  /**
+   * Abre o modal de configuração de valor variável
+   */
   open(expressionItem) {
     this._opened = true;
     this._expressionItem = expressionItem;
@@ -20,6 +23,9 @@ export class SnkFilterParamConfig {
       this._promiseResolver = accept;
     });
   }
+  /**
+   * Fecha o modal de configuração de valor variável
+   */
   close() {
     this._opened = false;
     return new Promise(accept => {
@@ -255,7 +261,7 @@ export class SnkFilterParamConfig {
           "return": "Promise<IExpressionItem>"
         },
         "docs": {
-          "text": "",
+          "text": "Abre o modal de configura\u00E7\u00E3o de valor vari\u00E1vel",
           "tags": []
         }
       },
@@ -275,7 +281,7 @@ export class SnkFilterParamConfig {
           "return": "Promise<IExpressionItem>"
         },
         "docs": {
-          "text": "",
+          "text": "Fecha o modal de configura\u00E7\u00E3o de valor vari\u00E1vel",
           "tags": []
         }
       }