@sankhyalabs/ezui 0.0.0-bugfix-dev-KB-08202.0

package/dist/cjs/ez-filter-input_2.cjs.entry.js

@@ -0,0 +1,137 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-1064511f.js');
+const core = require('@sankhyalabs/core');
+const CSSVarsUtils = require('./CSSVarsUtils-b136a156.js');
+
+const ezFilterInputCss = ":host{display:block;width:100%}";
+
+const EzFilterInput = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezChange = index.createEvent(this, "ezChange", 7);
+    this.ezSearching = index.createEvent(this, "ezSearching", 7);
+    this.ezFocusIn = index.createEvent(this, "ezFocusIn", 7);
+    this._searchingText = "";
+    this.handleFocus = () => {
+      if (this._searchingText === "") {
+        this._textInput.value = "";
+      }
+      else {
+        this._textInput.value = this._searchingText;
+      }
+      this.ezFocusIn.emit();
+    };
+    this.label = undefined;
+    this.value = undefined;
+    this.enabled = true;
+    this.errorMessage = undefined;
+    this.restrict = undefined;
+    this.mode = "regular";
+    this.asyncSearch = false;
+    this.canShowError = true;
+  }
+  observeLabel() {
+    if (this._textInput) {
+      this._textInput.label = this.label;
+    }
+  }
+  observeErrorMessage() {
+    if (this._textInput) {
+      this._textInput.errorMessage = this.errorMessage;
+    }
+  }
+  observeValue(newValue, oldValue) {
+    if (this._textInput && newValue != oldValue) {
+      this._textInput.value = newValue;
+      this.ezChange.emit(newValue);
+    }
+  }
+  /**
+   * Aplica o foco no campo.
+   */
+  async setFocus() {
+    this._textInput.setFocus();
+  }
+  /**
+   * Remove o foco do campo.
+   */
+  async setBlur() {
+    this._textInput.setBlur();
+  }
+  /**
+   * Retorna se o conteúdo é inválido.
+   */
+  async isInvalid() {
+    return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
+  }
+  /**
+   * Método responsável por setar um novo valor ao campo.
+   */
+  async setValue(newValue) {
+    if (!this.asyncSearch || this._textInput == undefined) {
+      return;
+    }
+    if (newValue !== this.value) {
+      this.value = newValue;
+      this._searchingText = "";
+    }
+    else {
+      this._textInput.value = newValue;
+    }
+  }
+  /**
+   * Método responsável por resetar o valor do campo para o ultimo valor inputado.
+   */
+  async endSearch() {
+    if (!this.asyncSearch || this._textInput == undefined) {
+      return;
+    }
+    if (this._textInput.value !== this.value) {
+      this._textInput.value = this.value;
+    }
+  }
+  handleChange(evt) {
+    const newValue = evt.detail;
+    this.errorMessage = "";
+    if (this.asyncSearch) {
+      this._searchingText = newValue;
+      this.ezSearching.emit(newValue);
+    }
+    else if (newValue !== this.value) {
+      this.value = newValue;
+    }
+  }
+  componentDidLoad() {
+    CSSVarsUtils.CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
+  }
+  render() {
+    core.ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
+    return (index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.handleChange(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, mode: this.mode, onFocusin: this.handleFocus, canShowError: this.canShowError }, index.h("ez-icon", { slot: "leftIcon", iconName: "search" })));
+  }
+  get _elem() { return index.getElement(this); }
+  static get watchers() { return {
+    "label": ["observeLabel"],
+    "errorMessage": ["observeErrorMessage"],
+    "value": ["observeValue"]
+  }; }
+};
+EzFilterInput.style = ezFilterInputCss;
+
+const multiSelectionBoxMessageCss = ".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";
+
+const MultiSelectionBoxMessage = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.message = undefined;
+  }
+  render() {
+    return (index.h("div", { class: "multi-selection__message" }, index.h("span", { class: "multi-selection__text-message" }, this.message)));
+  }
+};
+MultiSelectionBoxMessage.style = multiSelectionBoxMessageCss;
+
+exports.ez_filter_input = EzFilterInput;
+exports.multi_selection_box_message = MultiSelectionBoxMessage;

package/dist/cjs/ez-form-view.cjs.entry.js

