@sankhyalabs/sankhyablocks 1.1.22 → 1.1.25

package/dist/esm/ez-label-chip.entry.js

@@ -0,0 +1,100 @@
+import { r as registerInstance, c as createEvent, h } from './index-35088a3f.js';
+
+const ezLabelChipCss = ":host{--ez-label-chip--height:36px;--ez-label-chip__label--font-size:var(--text--medium, 14px);--ez-label-chip__label--font-family:var(--font-pattern, Arial);--ez-label-chip__label--font-weight:var(--text-weight--large, 600);--ez-label-chip__label--space--medium:var(--space--medium, 12px);--ez-label-chip__label--title--primary:var(--title--primary, #919191);--ez-label-chip__label__container--border-radius:var(--border--radius-large, 24px);--ez-label-chip__label__container--border:1px solid;--ez-label-chip__label__container--border-color-strokes:var(--color--strokes, #DCE0E8);--ez-label-chip__label__container--color-primary:var(--color--primary, #008561);--ez-label-chip__label__container-color--disable-secondary:var(--color--disable-secondary, #F2F5F8);--ez-label-chip__label__container--background-color:#0085610F;--ez-label-chip__label__container--border-color:#0085610F;--ez-label-chip__label__container--default--border-color--hover:var(--color--primary-600, #007a5a);--ez-label-chip__label__container--default--background-color--hover:var(--color--primary-200, #f2faf8);--ez-label-chip__label__container--text--disabled:var(--text--disable, #AFB6C0);--ez-label-chip__btn__close--image:url('data:image/svg+xml;utf8,<svg width=\"8\" height=\"8\" viewBox=\"0 0 8 8\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M 4.7098145,3.9968334 7.8535703,0.85318776 C 7.9473034,0.75946455 8,0.63233985 8,0.49978585 8,0.36723841 7.947304,0.24011361 7.8535703,0.14638378 7.7598354,0.05266059 7.6327257,6.48e-8 7.500152,6.48e-8 7.3676457,6.48e-8 7.2404691,0.0526608 7.1467354,0.14638378 L 4.00298,3.2900293 0.8591984,0.14638378 C 0.76546463,0.05266059 0.63834103,6.48e-8 0.50578123,6.48e-8 0.3732281,6.48e-8 0.24609783,0.05266059 0.15236397,0.14638378 0.05863012,0.24011361 0.00597395,0.36723841 0.00597395,0.49978585 c 0,0.132554 0.05265617,0.2596787 0.14639002,0.35340191 L 3.2961455,3.9968334 0.15236397,7.1411589 C 0.10466427,7.1872561 0.06663114,7.2424161 0.04046961,7.303371 0.01431473,7.3643212 5.6180845e-4,7.429943 1.6859246e-5,7.4962264 -5.2808998e-4,7.5625744 0.01214297,7.6283944 0.03729854,7.6897476 c 0.02514888,0.061416 0.06227604,0.1171794 0.1092096,0.1640783 0.0469402,0.046903 0.10274083,0.083936 0.16415749,0.1090508 0.0614166,0.025114 0.12721688,0.037703 0.19355667,0.037103 0.06634,-5.714e-4 0.13190027,-0.014457 0.19284393,-0.04064 0.0609507,-0.026246 0.11606474,-0.064351 0.16213217,-0.1120492 L 4.00298,4.7036374 7.1467354,7.8472967 c 0.093734,0.09373 0.2209103,0.1463572 0.3534166,0.1463572 0.1325737,0 0.2596834,-0.052623 0.3534183,-0.1463572 C 7.9473034,7.753567 8,7.6264624 8,7.493895 8,7.3613281 7.9473086,7.2342224 7.8535703,7.1404927 Z\"/></svg>')}.btn-close{align-items:flex-start;display:flex;outline:none;border:none;padding:0px 0px 0px 6px;background-color:unset;cursor:pointer}.btn-close::after{content:'';display:flex;background-color:var(--ez-label-chip__label__container--color-primary);width:8px;height:8px;-webkit-mask-image:var(--ez-label-chip__btn__close--image);mask-image:var(--ez-label-chip__btn__close--image)}.label__container{width:fit-content;display:flex;flex-wrap:wrap;position:relative;align-items:center;background-color:#FFFFFF;align-self:center;color:var(--ez-label-chip__label--title--primary);fill:var(--ez-label-chip__label--title--primary);border:var(--ez-label-chip__label__container--border);border-radius:var(--ez-label-chip__label__container--border-radius);border-color:var(--ez-label-chip__label__container--border-color-strokes);padding-right:var(--ez-label-chip__label--space--medium);padding-left:var(--ez-label-chip__label--space--medium)}.label__container:hover{border-color:var(--ez-label-chip__label__container--default--border-color--hover);background-color:var(--ez-label-chip__label__container--default--background-color--hover)}.label__container--active{width:fit-content;display:flex;flex-wrap:wrap;position:relative;align-items:center;align-self:center;border:var(--ez-label-chip__label__container--border);border-radius:var(--ez-label-chip__label__container--border-radius);padding-right:var(--ez-label-chip__label--space--medium);padding-left:var(--ez-label-chip__label--space--medium);fill:var(--ez-label-chip__label__container--color-primary);color:var(--ez-label-chip__label__container--color-primary);border-color:var(--ez-label-chip__label__container--border-color);background-color:var(--ez-label-chip__label__container--background-color)}.label__container--disabled{width:fit-content;display:flex;flex-wrap:wrap;position:relative;align-items:center;align-self:center;border:var(--ez-label-chip__label__container--border);border-color:var(--ez-label-chip__label__container-color--disable-secondary);border-radius:var(--ez-label-chip__label__container--border-radius);padding-right:var(--ez-label-chip__label--space--medium);padding-left:var(--ez-label-chip__label--space--medium);fill:var(--ez-label-chip__label__container--text--disabled);color:var(--ez-label-chip__label__container--text--disabled);background-color:var(--ez-label-chip__label__container-color--disable-secondary)}label{display:flex;align-items:center;font-weight:var(--ez-label-chip__label--font-weight);cursor:pointer;height:var(--ez-label-chip--height);font-family:var(--ez-label-chip__label--font-family);font-size:var(--ez-label-chip__label--font-size)}.label__icon{display:flex;cursor:pointer}";
+
+const EzLabelChip = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.valueChange = createEvent(this, "valueChange", 7);
+    this.removeChip = createEvent(this, "removeChip", 7);
+    /**
+     * Deixa o componente disponível ou não para seleção.
+     */
+    this.enabled = true;
+    /**
+     * Indica se o componente terá a opção de ser removido.
+     */
+    this.removable = false;
+    /**
+     * Indica se o componente está ou não ativado.
+     */
+    this.value = false;
+  }
+  //---------------------------------------------
+  // Public methods
+  //---------------------------------------------
+  /**
+   * Faz o foco no componente de input
+   */
+  async setFocus() {
+    this._labelElem.focus();
+  }
+  /**
+   * Remove o foco no componente de input
+   */
+  async setBlur() {
+    this._labelElem.blur();
+  }
+  //---------------------------------------------
+  // Event handlers
+  //---------------------------------------------
+  handleClick(ev) {
+    const target = ev.target;
+    if (target.assignedSlot === null && !target.classList.contains("label__icon")) {
+      this.valueChange.emit(this.value);
+      this.swichState();
+    }
+  }
+  swichState() {
+    if (this.enabled) {
+      this.value = !this.value;
+    }
+  }
+  reflectChange() {
+    if (this._divElem) {
+      this._divElem.classList.remove("label__container--active");
+      this._divElem.classList.remove("label__container");
+      if (this.value) {
+        this._divElem.classList.add("label__container--active");
+      }
+      else {
+        this._divElem.classList.add("label__container");
+      }
+    }
+  }
+  //---------------------------------------------
+  // Lifecycle web component
+  //---------------------------------------------
+  componentDidLoad() {
+    if (this._divElem) {
+      if (this.value) {
+        this._divElem.classList.add("label__container--active");
+      }
+      else {
+        this.handleEnabledState();
+      }
+    }
+  }
+  handleEnabledState() {
+    this._divElem.classList.remove("label__container--disabled");
+    if (!this.enabled) {
+      this._divElem.classList.remove("label__container");
+      this._divElem.classList.add("label__container--disabled");
+      if (this._labelElem) {
+        this._labelElem.style.cursor = "default";
+      }
+    }
+  }
+  render() {
+    return (h("div", { onClick: (ev) => this.handleClick(ev), class: this.value ? "label__container--active" : "label__container", ref: (el) => this._divElem = el }, h("slot", { name: "leftIcon" }), h("label", { ref: (el) => this._labelElem = el }, this.label), this.removable ?
+      h("button", { class: "btn-close", onClick: () => { this.removeChip.emit(); } })
+      : null, h("slot", { name: "rightIcon" })));
+  }
+  static get watchers() { return {
+    "value": ["reflectChange"],
+    "enabled": ["handleEnabledState"]
+  }; }
+};
+EzLabelChip.style = ezLabelChipCss;
+
+export { EzLabelChip as ez_label_chip };

