@sankhyalabs/ezui 1.1.90 → 1.1.93

package/dist/collection/components/ez-tabselector/ez-tabselector.js

@@ -3,12 +3,10 @@ export class EzTabselector {
   constructor() {
     this.setFocusedParam = (ev) => {
       if (ev.key === "Enter") {
-        this.selectedIndex = this.focusedIndex;
-        this.focusedIndex = undefined;
-        this.selectedTab = this._processedTabs[this.selectedIndex]["tabKey"];
-        this.handleTabClick(this.selectedTab, parseInt(this.selectedIndex));
+        const selectedTab = this._processedTabs[this._focusedIndex];
+        this.handleTabClick(selectedTab);
         ev.preventDefault();
-        this.setFocusedTab(this.selectedIndex);
+        this.setFocusedTab(selectedTab.index);
       }
       else if (ev.key === "ArrowLeft" || ev.key === "ArrowRight") {
         let operator = undefined;
@@ -21,48 +19,46 @@ export class EzTabselector {
         else {
           return;
         }
-        if (this.focusedIndex === undefined) {
+        if (this._focusedIndex === undefined) {
           if (operator === false) {
-            this.focusedIndex = this.selectedIndex !== undefined ? (parseInt(this.selectedIndex) - 1).toString() : undefined;
+            this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex - 1 : undefined;
           }
           else {
-            this.focusedIndex = this.selectedIndex !== undefined ? (parseInt(this.selectedIndex) + 1).toString() : undefined;
+            this._focusedIndex = this.selectedIndex !== undefined ? this.selectedIndex + 1 : undefined;
           }
         }
         else {
           if (operator === false) {
-            this.focusedIndex = (parseInt(this.focusedIndex) - 1).toString();
+            this._focusedIndex = this._focusedIndex - 1;
           }
           else {
-            this.focusedIndex = (parseInt(this.focusedIndex) + 1).toString();
+            this._focusedIndex = this._focusedIndex + 1;
           }
         }
-        if (parseInt(this.focusedIndex) < 0) {
-          this.focusedIndex = "0";
+        if (this._focusedIndex < 0) {
+          this._focusedIndex = 0;
         }
-        else if (parseInt(this.focusedIndex) > this._processedTabs.length - 1) {
-          this.focusedIndex = (this._processedTabs.length - 1).toString();
+        else if (this._focusedIndex > this._processedTabs.length - 1) {
+          this._focusedIndex = this._processedTabs.length - 1;
         }
-        this.setFocusedBtn(true, this.focusedIndex);
-        this.setFocusedTab(this.focusedIndex);
-        this.ezChange.emit(this.selectedTab);
+        this.setFocusedBtn(true, this._focusedIndex);
+        this.setFocusedTab(this._focusedIndex);
       }
       else if (ev.key === "Tab" || ev.key === "Escape") {
-        this.focusedIndex = undefined;
-        this.selectedTab = this._processedTabs[this.selectedIndex]["tabKey"];
-        this.handleTabClick(this.selectedTab, parseInt(this.selectedIndex));
+        const currentTab = this._processedTabs[this.selectedIndex];
+        this._focusedIndex = undefined;
+        this.handleTabClick(currentTab);
         ev.preventDefault();
         this.setFocusedTab(this.selectedIndex);
       }
-      // this.setFocusedTab();
     };
   }
-  handleTabClick(tab, index) {
-    this.selectedIndex = index.toString();
-    this.focusedIndex = undefined;
-    this.selectedTab = tab;
-    this.ezChange.emit(this.selectedTab);
-    this.setFocusedBtn(false, this.selectedIndex);
+  handleTabClick(tab) {
+    this.selectedIndex = tab.index;
+    this._focusedIndex = undefined;
+    this.selectedTab = tab.tabKey;
+    this.ezChange.emit(tab);
+    this.setFocusedBtn(false, tab.index);
   }
   componentWillRender() {
     if (!this._processedTabs) {
@@ -70,16 +66,16 @@ export class EzTabselector {
       if (this.tabs) {
         this.tabs.split(",").forEach((label) => {
           label = label.trim();
-          this._processedTabs.push(new Tab(label, label));
+          this._processedTabs.push({ label, tabKey: label, index: this._processedTabs.length });
         });
       }
       this._hostElem.querySelectorAll("ez-tab").forEach((elem) => {
         const tabKey = elem.getAttribute("tabKey");
         const label = elem.getAttribute("label");
-        const t = new Tab(label, tabKey);
+        const t = { label, tabKey, index: this._processedTabs.length };
         const content = elem.firstChild;
         if (content) {
-          content.setAttribute("slot", "tab" + this._processedTabs.length);
+          content.setAttribute("slot", "tab" + t.index);
           this._hostElem.appendChild(content);
         }
         this._processedTabs.push(t);
@@ -181,12 +177,12 @@ export class EzTabselector {
       h("div", { class: "scroll", ref: (el) => this._scrollContainer = el, onScroll: () => this.domScrollHandler(), onKeyDown: (ev) => this.setFocusedParam(ev) }, this._processedTabs.map((tab, index) => {
         const labelStyle = { "min-width": this.getTextWidth(tab.label) };
         const tabId = "tab" + index;
-        const isSelected = index === parseInt(this.selectedIndex) || (this.selectedTab && tab.tabKey === this.selectedTab);
+        const isSelected = index === this.selectedIndex || (this.selectedTab && tab.tabKey === this.selectedTab);
         if (isSelected) {
           this.selectedTab = tab.tabKey;
-          this.selectedIndex = index.toString();
+          this.selectedIndex = index;
         }
-        return h("button", { id: tabId, class: `tab${isSelected ? " is-active" : ""}`, onClick: () => this.handleTabClick(tab.tabKey, index), style: labelStyle },
+        return h("button", { id: tabId, class: `tab${isSelected ? " is-active" : ""}`, onClick: () => this.handleTabClick(tab), style: labelStyle },
           h("span", { class: "tab-label", title: tab.label }, tab.label),
           h("slot", { name: tabId, onSlotchange: (ev) => { this.handleSlotChange(ev); } }));
       })),
@@ -202,11 +198,11 @@ export class EzTabselector {
   }; }
   static get properties() { return {
     "selectedIndex": {
-      "type": "string",
+      "type": "number",
       "mutable": true,
       "complexType": {
-        "original": "string",
-        "resolved": "string",
+        "original": "number",
+        "resolved": "number",
         "references": {}
       },
       "required": false,
@@ -261,19 +257,17 @@ export class EzTabselector {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "Evento emitido ao clicar para abrir o popup (ezChange)."
+        "text": "Evento emitido ao clicar para abrir o popup (ezChange).\nO detail desse evento carrega tanto o tabKey quanto o index da aba\nselecionada."
       },
       "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+        "original": "Tab",
+        "resolved": "Tab",
+        "references": {
+          "Tab": {
+            "location": "local"
+          }
+        }
       }
     }]; }
   static get elementRef() { return "_hostElem"; }
 }
-class Tab {
-  constructor(label, tabKey) {
-    this.label = label;
-    this.tabKey = tabKey;
-  }
-}

package/dist/collection/utils/index.js

@@ -0,0 +1,2 @@
+export { default as ApplicationUtils } from './ApplicationUtils';
+export { default as CSSVarsUtils } from './CSSVarsUtils';