@sankhyalabs/ezui 3.6.0 → 4.0.1

package/dist/custom-elements/index.js

@@ -1,6 +1,6 @@
 import { HTMLElement as HTMLElement$1, createEvent, h, Host, forceUpdate, proxyCustomElement } from '@stencil/core/internal/client';
 export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
-import { FloatingManager, ElementIDUtils, JSUtils, StringUtils as StringUtils$1, ObjectUtils as ObjectUtils$1, DateUtils as DateUtils$1, TimeFormatter, Action, WaitingChangeException, ApplicationContext, UserInterface, DataUnitAction, DataUnit, NumberUtils as NumberUtils$1, DataType, SortMode, MaskFormatter } from '@sankhyalabs/core';
+import { UserInterface, DateUtils as DateUtils$1, Action, WaitingChangeException, ApplicationContext, DataUnitAction, FloatingManager, ElementIDUtils, ObjectUtils as ObjectUtils$1, JSUtils, StringUtils as StringUtils$1, TimeFormatter, DataUnit, NumberUtils as NumberUtils$1, DataType, SortMode, MaskFormatter } from '@sankhyalabs/core';
 
 var DialogType;
 (function (DialogType) {
@@ -149,6 +149,509 @@ var CheckMode;
   CheckMode["SWITCH"] = "SWITCH";
 })(CheckMode || (CheckMode = {}));
 
