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

package/dist/collection/components/list/list.js

@@ -1,7 +1,6 @@
 import { MDCList } from '@material/list';
-import { MDCRipple } from '@material/ripple';
 import { strings as listStrings } from '@material/list/constants';
-import { Component, Element, Event, h, Host, Prop, Watch, } from '@stencil/core';
+import { h, Host, } from '@stencil/core';
 import { ListRenderer } from './list-renderer';
 const { ACTION_EVENT } = listStrings;
 /**
@@ -22,18 +21,6 @@ const { ACTION_EVENT } = listStrings;
  */
 export class List {
   constructor() {
-    /**
-     * Size of the icons in the list
-     */
-    this.iconSize = 'small';
-    /**
-     * By default, lists will display 3 lines of text, and then truncate the rest.
-     * Consumers can increase or decrease this number by specifying
-     * `maxLinesSecondaryText`. If consumer enters zero or negative
-     * numbers we default to 1; and if they type decimals we round up.
-     */
-    // eslint-disable-next-line no-magic-numbers
-    this.maxLinesSecondaryText = 3;
     this.listRenderer = new ListRenderer();
     this.setup = () => {
       this.setupList();
@@ -46,7 +33,6 @@ export class List {
       }
       this.mdcList = new MDCList(element);
       this.mdcList.hasTypeahead = true;
-      this.mdcList.listElements.forEach((item) => new MDCRipple(item));
     };
     this.setupListeners = () => {
       if (!this.mdcList) {
@@ -111,6 +97,11 @@ export class List {
     this.isListItem = (item) => {
       return !('separator' in item);
     };
+    this.items = undefined;
+    this.badgeIcons = undefined;
+    this.iconSize = 'small';
+    this.type = undefined;
+    this.maxLinesSecondaryText = 3;
   }
   connectedCallback() {
     this.setup();
@@ -162,168 +153,178 @@ export class List {
   }
   static get is() { return "limel-list"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["list.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["list.css"]
-  }; }
-  static get properties() { return {
-    "items": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "Array<ListItem | ListSeparator>",
-        "resolved": "(ListItem<any> | ListSeparator)[]",
-        "references": {
-          "Array": {
-            "location": "global"
-          },
-          "ListItem": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
-          },
-          "ListSeparator": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
+  static get originalStyleUrls() {
+    return {
+      "$": ["list.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["list.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "items": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "Array<ListItem | ListSeparator>",
+          "resolved": "(ListSeparator | ListItem<any>)[]",
+          "references": {
+            "Array": {
+              "location": "global"
+            },
+            "ListItem": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            },
+            "ListSeparator": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            }
           }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "List of items to display"
         }
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "List of items to display"
-      }
-    },
-    "badgeIcons": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Set to `true` if the list should display larger icons with a background"
+      "badgeIcons": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Set to `true` if the list should display larger icons with a background"
+        },
+        "attribute": "badge-icons",
+        "reflect": false
       },
-      "attribute": "badge-icons",
-      "reflect": false
-    },
-    "iconSize": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "IconSize",
-        "resolved": "\"large\" | \"medium\" | \"small\" | \"x-small\"",
-        "references": {
-          "IconSize": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
+      "iconSize": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "IconSize",
+          "resolved": "\"large\" | \"medium\" | \"small\" | \"x-small\"",
+          "references": {
+            "IconSize": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Size of the icons in the list"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Size of the icons in the list"
+        },
+        "attribute": "icon-size",
+        "reflect": false,
+        "defaultValue": "'small'"
       },
-      "attribute": "icon-size",
-      "reflect": false,
-      "defaultValue": "'small'"
-    },
-    "type": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "ListType",
-        "resolved": "\"checkbox\" | \"radio\" | \"selectable\"",
-        "references": {
-          "ListType": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
+      "type": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "ListType",
+          "resolved": "\"checkbox\" | \"radio\" | \"selectable\"",
+          "references": {
+            "ListType": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            }
           }
-        }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The type of the list, omit to get a regular list. Available types are:\n`selectable`: regular list with single selection.\n`radio`: radio button list with single selection.\n`checkbox`: checkbox list with multiple selection."
+        },
+        "attribute": "type",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The type of the list, omit to get a regular list. Available types are:\n`selectable`: regular list with single selection.\n`radio`: radio button list with single selection.\n`checkbox`: checkbox list with multiple selection."
-      },
-      "attribute": "type",
-      "reflect": false
-    },
-    "maxLinesSecondaryText": {
-      "type": "number",
-      "mutable": false,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "By default, lists will display 3 lines of text, and then truncate the rest.\nConsumers can increase or decrease this number by specifying\n`maxLinesSecondaryText`. If consumer enters zero or negative\nnumbers we default to 1; and if they type decimals we round up."
-      },
-      "attribute": "max-lines-secondary-text",
-      "reflect": false,
-      "defaultValue": "3"
-    }
-  }; }
-  static get events() { return [{
-      "method": "change",
-      "name": "change",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fired when a new value has been selected from the list. Only fired if selectable is set to true"
-      },
-      "complexType": {
-        "original": "ListItem | ListItem[]",
-        "resolved": "ListItem<any> | ListItem<any>[]",
-        "references": {
-          "ListItem": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
+      "maxLinesSecondaryText": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "By default, lists will display 3 lines of text, and then truncate the rest.\nConsumers can increase or decrease this number by specifying\n`maxLinesSecondaryText`. If consumer enters zero or negative\nnumbers we default to 1; and if they type decimals we round up."
+        },
+        "attribute": "max-lines-secondary-text",
+        "reflect": false,
+        "defaultValue": "3"
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "change",
+        "name": "change",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fired when a new value has been selected from the list. Only fired if selectable is set to true"
+        },
+        "complexType": {
+          "original": "ListItem | ListItem[]",
+          "resolved": "ListItem<any> | ListItem<any>[]",
+          "references": {
+            "ListItem": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            }
           }
         }
-      }
-    }, {
-      "method": "select",
-      "name": "select",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fired when an action has been selected from the action menu of a list item"
-      },
-      "complexType": {
-        "original": "ListItem | ListItem[]",
-        "resolved": "ListItem<any> | ListItem<any>[]",
-        "references": {
-          "ListItem": {
-            "location": "import",
-            "path": "@limetech/lime-elements"
+      }, {
+        "method": "select",
+        "name": "select",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fired when an action has been selected from the action menu of a list item"
+        },
+        "complexType": {
+          "original": "ListItem | ListItem[]",
+          "resolved": "ListItem<any> | ListItem<any>[]",
+          "references": {
+            "ListItem": {
+              "location": "import",
+              "path": "@limetech/lime-elements"
+            }
           }
         }
-      }
-    }]; }
+      }];
+  }
   static get elementRef() { return "element"; }