@@ -0,0 +1,191 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-1064511f.js');
+const core = require('@sankhyalabs/core');
+const constants = require('./constants-3a1d64fb.js');
+const CheckMode = require('./CheckMode-ecb90b87.js');
+
+const buildSwitch = (field) => {
+  return buildField(field.name, field.label, field.readOnly, field.contextName, true);
+};
+const buildCheckBox = (field) => {
+  return buildField(field.name, field.label, field.readOnly, field.contextName, false);
+};
+function buildField(fieldName, fieldLabel, readOnly, contextName, switchMode) {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-align--middle ez-padding-horizontal--small ez-padding-bottom--large" },
+    index.h("ez-check", { enabled: !readOnly, label: fieldLabel, mode: switchMode ? CheckMode.CheckMode.SWITCH : CheckMode.CheckMode.REGULAR, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName })));
+}
+
+const buildComboBox = ({ name, label, readOnly, required, props, contextName, canShowError }) => {
+  const prop = props === null || props === void 0 ? void 0 : props.options;
+  let options;
+  if (typeof prop === "string") {
+    const parsed = JSON.parse(prop);
+    options = Object.keys(parsed).map(key => { return { value: key, label: parsed[key] }; });
+  }
+  else {
+    options = prop;
+  }
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
+    index.h("ez-combo-box", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, options: options, canShowError: canShowError })));
+};
+
+const buildDate = ({ name, label, readOnly, canShowError }) => {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
+    index.h("ez-date-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError })));
+};
+const buildTime = ({ name, label, readOnly, canShowError }) => {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
+    index.h("ez-time-input", { enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError })));
+};
+const buildDateTime = ({ name, label, readOnly, contextName, canShowError }) => {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
+    index.h("ez-date-time-input", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError })));
+};
+
+const buildFile = ({ name, label, readOnly, contextName, props }) => {
+  const uploadProps = core.ObjectUtils.removeEmptyValues({
+    subTitle: props.subTitle,
+    requestHeaders: props.STORAGESTRATEGY ? {
+      STORAGESTRATEGY: props.STORAGESTRATEGY
+    } : null
+  });
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-padding-horizontal--small" },
+    index.h("ez-upload", Object.assign({ enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name }, uploadProps))));
+};
+
+const buildDecimal = ({ name, label, readOnly, props, contextName, canShowError }) => {
+  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, contextName, canShowError);
+};
+const buildInteger = ({ name, label, readOnly, contextName, canShowError }) => {
+  return buildNumeric(name, label, readOnly, 0, 0, contextName, canShowError);
+};
+function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision, contextName, canShowError) {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
+    index.h("ez-number-input", { enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName, canShowError: canShowError })));
+}
+
+const buildSearch = ({ name, label, readOnly, required, contextName, canShowError, optionLoader }) => {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
+    index.h("ez-search", { enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader })));
+};
+
+const buildTextArea = ({ name, label, readOnly, contextName, rows, canShowError }) => {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-padding-horizontal--small", key: name },
+    index.h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, rows: rows, canShowError: canShowError })));
+};
+
+const buildTextInput = ({ name, label, readOnly, contextName, canShowError }) => {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-3 ez-padding-horizontal--small" },
+    index.h("ez-text-input", { label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly, canShowError: canShowError })));
+};
+
+const uiBuilders = new Map();
+uiBuilders.set(core.UserInterface.CHECKBOX, buildCheckBox);
+uiBuilders.set(core.UserInterface.SWITCH, buildSwitch);
+uiBuilders.set(core.UserInterface.OPTIONSELECTOR, buildComboBox);
+uiBuilders.set(core.UserInterface.DATE, buildDate);
+uiBuilders.set(core.UserInterface.TIME, buildTime);
+uiBuilders.set(core.UserInterface.DATETIME, buildDateTime);
+uiBuilders.set(core.UserInterface.FILE, buildFile);
+uiBuilders.set(core.UserInterface.DECIMALNUMBER, buildDecimal);
+uiBuilders.set(core.UserInterface.INTEGERNUMBER, buildInteger);
+uiBuilders.set(core.UserInterface.SEARCH, buildSearch);
+uiBuilders.set(core.UserInterface.LONGTEXT, buildTextArea);
+const fieldBuilder = (field) => {
+  const builder = uiBuilders.get(field.userInterface) || buildTextInput;
+  const label = field.required ? `${field.label}${constants.REQUIRED_INFO}` : field.label;
+  const builtElement = builder(Object.assign(Object.assign({}, field), { label }));
+  //@ts-ignore
+  builtElement.$attrs$['data-form-item'] = field.name;
+  return builtElement;
+};
+
+class FormItem {
+  constructor(elem) {
+    this.elem = elem;
+  }
+  addRightElement(el) {
+    el.classList.add('ez-padding-left--small');
+    this.elem.classList.add('ez-col--nowrap');
+    this.elem.appendChild(el);
+  }
+  get fieldName() {
+    return this.elem.getAttribute('data-form-item');
+  }
+}
+class FormItems {
+  constructor(items, formId) {
+    this.items = new Map();
+    this.formId = formId;
+    items.forEach(item => {
+      const formItem = new FormItem(item);
+      this.items.set(formItem.fieldName, formItem);
+    });
+  }
+  getItem(name) {
+    return this.items.get(name);
+  }
+  get formName() {
+    return this.formId;
+  }
+}
+
+const ezFormViewCss = ".sc-ez-form-view-h{display:flex;flex-direction:row;flex-wrap:wrap;width:100%}";
+
+const EzFormView = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.ezContentReady = index.createEvent(this, "ezContentReady", 7);
+    this.formItemsReady = index.createEvent(this, "formItemsReady", 7);
+    this.fields = undefined;
+  }
+  async showUp() {
+    this._element.scrollIntoView({ behavior: "smooth", block: "start" });
+  }
+  groupFields(fields) {
+    const result = new Map();
+    fields.forEach(item => {
+      const groupLabel = item.group;
+      if (groupLabel) {
+        let groupFields = result.get(groupLabel);
+        if (groupFields == undefined) {
+          groupFields = [];
+          result.set(groupLabel, groupFields);
+        }
+        groupFields.push(item);
+      }
+      else {
+        result.set(item.name, item);
+      }
+    });
+    return result;
+  }
+  componentDidRender() {
+    this.ezContentReady.emit(Array.from(this._element.querySelectorAll("[data-field-name]")));
+    const formItems = new FormItems(Array.from(this._element.querySelectorAll("[data-form-item]")));
+    this.formItemsReady.emit(formItems);
+  }
+  render() {
+    core.ElementIDUtils.addIDInfoIfNotExists(this._element, 'ezFormView');
+    if (this.fields == undefined) {
+      return;
+    }
+    return (index.h(index.Host, null, Array.from(this.groupFields(this.fields).entries()).map(([label, value]) => {
+      if (Array.isArray(value)) {
+        return (index.h("ez-collapsible-box", { id: `group-${label}`, label: label, "header-size": "large", key: label }, value.map(fi => fieldBuilder(fi))));
+      }
+      else {
+        return fieldBuilder(value);
+      }
+    })));
+  }
+  get _element() { return index.getElement(this); }
+};
+EzFormView.style = ezFormViewCss;
+
+exports.ez_form_view = EzFormView;