@limetech/lime-elements 36.1.0-next.8 → 36.1.0

package/dist/collection/components/dialog/dialog.js

@@ -1,5 +1,5 @@
 import { MDCDialog } from '@material/dialog';
-import { Component, Element, Event, h, Prop, Watch, } from '@stencil/core';
+import { h, } from '@stencil/core';
 import { isEqual } from 'lodash-es';
 import { dispatchResizeEvent } from '../../util/dispatch-resize-event';
 import { createRandomString } from '../../util/random-string';
@@ -33,22 +33,14 @@ import { createRandomString } from '../../util/random-string';
  */
 export class Dialog {
   constructor() {
-    /**
-     * Set to `true` to make the dialog "fullscreen".
-     */
+    this.showFooter = true;
+    this.heading = undefined;
     this.fullscreen = false;
-    /**
-     * `true` if the dialog is open, `false` otherwise.
-     */
     this.open = false;
-    /**
-     * Defines which action triggers a close-event.
-     */
     this.closingActions = {
       escapeKey: true,
       scrimClick: true,
     };
-    this.showFooter = true;
     this.handleMdcOpened = this.handleMdcOpened.bind(this);
     this.handleMdcClosed = this.handleMdcClosed.bind(this);
     this.handleMdcClosing = this.handleMdcClosing.bind(this);
@@ -87,16 +79,7 @@ export class Dialog {
     return (h("div", { class: {
         'mdc-dialog': true,
         'full-screen': !!this.fullscreen,
-      }, role: "alertdialog", "aria-modal": "true", "aria-labelledby": 'limel-dialog-title-' + this.id, "aria-describedby": 'limel-dialog-content-' + this.id },
-      h("input", { hidden: true, id: "initialFocusEl" }),
-      h("div", { class: "mdc-dialog__container" },
-        h("div", { class: "mdc-dialog__surface" },
-          h("input", { type: "text", id: "initialFocusElement" }),
-          this.renderHeading(),
-          h("div", { class: "mdc-dialog__content scrollbox", id: 'limel-dialog-content-' + this.id },
-            h("slot", null)),
-          this.renderFooter())),
-      h("div", { class: "mdc-dialog__scrim" })));
+      }, role: "alertdialog", "aria-modal": "true", "aria-labelledby": 'limel-dialog-title-' + this.id, "aria-describedby": 'limel-dialog-content-' + this.id }, h("input", { hidden: true, id: "initialFocusEl" }), h("div", { class: "mdc-dialog__container" }, h("div", { class: "mdc-dialog__surface" }, h("input", { type: "text", id: "initialFocusElement" }), this.renderHeading(), h("div", { class: "mdc-dialog__content scrollbox", id: 'limel-dialog-content-' + this.id }, h("slot", null)), this.renderFooter())), h("div", { class: "mdc-dialog__scrim" })));
   }
   watchHandler(newValue, oldValue) {
     if (oldValue === newValue) {
@@ -150,8 +133,7 @@ export class Dialog {
   }
   renderFooter() {
     if (this.showFooter) {
-      return (h("footer", { class: "mdc-dialog__actions" },
-        h("slot", { name: "button" })));
+      return (h("footer", { class: "mdc-dialog__actions" }, h("slot", { name: "button" })));
     }
   }
   setClosingActions() {
@@ -166,130 +148,140 @@ export class Dialog {
   }
   static get is() { return "limel-dialog"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["dialog.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["dialog.css"]
-  }; }
-  static get properties() { return {
-    "heading": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string | DialogHeading",
-        "resolved": "DialogHeading | string",
-        "references": {
-          "DialogHeading": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
+  static get originalStyleUrls() {
+    return {
+      "$": ["dialog.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["dialog.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "heading": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string | DialogHeading",
+          "resolved": "DialogHeading | string",
+          "references": {
+            "DialogHeading": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The heading for the dialog, if any."
-      },
-      "attribute": "heading",
-      "reflect": false
-    },
-    "fullscreen": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The heading for the dialog, if any."
+        },
+        "attribute": "heading",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Set to `true` to make the dialog \"fullscreen\"."
+      "fullscreen": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Set to `true` to make the dialog \"fullscreen\"."
+        },
+        "attribute": "fullscreen",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "attribute": "fullscreen",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "open": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "open": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "`true` if the dialog is open, `false` otherwise."
+        },
+        "attribute": "open",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "`true` if the dialog is open, `false` otherwise."
-      },
-      "attribute": "open",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "closingActions": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "ClosingActions",
-        "resolved": "ClosingActions",
-        "references": {
-          "ClosingActions": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
+      "closingActions": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "ClosingActions",
+          "resolved": "ClosingActions",
+          "references": {
+            "ClosingActions": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Defines which action triggers a close-event."
-      },
-      "defaultValue": "{\n        escapeKey: true,\n        scrimClick: true,\n    }"
-    }
-  }; }
-  static get events() { return [{
-      "method": "close",
-      "name": "close",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emitted when the dialog is closed from inside the component.\n(*Not* emitted when the consumer sets the `open`-property to `false`.)"
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Defines which action triggers a close-event."
+        },
+        "defaultValue": "{\n        escapeKey: true,\n        scrimClick: true,\n    }"
       }
-    }, {
-      "method": "closing",
-      "name": "closing",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Emitted when the dialog is in the process of being closed."
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }]; }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "close",
+        "name": "close",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when the dialog is closed from inside the component.\n(*Not* emitted when the consumer sets the `open`-property to `false`.)"
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "closing",
+        "name": "closing",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Emitted when the dialog is in the process of being closed."
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "host"; }
-  static get watchers() { return [{
-      "propName": "open",
-      "methodName": "watchHandler"
-    }, {
-      "propName": "closingActions",
-      "methodName": "closingActionsChanged"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "open",
+        "methodName": "watchHandler"
+      }, {
+        "propName": "closingActions",
+        "methodName": "closingActionsChanged"
+      }];
+  }
 }

