@sankhyalabs/ezui 2.0.3 → 2.0.5

package/dist/collection/components/ez-grid/subcomponents/ez-grid-config/ez-grid-config.js

@@ -1,551 +0,0 @@
-import { StringUtils } from '@sankhyalabs/core';
-import { Component, Event, h, Host, Prop } from '@stencil/core';
-import ApplicationUtils from '../../../../utils/ApplicationUtils';
-import { DialogType } from '../../../ez-dialog/DialogType';
-export class EzGridConfig {
-  constructor() {
-    this._orderListItems = [];
-    this._orderPriorityList = [];
-    this._columListItems = [];
-    this._selectedIndex = -1;
-    this._dataChanged = false;
-    this._componenteInternalKey = Date.now();
-    this.selectedTab = "Colunas";
-  }
-  /* Creation Methods */
-  createOrderList() {
-    let newList = [];
-    this.columns.filter(col => { var _a; return StringUtils.getBooleanValue((_a = col === null || col === void 0 ? void 0 : col.props) === null || _a === void 0 ? void 0 : _a.get("sortable"), true); }).forEach(column => {
-      var _a;
-      let configItem = (_a = this.config) === null || _a === void 0 ? void 0 : _a.columns.find(item => item.name === column.name);
-      let item = { name: column.name, label: column.label };
-      if (configItem) {
-        item['orderIndex'] = configItem.orderIndex;
-        item['ascending'] = configItem.ascending;
-      }
-      if (!column.hidden) {
-        newList.push(item);
-      }
-    });
-    newList.sort((a, b) => {
-      //OS dois tem order index 0 e pelo menos um deles tem orientação de ordenação.
-      if (a.orderIndex == 0 && b.orderIndex == 0 && (a.ascending != undefined || b.ascending != undefined)) {
-        if (a.ascending != undefined)
-          return -1;
-        if (b.ascending != undefined)
-          return 1;
-        return 0;
-        //Pelo menos um deles tem order index diferente de 0 e os dois tem orientação de ordenação.
-      }
-      else if (a.ascending != undefined && b.ascending != undefined) {
-        return (a.orderIndex - b.orderIndex);
-        //Pelo menos um deles tem order index diferente de 0 e pelo menos um deles tem orientação de ordenação.
-      }
-      else if (a.ascending != undefined || b.ascending != undefined) {
-        if (a.ascending != undefined)
-          return -1;
-        if (b.ascending != undefined)
-          return 1;
-        return 0;
-      }
-      return (a.orderIndex - b.orderIndex);
-    });
-    this._orderListItems = newList;
-  }
-  createColumnList() {
-    let visibleGroup = {
-      group: 'Visíveis',
-      items: [],
-    };
-    let hiddenGroup = {
-      group: 'Ocultas',
-      items: [],
-      sort: 'ASC'
-    };
-    this.columns.forEach(column => {
-      let item = { label: column.label };
-      if (column.hidden) {
-        hiddenGroup.items.push(item);
-      }
-      else {
-        visibleGroup.items.push(item);
-      }
-    });
-    this._columListItems = [visibleGroup, hiddenGroup];
-  }
-  buildColumnListSlot(item, group) {
-    return (h("div", null,
-      h("ez-check", { mode: 'switch', id: 'switch' + ((item === null || item === void 0 ? void 0 : item.label) || '') + ((group === null || group === void 0 ? void 0 : group.group) || ''), value: group.group === "Visíveis", onEzChange: (ev) => { this.switchColumnGroup(ev, item); } })));
-  }
-  buildOrderListSlot(item) {
-    let selectedOption = "na";
-    if ((item === null || item === void 0 ? void 0 : item.ascending) != undefined) {
-      selectedOption = item.ascending == true ? 'asc' : 'desc';
-    }
-    return (h("div", null,
-      h("ez-select-box", { selectedOption: selectedOption, key: 'ez-select-box-' + this._componenteInternalKey + '-' + item, onEzChange: (ev) => { ev.stopPropagation(); this.updateOrder(ev.detail, item.label); } })));
-  }
-  updateOrder(sortOrder, updatedItemLabel) {
-    var _a;
-    this._dataChanged = true;
-    let newList = [...this.columns];
-    let newItem = newList.find(item => item.label === updatedItemLabel);
-    if (newItem) {
-      newItem.sort = sortOrder.value === "na" ? undefined : sortOrder.value;
-    }
-    let orderArray;
-    if (((_a = this._orderPriorityList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-      this._orderPriorityList.find(item => item.label === newItem.label).sort = sortOrder;
-      this._orderPriorityList.filter(item => item.sort).map((item, index) => {
-        if (item.label === newItem.label) {
-          newItem.sortIndex = index;
-        }
-      });
-    }
-    else {
-      orderArray = newList.filter(item => item.sort && item.hidden !== true).map((item, index) => {
-        return { label: item.label, orderIndex: index };
-      });
-      orderArray.forEach(element => {
-        newList.find(item => item.label === element.label).sortIndex = element.orderIndex;
-      });
-    }
-    this.columns = newList;
-  }
-  /* Actions Methods */
-  switchColumnGroup(ev, switchedItem) {
-    ev.stopPropagation();
-    let newList = [...this._columListItems];
-    this._dataChanged = true;
-    if (ev.detail === true) {
-      let hiddenGroup = newList.find(group => group.group === "Ocultas");
-      let index = hiddenGroup.items.findIndex(item => item.label === switchedItem.label);
-      if (index >= 0) {
-        hiddenGroup.items.splice(index, 1);
-      }
-      let visibleGroup = newList.find(group => group.group === "Visíveis");
-      visibleGroup.items.push(switchedItem);
-      this._columListItems = newList;
-      this.createOrderList();
-    }
-    else if (ev.detail === false) {
-      let visibleGroup = newList.find(group => group.group === "Visíveis");
-      let index = visibleGroup.items.findIndex(item => item.label === switchedItem.label);
-      if (index >= 0) {
-        visibleGroup.items.splice(index, 1);
-      }
-      let hiddenGroup = newList.find(group => group.group === "Ocultas");
-      hiddenGroup.items.push(switchedItem);
-      this._columListItems = newList;
-      this.createOrderList();
-    }
-  }
-  finish() {
-    let newColumnList = [];
-    this._columListItems.forEach(group => {
-      group.items.forEach(item => {
-        const baseColumn = this.columns.find(column => column.label === item.label);
-        let newColumnItem = Object.assign({}, baseColumn);
-        if (group.group === "Ocultas") {
-          newColumnItem.hidden = true;
-        }
-        else {
-          newColumnItem.hidden = false;
-        }
-        newColumnList.push(newColumnItem);
-      });
-    });
-    this.columns = newColumnList;
-    this._dataChanged = false;
-    this.closeConfig();
-    this.save();
-  }
-  save() {
-    var _a;
-    let _newConfig;
-    if (this.config) {
-      _newConfig = this.config;
-    }
-    else {
-      _newConfig = this.createConfigFromState(this.columns);
-    }
-    let _newColumnConfigList = [];
-    let orderArray;
-    if (((_a = this._orderPriorityList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-      orderArray = this.columns.filter(item => item.sort && item.hidden !== true).map((item) => {
-        return { label: item.label, orderIndex: 0 };
-      });
-      let indexCount = 0;
-      let newOrderArray = [];
-      this._orderPriorityList.forEach((orderPriorityItem) => {
-        let item = orderArray.find(column => column.label === orderPriorityItem.label);
-        if (item) {
-          item.orderIndex = indexCount;
-          newOrderArray.push(item);
-          indexCount++;
-        }
-      });
-      if (newOrderArray.length > 0) {
-        orderArray = newOrderArray;
-      }
-    }
-    for (let i = 0; i < this.columns.length; i++) {
-      const column = this.columns[i];
-      let _newColumnConfig = _newConfig.columns.find(_newColumnConfig => column.name === _newColumnConfig.name);
-      if (column.hidden === true && _newColumnConfig) {
-        continue;
-      }
-      if (_newColumnConfig) {
-        _newColumnConfig.width = column.width;
-      }
-      else if (column.hidden === false) {
-        _newColumnConfig = { name: column.name, width: column.width, orderIndex: 0 };
-      }
-      if (_newColumnConfig) {
-        if (column.sort) {
-          _newColumnConfig.ascending = column.sort.toUpperCase() === "ASC" ? true : false;
-          if (orderArray) {
-            adjustPriorityOrder(column, _newColumnConfig);
-          }
-          else {
-            _newColumnConfig.orderIndex = column.sortIndex;
-          }
-        }
-        else {
-          delete _newColumnConfig.ascending;
-          _newColumnConfig.orderIndex = 0;
-        }
-        _newColumnConfigList.push(_newColumnConfig);
-      }
-    }
-    _newConfig.columns = _newColumnConfigList;
-    this.configFinish.emit(_newConfig);
-    this._orderList.clearHistory();
-    function adjustPriorityOrder(column, _newColumnConfig) {
-      if (orderArray) {
-        let orderItem = orderArray.find(item => item.label === column.label);
-        if (orderItem) {
-          _newColumnConfig.orderIndex = orderItem.orderIndex;
-        }
-      }
-    }
-  }
-  createConfigFromState(state) {
-    let newConfig = { columns: [] };
-    state.forEach(columnState => {
-      if (!columnState.hidden) {
-        let newConfigColumn = { name: columnState.name };
-        if (columnState.width) {
-          newConfigColumn['width'] = columnState.width;
-        }
-        if (columnState.sort) {
-          newConfigColumn['ascending'] = (columnState.sort.toUpperCase() === 'ASC');
-          newConfigColumn['orderIndex'] = columnState.sortIndex;
-        }
-        else {
-          newConfigColumn['orderIndex'] = 0;
-        }
-        if (newConfigColumn) {
-          newConfig.columns.push(newConfigColumn);
-        }
-      }
-    });
-    return newConfig;
-  }
-  async locateColumn(evt, searchingText) {
-    var _a;
-    const hitEnter = evt.key === "Enter";
-    if (!searchingText) {
-      searchingText = (_a = evt.currentTarget) === null || _a === void 0 ? void 0 : _a.value;
-    }
-    let newSelected = -1;
-    if (this.selectedTab === "Ordenação das linhas") {
-      if (searchingText) {
-        const matchedIndexes = [];
-        let orderListDatasource;
-        await this._orderList.getList().then(listGroup => {
-          orderListDatasource = listGroup;
-          orderListDatasource.forEach((column, index) => {
-            if (this.compareWords(column, searchingText)) {
-              matchedIndexes.push(index);
-            }
-          });
-        });
-        if (matchedIndexes.length > 0) {
-          if (hitEnter) {
-            for (let j = 0; j < matchedIndexes.length; j++) {
-              if (matchedIndexes[j] > this._selectedIndex) {
-                newSelected = matchedIndexes[j];
-                break;
-              }
-            }
-          }
-          if (newSelected === -1) {
-            newSelected = matchedIndexes[0];
-          }
-        }
-        this._selectedIndex = newSelected;
-        let selectedColumn;
-        selectedColumn = orderListDatasource[newSelected];
-        if (selectedColumn) {
-          this._orderList.setSelection({ label: selectedColumn.label }, true);
-        }
-        else {
-          this._orderList.setSelection(undefined);
-        }
-      }
-      else {
-        this._orderList.setSelection(undefined);
-      }
-    }
-    else {
-      if (searchingText) {
-        const matchedIndexes = [];
-        this.columns.forEach((column, index) => {
-          if (this.compareWords(column, searchingText)) {
-            matchedIndexes.push(index);
-          }
-        });
-        if (matchedIndexes.length > 0) {
-          if (hitEnter) {
-            for (let j = 0; j < matchedIndexes.length; j++) {
-              if (matchedIndexes[j] > this._selectedIndex) {
-                newSelected = matchedIndexes[j];
-                break;
-              }
-            }
-          }
-          if (newSelected === -1) {
-            newSelected = matchedIndexes[0];
-          }
-        }
-        this._selectedIndex = newSelected;
-        let selectedColumn = this.columns[newSelected];
-        if (selectedColumn) {
-          this._columnList.setSelection({ label: selectedColumn.label }, true);
-        }
-        else {
-          this._columnList.setSelection(undefined);
-        }
-      }
-      else {
-        this._columnList.setSelection(undefined);
-      }
-    }
-  }
-  compareWords(column, searchingText) {
-    if (StringUtils.replaceAccentuatedChars(column.label).indexOf(StringUtils.replaceAccentuatedChars(searchingText)) > -1) {
-      return true;
-    }
-    return false;
-  }
-  closeConfig() {
-    this._orderList.scrollToTop();
-    this._columnList.scrollToTop();
-    this._searchElement.value = "";
-    if (this._dataChanged) {
-      let options = {
-        canClose: false,
-        labelCancel: "Descartar",
-        labelConfirm: "Salvar",
-        btnConfirmDanger: false
-      };
-      ApplicationUtils.confirm("Aviso", "As alterações realizadas serão descartadas. Gostaria de salvar antes de sair?", null, DialogType.WARN, options)
-        .then(response => {
-        if (!response) {
-          this._dataChanged = false;
-          this.configCancel.emit();
-          this._orderList.clearHistory();
-          this._componenteInternalKey = Date.now();
-        }
-        else {
-          this.finish();
-        }
-      });
-    }
-    else {
-      this.configCancel.emit();
-      this._orderList.clearHistory();
-    }
-  }
-  /* Handlers */
-  handleTabChange(ev) {
-    var _a;
-    if ((_a = ev === null || ev === void 0 ? void 0 : ev.target) === null || _a === void 0 ? void 0 : _a.selectedTab) {
-      if (this.selectedTab !== ev.target.selectedTab) {
-        if (ev.target.selectedTab === "Colunas") {
-          this._orderList.scrollToTop();
-        }
-        else if (ev.target.selectedTab === "Ordenação das linhas") {
-          this._columnList.scrollToTop();
-        }
-        this._searchElement.value = "";
-      }
-      if (ev.target.selectedTab === "Ordenação das linhas") {
-        this.createOrderList();
-      }
-      this.selectedTab = ev.target.selectedTab;
-    }
-  }
-  handleColumnListChange(ev) {
-    var _a;
-    if (ev.detail) {
-      let visibleItems = (_a = ev.detail.find(group => group.group === "Visíveis")) === null || _a === void 0 ? void 0 : _a.items;
-      if (visibleItems) {
-        this._dataChanged = true;
-        this._orderListItems = visibleItems;
-      }
-    }
-  }
-  handleOrderListChange(ev) {
-    if (ev.detail) {
-      let orderPriorityList = ev.detail;
-      if (orderPriorityList) {
-        this._dataChanged = true;
-        this._orderPriorityList = orderPriorityList;
-      }
-    }
-  }
-  componentWillRender() {
-    var _a;
-    if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-      this.createColumnList();
-    }
-  }
-  componentDidRender() {
-    var _a;
-    if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-      this.locateColumn(new KeyboardEvent("arrow-right", { key: "ArrowRight" }), this._searchElement.value);
-    }
-  }
-  render() {
-    return (h(Host, null,
-      h("div", { class: "grid-config__header" },
-        h("div", { class: "title-container" },
-          h("div", { class: "" },
-            h("label", { class: "title" }, "Configura\u00E7\u00E3o da Grade"),
-            h("label", { class: "subtitle" }, "Defina visibilidade e ordem das colunas.")),
-          h("div", { class: "button-close" },
-            h("ez-button", { mode: 'icon', iconName: "close", size: 'medium', onClick: () => this.closeConfig() }))),
-        h("div", { class: "tabselector-container" },
-          h("ez-tabselector", { selectedTab: this.selectedTab, selectedIndex: 0, onEzChange: (ev) => { this.handleTabChange(ev); }, tabs: 'Colunas, Ordena\u00E7\u00E3o das linhas' })),
-        h("div", null,
-          h("ez-text-input", { ref: (el) => this._searchElement = el, label: "Localizar coluna", onKeyUp: evt => this.locateColumn(evt) },
-            h("ez-icon", { slot: "leftIcon", size: "medium", iconName: "search" })))),
-      h("div", { class: "grid-config__main" },
-        h("ez-list", { ref: (el) => this._columnList = el, class: this.selectedTab === "Colunas" ? "" : "hidden", dataSource: this._columListItems, onEzChange: ev => this.handleColumnListChange(ev), ezDraggable: true, ezSelectable: true, itemSlotBuilder: (item, group) => this.buildColumnListSlot(item, group), useGroups: true }),
-        h("div", { class: this.selectedTab === "Ordenação das linhas" ? "group-name" : "hidden" }, "Sequ\u00EAncia da ordena\u00E7\u00E3o"),
-        h("ez-list", { ref: (el) => this._orderList = el, class: this.selectedTab === "Ordenação das linhas" ? "height-calc" : "hidden", dataSource: this._orderListItems, ezSelectable: true, onEzChange: ev => this.handleOrderListChange(ev), ezDraggable: true, itemSlotBuilder: (item) => this.buildOrderListSlot(item) })),
-      h("div", { class: "grid-config__footer" },
-        h("ez-button", { class: "padding-right--medium", label: "Cancelar", onClick: () => this.closeConfig() }),
-        h("ez-button", { label: "Concluir", class: "ez-button--primary", onClick: () => this.finish() }))));
-  }
-  static get is() { return "ez-grid-config"; }
-  static get encapsulation() { return "scoped"; }
-  static get originalStyleUrls() { return {
-    "$": ["ez-grid-config.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ez-grid-config.css"]
-  }; }
-  static get assetsDirs() { return ["../assets"]; }
-  static get properties() { return {
-    "selectedTab": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "selected-tab",
-      "reflect": false,
-      "defaultValue": "\"Colunas\""
-    },
-    "columns": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "Array<EzGridColumn>",
-        "resolved": "EzGridColumn[]",
-        "references": {
-          "Array": {
-            "location": "global"
-          },
-          "EzGridColumn": {
-            "location": "import",
-            "path": "../../controller/EzGridController"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      }
-    },
-    "config": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "IGridConfig",
-        "resolved": "IGridConfig",
-        "references": {
-          "IGridConfig": {
-            "location": "import",
-            "path": "../../controller/EzGridController"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      }
-    }
-  }; }
-  static get events() { return [{
-      "method": "configFinish",
-      "name": "configFinish",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "IGridConfig",
-        "resolved": "IGridConfig",
-        "references": {
-          "IGridConfig": {
-            "location": "import",
-            "path": "../../controller/EzGridController"
-          }
-        }
-      }
-    }, {
-      "method": "configCancel",
-      "name": "configCancel",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }]; }
-}

