@roadtrip/components 2.42.0 → 2.44.0

package/dist/collection/components/drawer/drawer.js

@@ -1,4 +1,4 @@
-import { Component, Element, Event, Listen, Method, Prop, h, Host, Watch } from '@stencil/core';
+import { h, Host } from '@stencil/core';
 import { navigationClose, navigationChevron } from '../../../icons';
 /**
  * @slot  - Content of the drawer.
@@ -98,284 +98,285 @@ export class Drawer {
     const drawerIsOpenClass = this.isOpen ? 'drawer-open' : '';
     const inverseHeaderClass = this.hasInverseHeader ? 'drawer-header-inverse' : '';
     const drawerDelimiterClass = this.drawerTitle !== undefined && !this.hasInverseHeader ? 'drawer-delimiter' : '';
-    const backIconElement = this.hasBackIcon ? h("button", { type: "button", class: "drawer-action", "aria-label": "Back", onClick: this.onClickBack },
-      h("road-icon", { icon: navigationChevron, rotate: "180" }),
-      this.backText) : '';
-    const closeIconElement = this.hasCloseIcon ? h("button", { type: "button", class: "drawer-close", onClick: this.onClick, "aria-label": "Close" },
-      h("road-icon", { icon: navigationClose, "aria-hidden": "true" })) : '';
+    const backIconElement = this.hasBackIcon ? h("button", { type: "button", class: "drawer-action", "aria-label": "Back", onClick: this.onClickBack }, h("road-icon", { icon: navigationChevron, rotate: "180" }), this.backText) : '';
+    const closeIconElement = this.hasCloseIcon ? h("button", { type: "button", class: "drawer-close", onClick: this.onClick, "aria-label": "Close" }, h("road-icon", { icon: navigationClose, "aria-hidden": "true" })) : '';
     const drawerWidthValue = this.position === 'bottom' ? '100%' : this.drawerWidth + 'px';
-    return (h(Host, { class: `drawer ${drawerIsOpenClass} drawer-${this.position}`, tabindex: "-1", role: "dialog" },
-      h("div", { class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }),
-      h("div", { class: "drawer-dialog", style: { maxWidth: `${drawerWidthValue}` }, role: "document", tabindex: "0" },
-        h("div", { class: "drawer-content" },
-          h("header", { class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` },
-            backIconElement,
-            this.drawerTitle !== undefined ? h("h2", { class: "drawer-title" }, this.drawerTitle) : h("div", { class: "drawer-title" },
-              h("slot", { name: "title" })),
-            closeIconElement),
-          h("div", { class: "drawer-body" },
-            h("slot", null))))));
+    return (h(Host, { class: `drawer ${drawerIsOpenClass} drawer-${this.position}`, tabindex: "-1", role: "dialog" }, h("div", { class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), h("div", { class: "drawer-dialog", style: { maxWidth: `${drawerWidthValue}` }, role: "document", tabindex: "0" }, h("div", { class: "drawer-content" }, h("header", { class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle !== undefined ? h("h2", { class: "drawer-title" }, this.drawerTitle) : h("div", { class: "drawer-title" }, h("slot", { name: "title" })), closeIconElement), h("div", { class: "drawer-body" }, h("slot", null))))));
   }
   static get is() { return "road-drawer"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "light": ["drawer.light.css"],
-    "dark": ["drawer.dark.css"]
-  }; }
-  static get styleUrls() { return {
-    "light": ["drawer.light.css"],
-    "dark": ["drawer.dark.css"]
-  }; }
-  static get properties() { return {
-    "isOpen": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Set isOpen property to true to open the drawer"
-      },
-      "attribute": "is-open",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "position": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "position of the drawer. e.g. left, right, bottom"
-      },
-      "attribute": "position",
-      "reflect": false,
-      "defaultValue": "'left'"
-    },
-    "drawerWidth": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Width of the drawer"
-      },
-      "attribute": "drawer-width",
-      "reflect": false,
-      "defaultValue": "480"
-    },
-    "hasInverseHeader": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Inverse header colors"
-      },
-      "attribute": "has-inverse-header",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "hasBackIcon": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show / hide back icon"
-      },
-      "attribute": "has-back-icon",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "backText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string | undefined",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Show / hide back icon"
-      },
-      "attribute": "back-text",
-      "reflect": false
-    },
-    "drawerTitle": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string | undefined",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Title of the drawer in the header bar"
+  static get originalStyleUrls() {
+    return {
+      "light": ["drawer.light.css"],
+      "dark": ["drawer.dark.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "light": ["drawer.light.css"],
+      "dark": ["drawer.dark.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "isOpen": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Set isOpen property to true to open the drawer"
+        },
+        "attribute": "is-open",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "attribute": "drawer-title",
-      "reflect": false
-    },
-    "hasCloseIcon": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "position": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "position of the drawer. e.g. left, right, bottom"
+        },
+        "attribute": "position",
+        "reflect": false,
+        "defaultValue": "'left'"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show / hide close icon"
+      "drawerWidth": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Width of the drawer"
+        },
+        "attribute": "drawer-width",
+        "reflect": false,
+        "defaultValue": "480"
       },
-      "attribute": "has-close-icon",
-      "reflect": false,
-      "defaultValue": "true"
-    }
-  }; }
-  static get events() { return [{
-      "method": "onOpen",
-      "name": "open",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Indicate when opening the drawer"
+      "hasInverseHeader": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Inverse header colors"
+        },
+        "attribute": "has-inverse-header",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }, {
-      "method": "onClose",
-      "name": "close",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Indicate when closing the drawer"
+      "hasBackIcon": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Show / hide back icon"
+        },
+        "attribute": "has-back-icon",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }, {
-      "method": "onBack",
-      "name": "back",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Indicate when return to previous state of the drawer content"
+      "backText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Show / hide back icon"
+        },
+        "attribute": "back-text",
+        "reflect": false
       },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "open": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "drawerTitle": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Title of the drawer in the header bar"
         },
-        "return": "Promise<void>"
+        "attribute": "drawer-title",
+        "reflect": false
       },
-      "docs": {
-        "text": "Open the drawer",
-        "tags": []
+      "hasCloseIcon": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Show / hide close icon"
+        },
+        "attribute": "has-close-icon",
+        "reflect": false,
+        "defaultValue": "true"
       }
-    },
-    "close": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "onOpen",
+        "name": "open",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Indicate when opening the drawer"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "onClose",
+        "name": "close",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Indicate when closing the drawer"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "onBack",
+        "name": "back",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Indicate when return to previous state of the drawer content"
         },
-        "return": "Promise<void>"
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "open": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Open the drawer",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Close the drawer",
-        "tags": []
-      }
-    },
-    "back": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
+      "close": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
         },
-        "return": "Promise<void>"
+        "docs": {
+          "text": "Close the drawer",
+          "tags": []
+        }
       },
-      "docs": {
-        "text": "Return to previous state of the drawer content",
-        "tags": []
+      "back": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Return to previous state of the drawer content",
+          "tags": []
+        }
       }
-    }
-  }; }
+    };
+  }
   static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "isOpen",
-      "methodName": "handleOpen"
-    }]; }
-  static get listeners() { return [{
-      "name": "keyup",
-      "method": "onEscape",
-      "target": "document",
-      "capture": false,
-      "passive": false
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "isOpen",
+        "methodName": "handleOpen"
+      }];
+  }
+  static get listeners() {
+    return [{
+        "name": "keyup",
+        "method": "onEscape",
+        "target": "document",
+        "capture": false,
+        "passive": false
+      }];
+  }
 }