@sankhyalabs/ezui 1.1.6 → 1.1.10

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

@@ -1,323 +1,323 @@
-import { Component, h, Method, Element, Host, Prop } from '@stencil/core';
-import { FloatingManager } from '@sankhyalabs/core';
-export class EzPopover {
-  constructor() {
-    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';
-  }
-  /**
-   * 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;
-        }
-        //Here: we pass this._box as parameter but we need to change to _host 
-        //because we need to get the lasChild (inner content to put in slot)
-        _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;
-        }
-        // Here: we pass this._box as parameter but we need to change to _host 
-        // because we need to get the lasChild (inner content to put in slot)
-        _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.isOpened = 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.isOpened = 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)))));
-  }
-  static get is() { return "ez-popover"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["ez-popover.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ez-popover.css"]
-  }; }
-  static get properties() { return {
-    "autoclose": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "No modo floating = false o popover s\u00F3 se tornar\u00E1 vis\u00EDvel\r\nquando o m\u00E9todo show() for acionado."
-      },
-      "attribute": "autoclose",
-      "reflect": true,
-      "defaultValue": "true"
-    },
-    "top": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Offset top do popover em rela\u00E7\u00E3o ao componente pai"
-      },
-      "attribute": "top",
-      "reflect": true,
-      "defaultValue": "'0px'"
-    },
-    "left": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Offset left do popover em rela\u00E7\u00E3o ao componente pai"
-      },
-      "attribute": "left",
-      "reflect": true,
-      "defaultValue": "'0px'"
-    },
-    "bottom": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Offset bottom do popover em rela\u00E7\u00E3o ao componente pai"
-      },
-      "attribute": "bottom",
-      "reflect": true,
-      "defaultValue": "'0px'"
-    },
-    "right": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Offset right do popover em rela\u00E7\u00E3o ao componente pai"
-      },
-      "attribute": "right",
-      "reflect": true,
-      "defaultValue": "'0px'"
-    },
-    "boxwidth": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Ajusta o comportamento da largura do popover.\r\nOp\u00E7\u00F5es: \"100% e \"fit-content\" (default)"
-      },
-      "attribute": "boxwidth",
-      "reflect": true,
-      "defaultValue": "'fit-content'"
-    },
-    "isOpened": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Externaliza estado atual do componente."
-      },
-      "attribute": "is-opened",
-      "reflect": true
-    }
-  }; }
-  static get methods() { return {
-    "updatePosition": {
-      "complexType": {
-        "signature": "(top?: string, left?: string, bottom?: string, right?: string) => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          },
-          "HTMLElement": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "Atualiza a posi\u00E7\u00E3o do popover em rela\u00E7\u00E3o ao componente pai.",
-        "tags": []
-      }
-    },
-    "show": {
-      "complexType": {
-        "signature": "(top?: string, left?: string, bottom?: string, right?: string) => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          },
-          "HTMLElement": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "Faz com que o popover seja renderizado na DOM.",
-        "tags": []
-      }
-    },
-    "hide": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "Usado no modo floating. Faz com que o componente seja ocultado.",
-        "tags": []
-      }
-    }
-  }; }
-  static get elementRef() { return "_host"; }
-}
+import { Component, h, Method, Element, Host, Prop } from '@stencil/core';
+import { FloatingManager } from '@sankhyalabs/core';
+export class EzPopover {
+  constructor() {
+    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';
+  }
+  /**
+   * 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;
+        }
+        //Here: we pass this._box as parameter but we need to change to _host 
+        //because we need to get the lasChild (inner content to put in slot)
+        _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;
+        }
+        // Here: we pass this._box as parameter but we need to change to _host 
+        // because we need to get the lasChild (inner content to put in slot)
+        _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.isOpened = 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.isOpened = 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)))));
+  }
+  static get is() { return "ez-popover"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["ez-popover.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["ez-popover.css"]
+  }; }
+  static get properties() { return {
+    "autoclose": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "No modo floating = false o popover s\u00F3 se tornar\u00E1 vis\u00EDvel\nquando o m\u00E9todo show() for acionado."
+      },
+      "attribute": "autoclose",
+      "reflect": true,
+      "defaultValue": "true"
+    },
+    "top": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Offset top do popover em rela\u00E7\u00E3o ao componente pai"
+      },
+      "attribute": "top",
+      "reflect": true,
+      "defaultValue": "'0px'"
+    },
+    "left": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Offset left do popover em rela\u00E7\u00E3o ao componente pai"
+      },
+      "attribute": "left",
+      "reflect": true,
+      "defaultValue": "'0px'"
+    },
+    "bottom": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Offset bottom do popover em rela\u00E7\u00E3o ao componente pai"
+      },
+      "attribute": "bottom",
+      "reflect": true,
+      "defaultValue": "'0px'"
+    },
+    "right": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Offset right do popover em rela\u00E7\u00E3o ao componente pai"
+      },
+      "attribute": "right",
+      "reflect": true,
+      "defaultValue": "'0px'"
+    },
+    "boxwidth": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Ajusta o comportamento da largura do popover.\nOp\u00E7\u00F5es: \"100% e \"fit-content\" (default)"
+      },
+      "attribute": "boxwidth",
+      "reflect": true,
+      "defaultValue": "'fit-content'"
+    },
+    "isOpened": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Externaliza estado atual do componente."
+      },
+      "attribute": "is-opened",
+      "reflect": true
+    }
+  }; }
+  static get methods() { return {
+    "updatePosition": {
+      "complexType": {
+        "signature": "(top?: string, left?: string, bottom?: string, right?: string) => Promise<void>",
+        "parameters": [{
+            "tags": [],
+            "text": ""
+          }, {
+            "tags": [],
+            "text": ""
+          }, {
+            "tags": [],
+            "text": ""
+          }, {
+            "tags": [],
+            "text": ""
+          }],
+        "references": {
+          "Promise": {
+            "location": "global"
+          },
+          "HTMLElement": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Atualiza a posi\u00E7\u00E3o do popover em rela\u00E7\u00E3o ao componente pai.",
+        "tags": []
+      }
+    },
+    "show": {
+      "complexType": {
+        "signature": "(top?: string, left?: string, bottom?: string, right?: string) => Promise<void>",
+        "parameters": [{
+            "tags": [],
+            "text": ""
+          }, {
+            "tags": [],
+            "text": ""
+          }, {
+            "tags": [],
+            "text": ""
+          }, {
+            "tags": [],
+            "text": ""
+          }],
+        "references": {
+          "Promise": {
+            "location": "global"
+          },
+          "HTMLElement": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Faz com que o popover seja renderizado na DOM.",
+        "tags": []
+      }
+    },
+    "hide": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Usado no modo floating. Faz com que o componente seja ocultado.",
+        "tags": []
+      }
+    }
+  }; }
+  static get elementRef() { return "_host"; }
+}