+const DETAIL_PATTERN = /child\[([^\]]+)\]/;
+const REGEX_DEFAULT_VAR_KEY = /\$\{.+\}/;
+class FormMetadata {
+  constructor() {
+    this._sheets = new Map();
+    this._requiredFields = [];
+    this._cleanOnCopyFields = [];
+    this._defaultValues = {};
+  }
+  static getDetailName(name) {
+    const result = DETAIL_PATTERN.exec(name);
+    return result ? result[1] : undefined;
+  }
+  getSheet(name) {
+    return this._sheets.get(name);
+  }
+  getAllSheets() {
+    return this._sheets;
+  }
+  addSheet(sheet) {
+    this._sheets.set(sheet.name, sheet);
+  }
+  addRequiredFields(fields) {
+    this._requiredFields = this._requiredFields.concat(fields);
+  }
+  getRequiredFields() {
+    return this._requiredFields;
+  }
+  addCleanOnCopyFields(fields) {
+    this._cleanOnCopyFields = this._cleanOnCopyFields.concat(fields);
+  }
+  getCleanOnCopyFields() {
+    return this._cleanOnCopyFields;
+  }
+  addDefaultValues(defaultValues) {
+    return this._defaultValues = Object.assign(Object.assign({}, this._defaultValues), defaultValues);
+  }
+  getDefaultValues() {
+    const result = {};
+    Object.entries(this._defaultValues).forEach(([key, value]) => {
+      if (typeof value === "string") {
+        const result = REGEX_DEFAULT_VAR_KEY.exec(value);
+        if (result) {
+          value = this.getDefaultVar(result[0]);
+        }
+      }
+      result[key] = value;
+    });
+    return result;
+  }
+  getDefaultVar(name) {
+    if (name === "${data}") {
+      return DateUtils$1.getToday();
+    }
+    if (name === "${datahora}") {
+      return DateUtils$1.getToday(true);
+    }
+    return this._defaultVars ? this._defaultVars.get(name) : undefined;
+  }
+  setDefaultVars(vars) {
+    this._defaultVars = vars;
+  }
+}
+const buildFormConfigFromDataUnit = (dataUnit) => {
+  const unitMD = dataUnit.metadata;
+  let fields;
+  if (unitMD) {
+    fields = unitMD.fields
+      .filter(descriptor => descriptor.visible !== false)
+      .map(descriptor => { return { name: descriptor.name, defaultValue: descriptor.defaultValue }; });
+  }
+  const config = { fields };
+  return config;
+};
+const buildFormMetadata = (config, dataUnit, includeDetails = false) => {
+  var _a, _b;
+  if (config == undefined) {
+    config = buildFormConfigFromDataUnit(dataUnit);
+  }
+  const sheets = new Map();
+  const hiddenTabs = new Map();
+  const requiredFields = [];
+  const cleanOnCopyFields = [];
+  const defaultValues = {};
+  (_a = config === null || config === void 0 ? void 0 : config.tabs) === null || _a === void 0 ? void 0 : _a.forEach((tab) => {
+    if (!hiddenTabs.has(tab.label) && tab.visible === false) {
+      hiddenTabs.set(tab.label, tab);
+    }
+  });
+  (_b = config === null || config === void 0 ? void 0 : config.fields) === null || _b === void 0 ? void 0 : _b.forEach((field) => {
+    var _a, _b, _c;
+    if (field.visible !== false) {
+      const tabConfig = getTabConfig(field.tab || "__main", sheets);
+      if (hiddenTabs.has(tabConfig.label)) {
+        return;
+      }
+      const descriptor = dataUnit.getField(field.name);
+      if (descriptor && tabConfig.visible) {
+        if (!sheets.has(tabConfig)) {
+          sheets.set(tabConfig, []);
+        }
+        const formField = buildFormField(descriptor, field);
+        sheets.get(tabConfig).push(formField);
+        if (formField.required) {
+          requiredFields.push(field.name);
+        }
+        const cleanOnCopy = field.cleanOnCopy == undefined ? (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy : field.cleanOnCopy;
+        if (cleanOnCopy || ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.cleanOnCopy)) {
+          cleanOnCopyFields.push(field.name);
+        }
+        let defaultValue = field.defaultValue == undefined ? (_c = descriptor.properties) === null || _c === void 0 ? void 0 : _c.defaultValue : field.defaultValue;
+        if (defaultValue) {
+          if ((typeof defaultValue === "object") && defaultValue["type"] === "V") {
+            // Atualmente a configuração do formulário eventualmente deposita um objeto
+            // prototipado como {type: "V", value: "${nome.de.variavel}"} para campos com
+            // valor padrão do tipo variável. Dessa forma precisamos "desenvelopar" o valor
+            // para que a variável chegue corretamente a seu destino.
+            defaultValue = defaultValue["value"];
+          }
+          defaultValues[field.name] = defaultValue;
+        }
+      }
+    }
+  });
+  const metadata = new FormMetadata();
+  metadata.setDefaultVars(config.defaultVars);
+  if (includeDetails) {
+    const unitMD = dataUnit.metadata;
+    if (unitMD != undefined && unitMD.children != undefined) {
+      unitMD.children.forEach(child => {
+        const { label, name, fields } = buildDetailSheet(child);
+        sheets.set({ name, label }, fields);
+      });
+    }
+  }
+  Array.from(sheets.entries())
+    .sort(sortTabs)
+    .forEach(([key, fields]) => {
+    metadata.addSheet({
+      label: (key.label === "__main") ? "Principal" : key.label,
+      name: key.name || key.label,
+      fields
+    });
+  });
+  metadata.addRequiredFields(requiredFields);
+  metadata.addCleanOnCopyFields(cleanOnCopyFields);
+  metadata.addDefaultValues(defaultValues);
+  return metadata;
+};
+const buildFormField = (descriptor, config) => {
+  let { name, label, group } = Object.assign({}, config);
+  let { readOnly, required } = Object.assign({}, config);
+  let props;
+  let userInterface;
+  if (descriptor) {
+    label = label || descriptor.label;
+    name = name || descriptor.name;
+    required = descriptor.required || (config === null || config === void 0 ? void 0 : config.required);
+    readOnly = descriptor.readOnly || (config === null || config === void 0 ? void 0 : config.readOnly);
+    props = descriptor.properties;
+    userInterface = descriptor.userInterface;
+  }
+  return {
+    name, label, group,
+    readOnly, required,
+    props,
+    userInterface: userInterface || UserInterface.SHORTTEXT
+  };
+};
+const getTabConfig = (tab, sheets) => {
+  const tabConfig = (typeof tab === "string" ? Array.from(sheets.keys()).find(t => t.label === tab) : tab);
+  return tabConfig || { label: tab, visible: true };
+};
+const sortTabs = (a, b) => {
+  return a[0].label == '__main' ? -1 : (a[0].order || 10000) - (b[0].order || 10000);
+};
+const buildDetailSheet = (child) => {
+  return {
+    name: `child[${child.name}]`,
+    label: child.label,
+    fields: []
+  };
+};
+
+class DataBinder {
+  constructor(dataUnit) {
+    this._invalidFields = new Map();
+    this.onDataUnitEvent = (action) => {
+      var _a;
+      switch (action.type) {
+        case Action.DATA_LOADED:
+        case Action.DATA_SAVED:
+        case Action.RECORDS_REMOVED:
+        case Action.RECORDS_ADDED:
+        case Action.RECORDS_COPIED:
+        case Action.EDITION_CANCELED:
+        case Action.SELECTION_CHANGED:
+        case Action.NEXT_SELECTED:
+        case Action.PREVIOUS_SELECTED:
+          this.clearInvalid();
+        case Action.DATA_CHANGED:
+        case Action.CHANGE_UNDONE:
+        case Action.CHANGE_REDONE:
+        case Action.RECORD_LOADED:
+          (_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
+            this.updateValue(field.fieldName, field.field);
+          });
+          break;
+      }
+    };
+    this._fields = new Map();
+    this._dataUnit = dataUnit;
+    this._dataUnit.subscribe(this.onDataUnitEvent);
+    this._dataUnit.addInterceptor(this);
+  }
+  bind(fields, currentContextName, formMetadata, recordsValidator) {
+    fields.forEach(fieldElement => {
+      const { fieldName, contextName } = fieldElement.dataset;
+      if (contextName == undefined || contextName === currentContextName) {
+        this.updateBind(fieldName, fieldElement);
+      }
+    });
+    this._formMetadata = formMetadata;
+    this._recordsValidator = recordsValidator;
+  }
+  onDisconnectedCallback() {
+    this._dataUnit.unsubscribe(this.onDataUnitEvent);
+    this._dataUnit.removeInterceptor(this);
+  }
+  markInvalid(field) {
+    this._invalidFields.set(field.name, field);
+    if (this._fields.has(field.name)) {
+      const fieldElement = this._fields.get(field.name).field;
+      if (!fieldElement["errorMessage"]) {
+        this.updateErrorMessage(field.name, fieldElement);
+      }
+    }
+  }
+  clearInvalid() {
+    this._invalidFields.clear();
+    this._fields.forEach(fieldBinder => {
+      const fieldElement = fieldBinder.field;
+      fieldElement["errorMessage"] = "";
+    });
+  }
+  updateValue(fieldName, field) {
+    const bind = this._fields.get(fieldName);
+    try {
+      if (bind) {
+        bind.listen = false;
+      }
+      field["value"] = this._dataUnit.getFieldValue(fieldName);
+      this.updateErrorMessage(fieldName, field);
+    }
+    finally {
+      if (bind) {
+        bind.listen = true;
+      }
+    }
+  }
+  validate() {
+    return new Promise((accept, reject) => {
+      var _a;
+      const records = this._dataUnit.getModifiedRecords();
+      for (let i = 0; i < records.length; i++) {
+        const record = records[i];
+        const invalidResults = [];
+        let validationResult = this.validateRequired(record);
+        if (validationResult && !validationResult.isValid) {
+          invalidResults.push(validationResult);
+        }
+        validationResult = (_a = this._recordsValidator) === null || _a === void 0 ? void 0 : _a.validateRecord(record);
+        if (validationResult && !validationResult.isValid) {
+          invalidResults.push(validationResult);
+        }
+        if (invalidResults.length > 0) {
+          this.processValidationResult(invalidResults);
+          reject();
+          break;
+        }
+      }
+      return accept();
+    });
+  }
+  validateRequired(record) {
+    const requiredFields = this._formMetadata.getRequiredFields();
+    const invalidFields = [];
+    new Set(requiredFields).forEach(field => {
+      const value = record[field];
+      if (value == undefined || value === "") {
+        const errorMessage = this.getErrorMessage(field);
+        if (errorMessage) {
+          invalidFields.push({ name: field, message: errorMessage });
+        }
+        else {
+          invalidFields.push({ name: field, message: "Essa informação é obrigatória" });
+        }
+      }
+    });
+    if (invalidFields.length > 0) {
+      return { isValid: false, invalidFields, infoMessage: "Há pelo menos um campo obrigatório não preenchido." };
+    }
+    return undefined;
+  }
+  processValidationResult(validationResult) {
+    validationResult.forEach(invalidResult => {
+      const invalidFields = invalidResult.invalidFields;
+      if (invalidFields) {
+        invalidFields.forEach(field => {
+          this.markInvalid(field);
+        });
+      }
+      if (invalidResult.infoMessage) {
+        ApplicationUtils.info(invalidResult.infoMessage);
+      }
+      if (invalidResult.errorMessage) {
+        const { errorTitle, errorMessage } = invalidResult;
+        ApplicationUtils.error(errorTitle, errorMessage);
+      }
+    });
+  }
+  updateErrorMessage(fieldName, field) {
+    const invalidField = this._invalidFields.get(fieldName);
+    if (invalidField) {
+      field["errorMessage"] = invalidField.message;
+    }
+  }
+  getErrorMessage(fieldName) {
+    if (this._fields.has(fieldName)) {
+      const fieldElement = this._fields.get(fieldName).field;
+      return fieldElement["errorMessage"] || null;
+    }
+    return undefined;
+  }
+  updateBind(fieldName, field) {
+    const oldBind = this._fields.get(fieldName);
+    if (oldBind) {
+      oldBind.destroy();
+    }
+    field["value"] = this._dataUnit.getFieldValue(fieldName);
+    this.updateErrorMessage(fieldName, field);
+    this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, waitingChange) => this.changeStarted(fieldName, waitingChange), (fieldName) => this.cancelWaitingChange(fieldName), (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
+    this.bindSearchOptionsLoader(fieldName, field);
+    this.applyEzUploadContext(fieldName, field);
+  }
+  changeStarted(fieldName, waitingChange) {
+    /**
+     * se o waitingChange não é blocante, add um event listener pra
+     * fazer o accept da promise
+     *
+     * se não tiver promise no waitingChange, eu crio uma e resolvo no bind
+     *
+     *
+     */
+    if (this._dataUnit.records.length === 0) {
+      this._dataUnit.addRecord();
+    }
+    if (!waitingChange.blocking && waitingChange.promise == undefined) {
+      const bind = this._fields.get(fieldName);
+      if (bind) {
+        waitingChange.promise = new Promise((resolve, reject) => {
+          bind.waitingChangePromiseResolve = resolve;
+          bind.waitingChangePromiseReject = reject;
+        });
+      }
+    }
+    this._dataUnit.startChange(fieldName, waitingChange);
+  }
+  cancelWaitingChange(fieldName) {
+    if (this._dataUnit.waitingForChange(fieldName)) {
+      this._dataUnit.cancelWaitingChange(fieldName);
+      const bind = this._fields.get(fieldName);
+      if (bind) {
+        bind.rejectWaitingChange(new WaitingChangeException("Change canceled", fieldName));
+      }
+    }
+  }
+  setFieldValue(fieldName, newValue) {
+    if (this._dataUnit.records.length === 0) {
+      this._dataUnit.addRecord();
+    }
+    this._invalidFields.delete(fieldName);
+    this._dataUnit.setFieldValue(fieldName, newValue);
+    if (this._dataUnit.waitingForChange(fieldName)) {
+      const bind = this._fields.get(fieldName);
+      if (bind) {
+        bind.acceptWaitingChange();
+      }
+    }
+  }
+  bindSearchOptionsLoader(fieldName, field) {
+    if (field.nodeName === "EZ-SEARCH" && field["optionLoader"] == undefined) {
+      const loader = ApplicationContext.getContextValue("__EZUI__SEARCH__OPTION__LOADER__");
+      if (loader) {
+        field["optionLoader"] = (arg) => {
+          return loader(arg, fieldName, this._dataUnit);
+        };
+      }
+    }
+  }
+  applyEzUploadContext(fieldName, field) {
+    var _a, _b;
+    if (field.nodeName === "EZ-UPLOAD") {
+      field["urlUpload"] = ApplicationContext.getContextValue("__EZUI__UPLOAD__ADD__URL__");
+      field["urlDelete"] = ApplicationContext.getContextValue("__EZUI__UPLOAD__DEL__URL__");
+      const descriptor = this._dataUnit.getField(fieldName);
+      const destination = (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.DESTINATION;
+      if (destination) {
+        field["requestHeaders"] = { XTRAINF: `{"destination": "${destination}"}` };
+      }
+      field["maxFiles"] = ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.MAX_FILES) || 0;
+    }
+  }
+  interceptAction(action) {
+    var _a;
+    if (action.type === Action.RECORDS_COPIED) {
+      const cleanFields = this._formMetadata.getCleanOnCopyFields();
+      if (cleanFields) {
+        const records = action.payload;
+        return new DataUnitAction(Action.RECORDS_COPIED, records.map(record => {
+          const newRecord = Object.assign({}, record);
+          cleanFields.forEach(fieldName => delete newRecord[fieldName]);
+          return newRecord;
+        }));
+      }
+    }
+    if (action.type === Action.SAVING_DATA) {
+      return new Promise((resolve) => {
+        this.validate()
+          .then(() => resolve(action))
+          .catch(() => { });
+      });
+    }
+    if (action.type === Action.RECORDS_ADDED) {
+      const defaultValues = (_a = this._formMetadata) === null || _a === void 0 ? void 0 : _a.getDefaultValues();
+      if (defaultValues) {
+        const records = action.payload;
+        return new DataUnitAction(Action.RECORDS_ADDED, records.map(record => {
+          const newRecord = Object.assign({}, record);
+          for (const field in defaultValues) {
+            const defaultValue = this.getFormattedValue(defaultValues[field]);
+            const recordValue = typeof defaultValue === "function" ? defaultValue() : defaultValue;
+            newRecord[field] = this._dataUnit.valueFromString(field, recordValue);
+          }
+          return newRecord;
+        }));
+      }
+    }
+    return action;
+  }
+  getFormattedValue(defaultValue) {
+    if (defaultValue == undefined || typeof defaultValue !== "object") {
+      return defaultValue;
+    }
+    if ("formattedValue" in defaultValue) {
+      return defaultValue.formattedValue;
+    }
+    return defaultValue.value;
+  }
+}
+class Bind {
+  constructor() {
+    this.listen = true;
+    this.startChangeEventName = "ezStartChange";
+    this.cancelWaitingChangeEventName = "ezCancelWaitingChange";
+    this.changeEventName = "ezChange";
+  }
+  destroy() {
+    this.field.removeEventListener(this.startChangeEventName, this.startChangeListener);
+    this.field.removeEventListener(this.cancelWaitingChangeEventName, this.cancelWaitingChangeListener);
+    this.field.removeEventListener(this.changeEventName, this.changeListener);
+  }
+  acceptWaitingChange() {
+    if (this.waitingChangePromiseResolve) {
+      this.waitingChangePromiseResolve();
+      this.waitingChangePromiseReject = undefined;
+      this.waitingChangePromiseResolve = undefined;
+    }
+  }
+  rejectWaitingChange(reason) {
+    if (this.waitingChangePromiseReject) {
+      this.waitingChangePromiseReject(reason);
+      this.waitingChangePromiseReject = undefined;
+      this.waitingChangePromiseResolve = undefined;
+    }
+  }
+  static create(fieldName, field, startChangeCallback, cancelWaitingChangeCallback, changeCallback) {
+    const b = new Bind();
+    b.field = field;
+    b.fieldName = fieldName;
+    b.startChangeListener = (evt) => { if (b.listen)
+      startChangeCallback(fieldName, evt.detail); };
+    b.field.addEventListener(b.startChangeEventName, b.startChangeListener);
+    b.cancelWaitingChangeListener = () => { if (b.listen)
+      cancelWaitingChangeCallback(fieldName); };
+    b.field.addEventListener(b.cancelWaitingChangeEventName, b.cancelWaitingChangeListener);
+    b.changeListener = (evt) => { if (b.listen)
+      changeCallback(fieldName, evt.detail); };
+    b.field.addEventListener(b.changeEventName, b.changeListener);
+    return b;
+  }
+}
+
 const ezActionsButtonCss = ":host{--ez-actions-button__actions-list--border-radius:var(--border--radius-medium, 12px);--ez-actions-button__actions-list--box-shadow:var(--shadow, 0px 0px 16px 0px #000);--ez-actions-button__actions-list--background-color:var(--background--xlight, #fff);--ez-actions-button__actions-list--padding:var(--space--small, 6px);--ez-actions-button__actions-list--top-margin:var(--space-small, 6px);--ez-actions-button__btn-action--min-width:'auto';--ez-actions-button__btn-action--background-color:var(--background--xlight, #fff);display:flex;flex-direction:column;height:fit-content;user-select:none}.ez-actions-button__actions-list{display:flex;flex-direction:column;position:fixed;width:fit-content;height:fit-content;z-index:var(--more-visible, 2);padding:var(--ez-actions-button__actions-list--padding);margin-top:var(--ez-actions-button__actions-list--top-margin);background-color:var(--ez-actions-button__actions-list--background-color);border-radius:var(--ez-actions-button__actions-list--border-radius);box-shadow:var(--ez-actions-button__actions-list--box-shadow)}.ez-actions-button__actions-list--lowered{margin-top:calc(var(--ez-actions-button__actions-list--top-margin) + 6px)}.ez-actions-button__btn-action{--ez-button--justify-content:flex-start;--ez-button--width:100%;--ez-button--min-width:var(--ez-actions-button__btn-action--min-width);--ez-button--background-color:var(--ez-actions-button__btn-action--background-color);--ez-button--font-weight:var(--text-weight--medium, 400);--ez-button--padding-left:var(--space--medium, 12px);--ez-button--padding-right:var(--space--medium, 12px)}.ez-actions-button__btn-action--spaced{--ez-button--padding-left:calc(var(--space--medium, 12px) + 24px)}.ez-actions-button__icon-right{margin-left:var(--space--small, 6px)}.ez-actions-button__icon-check,.ez-actions-button__icon-item{position:absolute;left:var(--space--medium, 12px)}.ez-actions-button__icon-check{color:var(--ez-button--hover-color)}.ez-actions-button__arrow{position:absolute;border-left:10px solid transparent;border-right:10px solid transparent;width:0;height:0;z-index:calc(var(--more-visible, 2) + 1);border-bottom:15px solid var(--ez-actions-button__btn-action--background-color)}.ez-actions-button__arrow--upped{margin-top:calc((var(--ez-actions-button__actions-list--top-margin) + 2px) * -1)}.ez-actions-button__arrow--small{margin-left:6px}.ez-actions-button__arrow--medium{margin-left:11px}.ez-actions-button__arrow--large{margin-left:13px}.ez-actions-button__arrow:only-child{display:none}.ez-actions-button__btn-transparent{--ez-button--background-color:transparent;--ez-button--hover--background-color:transparent;--ez-button--active--background-color:transparent;--ez-button--focus--border:none}.ez-actions-button__btn-label{--ez-button--padding-left:var(--space--medium, 12px);--ez-button--padding-right:var(--space--medium, 12px)}.ez-actions-button__list-container{position:relative}";
 
 const EzActionsButton$1 = class extends HTMLElement$1 {
@@ -459,7 +962,10 @@ const EzBreadcrumb$1 = class extends HTMLElement$1 {
     this.showDropdown = false;
     this.collapseConfigPosition = -1;
   }
-  watchPropHandler() {
+  watchPropHandler(newValue, oldValue) {
+    if (ObjectUtils$1.objectToString(newValue || []) !== ObjectUtils$1.objectToString(oldValue || [])) {
+      this.loadItems();
+    }
     this.fillMode === "auto" && this.handleResize();
   }
   watchPropHiddenItems() {
@@ -472,7 +978,11 @@ const EzBreadcrumb$1 = class extends HTMLElement$1 {
     this.setEvents();
   }
   componentWillLoad() {
+    this.loadItems();
+  }
+  loadItems() {
     this.visibleItems = [...this.items];
+    this.hiddenItems = [];
     if (this.fillMode === 'regular') {
       this.configModeRegular();
     }
@@ -517,6 +1027,9 @@ const EzBreadcrumb$1 = class extends HTMLElement$1 {
       this._renderSecond = true;
       return;
     }
+    if (this._element.parentElement == undefined) {
+      return;
+    }
     let { offsetWidth } = this._element.parentElement;
     let sumVisibleItems = 0;
     this.visibleItems.forEach(item => sumVisibleItems += item.width);
@@ -1351,6 +1864,10 @@ const EzComboBox$1 = class extends HTMLElement$1 {
   }
   observeValue(newValue, oldValue) {
     if (this._textInput && newValue != oldValue) {
+      if (this.searchMode && typeof newValue === "string") {
+        this.setInputValue();
+        return;
+      }
       const newValueSelected = this.getSelectedOption(newValue);
       const oldValueSelected = this.getSelectedOption(oldValue);
       const currentValue = this.getSelectedOption(this.value);
@@ -1557,7 +2074,7 @@ const EzComboBox$1 = class extends HTMLElement$1 {
     var _a, _b;
     const currentValue = this.getSelectedOption(this.value);
     if ((((_a = currentValue === null || currentValue === void 0 ? void 0 : currentValue.value) === null || _a === void 0 ? void 0 : _a.toString()) !== ((_b = newOption === null || newOption === void 0 ? void 0 : newOption.value) === null || _b === void 0 ? void 0 : _b.toString()))
-      || (currentValue == undefined && "value" in newOption)) {
+      || (currentValue == undefined && newOption != undefined && "value" in newOption)) {
       const adjustedOpt = !(newOption === null || newOption === void 0 ? void 0 : newOption.value) ? undefined : newOption;
       this.value = adjustedOpt;
     }
@@ -1625,11 +2142,17 @@ const EzComboBox$1 = class extends HTMLElement$1 {
     }
   }
   validateDescriptionValue() {
-    if (!this.searchMode || typeof this.value !== "object") {
+    if (!this.searchMode || StringUtils$1.isEmpty(this.value)) {
       return;
     }
-    const { label, value } = this.value || {};
-    if (label || value == undefined) {
+    let value = this.value;
+    if (typeof value === "object") {
+      if (!StringUtils$1.isEmpty(value.label)) {
+        return;
+      }
+      value = value.value;
+    }
+    if (StringUtils$1.isEmpty(value)) {
       return;
     }
     this.loadDescriptionValue(value);
@@ -1729,16 +2252,12 @@ const EzComboBox$1 = class extends HTMLElement$1 {
     (_a = this._optionsList) === null || _a === void 0 ? void 0 : _a.querySelectorAll(".item").forEach((elem) => {
       ElementIDUtils.addIDInfoIfNotExists(elem, "itemComboBox");
     });
+    this.validateDescriptionValue();
   }
   componentDidLoad() {
     CSSVarsUtils.applyVarsTextInput(this.el, this._textInput);
     this.setInputValue(false);
   }
-  componentShouldUpdate(newValue, oldValue) {
-    if (this.isDifferentValues(newValue, oldValue)) {
-      this.validateDescriptionValue();
-    }
-  }
   //---------------------------------------------
   // Event handlers
   //---------------------------------------------
@@ -1981,7 +2500,7 @@ const EzDateInput$1 = class extends HTMLElement$1 {
     }
   }
   getTextValue(d) {
-    return d ? new Intl.DateTimeFormat("pt-BR").format(d) : undefined;
+    return d ? DateUtils$1.formatDate(d) : undefined;
   }
   handleInput(event) {
     const strValue = this._textInput.value;
@@ -2179,18 +2698,10 @@ const EzDateTimeInput$1 = class extends HTMLElement$1 {
     }
   }
   getTextValue(date) {
-    const options = {
-      year: 'numeric', month: 'numeric', day: 'numeric',
-      hour: 'numeric', minute: 'numeric'
-    };
-    const optionsSecond = {
-      year: 'numeric', month: 'numeric', day: 'numeric',
-      hour: 'numeric', minute: 'numeric', second: 'numeric'
-    };
-    if (!date)
+    if (!date) {
       return;
-    let formattedDate = new Intl.DateTimeFormat('pt-BR', this.showSeconds ? optionsSecond : options).format(date);
-    return formattedDate.replace(",", "");
+    }
+    return DateUtils$1.formatDateTime(date, this.showSeconds);
   }
   handleInput(event) {
     const newValue = this.getParsedDateTime();
@@ -3380,212 +3891,6 @@ function createStore(reducer, preloadedState, enhancer) {
   }, _ref2[$$observable] = observable, _ref2;
 }
 
-class DataBinder {
-  constructor(dataUnit) {
-    this._invalidFields = new Map();
-    this.onDataUnitEvent = (action) => {
-      var _a;
-      switch (action.type) {
-        case Action.DATA_LOADED:
-        case Action.DATA_SAVED:
-        case Action.RECORDS_REMOVED:
-        case Action.RECORDS_ADDED:
-        case Action.RECORDS_COPIED:
-        case Action.EDITION_CANCELED:
-        case Action.SELECTION_CHANGED:
-        case Action.NEXT_SELECTED:
-        case Action.PREVIOUS_SELECTED:
-          this.clearInvalid();
-        case Action.DATA_CHANGED:
-        case Action.CHANGE_UNDONE:
-        case Action.CHANGE_REDONE:
-        case Action.RECORD_LOADED:
-          (_a = this._fields) === null || _a === void 0 ? void 0 : _a.forEach(field => {
-            this.updateValue(field.fieldName, field.field);
-          });
-          break;
-      }
-    };
-    this._fields = new Map();
-    this._dataUnit = dataUnit;
-    this._dataUnit.subscribe(this.onDataUnitEvent);
-  }
-  bind(fields) {
-    fields.forEach(fieldElement => {
-      const fieldName = fieldElement.dataset.fieldName;
-      this.updateBind(fieldName, fieldElement);
-    });
-  }
-  onDisconnectedCallback() {
-    this._dataUnit.unsubscribe(this.onDataUnitEvent);
-  }
-  markInvalid(field) {
-    this._invalidFields.set(field.name, field);
-    if (this._fields.has(field.name)) {
-      const fieldElement = this._fields.get(field.name).field;
-      if (!fieldElement["errorMessage"]) {
-        this.updateErrorMessage(field.name, fieldElement);
-      }
-    }
-  }
-  clearInvalid() {
-    this._invalidFields.clear();
-    this._fields.forEach(fieldBinder => {
-      const fieldElement = fieldBinder.field;
-      fieldElement["errorMessage"] = "";
-    });
-  }
-  updateValue(fieldName, field) {
-    const bind = this._fields.get(fieldName);
-    try {
-      if (bind) {
-        bind.listen = false;
-      }
-      field["value"] = this._dataUnit.getFieldValue(fieldName);
-      this.updateErrorMessage(fieldName, field);
-    }
-    finally {
-      if (bind) {
-        bind.listen = true;
-      }
-    }
-  }
-  updateErrorMessage(fieldName, field) {
-    const invalidField = this._invalidFields.get(fieldName);
-    if (invalidField) {
-      field["errorMessage"] = invalidField.message;
-    }
-  }
-  getErrorMessage(fieldName) {
-    if (this._fields.has(fieldName)) {
-      const fieldElement = this._fields.get(fieldName).field;
-      return fieldElement["errorMessage"] || null;
-    }
-    return undefined;
-  }
-  updateBind(fieldName, field) {
-    const oldBind = this._fields.get(fieldName);
-    if (oldBind) {
-      oldBind.destroy();
-    }
-    field["value"] = this._dataUnit.getFieldValue(fieldName);
-    this.updateErrorMessage(fieldName, field);
-    this._fields.set(fieldName, Bind.create(fieldName, field, (fieldName, waitingChange) => this.changeStarted(fieldName, waitingChange), (fieldName) => this.cancelWaitingChange(fieldName), (fieldName, newValue) => this.setFieldValue(fieldName, newValue)));
-    this.bindSearchOptionsLoader(fieldName, field);
-    this.applyEzUploadContext(fieldName, field);
-  }
-  changeStarted(fieldName, waitingChange) {
-    /**
-     * se o waitingChange não é blocante, add um event listener pra
-     * fazer o accept da promise
-     *
-     * se não tiver promise no waitingChange, eu crio uma e resolvo no bind
-     *
-     *
-     */
-    if (this._dataUnit.records.length === 0) {
-      this._dataUnit.addRecord();
-    }
-    if (!waitingChange.blocking && waitingChange.promise == undefined) {
-      const bind = this._fields.get(fieldName);
-      if (bind) {
-        waitingChange.promise = new Promise((resolve, reject) => {
-          bind.waitingChangePromiseResolve = resolve;
-          bind.waitingChangePromiseReject = reject;
-        });
-      }
-    }
-    this._dataUnit.startChange(fieldName, waitingChange);
-  }
-  cancelWaitingChange(fieldName) {
-    if (this._dataUnit.waitingForChange(fieldName)) {
-      this._dataUnit.cancelWaitingChange(fieldName);
-      const bind = this._fields.get(fieldName);
-      if (bind) {
-        bind.rejectWaitingChange(new WaitingChangeException("Change canceled", fieldName));
-      }
-    }
-  }
-  setFieldValue(fieldName, newValue) {
-    if (this._dataUnit.records.length === 0) {
-      this._dataUnit.addRecord();
-    }
-    this._invalidFields.delete(fieldName);
-    this._dataUnit.setFieldValue(fieldName, newValue);
-    if (this._dataUnit.waitingForChange(fieldName)) {
-      const bind = this._fields.get(fieldName);
-      if (bind) {
-        bind.acceptWaitingChange();
-      }
-    }
-  }
-  bindSearchOptionsLoader(fieldName, field) {
-    if (field.nodeName === "EZ-SEARCH" && field["optionLoader"] == undefined) {
-      const loader = ApplicationContext.getContextValue("__EZUI__SEARCH__OPTION__LOADER__");
-      if (loader) {
-        field["optionLoader"] = (arg) => {
-          return loader(arg, fieldName, this._dataUnit);
-        };
-      }
-    }
-  }
-  applyEzUploadContext(fieldName, field) {
-    var _a, _b;
-    if (field.nodeName === "EZ-UPLOAD") {
-      field["urlUpload"] = ApplicationContext.getContextValue("__EZUI__UPLOAD__ADD__URL__");
-      field["urlDelete"] = ApplicationContext.getContextValue("__EZUI__UPLOAD__DEL__URL__");
-      const descriptor = this._dataUnit.getField(fieldName);
-      const destination = (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.DESTINATION;
-      if (destination) {
-        field["requestHeaders"] = { XTRAINF: `{"destination": "${destination}"}` };
-      }
-      field["maxFiles"] = ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.MAX_FILES) || 0;
-    }
-  }
-}
-class Bind {
-  constructor() {
-    this.listen = true;
-    this.startChangeEventName = "ezStartChange";
-    this.cancelWaitingChangeEventName = "ezCancelWaitingChange";
-    this.changeEventName = "ezChange";
-  }
-  destroy() {
-    this.field.removeEventListener(this.startChangeEventName, this.startChangeListener);
-    this.field.removeEventListener(this.cancelWaitingChangeEventName, this.cancelWaitingChangeListener);
-    this.field.removeEventListener(this.changeEventName, this.changeListener);
-  }
-  acceptWaitingChange() {
-    if (this.waitingChangePromiseResolve) {
-      this.waitingChangePromiseResolve();
-      this.waitingChangePromiseReject = undefined;
-      this.waitingChangePromiseResolve = undefined;
-    }
-  }
-  rejectWaitingChange(reason) {
-    if (this.waitingChangePromiseReject) {
-      this.waitingChangePromiseReject(reason);
-      this.waitingChangePromiseReject = undefined;
-      this.waitingChangePromiseResolve = undefined;
-    }
-  }
-  static create(fieldName, field, startChangeCallback, cancelWaitingChangeCallback, changeCallback) {
-    const b = new Bind();
-    b.field = field;
-    b.fieldName = fieldName;
-    b.startChangeListener = (evt) => { if (b.listen)
-      startChangeCallback(fieldName, evt.detail); };
-    b.field.addEventListener(b.startChangeEventName, b.startChangeListener);
-    b.cancelWaitingChangeListener = () => { if (b.listen)
-      cancelWaitingChangeCallback(fieldName); };
-    b.field.addEventListener(b.cancelWaitingChangeEventName, b.cancelWaitingChangeListener);
-    b.changeListener = (evt) => { if (b.listen)
-      changeCallback(fieldName, evt.detail); };
-    b.field.addEventListener(b.changeEventName, b.changeListener);
-    return b;
-  }
-}
-
 const inicialState = {};
 ///////////////////////////////     REDUCERS     ///////////////////////////////
 function formReducer(state = inicialState, action) {
@@ -3629,144 +3934,7 @@ var FormActions;
   FormActions["CHANGE_TAB"] = "FORM/CHANGE_TAB";
 })(FormActions || (FormActions = {}));
 
-class FormMetadata {
-  constructor() {
-    this._sheets = new Map();
-    this._requiredFields = [];
-    this._cleanOnCopyFields = [];
-    this._defaultValues = {};
-  }
-  getSheet(name) {
-    return this._sheets.get(name);
-  }
-  getAllSheets() {
-    return this._sheets;
-  }
-  addSheet(sheet) {
-    this._sheets.set(sheet.name, sheet);
-    this._requiredFields = this._requiredFields.concat(sheet.requiredFields);
-    this._cleanOnCopyFields = this._cleanOnCopyFields.concat(sheet.cleanOnCopyFields);
-    this._defaultValues = sheet.defaultValues;
-  }
-  getRequiredFields() {
-    return this._requiredFields;
-  }
-  getCleanOnCopyFields() {
-    return this._cleanOnCopyFields;
-  }
-  getDefaultValues() {
-    return this._defaultValues;
-  }
-}
-const buildFromDataUnit = (dataUnit) => {
-  const unitMD = dataUnit.metadata;
-  const metadata = new FormMetadata();
-  if (unitMD) {
-    const visibleFields = (unitMD.fields || []).filter(descriptor => descriptor.visible !== false);
-    const fields = visibleFields.map(descriptor => buildFormField(descriptor));
-    let defaultValues = {};
-    visibleFields
-      .filter(descriptor => descriptor.defaultValue)
-      .forEach((descriptor) => defaultValues[descriptor.name] = descriptor.defaultValue);
-    metadata.addSheet({
-      name: unitMD.name,
-      label: unitMD.label,
-      fields,
-      requiredFields: visibleFields
-        .filter(descriptor => descriptor.required)
-        .map(descriptor => descriptor.name),
-      cleanOnCopyFields: visibleFields
-        .filter(descriptor => { var _a, _b; return ((_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy) || ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.autoNum); })
-        .map(descriptor => descriptor.name),
-      defaultValues
-    });
-  }
-  return metadata;
-};
-const buildFromConfig = (config, dataUnit) => {
-  var _a, _b;
-  const sheets = new Map();
-  const hiddenTabs = new Map();
-  const requiredFields = [];
-  const cleanOnCopyFields = [];
-  const defaultValues = {};
-  (_a = config === null || config === void 0 ? void 0 : config.tabs) === null || _a === void 0 ? void 0 : _a.forEach((tab) => {
-    if (!hiddenTabs.has(tab.label) && tab.visible === false) {
-      hiddenTabs.set(tab.label, tab);
-    }
-  });
-  (_b = config === null || config === void 0 ? void 0 : config.fields) === null || _b === void 0 ? void 0 : _b.forEach((field) => {
-    var _a, _b, _c, _d;
-    if (field.visible !== false) {
-      const tabConfig = getTabConfig(field.tab || "__main", sheets);
-      if (hiddenTabs.has(tabConfig.label)) {
-        return;
-      }
-      const descriptor = dataUnit.getField(field.name);
-      if (descriptor && tabConfig.visible) {
-        if (!sheets.has(tabConfig)) {
-          sheets.set(tabConfig, []);
-        }
-        const formField = buildFormField(descriptor, field);
-        sheets.get(tabConfig).push(formField);
-        if (formField.required) {
-          requiredFields.push(field.name);
-        }
-        const cleanOnCopy = field.cleanOnCopy == undefined ? (_a = descriptor.properties) === null || _a === void 0 ? void 0 : _a.cleanOnCopy : field.cleanOnCopy;
-        if (cleanOnCopy || ((_b = descriptor.properties) === null || _b === void 0 ? void 0 : _b.autoNum) || ((_c = descriptor.properties) === null || _c === void 0 ? void 0 : _c.cleanOnCopy)) {
-          cleanOnCopyFields.push(field.name);
-        }
-        const defaultValue = field.defaultValue == undefined ? (_d = descriptor.properties) === null || _d === void 0 ? void 0 : _d.defaultValue : field.defaultValue;
-        if (defaultValue) {
-          defaultValues[field.name] = field.defaultValue;
-        }
-      }
-    }
-  });
-  const metadata = new FormMetadata();
-  Array.from(sheets.entries())
-    .sort(sortTabs)
-    .forEach(([key, fields]) => {
-    metadata.addSheet({
-      label: (key.label === "__main") ? "Principal" : key.label,
-      name: key.label,
-      fields,
-      requiredFields,
-      cleanOnCopyFields,
-      defaultValues
-    });
-  });
-  return metadata;
-};
-const buildFormField = (descriptor, config) => {
-  let { name, label, group } = Object.assign({}, config);
-  let { readOnly, required } = Object.assign({}, config);
-  let props;
-  let userInterface;
-  if (descriptor) {
-    label = label || descriptor.label;
-    name = name || descriptor.name;
-    required = descriptor.required || (config === null || config === void 0 ? void 0 : config.required);
-    readOnly = descriptor.readOnly || (config === null || config === void 0 ? void 0 : config.readOnly);
-    props = descriptor.properties;
-    userInterface = descriptor.userInterface;
-  }
-  return {
-    name, label, group,
-    readOnly, required,
-    props,
-    userInterface: userInterface || UserInterface.SHORTTEXT
-  };
-};
-const getTabConfig = (tab, sheets) => {
-  const tabConfig = (typeof tab === "string" ? Array.from(sheets.keys()).find(t => t.label === tab) : tab);
-  return tabConfig || { label: tab, visible: true };
-};
-const sortTabs = (a, b) => {
-  return a[0].label == '__main' ? -1 : (a[0].order || 10000) - (b[0].order || 10000);
-};
-
-const ezFormCss = ".sc-ez-form-h{display:flex;flex-direction:column;width:100%}.dynamic-content.sc-ez-form ez-collapsible-box.sc-ez-form{--ez-collapsible-box__header--padding-right:var(--space-small, 6px);--ez-collapsible-box__header--padding-left:var(--space-small, 6px)}.multi-level__container.sc-ez-form{display:grid;grid-template-columns:minmax(20%, 300px) auto;width:100%}";
+const ezFormCss = ".sc-ez-form-h{display:flex;flex-direction:column;width:100%}.dynamic-content.sc-ez-form ez-collapsible-box.sc-ez-form{--ez-collapsible-box__header--padding-right:var(--space-small, 6px);--ez-collapsible-box__header--padding-left:var(--space-small, 6px)}";
 
 const EzForm$1 = class extends HTMLElement$1 {
   constructor() {
@@ -3781,114 +3949,24 @@ const EzForm$1 = class extends HTMLElement$1 {
     this.dataUnit = undefined;
     this.config = undefined;
     this.recordsValidator = undefined;
-    this.multiLevel = undefined;
-    this.levelResolver = undefined;
-    this.contentBuilder = undefined;
   }
   /**
    * Realiza validação no conteúdo de todos os campos.
    */
   validate() {
-    return new Promise((accept, reject) => {
-      var _a;
-      const records = this.dataUnit.getModifiedRecords();
-      for (let i = 0; i < records.length; i++) {
-        const record = records[i];
-        const invalidResults = [];
-        let validationResult = this.validateRequired(record);
-        if (validationResult && !validationResult.isValid) {
-          invalidResults.push(validationResult);
-        }
-        validationResult = (_a = this.recordsValidator) === null || _a === void 0 ? void 0 : _a.validateRecord(this, record);
-        if (validationResult && !validationResult.isValid) {
-          invalidResults.push(validationResult);
-        }
-        if (invalidResults.length > 0) {
-          this.processValidationResult(invalidResults);
-          reject();
-          break;
-        }
-      }
-      accept();
-    });
+    return this._dataBinder.validate();
   }
   observeConfig() {
     this.processMetadata();
   }
-  validateRequired(record) {
-    const metadata = selectFormMetadata(this._store.getState());
-    const requiredFields = this._staticFields
-      .filter(f => f.dataset.required)
-      .map(f => f.dataset.fieldName)
-      .concat(metadata.getRequiredFields());
-    const invalidFields = [];
-    new Set(requiredFields).forEach(field => {
-      const value = record[field];
-      if (value == undefined || value === "") {
-        const errorMessage = this._dataBinder.getErrorMessage(field);
-        if (errorMessage) {
-          invalidFields.push({ name: field, message: errorMessage });
-        }
-        else {
-          invalidFields.push({ name: field, message: "Essa informação é obrigatória" });
-        }
-      }
-    });
-    if (invalidFields.length > 0) {
-      return { isValid: false, invalidFields, infoMessage: "Há pelo menos um campo obrigatório não preenchido." };
-    }
-    return undefined;
-  }
-  processValidationResult(validationResult) {
-    validationResult.forEach(invalidResult => {
-      const invalidFields = invalidResult.invalidFields;
-      if (invalidFields) {
-        invalidFields.forEach(field => {
-          this._dataBinder.markInvalid(field);
-        });
-      }
-      if (invalidResult.infoMessage) {
-        ApplicationUtils.info(invalidResult.infoMessage);
-      }
-      if (invalidResult.errorMessage) {
-        const { errorTitle, errorMessage } = invalidResult;
-        ApplicationUtils.error(errorTitle, errorMessage);
-      }
-    });
-  }
-  resolveLevel(items) {
-    if (!this.levelResolver) {
-      return items;
-    }
-    return this.levelResolver(items);
-  }
-  getMultiLevelContent(sheets, currentSheet, currentSheetId) {
-    const treeItems = this.resolveLevel(sheets.map(sheet => {
-      const item = {
-        id: sheet.name,
-        label: sheet.label
-      };
-      return item;
-    }));
-    return (h("div", { class: "multi-level__container" }, h("div", null, h("ez-tree", { selectedId: currentSheet === null || currentSheet === void 0 ? void 0 : currentSheet.name, items: treeItems, onEzChange: (evt) => {
-        var _a;
-        const selectedItem = (_a = evt.detail) === null || _a === void 0 ? void 0 : _a.id;
-        if (selectedItem && selectedItem !== (currentSheet === null || currentSheet === void 0 ? void 0 : currentSheet.name)) {
-          this._store.dispatch(changeTab(selectedItem));
-        }
-      } })), h("div", null, this.buildFormContent(currentSheetId, currentSheet))));
-  }
   getDynamicContent() {
-    var _a, _b;
+    var _a;
     const formMD = selectFormMetadata(this._store.getState());
-    if (!formMD)
+    if (!formMD) {
       return null;
-    const allSheets = Array.from(formMD.getAllSheets().values());
-    const currentSheetId = selectCurrentSheetId((_a = this._store) === null || _a === void 0 ? void 0 : _a.getState());
-    const currentSheet = selectCurrentSheet((_b = this._store) === null || _b === void 0 ? void 0 : _b.getState());
-    if (this.multiLevel) {
-      return this.getMultiLevelContent(allSheets, currentSheet, currentSheetId);
     }
+    const allSheets = Array.from(formMD.getAllSheets().values());
+    const currentSheet = selectCurrentSheet((_a = this._store) === null || _a === void 0 ? void 0 : _a.getState());
     let result = [];
     if (allSheets.length > 1) {
       const tabs = allSheets.map((sheet, index) => {
@@ -3897,26 +3975,20 @@ const EzForm$1 = class extends HTMLElement$1 {
       const idTabSelector = `selector`;
       result.push(h("ez-tabselector", { tabs: this.buildIdTabSelector(tabs), onEzChange: (evt) => this._store.dispatch(changeTab(evt.detail)), selectedTab: currentSheet.name, "data-element-id": idTabSelector }));
     }
-    result = result.concat(this.buildFormContent(currentSheetId, currentSheet));
+    result = result.concat(this.buildFormContent(currentSheet));
     return result;
   }
-  buildFormContent(sheetId, currentSheet) {
+  buildFormContent(currentSheet) {
     const fields = currentSheet === null || currentSheet === void 0 ? void 0 : currentSheet.fields;
-    if (this.contentBuilder != undefined) {
-      const customContent = this.contentBuilder(sheetId, fields);
-      if (customContent != undefined) {
-        return h("div", { "innerHTML": customContent });
-      }
-    }
     if (currentSheet == undefined) {
       return;
     }
     const idFormSheet = `${StringUtils$1.replaceAccentuatedChars(StringUtils$1.toCamelCase(currentSheet === null || currentSheet === void 0 ? void 0 : currentSheet.label), false)}_selectorContainer`;
-    return (h("div", { class: "dynamic-content ez-box__container", "data-element-id": idFormSheet }, h("ez-form-view", { class: "ez-row ez-padding-vertical--small", fields: fields })));
+    return (h("div", { class: "dynamic-content", "data-element-id": idFormSheet }, h("ez-form-view", { class: "ez-row ez-padding-vertical--small", fields: fields })));
   }
   processMetadata() {
     if (!this.isStatic() && this.dataUnit && this._store) {
-      const metadata = this.config != undefined && Object.values(this.config).length > 0 ? buildFromConfig(this.config, this.dataUnit) : buildFromDataUnit(this.dataUnit);
+      const metadata = buildFormMetadata(this.config, this.dataUnit);
       this._store.dispatch(loadMetadata(metadata));
     }
   }
@@ -3924,58 +3996,10 @@ const EzForm$1 = class extends HTMLElement$1 {
     var _a;
     return ((_a = this._staticFields) === null || _a === void 0 ? void 0 : _a.length) > 0;
   }
-  getFormattedValue(defaultValue) {
-    if (defaultValue == undefined || typeof defaultValue !== "object") {
-      return defaultValue;
-    }
-    if ("formattedValue" in defaultValue) {
-      return defaultValue.formattedValue;
-    }
-    return defaultValue.value;
-  }
-  interceptAction(action) {
-    if (action.type === Action.RECORDS_COPIED) {
-      const metadata = selectFormMetadata(this._store.getState());
-      const cleanFields = metadata.getCleanOnCopyFields();
-      if (cleanFields) {
-        const records = action.payload;
-        return new DataUnitAction(Action.RECORDS_COPIED, records.map(record => {
-          const newRecord = Object.assign({}, record);
-          cleanFields.forEach(fieldName => delete newRecord[fieldName]);
-          return newRecord;
-        }));
-      }
-    }
-    if (action.type === Action.SAVING_DATA) {
-      return new Promise((resolve) => {
-        this.validate()
-          .then(() => resolve(action))
-          .catch(() => { });
-      });
-    }
-    if (action.type === Action.RECORDS_ADDED) {
-      const metadata = selectFormMetadata(this._store.getState());
-      const defaultValues = metadata === null || metadata === void 0 ? void 0 : metadata.getDefaultValues();
-      if (defaultValues) {
-        const records = action.payload;
-        return new DataUnitAction(Action.RECORDS_ADDED, records.map(record => {
-          const newRecord = Object.assign({}, record);
-          for (const field in defaultValues) {
-            const defaultValue = this.getFormattedValue(defaultValues[field]);
-            const recordValue = typeof defaultValue === "function" ? defaultValue() : defaultValue;
-            newRecord[field] = this.dataUnit.valueFromString(field, recordValue);
-          }
-          return newRecord;
-        }));
-      }
-    }
-    return action;
-  }
   componentWillLoad() {
     if (this.dataUnit === undefined) {
       this.dataUnit = new DataUnit("ez-form");
     }
-    this.dataUnit.addInterceptor(this);
     this.dataUnit.subscribe(this.onDataUnitAction);
     this._dataBinder = new DataBinder(this.dataUnit);
     this._store = createStore(formReducer);
@@ -3986,12 +4010,13 @@ const EzForm$1 = class extends HTMLElement$1 {
     ElementIDUtils.addIDInfo(this._element, null, dataInfo);
   }
   componentDidRender() {
-    this._dataBinder.bind(Array.from(this._element.querySelectorAll("[data-field-name]")));
+    const metadata = selectFormMetadata(this._store.getState());
+    metadata.addRequiredFields(this._staticFields.filter(f => f.dataset.required).map(f => f.dataset.fieldName));
+    this._dataBinder.bind(Array.from(this._element.querySelectorAll("[data-field-name]")), this.dataUnit.dataUnitId, metadata, this.recordsValidator);
     this.ezReady.emit();
   }
   disconnectedCallback() {
     this.dataUnit.unsubscribe(this.onDataUnitAction);
-    this.dataUnit.removeInterceptor(this);
     this._dataBinder.onDisconnectedCallback();
   }
   buildIdTabSelector(tabs) {
@@ -4011,17 +4036,17 @@ const EzForm$1 = class extends HTMLElement$1 {
 };
 
 const buildSwitch = (field) => {
-  return buildField(field.name, field.label, field.readOnly, true);
+  return buildField(field.name, field.label, field.readOnly, field.contextName, true);
 };
 const buildCheckBox = (field) => {
-  return buildField(field.name, field.label, field.readOnly, false);
+  return buildField(field.name, field.label, field.readOnly, field.contextName, false);
 };
-function buildField(fieldName, fieldLabel, readOnly, switchMode = false) {
+function buildField(fieldName, fieldLabel, readOnly, contextName, switchMode) {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-align--middle ez-padding-horizontal--small ez-padding-bottom--large" },
-    h("ez-check", { enabled: !readOnly, label: fieldLabel, mode: switchMode ? CheckMode.SWITCH : CheckMode.REGULAR, "data-field-name": fieldName, key: fieldName })));
+    h("ez-check", { enabled: !readOnly, label: fieldLabel, mode: switchMode ? CheckMode.SWITCH : CheckMode.REGULAR, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName })));
 }
 
-const buildComboBox = ({ name, label, readOnly, required, props }) => {
+const buildComboBox = ({ name, label, readOnly, required, props, contextName }) => {
   const prop = props === null || props === void 0 ? void 0 : props.options;
   let options;
   if (typeof prop === "string") {
@@ -4032,7 +4057,7 @@ const buildComboBox = ({ name, label, readOnly, required, props }) => {
     options = prop;
   }
   return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
-    h("ez-combo-box", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, key: name, options: options })));
+    h("ez-combo-box", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, options: options })));
 };
 
 const buildDate = ({ name, label, readOnly }) => {
@@ -4043,42 +4068,42 @@ const buildTime = ({ name, label, readOnly }) => {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
     h("ez-time-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
 };
-const buildDateTime = ({ name, label, readOnly }) => {
+const buildDateTime = ({ name, label, readOnly, contextName }) => {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
-    h("ez-date-time-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
+    h("ez-date-time-input", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name })));
 };
 
-const buildFile = ({ name, label, readOnly }) => {
+const buildFile = ({ name, label, readOnly, contextName }) => {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-padding-horizontal--small" },
-    h("ez-upload", { enabled: !readOnly, label: label, "data-field-name": name, key: name })));
+    h("ez-upload", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name })));
 };
 
-const buildDecimal = ({ name, label, readOnly, props }) => {
+const buildDecimal = ({ name, label, readOnly, props, contextName }) => {
   const precision = Number((props === null || props === void 0 ? void 0 : props.precision) || 2);
   const prettyPrecision = Number((props === null || props === void 0 ? void 0 : props.prettyPrecision) || precision);
-  return buildNumeric(name, label, readOnly, precision, prettyPrecision);
+  return buildNumeric(name, label, readOnly, precision, prettyPrecision, contextName);
 };
-const buildInteger = ({ name, label, readOnly }) => {
-  return buildNumeric(name, label, readOnly, 0, 0);
+const buildInteger = ({ name, label, readOnly, contextName }) => {
+  return buildNumeric(name, label, readOnly, 0, 0, contextName);
 };
-function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision) {
+function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision, contextName) {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
-    h("ez-number-input", { enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, key: fieldName })));
+    h("ez-number-input", { enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName })));
 }
 
-const buildSearch = ({ name, label, readOnly, required }) => {
+const buildSearch = ({ name, label, readOnly, required, contextName }) => {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
-    h("ez-search", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, key: name })));
+    h("ez-search", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name })));
 };
 