-  static get watchers() { return [{
-      "propName": "type",
-      "methodName": "handleType"
-    }, {
-      "propName": "items",
-      "methodName": "itemsChanged"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "type",
+        "methodName": "handleType"
+      }, {
+        "propName": "items",
+        "methodName": "itemsChanged"
+      }];
+  }
 }

package/dist/collection/components/list/radio-button/radio-button.template.js

@@ -1,13 +1,7 @@
 import { h } from '@stencil/core';
 export const RadioButtonTemplate = (props) => {
-  return (h("div", { class: "mdc-form-field" },
-    h("div", { class: `
+  return (h("div", { class: "mdc-form-field" }, h("div", { class: `
                         mdc-radio
                         ${props.disabled ? 'mdc-radio--disabled' : ''}
-                    ` },
-      h("input", { class: "mdc-radio__native-control", type: "radio", id: props.id, checked: props.checked, disabled: props.disabled, onChange: props.onChange }),
-      h("div", { class: "mdc-radio__background" },
-        h("div", { class: "mdc-radio__outer-circle" }),
-        h("div", { class: "mdc-radio__inner-circle" }))),
-    h("label", { class: `${props.disabled ? 'disabled' : ''}`, htmlFor: props.id }, props.label)));
+                    ` }, h("input", { class: "mdc-radio__native-control", type: "radio", id: props.id, checked: props.checked, disabled: props.disabled, onChange: props.onChange }), h("div", { class: "mdc-radio__background" }, h("div", { class: "mdc-radio__outer-circle" }), h("div", { class: "mdc-radio__inner-circle" }))), h("label", { class: `${props.disabled ? 'disabled' : ''}`, htmlFor: props.id }, props.label)));
 };