@zanichelli/albe-web-components 5.5.1-rc.2 → 5.5.1

package/dist/cjs/z-user-dropdown.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-84b7063a.js');
+const index = require('./index-fcbe2d6e.js');
 const breakpoints = require('./breakpoints-88c4fd6c.js');
 
 const stylesCss = ":host{background-color:var(--gray900)}:host(.inverse){background-color:var(--color-white)}button{cursor:pointer;display:flex;flex-direction:column;width:100%;margin:0;background-color:var(--gray900);border:none;padding:0;letter-spacing:0.16px;white-space:nowrap}button.inverse{background-color:var(--color-white)}button div.firstline{display:flex;justify-content:flex-end;align-items:center;max-width:200px}button.open div.firstline{max-width:none}z-icon{padding:0 2px;fill:var(--color-white)}z-icon.inverse{fill:var(--gray900)}ul{box-sizing:border-box;position:absolute;left:0;padding:calc(var(--space-unit) / 2) calc(var(--space-unit) * 2) 0 calc(var(--space-unit) * 2);width:100%;margin:calc(var(--space-unit) * 1.5) 0 0 0;background-color:var(--gray900);font-family:var(--font-family-sans);font-weight:var(--font-sb);font-size:14px;line-height:20px;letter-spacing:0.3px}ul.inverse{background-color:var(--color-white)}ul>li{display:flex;justify-content:flex-end;white-space:nowrap;padding:calc(var(--space-unit) * 1.5 - 1px) 0;margin:0;border-bottom:var(--border-base) solid var(--gray700)}ul>li.inverse{border-bottom-color:var(--gray400)}ul>li:first-child{border-top:none;padding-top:0;padding-bottom:calc(var(--space-unit) + 6px);flex-direction:column;align-items:end}ul>li:last-child{border-bottom:none;margin-bottom:0}#guestbutton{box-sizing:border-box;display:inline-flex;flex-direction:row;align-items:center;justify-content:center;width:100%;font-family:var(--font-family-sans);font-weight:var(--font-sb);font-size:14px;line-height:1;letter-spacing:0.3px;border-width:var(--border-size-medium);border-style:solid;border-radius:var(--border-radius);vertical-align:middle;text-transform:uppercase;text-decoration:none;cursor:pointer;outline:none;fill:currentColor;height:32px;min-width:32px;padding:0 calc(var(--space-unit) * 2);background-color:var(--color-white);border-color:var(--color-white);color:var(--gray800)}#guestbutton.inverse{background-color:var(--gray800);border-color:var(--gray800);color:var(--color-white)}.userfullname{padding:0;overflow:hidden;max-width:250px;text-overflow:ellipsis;width:100%;color:var(--color-white);font-family:var(--font-family-sans);font-weight:var(--font-sb);font-size:16px;line-height:24px;letter-spacing:0;text-align:right}.userfullname.inverse{color:var(--gray800)}.useremail{color:var(--color-white);font-family:var(--font-family-sans);font-weight:var(--font-rg);font-size:12px;line-height:16px;letter-spacing:0.32px;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:right}.useremail.inverse{color:var(--gray800)}@media only screen and (min-width: 768px){:host{height:calc(var(--space-unit) * 4);background-color:var(--gray900)}:host(.inverse){background-color:var(--color-white)}:host>div{position:relative;top:50%;transform:translateY(-50%)}:host>div.open{top:auto;transform:none}:host>div>div{padding:0}:host>div>div.open{position:absolute;right:calc(var(--space-unit) * -1);box-shadow:0px 2px calc(var(--space-unit) * .5) 0px rgba(0, 0, 0, 0.5);background-color:var(--color-white);margin-top:calc(var(--space-unit) / 2);padding:calc(var(--space-unit) / 2 + 1px) var(--space-unit) 0 var(--space-unit);transform:translate(0, -4px)}:host>div>div.inverse.open{background-color:var(--gray800)}button{display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:flex-end;align-items:end;align-content:center}button.open{background-color:var(--color-white);border-top:var(--border-size-small) solid var(--color-white);border-top-left-radius:calc(var(--space-unit) * .5);border-top-right-radius:calc(var(--space-unit) * .5);max-width:initial;margin-left:var(--space-unit);padding-right:var(--space-unit)}button.open.inverse{border-top-color:var(--gray800);background-color:var(--gray800)}button:not(.open) z-icon{fill:var(--color-white)}button:not(.open) z-icon.inverse{fill:var(--gray800)}button.open z-icon{fill:var(--gray800)}button.open z-icon.inverse{fill:var(--color-white)}.userfullname{font-family:var(--font-family-sans);font-weight:var(--font-sb);font-size:14px;line-height:20px;letter-spacing:0.16px;padding:0 calc(var(--space-unit) - 6px) 0 calc(var(--space-unit) - 2px);width:auto}.userfullname.inverse{color:var(--gray800)}button.open div.userfullname{color:var(--gray800);max-width:none;text-overflow:clip}button.open div.userfullname.inverse{color:var(--color-white)}.useremail{padding-right:calc(var(--space-unit) * 3 - 2px);box-sizing:border-box}button.open div.useremail{color:var(--gray800)}button.open div.useremail.inverse{color:var(--color-white)}ul{position:initial;left:initial;padding:0;width:100%;background-color:var(--color-white)}ul.inverse{border-bottom-color:var(--gray800);background-color:var(--gray800)}ul>li{color:var(--gray800);border-bottom:var(--border-base) solid var(--gray400);margin:0 var(--space-unit)}ul>li.inverse{color:var(--color-white)}ul>li:first-child{border-top:var(--border-base) solid var(--gray400);padding-top:calc(var(--space-unit) + 3px);padding-bottom:calc(var(--space-unit) + 5px)}}";