package/dist/esm/ez-modal_2.entry.js

@@ -0,0 +1,311 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-35088a3f.js';
+import { g as getSpritePath } from './AssetsUtils-6e6624dc.js';
+import { StringUtils } from '@sankhyalabs/core';
+
+const ezModalCss = ":host{--ez-modal-z-index:var(--most-visible, 3);--ez-modal-vertical-padding:var(--space--large, 24px);display:block}.modal{position:fixed;padding:var(--ez-modal-vertical-padding) 0;display:flex;top:0px;z-index:var(--ez-modal-z-index);left:0px;width:100%;box-sizing:border-box;height:100vh;backdrop-filter:blur(4px);background:rgba(0, 4, 12, 0.4)}@keyframes expand-modal--left{from{transform:translate(-100%)}}@keyframes expand-modal--right{from{transform:translate(100%)}}.modal__container{display:flex;flex-wrap:wrap;height:100%;box-sizing:border-box;width:100%;align-items:flex-start}.modal__container--right{animation:expand-modal--right .2s ease-in-out 1;justify-content:flex-end}.modal__container--left{animation:expand-modal--left .2s ease-in-out 1;justify-content:flex-start}.modal__content{display:flex;flex-wrap:wrap;max-height:calc(100% - 48px);height:100%;overflow-y:auto;background-color:rgb(255, 255, 255);padding:24px;border-radius:12px 0px 0px 12px;box-shadow:rgb(0 38 111 / 12%) 0px 0px 16px 0px}.modal__content--right{border-radius:12px 0px 0px 12px}.modal__content--left{border-radius:0px 12px 12px 0px}.modal__box__container{display:flex;flex-wrap:wrap;background-color:#fff;width:100%;border-radius:12px}.row{width:100%;display:flex;flex-wrap:wrap}.col{display:flex;flex-wrap:wrap;align-self:flex-start;box-sizing:border-box}.col--stretch{align-self:stretch}.col--undefined{width:unset}.col--nowrap{flex-wrap:nowrap}@media screen and (min-width: 320px){.col--sd-1{width:8.33333%}.col--sd-2{width:16.66667%}.col--sd-3{width:25%}.col--sd-4{width:33.33333%}.col--sd-5{width:41.66667%}.col--sd-6{width:50%}.col--sd-7{width:58.33333%}.col--sd-8{width:66.66667%}.col--sd-9{width:75%}.col--sd-10{width:83.33333%}.col--sd-11{width:91.66667%}.col--sd-12{width:100%}}@media screen and (min-width: 480px){.col--pn-1{width:8.33333%}.col--pn-2{width:16.66667%}.col--pn-3{width:25%}.col--pn-4{width:33.33333%}.col--pn-5{width:41.66667%}.col--pn-6{width:50%}.col--pn-7{width:58.33333%}.col--pn-8{width:66.66667%}.col--pn-9{width:75%}.col--pn-10{width:83.33333%}.col--pn-11{width:91.66667%}.col--pn-12{width:100%}}@media screen and (min-width: 768px){.col--tb-1{width:8.33333%}.col--tb-2{width:16.66667%}.col--tb-3{width:25%}.col--tb-4{width:33.33333%}.col--tb-5{width:41.66667%}.col--tb-6{width:50%}.col--tb-7{width:58.33333%}.col--tb-8{width:66.66667%}.col--tb-9{width:75%}.col--tb-10{width:83.33333%}.col--tb-11{width:91.66667%}.col--tb-12{width:100%}}@media screen and (min-width: 992px){.col--md-1{width:8.33333%}.col--md-2{width:16.66667%}.col--md-3{width:25%}.col--md-4{width:33.33333%}.col--md-5{width:41.66667%}.col--md-6{width:50%}.col--md-7{width:58.33333%}.col--md-8{width:66.66667%}.col--md-9{width:75%}.col--md-10{width:83.33333%}.col--md-11{width:91.66667%}.col--md-12{width:100%}}@media screen and (min-width: 1200px){.col--ld-1{width:8.33333%}.col--ld-2{width:16.66667%}.col--ld-3{width:25%}.col--ld-4{width:33.33333%}.col--ld-5{width:41.66667%}.col--ld-6{width:50%}.col--ld-7{width:58.33333%}.col--ld-8{width:66.66667%}.col--ld-9{width:75%}.col--ld-10{width:83.33333%}.col--ld-11{width:91.66667%}.col--ld-12{width:100%}}";
+
+const EzModal = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ezCloseModal = createEvent(this, "ezCloseModal", 7);
+    /**
+    * Controle de exibição do Modal
+    */
+    this.opened = true;
+    /**
+    * Define se o modal será fechado ao clicar ESC
+    */
+    this.closeEsc = false;
+    /**
+    * Define se o modal será fechado ao clicar fora do conteúdo.
+    */
+    this.closeOutsideClick = false;
+    this.handleKeyboardEvent = (ev) => {
+      if ((ev === null || ev === void 0 ? void 0 : ev.key) === "Escape" && this.closeEsc) {
+        this.closeModal();
+      }
+    };
+  }
+  handleopenedChange() {
+    if (this.opened) {
+      document.addEventListener("keydown", this.handleKeyboardEvent);
+    }
+    else {
+      document.removeEventListener("keydown", this.handleKeyboardEvent);
+    }
+  }
+  closeModal() {
+    this.opened = false;
+    this.ezCloseModal.emit(this.opened);
+  }
+  componentDidLoad() {
+    this.handleopenedChange();
+  }
+  onMouseDownHandler(event) {
+    if (this.closeOutsideClick && event.target === this._overlay) {
+      this.closeModal();
+    }
+  }
+  render() {
+    const positionSufix = this.align === "left" ? "left" : "right";
+    return (h(Host, null, this.opened
+      ?
+        h("div", { class: "modal", onMouseDown: evt => this.onMouseDownHandler(evt) }, h("div", { class: `modal__container modal__container--${positionSufix}`, ref: ref => this._overlay = ref }, h("div", { class: `modal__content modal__content--${positionSufix} ${this.modalSize}` }, h("slot", null))))
+      :
+        undefined));
+  }
+  static get watchers() { return {
+    "opened": ["handleopenedChange"]
+  }; }
+};
+EzModal.style = ezModalCss;
+
+const gridConfigCss = ".sc-grid-config-h{--ez-grid-config__footer--padding-top:var(--space--medium, 12px);--ez-grid-config__main--padding-right:var(--space--medium, 12px);--ez-grid-config__tabselector-container--padding:var(--space--medium, 12px);--ez-grid-config__button-close--padding-left:var(--space--medium, 12px);--ez-grid-config__subtitle--font-family:var(--font-pattern, \"Sora\");--ez-grid-config__title--font-family:var(--font-pattern, \"Sora\");--ez-grid-config__title--font-weight:var(--text-weight--large, 700);--ez-grid-config__subtitle--font-size:var(--text--medium, 14px);--ez-grid-config__scrollbar--width:var(--space--medium, 12px);--ez-grid-config__main__scrollbar--background-color:var(--text--primary, #626e82);--ez-grid-config__main__scrollbar--border-radius:var(--border--radius-medium, 12px);--ez-grid__group--font-family:var(--font-pattern, \"Sora\");--ez-grid__group--font-size:var(--text--medium, 14px);--ez-grid__group--font-weight:var(--text-weight--large, 600);--ez-grid__group--padding-bottom:var(--space-small, 6px);display:grid;grid-template-rows:auto 1fr auto;max-height:100%;width:100%}.padding-right--medium.sc-grid-config{padding-right:var(--space--medium)}ez-list.sc-grid-config{height:100%}.heigth-calc.sc-grid-config{max-height:calc(100% - 24px)}.grid-config__footer.sc-grid-config{padding-top:var(--ez-grid-config__footer--padding-top);display:flex;justify-content:flex-end;width:100%}.hidden.sc-grid-config{display:none}.grid-config__main.sc-grid-config{padding-right:var(--ez-grid-config__main--padding-right);overflow-y:auto}.tabselector-container.sc-grid-config{padding:var(--ez-grid-config__tabselector-container--padding) 0}.button-close.sc-grid-config{padding-left:var(--ez-grid-config__button-close--padding-left)}.title-container.sc-grid-config{display:flex;justify-content:space-between;align-items:center;width:359px}.subtitle.sc-grid-config{font-family:var(--ez-grid-config__subtitle--font-family);font-size:var(--ez-grid-config__subtitle--font-size);color:var(--text--primary)}.title.sc-grid-config{display:flex;margin:0;font-family:var(--ez-grid-config__title--font-family);font-size:var(--title--large);font-weight:var(--ez-grid-config__title--font-weight);line-height:normal;letter-spacing:0em;text-align:left;color:var(--title--primary)}.grid-config__main.sc-grid-config::-webkit-scrollbar-track{background-color:#f0f2f5}.grid-config__main.sc-grid-config::-webkit-scrollbar-thumb{background-color:var(--ez-grid-config__main__scrollbar--background-color);border-radius:var(--ez-grid-config__main__scrollbar--border-radius)}.grid-config__main.sc-grid-config::-webkit-scrollbar{background-color:#f0f2f5;width:var(--ez-grid-config__scrollbar--width);max-width:var(--ez-grid-config__scrollbar--width);min-width:var(--ez-grid-config__scrollbar--width)}.group-name.sc-grid-config{font-family:var(--ez-grid__group--font-family);font-size:var(--ez-grid__group--font-size);font-weight:var(--ez-grid__group--font-weight);padding-bottom:var(--ez-grid__group--padding-bottom)}";
+
+const GridConfig = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.configFinish = createEvent(this, "configFinish", 7);
+    this.configCancel = createEvent(this, "configCancel", 7);
+    this._columnListHistory = [];
+    this._orderListItems = [];
+    this._columListItems = [];
+    this.selectedTab = "Colunas";
+    this._selectedIndex = -1;
+  }
+  /* Creation Methods */
+  createOrderList() {
+    var _a;
+    let newList = [];
+    if (((_a = this._columnListHistory) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+      this._columnListHistory.find(group => group.group === "Visíveis").items.forEach(column => {
+        let item = { label: column.label };
+        newList.push(item);
+      });
+    }
+    else {
+      this.columns.forEach(column => {
+        let item = { name: column.name, label: column.label };
+        if (!column.hidden) {
+          newList.push(item);
+        }
+      });
+    }
+    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);
+      }
+    });
+    if (this._columnListHistory.length <= 0) {
+      this._columListItems = [visibleGroup, hiddenGroup];
+    }
+  }
+  buildColumnListSlot(item, group) {
+    return (h("div", null, h("ez-check", { mode: 'switch', id: 'switch' + item + group, value: group.group === "Visíveis", onEzChange: (ev) => { this.switchColumnGroup(ev, item); } })));
+  }
+  buildOrderListSlot(item) {
+    let existingItem = this.columns.find(columnItem => columnItem.label === item.label);
+    return (h("div", null, h("select-box", { selectedOption: existingItem === null || existingItem === void 0 ? void 0 : existingItem.sort, key: 'select-box' + item, onEzChange: (ev) => { ev.stopPropagation(); this.updateOrder(ev.detail, item); } })));
+  }
+  updateOrder(sortOrder, updatedItem) {
+    let newList = [...this.columns];
+    let newItem = newList.find(item => item.label === updatedItem.label);
+    if (newItem) {
+      newItem.sort = sortOrder.value;
+    }
+    this.columns = newList;
+  }
+  /* Actions Methods */
+  switchColumnGroup(ev, switchedItem) {
+    ev.stopPropagation();
+    let newList = [...this._columListItems];
+    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._columnListHistory = [];
+    this.columns = newColumnList;
+    this.configFinish.emit(this.columns);
+  }
+  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._columnListHistory = [];
+    this.configCancel.emit();
+  }
+  /* 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 (ev.target.selectedTab === "Ordenação das linhas") {
+        this._columnListHistory = this._columnList.dataSource;
+        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._orderListItems = visibleItems;
+      }
+    }
+  }
+  componentWillRender() {
+    var _a;
+    if (((_a = this.columns) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+      this.createColumnList();
+      this.createOrderList();
+    }
+  }
+  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', image: getSpritePath("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", href: getSpritePath("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" ? "heigth-calc" : "hidden", dataSource: this._orderListItems, ezSelectable: true, 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: "button--primary", onClick: () => this.finish() }))));
+  }
+  static get assetsDirs() { return ["../assets"]; }
+};
+GridConfig.style = gridConfigCss;
+
+export { EzModal as ez_modal, GridConfig as grid_config };

package/dist/esm/ez-number-input.entry.js

@@ -0,0 +1,82 @@
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-35088a3f.js';
+import { NumberUtils } from '@sankhyalabs/core';
+import { C as CSSVarsUtils } from './CSSVarsUtils-0787c3f3.js';
+
+const ezNumberInputCss = ":host{display:block;width:100%}";
+
+const EzNumberInput = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ezChange = createEvent(this, "ezChange", 7);
+    /**
+     * Deixa o campo disponível ou não para uso.
+     */
+    this.enabled = true;
+  }
+  setLabel() {
+    this._textInput.label = this.label;
+  }
+  setErrorMessage() {
+    this._textInput.errorMessage = this.errorMessage;
+  }
+  applyValueToInput() {
+    if (this._textInput) {
+      this._textInput.value = this.getTextValue(this.value);
+    }
+  }
+  /**
+   * Realiza o foco no componente de input
+   */
+  async setFocus() {
+    this._textInput.setFocus();
+  }
+  /**
+   * Remove o foco no componente de input
+   */
+  async setBlur() {
+    this._textInput.setBlur();
+  }
+  changeValue(newValue) {
+    this.errorMessage = "";
+    if (newValue && newValue !== this.value) {
+      this.value = newValue;
+      this.ezChange.emit(this.value);
+    }
+  }
+  parseNumber() {
+    const parsedNumber = this._textInput.value ? NumberUtils.stringToNumber(this._textInput.value) : null;
+    if (parsedNumber != null && isNaN(parsedNumber)) {
+      this.errorMessage = "O valor digitado não é um número válido";
+    }
+    else {
+      try {
+        this.changeValue(parsedNumber);
+      }
+      catch (e) {
+        this.errorMessage = e.message;
+        return;
+      }
+    }
+  }
+  getTextValue(value) {
+    if (value) {
+      return this.precision > 0 ? NumberUtils.format(value.toString(), Number(this.precision), Number(this.prettyPrecision)) : value.toString();
+    }
+    return null;
+  }
+  componentDidLoad() {
+    CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
+  }
+  render() {
+    return (h("ez-text-input", { ref: elem => this._textInput = elem, onBlur: () => this.parseNumber(), label: this.label, onEzChange: event => event.stopPropagation(), value: this.getTextValue(this.value), restrict: this.precision > 0 ? "0123456789-,." : "0123456789-", enabled: this.enabled, errorMessage: this.errorMessage }));
+  }
+  get _elem() { return getElement(this); }
+  static get watchers() { return {
+    "label": ["setLabel"],
+    "errorMessage": ["setErrorMessage"],
+    "value": ["applyValueToInput"]
+  }; }
+};
+EzNumberInput.style = ezNumberInputCss;
+
+export { EzNumberInput as ez_number_input };