-const buildTextArea = ({ name, label, readOnly }) => {
+const buildTextArea = ({ name, label, readOnly, contextName }) => {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-padding-horizontal--small", key: name },
-    h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name })));
+    h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName })));
 };
 
-const buildTextInput = ({ name, label, readOnly }) => {
+const buildTextInput = ({ name, label, readOnly, contextName }) => {
   return (h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
-    h("ez-text-input", { label: label, "data-field-name": name, key: name, enabled: !readOnly })));
+    h("ez-text-input", { label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly })));
 };
 
 const uiBuilders = new Map();
@@ -4105,8 +4130,12 @@ const EzFormView$1 = class extends HTMLElement$1 {
   constructor() {
     super();
     this.__registerHost();
+    this.ezContentReady = createEvent(this, "ezContentReady", 7);
     this.fields = undefined;
   }
+  async showUp() {
+    this._element.scrollIntoView({ behavior: "smooth", block: "start" });
+  }
   groupFields(fields) {
     const result = new Map();
     fields.forEach(item => {
@@ -4125,6 +4154,9 @@ const EzFormView$1 = class extends HTMLElement$1 {
     });
     return result;
   }
+  componentDidRender() {
+    this.ezContentReady.emit(Array.from(this._element.querySelectorAll("[data-field-name]")));
+  }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._element, 'ezFormView');
     if (this.fields == undefined) {
@@ -123244,6 +123276,7 @@ class AgGridController {
   }
   ;
   initDatagrid(container, options) {
+    var _a;
     if (this._grid === undefined) {
       LicenseManager.setLicenseKey(ApplicationContext.getContextValue("__EZUI__GRID_LICENSE__"));
       this._columnStateChangeCallback = options.onColumnStateChange;
@@ -123293,8 +123326,10 @@ class AgGridController {
       else {
         this._grid = new Grid(container, this._gridOptions);
       }
-      //Atualiza estado da seleção inicial
-      this.onSelectionChange();
+      const selection = (_a = this._dataUnit) === null || _a === void 0 ? void 0 : _a.getSelection();
+      if (selection) {
+        this.selectRows(selection);
+      }
       this._gridOptions.api.setHeaderHeight(this.getHeaderRowHeight());
     }
   }
@@ -123759,7 +123794,7 @@ class AgGridController {
   }
 }
 
-const ezGridCss = ".sc-ez-grid-h{display:grid;grid-template-rows:auto 1fr auto;height:100%;width:100%;--ezgrid__header--background-color:var(--background--xlight, #FFF)}.grid-header.sc-ez-grid{display:flex;justify-content:space-between;align-items:center;background-color:var(--ezgrid__header--background-color, #FFF);z-index:var(--visible)}.grid__container.sc-ez-grid{box-shadow:0 0 16px 0 rgb(0 38 111 / 12%);padding-top:15px;margin-top:-12px;background-color:var(--ezgrid__header--background-color)}.grid-header__container.sc-ez-grid{display:flex;align-items:center}";
+const ezGridCss = ".sc-ez-grid-h{display:grid;grid-template-rows:auto 1fr auto;height:100%;width:100%;--ezgrid__header--background-color:var(--background--xlight, #FFF);--ezgrid__container--shadow:0 0 16px 0 rgb(0 38 111 / 12%)}.grid-header.sc-ez-grid{display:flex;justify-content:space-between;align-items:center;background-color:var(--ezgrid__header--background-color, #FFF);z-index:var(--visible)}.grid__container.sc-ez-grid{box-shadow:var(--ezgrid__container--shadow);padding-top:15px;margin-top:-12px;background-color:var(--ezgrid__header--background-color)}.grid-header__container.sc-ez-grid{display:flex;align-items:center}";
 
 const EzGrid$1 = class extends HTMLElement$1 {
   constructor() {
@@ -123900,7 +123935,7 @@ const EzGrid$1 = class extends HTMLElement$1 {
       onSelectionChange: (selection) => this.ezSelectionChange.emit(selection),
       onPaginationChange: (paginationInfo) => {
         var _a;
-        if (((_a = this._paginationInfo) === null || _a === void 0 ? void 0 : _a.currentPage) > paginationInfo.currentPage && this._paginationChangedByKeyboard) {
+        if (((_a = this._paginationInfo) === null || _a === void 0 ? void 0 : _a.currentPage) > (paginationInfo === null || paginationInfo === void 0 ? void 0 : paginationInfo.currentPage) && this._paginationChangedByKeyboard) {
           this._gridController.setFocusLastRow();
         }
         else {
@@ -123972,7 +124007,7 @@ var EzScrollDirection;
   EzScrollDirection["BOTH"] = "both";
 })(EzScrollDirection || (EzScrollDirection = {}));
 
-const ezGuideNavigatorCss = ":host{--ez-guide-navigator--padding-left:var(--space--large);--ez-guide-navigator--padding-right:var(--space--small);--ez-guide-navigator--box-shadow:var(--shadow, 0px 0px 24px 0px #000);--ez-guide-navigator--background-color:var(--color--inverted);--ez-guide-navigator--border-radius:0px var(--border--radius-medium) var(--border--radius-medium) 0px;--ez-guide-navigator--actions-gap:var(--space--medium);--ez-guide-navigator--actions-margin:var(--space--medium) 0 var(--space--medium);--ez-guide-navigator--actions-padding-right:calc(var(--space--medium, 12px) + var(--space--small, 6px))}.inverted{transform:rotate(180deg)}.ez-guide-navigator{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%;padding-left:var(--ez-guide-navigator--padding-left);padding-right:var(--ez-guide-navigator--padding-right);background-color:var(--ez-guide-navigator--background-color);-webkit-box-shadow:var(--ez-guide-navigator--box-shadow);box-shadow:var(--ez-guide-navigator--box-shadow);border-radius:var(--ez-guide-navigator--border-radius)}.ez-guide-navigator__actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--ez-guide-navigator--actions-gap);margin:var(--ez-guide-navigator--actions-margin);padding-right:var(--ez-guide-navigator--actions-padding-right)}.hidden{display:none}";
+const ezGuideNavigatorCss = ":host{--ez-guide-navigator--padding-left:var(--space--large);--ez-guide-navigator--padding-right:var(--space--small);--ez-guide-navigator--box-shadow:var(--shadow, 0px 0px 24px 0px #000);--ez-guide-navigator--background-color:var(--color--inverted);--ez-guide-navigator--border-radius:0px var(--border--radius-medium) var(--border--radius-medium) 0px;--ez-guide-navigator--actions-gap:var(--space--medium);--ez-guide-navigator--actions-margin:var(--space--large) 0 var(--space--medium);--ez-guide-navigator--actions-padding-right:calc(var(--space--medium, 12px) + var(--space--small, 6px))}.inverted{transform:rotate(180deg)}.ez-guide-navigator{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;height:100%;padding-left:var(--ez-guide-navigator--padding-left);padding-right:var(--ez-guide-navigator--padding-right);background-color:var(--ez-guide-navigator--background-color);-webkit-box-shadow:var(--ez-guide-navigator--box-shadow);box-shadow:var(--ez-guide-navigator--box-shadow);border-radius:var(--ez-guide-navigator--border-radius)}.ez-guide-navigator__actions{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--ez-guide-navigator--actions-gap);margin:var(--ez-guide-navigator--actions-margin);padding-right:var(--ez-guide-navigator--actions-padding-right)}.hidden{display:none}";
 
 const ENTER_KEY = "Enter";
 const EzGuideNavigator$1 = class extends HTMLElement$1 {
@@ -123980,7 +124015,9 @@ const EzGuideNavigator$1 = class extends HTMLElement$1 {
     super();
     this.__registerHost();
     this.__attachShadow();
+    this.ezSelectionChange = createEvent(this, "ezSelectionChange", 7);
     this.open = true;
+    this.selectedId = undefined;
     this.items = [];
     this.tooltipResolver = undefined;
     this.filterText = "";
@@ -123997,6 +124034,48 @@ const EzGuideNavigator$1 = class extends HTMLElement$1 {
   async enableItem(id) {
     [].concat(id).forEach(item => this._tree.enableItem(item));
   }
+  /**
+   * Atualiza um ou mais items
+   */
+  async updateItem(item) {
+    [].concat(item).forEach(item => this._tree.updateItem(item));
+  }
+  /**
+   * Obtem um item pelo id
+   */
+  async getItem(id) {
+    return this._tree.getItem(id);
+  }
+  /**
+   * Obtem um array do caminho de itens da seleção atual.
+   * @returns Retorna um array do caminho de itens da seleção atual.
+   */
+  async getCurrentPath() {
+    var _a;
+    return (_a = this._tree) === null || _a === void 0 ? void 0 : _a.getCurrentPath();
+  }
+  /**
+   * Seleciona o item desejado pelo ID.
+   * @param id - ID do item que receberá a seleção.
+   */
+  async selectGuide(id) {
+    if (this._tree == undefined || id == undefined) {
+      return;
+    }
+    this._tree.selectItem(id);
+    this.getCurrentPath()
+      .then((currentPath) => {
+      currentPath === null || currentPath === void 0 ? void 0 : currentPath.forEach((item) => {
+        this._tree.openItem(item.id);
+      });
+    });
+  }
+  /**
+   * Obtem o item pai a partir de um id
+   */
+  async getParent(id) {
+    return this._tree.getParent(id);
+  }
   async handleToggleSidebar() {
     this.open = !this.open;
   }
@@ -124005,9 +124084,13 @@ const EzGuideNavigator$1 = class extends HTMLElement$1 {
       this._tree.applyFilter(this.filterText);
     }
   }
+  onFilterChanged(event) {
+    this.filterText = event.detail;
+    event.stopPropagation();
+  }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._element);
-    return (h(Host, null, h("ez-sidebar-button", { class: this.open ? "hidden" : "", onEzClick: this.handleToggleSidebar.bind(this), "aria-controls": "navigator", "aria-expanded": this.open, "data-element-id": ElementIDUtils.getInternalIDInfo("openButton") }), h("aside", { tabIndex: -1, id: "navigator", class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-guide-navigator " + (this.open ? "" : "hidden"), "data-element-id": ElementIDUtils.getInternalIDInfo("sidebar") }, h("div", { role: "search", class: "ez-guide-navigator__actions" }, h("ez-filter-input", { mode: "slim", value: this.filterText, onEzChange: (event) => (this.filterText = event.detail), label: "Buscar guia", "aria-placeholder": "Buscar guia", onKeyUp: this.handleFilterTree.bind(this), "data-element-id": ElementIDUtils.getInternalIDInfo("textinput") }), h("ez-button", { onClick: this.handleToggleSidebar.bind(this), class: "inverted", mode: "icon", size: "small", iconName: "show_menu", title: "Ocultar menu", "aria-label": "Ocultar menu", "aria-controls": "navigator", "data-element-id": ElementIDUtils.getInternalIDInfo("closeButton") })), h("ez-scroller", { direction: EzScrollDirection.VERTICAL, activeShadow: true }, h("ez-tree", { ref: element => (this._tree = element), items: this.items, "data-element-id": ElementIDUtils.getInternalIDInfo("tree"), tooltipResolver: this.tooltipResolver })))));
+    return (h(Host, null, h("ez-sidebar-button", { class: this.open ? "hidden" : "", onEzClick: this.handleToggleSidebar.bind(this), "aria-controls": "navigator", "aria-expanded": this.open, "data-element-id": ElementIDUtils.getInternalIDInfo("openButton") }), h("aside", { tabIndex: -1, id: "navigator", class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-guide-navigator " + (this.open ? "" : "hidden"), "data-element-id": ElementIDUtils.getInternalIDInfo("sidebar") }, h("div", { role: "search", class: "ez-guide-navigator__actions" }, h("ez-filter-input", { mode: "slim", value: this.filterText, onEzChange: (event) => this.onFilterChanged(event), label: "Buscar guia", "aria-placeholder": "Buscar guia", onKeyUp: this.handleFilterTree.bind(this), "data-element-id": ElementIDUtils.getInternalIDInfo("textinput") }), h("ez-button", { onClick: this.handleToggleSidebar.bind(this), class: "inverted", mode: "icon", size: "small", iconName: "show_menu", title: "Ocultar menu", "aria-label": "Ocultar menu", "aria-controls": "navigator", "data-element-id": ElementIDUtils.getInternalIDInfo("closeButton") })), h("ez-scroller", { direction: EzScrollDirection.VERTICAL, activeShadow: true }, h("ez-tree", { ref: element => (this._tree = element), items: this.items, "data-element-id": ElementIDUtils.getInternalIDInfo("tree"), tooltipResolver: this.tooltipResolver, onEzChange: evt => this.ezSelectionChange.emit(evt.detail), selectedId: this.selectedId })))));
   }
   get _element() { return this; }
   static get style() { return ezGuideNavigatorCss; }
@@ -125349,7 +125432,7 @@ const EzSearch$1 = class extends HTMLElement$1 {
   static get style() { return ezSearchCss; }
 };
 
-const ezSidebarButtonCss = ":host{--ez-sidebar-button--width:6px;--ez-sidebar-button--hover--width:12px;--ez-sidebar-button--height:96px;--ez-sidebar-button--background-color--xlight:var(--background--xlight, #fff);--ez-sidebar-button--background-color--primary:var(--color--primary);--ez-sidebar-button--space--small:var(--space--small, 6px);--ez-sidebar-button--space--medium:var(--space--medium, 12px);--ez-sidebar-button--box-shadow:var(--shadow--small, 0px 0px 16px rgba(0, 38, 111, 0.07));--ez-sidebar-button--hover--box-shadow:var(--shadow--hard, 0px 0px 16px rgba(43, 58, 84, 0.24));--ez-sidebar-button--border--radius-small:var(--border--radius-small);--ez-sidebar-button--border--radius-medium:var(--border--radius-medium)}button{display:flex;background:var(--ez-sidebar-button--background-color--xlight);border:0;border-radius:0 var(--ez-sidebar-button--border--radius-medium) var(--ez-sidebar-button--border--radius-medium) 0;box-shadow:var(--ez-sidebar-button--box-shadow);padding:0;cursor:pointer}span{width:var(--ez-sidebar-button--width);height:var(--ez-sidebar-button--height);margin:var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--small) var(--ez-sidebar-button--space--medium) 0;background:var(--ez-sidebar-button--background-color--primary);border-radius:0 var(--ez-sidebar-button--border--radius-small) var(--ez-sidebar-button--border--radius-small) 0}button:hover{box-shadow:var(--ez-sidebar-button--hover--box-shadow)}button:hover span{width:var(--ez-sidebar-button--hover--width);margin:var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--medium) 0}";
+const ezSidebarButtonCss = ":host{position:relative;--ez-sidebar-button--width:6px;--ez-sidebar-button--hover--width:12px;--ez-sidebar-button--height:96px;--ez-sidebar-button--background-color--xlight:var(--background--xlight, #fff);--ez-sidebar-button--background-color--primary:var(--color--primary);--ez-sidebar-button--space--small:var(--space--small, 6px);--ez-sidebar-button--space--medium:var(--space--medium, 12px);--ez-sidebar-button--box-shadow:var(--shadow--small, 0px 0px 16px rgba(0, 38, 111, 0.07));--ez-sidebar-button--hover--box-shadow:var(--shadow--hard, 0px 0px 16px rgba(43, 58, 84, 0.24));--ez-sidebar-button--border--radius-small:var(--border--radius-small);--ez-sidebar-button--border--radius-medium:var(--border--radius-medium)}button{position:absolute;display:flex;background:var(--ez-sidebar-button--background-color--xlight);border:0;border-radius:0 var(--ez-sidebar-button--border--radius-medium) var(--ez-sidebar-button--border--radius-medium) 0;box-shadow:var(--ez-sidebar-button--box-shadow);padding:0;cursor:pointer}span{width:var(--ez-sidebar-button--width);height:var(--ez-sidebar-button--height);margin:var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--small) var(--ez-sidebar-button--space--medium) 0;background:var(--ez-sidebar-button--background-color--primary);border-radius:0 var(--ez-sidebar-button--border--radius-small) var(--ez-sidebar-button--border--radius-small) 0}button:hover{box-shadow:var(--ez-sidebar-button--hover--box-shadow)}button:hover span{width:var(--ez-sidebar-button--hover--width);margin:var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--medium) var(--ez-sidebar-button--space--medium) 0}";
 
 const EzSidebarButton$1 = class extends HTMLElement$1 {
   constructor() {
@@ -126454,7 +126537,13 @@ class Node$1 {
     return this._isLazyLoad && !this._childrenLoaded;
   }
   isExpandable() {
-    return this._isLazyLoad || this.children.size > 0 || Array.isArray(this.item.children);
+    if (this._isLazyLoad) {
+      return true;
+    }
+    if (this.children.size > 0) {
+      return true;
+    }
+    return false;
   }
   getChildren() {
     if (this.isPlaceHolder) {
@@ -126524,6 +126613,12 @@ class Tree extends Node$1 {
       return;
     }
     Object.keys(item).forEach(attrib => node.item[attrib] = item[attrib]);
+    if (item.children == undefined) {
+      node.children.clear();
+    }
+    else if (Array.isArray(item.children)) {
+      node.updateChildren(item.children);
+    }
     this._changeCallback();
   }
   async open(path) {
@@ -126676,6 +126771,55 @@ const EzTree$1 = class extends HTMLElement$1 {
   async applyFilter(pattern) {
     this._tree.setFilterPattern(pattern);
   }
+  /**
+   * Atualiza um item
+   */
+  async updateItem(item) {
+    this._tree.updateItem(item);
+  }
+  /**
+   * Obtem um item pelo id
+   */
+  async getItem(id) {
+    return new Promise(resolve => {
+      const node = this._tree.getNode(id);
+      resolve(node === null || node === void 0 ? void 0 : node.item);
+    });
+  }
+  /**
+   * Obtem um array do caminho de itens da seleção atual.
+   * @returns Retorna um array do caminho de itens da seleção atual.
+   */
+  async getCurrentPath() {
+    var _a, _b, _c;
+    const node = (_a = this._tree) === null || _a === void 0 ? void 0 : _a.getNode(this.selectedId);
+    if (node == undefined) {
+      return;
+    }
+    const currentPath = [];
+    let parentNode;
+    let parentItem = (_b = node.parent) === null || _b === void 0 ? void 0 : _b.item;
+    currentPath.push(this.getItemPathAttrs(node.item));
+    while (parentItem != undefined) {
+      currentPath.unshift(this.getItemPathAttrs(parentItem));
+      parentNode = this._tree.getNode(parentItem.id);
+      parentItem = (_c = parentNode === null || parentNode === void 0 ? void 0 : parentNode.parent) === null || _c === void 0 ? void 0 : _c.item;
+    }
+    return currentPath;
+  }
+  /**
+   * Obtem o item pai a partir de um id
+   */
+  async getParent(id) {
+    return new Promise(resolve => {
+      var _a;
+      const node = this._tree.getNode(id);
+      if (node) {
+        resolve((_a = node.parent) === null || _a === void 0 ? void 0 : _a.item);
+      }
+      resolve(undefined);
+    });
+  }
   observeItems(newValue, oldValue) {
     if (ObjectUtils$1.objectToString(newValue) !== ObjectUtils$1.objectToString(oldValue)) {
       this._tree.load(this.items || []);
@@ -126718,6 +126862,9 @@ const EzTree$1 = class extends HTMLElement$1 {
       event.preventDefault();
     }
   }
+  getItemPathAttrs({ id, label }) {
+    return { id, label };
+  }
   openClose(item) {
     if (item == undefined) {
       return;
@@ -126801,9 +126948,6 @@ const EzTree$1 = class extends HTMLElement$1 {
     if (node) {
       this.value = node.item;
     }
-    else {
-      this.selectedId = undefined;
-    }
   }
   render() {
     ElementIDUtils.addIDInfoIfNotExists(this._element, 'ezTree');
@@ -127305,10 +127449,10 @@ const EzDialog = /*@__PURE__*/proxyCustomElement(EzDialog$1, [1,"ez-dialog",{"co
 const EzDropdown = /*@__PURE__*/proxyCustomElement(EzDropdown$1, [1,"ez-dropdown",{"items":[1040],"value":[1040],"itemBuilder":[16]}]);
 const EzFileItem = /*@__PURE__*/proxyCustomElement(EzFileItem$1, [1,"ez-file-item",{"canRemove":[4,"can-remove"],"fileName":[1,"file-name"],"iconName":[1,"icon-name"],"fileSize":[2,"file-size"],"progress":[2]}]);
 const EzFilterInput = /*@__PURE__*/proxyCustomElement(EzFilterInput$1, [1,"ez-filter-input",{"label":[1],"value":[1537],"enabled":[4],"errorMessage":[1537,"error-message"],"restrict":[1],"mode":[513],"asyncSearch":[516,"async-search"]}]);
-const EzForm = /*@__PURE__*/proxyCustomElement(EzForm$1, [2,"ez-form",{"dataUnit":[1040],"config":[16],"recordsValidator":[16],"multiLevel":[4,"multi-level"],"levelResolver":[16],"contentBuilder":[16]}]);
+const EzForm = /*@__PURE__*/proxyCustomElement(EzForm$1, [2,"ez-form",{"dataUnit":[1040],"config":[16],"recordsValidator":[16]}]);
 const EzFormView = /*@__PURE__*/proxyCustomElement(EzFormView$1, [2,"ez-form-view",{"fields":[16]}]);
 const EzGrid = /*@__PURE__*/proxyCustomElement(EzGrid$1, [6,"ez-grid",{"multipleSelection":[4,"multiple-selection"],"config":[1040],"serverUrl":[1,"server-url"],"dataUnit":[16],"statusResolver":[16],"_paginationInfo":[32],"_paginationChangedByKeyboard":[32]},[[0,"ezSelectionChange","onSelectionChange"]]]);
-const EzGuideNavigator = /*@__PURE__*/proxyCustomElement(EzGuideNavigator$1, [1,"ez-guide-navigator",{"open":[1540],"items":[16],"tooltipResolver":[16],"filterText":[32]}]);
+const EzGuideNavigator = /*@__PURE__*/proxyCustomElement(EzGuideNavigator$1, [1,"ez-guide-navigator",{"open":[1540],"selectedId":[1537,"selected-id"],"items":[16],"tooltipResolver":[16],"filterText":[32]}]);
 const EzIcon = /*@__PURE__*/proxyCustomElement(EzIcon$1, [1,"ez-icon",{"size":[513],"href":[513],"iconName":[513,"icon-name"]}]);
 const EzList = /*@__PURE__*/proxyCustomElement(EzList$1, [1,"ez-list",{"dataSource":[1040],"useGroups":[1540,"use-groups"],"ezDraggable":[1028,"ez-draggable"],"ezSelectable":[1028,"ez-selectable"],"itemSlotBuilder":[1040],"hoverFeedback":[1028,"hover-feedback"],"_listItems":[32],"_listGroupItems":[32]}]);
 const EzLoadingBar = /*@__PURE__*/proxyCustomElement(EzLoadingBar$1, [1,"ez-loading-bar",{"_showLoading":[32]}]);