package/dist/collection/components/dock/dock-button/dock-button.js

@@ -1,24 +1,10 @@
-import { Component, Event, h, Prop, State, Watch, } from '@stencil/core';
+import { h, } from '@stencil/core';
 import { createRandomString } from '../../../util/random-string';
 /**
  * @private
  */
 export class DockButton {
   constructor() {
-    /**
-     * When the dock is expanded or collapsed, dock items
-     * show labels and tooltips as suitable for the layout.
-     */
-    this.expanded = false;
-    /**
-     * When dock is using mobile layout, dock items
-     * show labels and tooltips as suitable for the layout.
-     */
-    this.useMobileLayout = false;
-    /**
-     * Indicated whether the popover that renders a component is open.
-     */
-    this.isOpen = false;
     this.openPopover = (event) => {
       event.stopPropagation();
       this.isOpen = true;
@@ -41,6 +27,10 @@ export class DockButton {
         (_c = this.customComponentElement) === null || _c === void 0 ? void 0 : _c.focus();
       }
     };
+    this.item = undefined;
+    this.expanded = false;
+    this.useMobileLayout = false;
+    this.isOpen = false;
     this.tooltipId = createRandomString();
   }
   render() {
@@ -60,19 +50,14 @@ export class DockButton {
   renderPopover() {
     var _a;
     const CustomComponent = (_a = this.item) === null || _a === void 0 ? void 0 : _a.dockMenu.componentName;
-    return (h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose },
-      this.renderButton(this.openPopover, 'trigger'),
-      h(CustomComponent, Object.assign({ ref: this.setCustomComponentElement }, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
+    return (h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose }, this.renderButton(this.openPopover, 'trigger'), h(CustomComponent, Object.assign({ ref: this.setCustomComponentElement }, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
   }
   renderButton(handleClick, slot) {
     var _a;
     return (h("button", { slot: slot, tabindex: "0", id: this.tooltipId, type: "button", class: {
         button: true,
         selected: (_a = this.item) === null || _a === void 0 ? void 0 : _a.selected,
-      }, onClick: handleClick },
-      this.renderIcon(),
-      this.renderLabel(),
-      this.renderTooltip()));
+      }, onClick: handleClick }, this.renderIcon(), this.renderLabel(), this.renderTooltip()));
   }
   renderIcon() {
     if (!this.item.icon) {
@@ -94,131 +79,143 @@ export class DockButton {
     }
   }
   static get is() { return "limel-dock-button"; }
-  static get originalStyleUrls() { return {
-    "$": ["dock-button.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["dock-button.css"]
-  }; }
-  static get properties() { return {
-    "item": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "DockItem",
-        "resolved": "DockItem",
-        "references": {
-          "DockItem": {
-            "location": "import",
-            "path": "../dock.types"
+  static get originalStyleUrls() {
+    return {
+      "$": ["dock-button.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["dock-button.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "item": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "DockItem",
+          "resolved": "DockItem",
+          "references": {
+            "DockItem": {
+              "location": "import",
+              "path": "../dock.types"
+            }
           }
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Item that is placed in the dock."
         }
       },
-      "required": true,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Item that is placed in the dock."
-      }
-    },
-    "expanded": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "When the dock is expanded or collapsed, dock items\nshow labels and tooltips as suitable for the layout."
+      "expanded": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "When the dock is expanded or collapsed, dock items\nshow labels and tooltips as suitable for the layout."
+        },
+        "attribute": "expanded",
+        "reflect": true,
+        "defaultValue": "false"
       },
-      "attribute": "expanded",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "useMobileLayout": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "When dock is using mobile layout, dock items\nshow labels and tooltips as suitable for the layout."
-      },
-      "attribute": "use-mobile-layout",
-      "reflect": true,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "isOpen": {}
-  }; }
-  static get events() { return [{
-      "method": "itemSelected",
-      "name": "itemSelected",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fired when a dock item has been selected from the dock."
-      },
-      "complexType": {
-        "original": "DockItem",
-        "resolved": "DockItem",
-        "references": {
-          "DockItem": {
-            "location": "import",
-            "path": "../dock.types"
+      "useMobileLayout": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "When dock is using mobile layout, dock items\nshow labels and tooltips as suitable for the layout."
+        },
+        "attribute": "use-mobile-layout",
+        "reflect": true,
+        "defaultValue": "false"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "isOpen": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "itemSelected",
+        "name": "itemSelected",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fired when a dock item has been selected from the dock."
+        },
+        "complexType": {
+          "original": "DockItem",
+          "resolved": "DockItem",
+          "references": {
+            "DockItem": {
+              "location": "import",
+              "path": "../dock.types"
+            }
           }
         }
-      }
-    }, {
-      "method": "menuOpen",
-      "name": "menuOpen",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fired when a dock menu is opened."
-      },
-      "complexType": {
-        "original": "DockItem",
-        "resolved": "DockItem",
-        "references": {
-          "DockItem": {
-            "location": "import",
-            "path": "../dock.types"
+      }, {
+        "method": "menuOpen",
+        "name": "menuOpen",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fired when a dock menu is opened."
+        },
+        "complexType": {
+          "original": "DockItem",
+          "resolved": "DockItem",
+          "references": {
+            "DockItem": {
+              "location": "import",
+              "path": "../dock.types"
+            }
           }
         }
-      }
-    }, {
-      "method": "close",
-      "name": "close",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fired when the popover is closed."
-      },
-      "complexType": {
-        "original": "void",
-        "resolved": "void",
-        "references": {}
-      }
-    }]; }
-  static get watchers() { return [{
-      "propName": "isOpen",
-      "methodName": "openWatcher"
-    }]; }
+      }, {
+        "method": "close",
+        "name": "close",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fired when the popover is closed."
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }];
+  }
+  static get watchers() {
+    return [{
+        "propName": "isOpen",
+        "methodName": "openWatcher"
+      }];
+  }
 }