package/dist/esm/ez-popover.entry.js

@@ -0,0 +1,116 @@
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-35088a3f.js';
+import { FloatingManager } from '@sankhyalabs/core';
+
+const ezPopoverCss = ":host{--ez-popover__box--border-radius:var(--border--radius-medium, 12px);--ez-popover__box--box-shadow:var(--shadow, 0px 0px 16px 0px #000);--ez-popover__box--background-color:var(--background--xlight, #fff);--ez-popover__box--z-index:var(--more-visible, 1);position:relative;display:flex;user-select:none;width:100%}.box{z-index:var(--ez-popover__box--z-index);display:flex;flex-direction:column;height:fit-content;background-color:var(--ez-popover__box--background-color);border-radius:var(--ez-popover__box--border-radius);box-shadow:var(--ez-popover__box--box-shadow)}.box--fit-content{width:fit-content}.box--full-width{width:100%}";
+
+const EzPopover = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ezVisibilityChange = createEvent(this, "ezVisibilityChange", 7);
+    this._firstRender = true;
+    /**
+     * No modo floating = false o popover só se tornará visível
+     * quando o método show() for acionado.
+     */
+    this.autoClose = true;
+    /**
+     * Offset top do popover em relação ao componente pai
+     */
+    this.top = "0px";
+    /**
+     * Offset left do popover em relação ao componente pai
+     */
+    this.left = "0px";
+    /**
+     * Offset bottom do popover em relação ao componente pai
+     */
+    this.bottom = "0px";
+    /**
+     * Offset right do popover em relação ao componente pai
+     */
+    this.right = "0px";
+    /**
+     * Ajusta o comportamento da largura do popover.
+     * Opções: "100% e "fit-content" (default)
+     */
+    this.boxWidth = "fit-content";
+  }
+  dispatchVisibilityChange(newValue, oldValue) {
+    if (newValue != oldValue) {
+      this.ezVisibilityChange.emit(newValue);
+    }
+  }
+  /**
+   * Atualiza a posição do popover em relação ao componente pai.
+   */
+  async updatePosition(top = this.top, left = this.left, bottom = this.bottom, right = this.right) {
+    const floatingOptions = {
+      autoClose: this.autoClose,
+      top,
+      left,
+      bottom,
+      right,
+      innerClickTest: (_container, node) => {
+        if (_container.contains(node)) {
+          return true;
+        }
+        if (_container.shadowRoot && _container.shadowRoot.contains(node)) {
+          return true;
+        }
+        _container = this._host;
+        return !_container.lastElementChild.shadowRoot ? _container.contains(node) : _container.lastElementChild.shadowRoot.contains(node);
+      }
+    };
+    FloatingManager.updateFloatPosition(this._box, this._container, floatingOptions);
+  }
+  /**
+   * Faz com que o popover seja renderizado na DOM.
+   */
+  async show(top = this.top, left = this.left, bottom = this.bottom, right = this.right) {
+    const floatingOptions = {
+      autoClose: this.autoClose,
+      top,
+      left,
+      bottom,
+      right,
+      innerClickTest: (_container, node) => {
+        if (_container.contains(node)) {
+          return true;
+        }
+        if (_container.shadowRoot && _container.shadowRoot.contains(node)) {
+          return true;
+        }
+        _container = this._host;
+        return !_container.lastElementChild.shadowRoot ? _container.contains(node) : _container.lastElementChild.shadowRoot.contains(node);
+      }
+    };
+    this._floatingID = FloatingManager.float(this._box, this._container, floatingOptions);
+    this.opened = true;
+  }
+  /**
+   * Usado no modo floating. Faz com que o componente seja ocultado.
+   */
+  async hide() {
+    if (this._floatingID !== undefined) {
+      FloatingManager.close(this._floatingID);
+      this._floatingID = undefined;
+      this.opened = false;
+    }
+  }
+  componentDidRender() {
+    if (this._firstRender) {
+      this._box.remove();
+      this._firstRender = false;
+    }
+  }
+  render() {
+    return (h(Host, null, h("section", { ref: el => this._container = el }, h("div", { class: `box ${this.boxWidth === "fit-content" ? "box--fit-content" : "box--full-width"}`, ref: el => this._box = el }, h("slot", null)))));
+  }
+  get _host() { return getElement(this); }
+  static get watchers() { return {
+    "opened": ["dispatchVisibilityChange"]
+  }; }
+};
+EzPopover.style = ezPopoverCss;
+
+export { EzPopover as ez_popover };