package/dist/cjs/z-visually-hidden.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-84b7063a.js');
+const index = require('./index-fcbe2d6e.js');
 
 const stylesCss = ":host{border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:0 -1px -1px 0;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}";
 

package/dist/collection/components/buttons/z-chip/index.js

@@ -16,7 +16,7 @@ export class ZChip {
   }
   render() {
     if (this.interactiveIcon) {
-      return (h("button", { class: this.type, disabled: this.disabled, tabindex: "0", type: "button" },
+      return (h("button", { class: this.type, disabled: this.disabled, tabindex: "0" },
         this.icon && (h("z-icon", { class: "iconSx", name: this.icon, width: this.getIconSize(), height: this.getIconSize() })),
         h("slot", null),
         h("z-icon", { tabIndex: this.disabled ? -1 : 0, onClick: () => this.emitinteractiveIconClick(), onKeyUp: (e) => handleKeyboardSubmit(e, this.emitinteractiveIconClick.bind(this)), name: this.interactiveIcon, width: this.getIconSize(), height: this.getIconSize() })));

package/dist/collection/components/buttons/z-chip/styles.css

@@ -5,14 +5,15 @@
   background-color: var(--bg-white);
   border: var(--border-size-small) solid var(--gray400);
   border-radius: 14px;
-  color: var(--text-grey-800);
+  color: var(--color-primary01);
   fill: var(--text-grey-800);
   font-family: var(--dashboard-font);
   font-size: 14px;
   font-weight: var(--font-sb);
 }
 
-:host > button:not(:disabled) > z-icon:last-child:hover {
+:host > button:hover:not(:disabled),
+:host > button:hover:not(:disabled) > z-icon:last-child {
   color: var(--color-hover-primary);
   fill: var(--color-hover-primary);
 }
@@ -54,6 +55,12 @@
   outline: none;
 }
 
+:host > button:not(:disabled):active {
+  background-color: var(--gray50);
+  text-decoration: underline;
+}
+
+:host > button:not(:disabled):active:hover,
 :host > button:hover:not(:disabled):active:hover > z-icon:last-child {
   color: var(--color-primary01);
   fill: var(--color-primary01);

package/dist/collection/components/file-upload/z-file/index.js

@@ -7,7 +7,7 @@ export class ZFile {
     this.popoverVisible = false;
   }
   removeFileHandler() {
-    this.removeFile.emit({ fileName: this.fileName });
+    this.removeFile.emit();
     this.el.remove();
   }
   onMouseOver() {
@@ -34,7 +34,8 @@ export class ZFile {
       this.allowPopover && (h("z-popover", { open: this.popoverVisible, position: PopoverPositions.auto, bindTo: this.chip },
         h("span", { class: "body-5 tooltip-content" }, this.ellipsis.innerText))),
       h("z-chip", { ref: (el) => (this.chip = el), id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.default },
-        h("span", { ref: (el) => (this.ellipsis = el), tabIndex: -1 }, this.fileName))));
+        h("span", { ref: (el) => (this.ellipsis = el), tabIndex: -1 },
+          h("slot", null)))));
   }
   static get is() { return "z-file"; }
   static get encapsulation() { return "scoped"; }
