@sankhyalabs/ezui 1.1.6 → 1.1.10

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

@@ -1,215 +1,215 @@
-import { FloatingManager } from '@sankhyalabs/core';
-import { Component, forceUpdate, h, Prop, Method, Event, Watch } from '@stencil/core';
-export class EzCalendar {
-  constructor() {
-    this._firstRender = true;
-    this._todayLabel = 'Hoje';
-    this._weekDayLabels = ['D', 'S', 'T', 'Q', 'Q', 'S', 'S'];
-    this._monthLabels = ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'];
-    /**
-     * A data selecionada no calendário
-     */
-    this.value = new Date();
-    /**
-     * No modo floating o calendário só se tornará visível
-     * quando o método show() for acionado.
-     */
-    this.floating = false;
-  }
-  /**
-   * Usado no modo floating. Faz com que o componente seja exibido.
-   * É possível determinar ajustes de posicionamento através dos parâmetros
-   * top, left, bottom e right. Esses parâmetros devem ser informados como
-   * strings no formato css.
-   */
-  async show(top, left, bottom, right) {
-    if (this.floating) {
-      this._floatingID = FloatingManager.float(this._box, this._container, { autoClose: true, top, left, bottom, right });
-    }
-  }
-  /**
-   * Usado no modo floating. Faz com que o componente seja ocultado.
-   */
-  async hide() {
-    if (this._floatingID !== undefined) {
-      FloatingManager.close(this._floatingID);
-      this._floatingID = undefined;
-    }
-  }
-  valueChanged() {
-    if (this.value) {
-      this._currentPosition.setTime(this.value.getTime());
-      this._currentPosition.setDate(1);
-    }
-  }
-  getMonthLabel() {
-    return this._monthLabels[this._currentPosition.getMonth()] + " " + this._currentPosition.getFullYear();
-  }
-  isSelectedDate(d) {
-    if (this.value) {
-      return this.value.getDate() == d.getDate() && this.value.getMonth() == d.getMonth() && this.value.getFullYear() == d.getFullYear();
-    }
-    return false;
-  }
-  changeMonth(offset) {
-    this._currentPosition.setMonth(this._currentPosition.getMonth() + offset);
-    forceUpdate(this);
-  }
-  selectDate(d) {
-    this.value = d;
-    this.ezChange.emit();
-  }
-  componentDidRender() {
-    if (this.floating && this._firstRender) {
-      this._box.remove();
-      this._firstRender = false;
-    }
-  }
-  render() {
-    if (this._currentPosition == null) {
-      this._currentPosition = new Date();
-      this._currentPosition.setTime(this.value.getTime());
-      this._currentPosition.setDate(1);
-    }
-    const firstDate = new Date();
-    firstDate.setTime(this._currentPosition.getTime());
-    firstDate.setDate(1 - firstDate.getDay());
-    return (h("section", { ref: elem => this._container = elem },
-      h("div", { class: "calendar", ref: elem => this._box = elem },
-        h("div", { class: "calendar__header" },
-          h("button", { class: "calendar__btn-previous", onClick: () => this.changeMonth(-1) }),
-          h("label", { class: "calendar__lbl-month" }, this.getMonthLabel()),
-          h("button", { class: "calendar__btn-next", onClick: () => this.changeMonth(1) })),
-        h("div", { class: "calendar__body" },
-          h("div", { class: "calendar__line" }, this._weekDayLabels.map(day => h("div", { class: "calendar__cell calendar__cell--unselectable" }, day))),
-          [0, 7, 14, 21, 28, 35].map(offset => h("div", { class: "calendar__line" }, [0, 1, 2, 3, 4, 5, 6].map(index => {
-            const date = new Date();
-            date.setTime(firstDate.getTime());
-            date.setDate(date.getDate() + offset + index);
-            let classNames = "calendar__cell";
-            if (this._currentPosition.getMonth() != date.getMonth()) {
-              classNames += " calendar__cell--secondary";
-            }
-            else if (this.isSelectedDate(date)) {
-              classNames += " calendar__cell--selected";
-            }
-            return h("div", { class: classNames, onClick: () => this.selectDate(date) }, date.getDate());
-          })))),
-        h("div", { class: "calendar__footer" },
-          h("button", { class: "calendar__btn-today", onClick: () => this.selectDate(new Date()) }, this._todayLabel)))));
-  }
-  static get is() { return "ez-calendar"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["ez-calendar.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ez-calendar.css"]
-  }; }
-  static get properties() { return {
-    "value": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "Date",
-        "resolved": "Date",
-        "references": {
-          "Date": {
-            "location": "global"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "A data selecionada no calend\u00E1rio"
-      },
-      "defaultValue": "new Date()"
-    },
-    "floating": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "No modo floating o calend\u00E1rio s\u00F3 se tornar\u00E1 vis\u00EDvel\r\nquando o m\u00E9todo show() for acionado."
-      },
-      "attribute": "floating",
-      "reflect": true,
-      "defaultValue": "false"
-    }
-  }; }
-  static get events() { return [{
-      "method": "ezChange",
-      "name": "ezChange",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Quando o usu\u00E1rio escolhe uma data, esse evento \u00E9 emitido."
-      },
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "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"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "Usado no modo floating. Faz com que o componente seja exibido.\r\n\u00C9 poss\u00EDvel determinar ajustes de posicionamento atrav\u00E9s dos par\u00E2metros\r\ntop, left, bottom e right. Esses par\u00E2metros devem ser informados como\r\nstrings no formato css.",
-        "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 watchers() { return [{
-      "propName": "value",
-      "methodName": "valueChanged"
-    }]; }
-}
+import { FloatingManager } from '@sankhyalabs/core';
+import { Component, forceUpdate, h, Prop, Method, Event, Watch } from '@stencil/core';
+export class EzCalendar {
+  constructor() {
+    this._firstRender = true;
+    this._todayLabel = 'Hoje';
+    this._weekDayLabels = ['D', 'S', 'T', 'Q', 'Q', 'S', 'S'];
+    this._monthLabels = ['Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'];
+    /**
+     * A data selecionada no calendário
+     */
+    this.value = new Date();
+    /**
+     * No modo floating o calendário só se tornará visível
+     * quando o método show() for acionado.
+     */
+    this.floating = false;
+  }
+  /**
+   * Usado no modo floating. Faz com que o componente seja exibido.
+   * É possível determinar ajustes de posicionamento através dos parâmetros
+   * top, left, bottom e right. Esses parâmetros devem ser informados como
+   * strings no formato css.
+   */
+  async show(top, left, bottom, right) {
+    if (this.floating) {
+      this._floatingID = FloatingManager.float(this._box, this._container, { autoClose: true, top, left, bottom, right });
+    }
+  }
+  /**
+   * Usado no modo floating. Faz com que o componente seja ocultado.
+   */
+  async hide() {
+    if (this._floatingID !== undefined) {
+      FloatingManager.close(this._floatingID);
+      this._floatingID = undefined;
+    }
+  }
+  valueChanged() {
+    if (this.value) {
+      this._currentPosition.setTime(this.value.getTime());
+      this._currentPosition.setDate(1);
+    }
+  }
+  getMonthLabel() {
+    return this._monthLabels[this._currentPosition.getMonth()] + " " + this._currentPosition.getFullYear();
+  }
+  isSelectedDate(d) {
+    if (this.value) {
+      return this.value.getDate() == d.getDate() && this.value.getMonth() == d.getMonth() && this.value.getFullYear() == d.getFullYear();
+    }
+    return false;
+  }
+  changeMonth(offset) {
+    this._currentPosition.setMonth(this._currentPosition.getMonth() + offset);
+    forceUpdate(this);
+  }
+  selectDate(d) {
+    this.value = d;
+    this.ezChange.emit();
+  }
+  componentDidRender() {
+    if (this.floating && this._firstRender) {
+      this._box.remove();
+      this._firstRender = false;
+    }
+  }
+  render() {
+    if (this._currentPosition == null) {
+      this._currentPosition = new Date();
+      this._currentPosition.setTime(this.value.getTime());
+      this._currentPosition.setDate(1);
+    }
+    const firstDate = new Date();
+    firstDate.setTime(this._currentPosition.getTime());
+    firstDate.setDate(1 - firstDate.getDay());
+    return (h("section", { ref: elem => this._container = elem },
+      h("div", { class: "calendar", ref: elem => this._box = elem },
+        h("div", { class: "calendar__header" },
+          h("button", { class: "calendar__btn-previous", onClick: () => this.changeMonth(-1) }),
+          h("label", { class: "calendar__lbl-month" }, this.getMonthLabel()),
+          h("button", { class: "calendar__btn-next", onClick: () => this.changeMonth(1) })),
+        h("div", { class: "calendar__body" },
+          h("div", { class: "calendar__line" }, this._weekDayLabels.map(day => h("div", { class: "calendar__cell calendar__cell--unselectable" }, day))),
+          [0, 7, 14, 21, 28, 35].map(offset => h("div", { class: "calendar__line" }, [0, 1, 2, 3, 4, 5, 6].map(index => {
+            const date = new Date();
+            date.setTime(firstDate.getTime());
+            date.setDate(date.getDate() + offset + index);
+            let classNames = "calendar__cell";
+            if (this._currentPosition.getMonth() != date.getMonth()) {
+              classNames += " calendar__cell--secondary";
+            }
+            else if (this.isSelectedDate(date)) {
+              classNames += " calendar__cell--selected";
+            }
+            return h("div", { class: classNames, onClick: () => this.selectDate(date) }, date.getDate());
+          })))),
+        h("div", { class: "calendar__footer" },
+          h("button", { class: "calendar__btn-today", onClick: () => this.selectDate(new Date()) }, this._todayLabel)))));
+  }
+  static get is() { return "ez-calendar"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["ez-calendar.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["ez-calendar.css"]
+  }; }
+  static get properties() { return {
+    "value": {
+      "type": "unknown",
+      "mutable": true,
+      "complexType": {
+        "original": "Date",
+        "resolved": "Date",
+        "references": {
+          "Date": {
+            "location": "global"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "A data selecionada no calend\u00E1rio"
+      },
+      "defaultValue": "new Date()"
+    },
+    "floating": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "No modo floating o calend\u00E1rio s\u00F3 se tornar\u00E1 vis\u00EDvel\nquando o m\u00E9todo show() for acionado."
+      },
+      "attribute": "floating",
+      "reflect": true,
+      "defaultValue": "false"
+    }
+  }; }
+  static get events() { return [{
+      "method": "ezChange",
+      "name": "ezChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": "Quando o usu\u00E1rio escolhe uma data, esse evento \u00E9 emitido."
+      },
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      }
+    }]; }
+  static get methods() { return {
+    "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"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Usado no modo floating. Faz com que o componente seja exibido.\n\u00C9 poss\u00EDvel determinar ajustes de posicionamento atrav\u00E9s dos par\u00E2metros\ntop, left, bottom e right. Esses par\u00E2metros devem ser informados como\nstrings no formato css.",
+        "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 watchers() { return [{
+      "propName": "value",
+      "methodName": "valueChanged"
+    }]; }
+}