package/dist/collection/components/ez-grid/subcomponents/ez-select-box/ez-select-box.css

@@ -1,9 +0,0 @@
-ez-combo-box {
-    width: 100px;
-}
-
-.grid-config-combo {
-    --ez-text-input--height: 28px;
-    --ez-text-input__input--background-color: #fff;
-    --ez-text-input__input--border-color: #dce0e8;
-}

package/dist/collection/components/ez-grid/subcomponents/ez-select-box/ez-select-box.js

@@ -1,62 +0,0 @@
-import { Component, Event, h, Prop } from '@stencil/core';
-export class SelectBox {
-  constructor() {
-    this.selectedOption = { value: "na", label: "N/A" };
-  }
-  render() {
-    return (h("ez-combo-box", { class: "grid-config-combo ez-input--inverted", label: "", suppressSearch: true, value: this.selectedOption, enabled: true, canShowError: false, suppressEmptyOption: true },
-      h("option", { value: "na" }, "N/A"),
-      h("option", { value: "asc" }, "A-Z"),
-      h("option", { value: "desc" }, "Z-A")));
-  }
-  static get is() { return "ez-select-box"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["ez-select-box.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ez-select-box.css"]
-  }; }
-  static get assetsDirs() { return ["../assets"]; }
-  static get properties() { return {
-    "selectedOption": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "IOption | string",
-        "resolved": "IOption | string",
-        "references": {
-          "IOption": {
-            "location": "import",
-            "path": "../../../ez-combo-box/ez-combo-box"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "selected-option",
-      "reflect": false,
-      "defaultValue": "{ value: \"na\", label: \"N/A\" }"
-    }
-  }; }
-  static get events() { return [{
-      "method": "ezChange",
-      "name": "ezChange",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      }
-    }]; }
-}