@@ -61,23 +62,6 @@ export class ZFile {
       },
       "attribute": "file-number",
       "reflect": false
-    },
-    "fileName": {
-      "type": "any",
-      "mutable": false,
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "File name"
-      },
-      "attribute": "file-name",
-      "reflect": false
     }
   }; }
   static get states() { return {

package/dist/collection/components/file-upload/z-file-upload/index.js

@@ -1,12 +1,12 @@
-import { Component, Prop, h, Event, State, Listen, Element, Method, } from "@stencil/core";
+import { Component, Prop, h, Event, State, Listen, Element, } from "@stencil/core";
 import { DeviceEnum, DividerSize, ZFileUploadTypeEnum, } from "../../../beans";
 import { getDevice } from "../../../utils/utils";
 export class ZFileUpload {
   constructor() {
     /** Prop indicating the file upload type - can be default or dragdrop */
     this.type = ZFileUploadTypeEnum.default;
-    /** Files added by the user */
-    this.files = [];
+    /** Number of files added by the user */
+    this.filesNumber = 0;
     this.inputAttributes = {
       type: "file",
       id: "fileElem",
@@ -14,16 +14,8 @@ export class ZFileUpload {
     };
   }
   /** Listen removeFile event sent from z-file component */
-  removeFileListener(e) {
-    const files = this.files;
-    const file = files.find((file) => file.name === e.detail.fileName);
-    if (file) {
-      const index = files.indexOf(file);
-      if (index >= 0) {
-        files.splice(index, 1);
-        this.files = [...files];
-      }
-    }
+  removeFileListener() {
+    this.filesNumber--;
   }
   /** Listen fileDropped event sent from z-dragdrop-area component */
   fileDroppedListener(e) {
@@ -45,12 +37,8 @@ export class ZFileUpload {
       this.invalidFiles = this.checkFiles(Array.from(this.input.files));
     }
   }
-  /** get array of uploaded files */
-  async getFiles() {
-    return this.files;
-  }
   handleAccessibility() {
-    if (this.files.length > 0) {
+    if (this.filesNumber > 0) {
       this.el.querySelector("z-file:last-child z-chip button").focus();
     }
     else {
@@ -70,11 +58,9 @@ export class ZFileUpload {
         .some((ext) => file.name.toLowerCase().endsWith(ext.trim()));
       const fileSizeOk = fileSize <= this.fileMaxSize;
       if (fileSizeOk && fileFormatOk) {
-        if (!this.files.find((f) => f.name === file.name)) {
-          this.files.push(file);
-          this.fileInput.emit(file);
-          this.input.value = "";
-        }
+        this.fileInput.emit(file);
+        this.filesNumber++;
+        this.input.value = "";
         return;
       }
       errors.set(file.name, []);
@@ -110,7 +96,7 @@ export class ZFileUpload {
     return (h("z-body", { level: 3 }, fileFormatString || fileWeightString ? finalString : null));
   }
   renderFileSection() {
-    return (this.files.length > 0 && (h("section", { class: "files-container" },
+    return (this.filesNumber > 0 && (h("section", { class: "files-container" },
       h("z-heading", { variant: "semibold", level: 4 }, "File appena caricati"),
       h("div", { class: "files" },
         h("slot", { name: "files" })),
@@ -310,7 +296,7 @@ export class ZFileUpload {
     }
   }; }
   static get states() { return {
-    "files": {},
+    "filesNumber": {},
     "invalidFiles": {}
   }; }
   static get events() { return [{
@@ -329,27 +315,6 @@ export class ZFileUpload {
         "references": {}
       }
     }]; }
-  static get methods() { return {
-    "getFiles": {
-      "complexType": {
-        "signature": "() => Promise<File[]>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          },
-          "File": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<File[]>"
-      },
-      "docs": {
-        "text": "get array of uploaded files",
-        "tags": []
-      }
-    }
-  }; }
   static get elementRef() { return "el"; }
   static get listeners() { return [{
       "name": "removeFile",

package/dist/collection/components/z-date-picker/index.js

@@ -0,0 +1,284 @@
+import { Component, Prop, Element, h, Event, Listen, State, } from "@stencil/core";
+import flatpickr from "flatpickr";
+import { Italian } from "flatpickr/dist/l10n/it.js";
+import monthSelectPlugin from "flatpickr/dist/plugins/monthSelect";
+import classNames from "classnames";
+import { ZDatePickerMode, ZDatePickerModeValues, ZDatePickerPosition, } from "../../beans";
+export class ZDatePicker {
+  constructor() {
+    /** [Optional] datepicker mode: date, datetime, only months */
+    this.mode = ZDatePickerMode.date;
+    this.flatpickrPosition = ZDatePickerPosition.bottom;
+  }
+  emitDateSelect(date) {
+    this.dateSelect.emit(date);
+  }
+  handleKeyDown(ev) {
+    if (ev.key === "Enter" || ev.key === " ") {
+      let isPrevArrowEntered = document.activeElement.classList.contains("flatpickr-prev-month");
+      let isNextArrowEntered = document.activeElement.classList.contains("flatpickr-next-month");
+      let arrowPressed = isPrevArrowEntered || isNextArrowEntered;
+      arrowPressed && ev.key === " " && ev.preventDefault();
+      if (this.mode === ZDatePickerMode.months) {
+        isPrevArrowEntered &&
+          this.flatpickrInstance.changeYear(this.flatpickrInstance.currentYear - 1);
+        isNextArrowEntered &&
+          this.flatpickrInstance.changeYear(this.flatpickrInstance.currentYear + 1);
+        if (arrowPressed) {
+          let calendar = this.element.getElementsByClassName("flatpickr-calendar")[0];
+          let months = calendar.querySelectorAll(".flatpickr-monthSelect-month");
+          months.forEach((element) => {
+            element.setAttribute("aria-label", `${element.innerHTML} ${this.flatpickrInstance.currentYear}`);
+          });
+          //Force check of the current day
+          Array.from(months).forEach((element, index) => {
+            let curMonth = new Date().getMonth();
+            let curYear = new Date().getFullYear();
+            if (index === curMonth) {
+              if (this.flatpickrInstance.currentYear === curYear) {
+                element.setAttribute("class", "flatpickr-monthSelect-month today");
+              }
+              else {
+                element.setAttribute("class", "flatpickr-monthSelect-month");
+              }
+            }
+          });
+        }
+      }
+      else {
+        isPrevArrowEntered && this.flatpickrInstance.changeMonth(-1);
+        isNextArrowEntered && this.flatpickrInstance.changeMonth(1);
+      }
+    }
+  }
+  componentWillLoad() {
+    let customToggle = this.element.querySelector("[slot=toggle]");
+    this.hasChildren = !!customToggle;
+    this.hasChildren && customToggle.setAttribute("data-toggle", "data-toggle");
+  }
+  componentDidLoad() {
+    this.flatpickrInstance = flatpickr(`.${this.datepickerid}`, {
+      appendTo: this.element.children[0],
+      enableTime: this.mode === ZDatePickerMode.dateTime,
+      locale: Italian,
+      allowInput: true,
+      dateFormat: this.mode === ZDatePickerMode.dateTime ? "d-m-Y - H:i" : "d-m-Y",
+      ariaDateFormat: this.mode === ZDatePickerMode.months ? "F Y" : "d F Y",
+      minuteIncrement: 1,
+      time_24hr: true,
+      onChange: (_selectedDates, dateStr) => {
+        this.emitDateSelect(dateStr);
+      },
+      onOpen: () => {
+        this.setAriaOptions();
+        this.setFlatpickrPosition();
+      },
+      onKeyDown: () => {
+        this.setAriaOptions();
+      },
+      wrap: this.hasChildren,
+      plugins: this.mode === ZDatePickerMode.months && [
+        monthSelectPlugin({
+          dateFormat: "m-Y",
+          altFormat: "m-Y",
+        }),
+      ],
+    });
+    this.element.querySelectorAll(".flatpickr-weekday").forEach((element) => {
+      element.innerHTML = element.innerHTML.trim().charAt(0);
+    });
+  }
+  setAriaOptions() {
+    let calendar = this.element.getElementsByClassName("flatpickr-calendar")[0];
+    let prevMonthArrow = calendar.getElementsByClassName("flatpickr-prev-month")[0];
+    let nextMonthArrow = calendar.getElementsByClassName("flatpickr-next-month")[0];
+    let tabindexElements = calendar.querySelectorAll('[tabindex = "-1"]');
+    tabindexElements.forEach((element) => element.setAttribute("tabindex", "0"));
+    prevMonthArrow.setAttribute("tabindex", "0");
+    nextMonthArrow.setAttribute("tabindex", "0");
+    prevMonthArrow.setAttribute("role", "button");
+    nextMonthArrow.setAttribute("role", "button");
+    calendar
+      .getElementsByClassName("cur-year")[0]
+      .setAttribute("aria-label", "Anno");
+    if (this.mode === ZDatePickerMode.months) {
+      this.setMonthsAriaOptions(calendar, prevMonthArrow, nextMonthArrow);
+    }
+    if (this.mode === ZDatePickerMode.date) {
+      this.setDateAriaOptions(calendar, prevMonthArrow, nextMonthArrow);
+    }
+    if (this.mode === ZDatePickerMode.dateTime) {
+      this.setDateTimeAriaOptions(calendar, prevMonthArrow, nextMonthArrow);
+    }
+  }
+  setMonthsAriaOptions(calendar, prevMonthArrow, nextMonthArrow) {
+    Array.from(calendar.getElementsByClassName("flatpickr-monthSelect-months")).forEach((element) => element.setAttribute("tabindex", "-1"));
+    Array.from(calendar.getElementsByClassName("flatpickr-monthSelect-month")).forEach((element) => element.setAttribute("role", "button"));
+    prevMonthArrow.setAttribute("aria-label", "Anno precedente");
+    nextMonthArrow.setAttribute("aria-label", "Anno successivo");
+  }
+  setDateAriaOptions(calendar, prevMonthArrow, nextMonthArrow) {
+    Array.from(calendar.getElementsByClassName("flatpickr-days")).forEach((element) => element.setAttribute("tabindex", "-1"));
+    Array.from(calendar.getElementsByClassName("flatpickr-day")).forEach((element) => element.setAttribute("role", "button"));
+    calendar
+      .getElementsByClassName("flatpickr-monthDropdown-months")[0]
+      .setAttribute("aria-label", "Mese");
+    prevMonthArrow.setAttribute("aria-label", "Mese precedente");
+    nextMonthArrow.setAttribute("aria-label", "Mese successivo");
+  }
+  setDateTimeAriaOptions(calendar, prevMonthArrow, nextMonthArrow) {
+    Array.from(calendar.getElementsByClassName("flatpickr-days")).forEach((element) => element.setAttribute("tabindex", "-1"));
+    Array.from(calendar.getElementsByClassName("flatpickr-day")).forEach((element) => element.setAttribute("role", "button"));
+    calendar
+      .getElementsByClassName("flatpickr-monthDropdown-months")[0]
+      .setAttribute("aria-label", "Mese");
+    prevMonthArrow.setAttribute("aria-label", "Mese precedente");
+    nextMonthArrow.setAttribute("aria-label", "Mese successivo");
+    Array.from(calendar.getElementsByClassName("time24hr")).forEach((element) => element.setAttribute("tabindex", "-1"));
+    calendar
+      .getElementsByClassName("flatpickr-hour")[0]
+      .setAttribute("aria-label", "Ora");
+    calendar
+      .getElementsByClassName("flatpickr-minute")[0]
+      .setAttribute("aria-label", "Minuti");
+  }
+  setFlatpickrPosition() {
+    const toggleHeight = this.element.children[0].clientHeight;
+    this.element.style.setProperty("--toggle-height", `${toggleHeight}px`);
+    const flatpickrHeight = this.mode === ZDatePickerMode.dateTime
+      ? ZDatePickerModeValues.DATETIME
+      : this.mode === ZDatePickerMode.months
+        ? ZDatePickerModeValues.MONTHS
+        : ZDatePickerModeValues.DATE;
+    const bottom = this.element.getBoundingClientRect().bottom;
+    const overflowBottom = bottom + flatpickrHeight > window.innerHeight;
+    const overflowTop = bottom - flatpickrHeight - toggleHeight < 0;
+    if (!overflowTop && overflowBottom) {
+      this.flatpickrPosition = ZDatePickerPosition.top;
+    }
+    else {
+      this.flatpickrPosition = ZDatePickerPosition.bottom;
+    }
+  }
+  renderSlottedContent() {
+    return (h("div", null,
+      h("input", { class: "hidden-input", "data-input": true }),
+      h("slot", { name: "toggle" })));
+  }
+  renderZInput() {
+    return (h("z-input", { ariaLabel: this.ariaLabel, label: this.label, class: classNames(this.datepickerid), type: "text", icon: "event", message: false, tabindex: "0" }));
+  }
+  render() {
+    return (h("div", { class: classNames("flatpickr-toggle-container", this.hasChildren && this.datepickerid, this.flatpickrPosition, this.mode) }, this.hasChildren ? this.renderSlottedContent() : this.renderZInput()));
+  }
+  static get is() { return "z-date-picker"; }
+  static get originalStyleUrls() { return {
+    "$": ["styles.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["styles.css"]
+  }; }
+  static get properties() { return {
+    "datepickerid": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "unique id"
+      },
+      "attribute": "datepickerid",
+      "reflect": false
+    },
+    "ariaLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "z-input aria label"
+      },
+      "attribute": "aria-label",
+      "reflect": false
+    },
+    "label": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "z-input label"
+      },
+      "attribute": "label",
+      "reflect": false
+    },
+    "mode": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "ZDatePickerMode",
+        "resolved": "ZDatePickerMode.date | ZDatePickerMode.dateTime | ZDatePickerMode.months",
+        "references": {
+          "ZDatePickerMode": {
+            "location": "import",
+            "path": "../../beans"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "[Optional] datepicker mode: date, datetime, only months"
+      },
+      "attribute": "mode",
+      "reflect": false,
+      "defaultValue": "ZDatePickerMode.date"
+    }
+  }; }
+  static get states() { return {
+    "flatpickrPosition": {}
+  }; }
+  static get events() { return [{
+      "method": "dateSelect",
+      "name": "dateSelect",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": "emitted when date changes, returns selected date"
+      },
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      }
+    }]; }
+  static get elementRef() { return "element"; }
+  static get listeners() { return [{
+      "name": "keydown",
+      "method": "handleKeyDown",
+      "target": "body",
+      "capture": true,
+      "passive": false
+    }]; }
+}