@scania/tegel 1.3.3-event-types.0 → 1.4.0

package/dist/collection/components/table/table-body/table-body.js

@@ -5,96 +5,96 @@ const relevantTableProps = ['multiselect', 'expandableRows'];
  * @slot no-result - Slot for no result message when using filtering.
  */
 export class TdsTableBody {
-  constructor() {
-    this.bodyCheckBoxClicked = () => {
-      const numberOfRows = this.host.getElementsByClassName('tds-table__row').length;
-      const numberOfRowsSelected = this.host.getElementsByClassName('tds-table__row--selected').length;
-      this.mainCheckboxStatus = numberOfRows === numberOfRowsSelected;
-    };
-    this.multiselect = false;
-    this.enablePaginationTableBody = false;
-    this.expandableRows = false;
-    this.multiselectArray = [];
-    this.multiselectArrayJSON = undefined;
-    this.mainCheckboxStatus = false;
-    this.columnsNumber = 0;
-    this.tableId = '';
-  }
-  internalTdsPropChangeListener(event) {
-    if (this.tableId === event.detail.tableId) {
-      event.detail.changed
-        .filter((changedProp) => relevantTableProps.includes(changedProp))
-        .forEach((changedProp) => {
-        if (typeof this[changedProp] === 'undefined') {
-          throw new Error(`Table prop is not supported: ${changedProp}`);
+    constructor() {
+        this.bodyCheckBoxClicked = () => {
+            const numberOfRows = this.host.getElementsByClassName('tds-table__row').length;
+            const numberOfRowsSelected = this.host.getElementsByClassName('tds-table__row--selected').length;
+            this.mainCheckboxStatus = numberOfRows === numberOfRowsSelected;
+        };
+        this.multiselect = false;
+        this.enablePaginationTableBody = false;
+        this.expandableRows = false;
+        this.multiselectArray = [];
+        this.multiselectArrayJSON = undefined;
+        this.mainCheckboxStatus = false;
+        this.columnsNumber = 0;
+        this.tableId = '';
+    }
+    internalTdsPropChangeListener(event) {
+        if (this.tableId === event.detail.tableId) {
+            event.detail.changed
+                .filter((changedProp) => relevantTableProps.includes(changedProp))
+                .forEach((changedProp) => {
+                if (typeof this[changedProp] === 'undefined') {
+                    throw new Error(`Table prop is not supported: ${changedProp}`);
+                }
+                this[changedProp] = event.detail[changedProp];
+            });
+        }
+    }
+    // No need to read the value, event is here just to trigger another function
+    bodyCheckboxListener() {
+        this.bodyCheckBoxClicked();
+    }
+    connectedCallback() {
+        this.tableEl = this.host.closest('tds-table');
+        this.tableId = this.tableEl.tableId;
+    }
+    componentWillLoad() {
+        relevantTableProps.forEach((tablePropName) => {
+            this[tablePropName] = this.tableEl[tablePropName];
+        });
+    }
+    componentWillRender() {
+        const headerColumnsNo = this.host.parentElement.querySelector('tds-table-header').children.length;
+        // multiselect and expended features requires one extra column for controls...
+        if (this.multiselect || this.expandableRows) {
+            this.columnsNumber = headerColumnsNo + 1;
+        }
+        else {
+            this.columnsNumber = headerColumnsNo;
         }
-        this[changedProp] = event.detail[changedProp];
-      });
     }
-  }
-  // No need to read the value, event is here just to trigger another function
-  bodyCheckboxListener() {
-    this.bodyCheckBoxClicked();
-  }
-  connectedCallback() {
-    this.tableEl = this.host.closest('tds-table');
-    this.tableId = this.tableEl.tableId;
-  }
-  componentWillLoad() {
-    relevantTableProps.forEach((tablePropName) => {
-      this[tablePropName] = this.tableEl[tablePropName];
-    });
-  }
-  componentWillRender() {
-    const headerColumnsNo = this.host.parentElement.querySelector('tds-table-header').children.length;
-    // multiselect and expended features requires one extra column for controls...
-    if (this.multiselect || this.expandableRows) {
-      this.columnsNumber = headerColumnsNo + 1;
+    render() {
+        return (h(Host, { "data-selected-rows": this.multiselectArrayJSON }, h("slot", null)));
+    }
+    static get is() { return "tds-table-body"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["table-body.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["table-body.css"]
+        };
+    }
+    static get states() {
+        return {
+            "multiselect": {},
+            "enablePaginationTableBody": {},
+            "expandableRows": {},
+            "multiselectArray": {},
+            "multiselectArrayJSON": {},
+            "mainCheckboxStatus": {},
+            "columnsNumber": {},
+            "tableId": {}
+        };
     }
-    else {
-      this.columnsNumber = headerColumnsNo;
+    static get elementRef() { return "host"; }
+    static get listeners() {
+        return [{
+                "name": "internalTdsTablePropChange",
+                "method": "internalTdsPropChangeListener",
+                "target": "body",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "internalTdsRowChange",
+                "method": "bodyCheckboxListener",
+                "target": "body",
+                "capture": false,
+                "passive": false
+            }];
     }
-  }
-  render() {
-    return (h(Host, { "data-selected-rows": this.multiselectArrayJSON }, h("slot", null)));
-  }
-  static get is() { return "tds-table-body"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["table-body.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["table-body.css"]
-    };
-  }
-  static get states() {
-    return {
-      "multiselect": {},
-      "enablePaginationTableBody": {},
-      "expandableRows": {},
-      "multiselectArray": {},
-      "multiselectArrayJSON": {},
-      "mainCheckboxStatus": {},
-      "columnsNumber": {},
-      "tableId": {}
-    };
-  }
-  static get elementRef() { return "host"; }
-  static get listeners() {
-    return [{
-        "name": "internalTdsTablePropChange",
-        "method": "internalTdsPropChangeListener",
-        "target": "body",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "internalTdsRowChange",
-        "method": "bodyCheckboxListener",
-        "target": "body",
-        "capture": false,
-        "passive": false
-      }];
-  }
 }

package/dist/collection/components/table/table-body-cell/table-body-cell.js

@@ -1,171 +1,171 @@
 import { h, Host } from "@stencil/core";
 const relevantTableProps = [
-  'verticalDividers',
-  'compactDesign',
-  'noMinWidth',
+    'verticalDividers',
+    'compactDesign',
+    'noMinWidth',
 ];
 /**
  * @slot <default> - <b>Unnamed slot.</b> For the cell contents.
  */
 export class TdsTableBodyCell {
-  constructor() {
-    this.cellValue = undefined;
-    this.cellKey = undefined;
-    this.disablePadding = false;
-    this.textAlignState = undefined;
-    this.activeSorting = false;
-    this.verticalDividers = false;
-    this.compactDesign = false;
-    this.noMinWidth = false;
-    this.whiteBackground = false;
-    this.tableId = '';
-  }
-  internalTdsPropChangeListener(event) {
-    if (this.tableId === event.detail.tableId) {
-      event.detail.changed
-        .filter((changedProp) => relevantTableProps.includes(changedProp))
-        .forEach((changedProp) => {
-        if (typeof this[changedProp] === 'undefined') {
-          throw new Error(`Table prop is not supported: ${changedProp}`);
+    constructor() {
+        this.cellValue = undefined;
+        this.cellKey = undefined;
+        this.disablePadding = false;
+        this.textAlignState = undefined;
+        this.activeSorting = false;
+        this.verticalDividers = false;
+        this.compactDesign = false;
+        this.noMinWidth = false;
+        this.whiteBackground = false;
+        this.tableId = '';
+    }
+    internalTdsPropChangeListener(event) {
+        if (this.tableId === event.detail.tableId) {
+            event.detail.changed
+                .filter((changedProp) => relevantTableProps.includes(changedProp))
+                .forEach((changedProp) => {
+                if (typeof this[changedProp] === 'undefined') {
+                    throw new Error(`Table prop is not supported: ${changedProp}`);
+                }
+                this[changedProp] = event.detail[changedProp];
+            });
+        }
+    }
+    // Listen to headKey from table-header-element
+    internalTdsHoverListener(event) {
+        const { tableId, key } = event.detail;
+        if (tableId === this.tableId) {
+            this.activeSorting = this.cellKey === key;
         }
-        this[changedProp] = event.detail[changedProp];
-      });
     }
-  }
-  // Listen to headKey from table-header-element
-  internalTdsHoverListener(event) {
-    const { tableId, key } = event.detail;
-    if (tableId === this.tableId) {
-      this.activeSorting = this.cellKey === key;
+    // Listen to internalTdsTextAlign from table-header-element
+    internalTdsTextAlignListener(event) {
+        const [receivedID, receivedKey, receivedTextAlign] = event.detail;
+        if (this.tableId === receivedID) {
+            if (this.cellKey === receivedKey) {
+                this.textAlignState = receivedTextAlign;
+            }
+        }
+    }
+    connectedCallback() {
+        this.tableEl = this.host.closest('tds-table');
+        this.tableId = this.tableEl.tableId;
+    }
+    componentWillLoad() {
+        relevantTableProps.forEach((tablePropName) => {
+            this[tablePropName] = this.tableEl[tablePropName];
+        });
+    }
+    render() {
+        return (h(Host, { class: {
+                'tds-table__body-cell': true,
+                'tds-table__body-cell--hover': this.activeSorting,
+                'tds-table__compact': this.compactDesign,
+                'tds-table--divider': this.verticalDividers,
+                'tds-table--no-min-width': this.noMinWidth,
+                'tds-table__body-cell--no-padding': this.disablePadding,
+            }, style: { textAlign: this.textAlignState } }, this.cellValue, h("slot", null)));
+    }
+    static get is() { return "tds-body-cell"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["table-body-cell.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["table-body-cell.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "cellValue": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | number",
+                    "resolved": "number | string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Value that will be presented as text inside a cell"
+                },
+                "attribute": "cell-value",
+                "reflect": true
+            },
+            "cellKey": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Passing the same cell key for all body cells which is used in head cell enables features of text align and hovering"
+                },
+                "attribute": "cell-key",
+                "reflect": true
+            },
+            "disablePadding": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Disables internal padding. Useful when passing other components to cell."
+                },
+                "attribute": "disable-padding",
+                "reflect": true,
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "textAlignState": {},
+            "activeSorting": {},
+            "verticalDividers": {},
+            "compactDesign": {},
+            "noMinWidth": {},
+            "whiteBackground": {},
+            "tableId": {}
+        };
     }
-  }
-  // Listen to internalTdsTextAlign from table-header-element
-  internalTdsTextAlignListener(event) {
-    const [receivedID, receivedKey, receivedTextAlign] = event.detail;
-    if (this.tableId === receivedID) {
-      if (this.cellKey === receivedKey) {
-        this.textAlignState = receivedTextAlign;
-      }
+    static get elementRef() { return "host"; }
+    static get listeners() {
+        return [{
+                "name": "internalTdsPropChange",
+                "method": "internalTdsPropChangeListener",
+                "target": "body",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "internalTdsHover",
+                "method": "internalTdsHoverListener",
+                "target": "body",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "internalTdsTextAlign",
+                "method": "internalTdsTextAlignListener",
+                "target": "body",
+                "capture": false,
+                "passive": false
+            }];
     }
-  }
-  connectedCallback() {
-    this.tableEl = this.host.closest('tds-table');
-    this.tableId = this.tableEl.tableId;
-  }
-  componentWillLoad() {
-    relevantTableProps.forEach((tablePropName) => {
-      this[tablePropName] = this.tableEl[tablePropName];
-    });
-  }
-  render() {
-    return (h(Host, { class: {
-        'tds-table__body-cell': true,
-        'tds-table__body-cell--hover': this.activeSorting,
-        'tds-table__compact': this.compactDesign,
-        'tds-table--divider': this.verticalDividers,
-        'tds-table--no-min-width': this.noMinWidth,
-        'tds-table__body-cell--no-padding': this.disablePadding,
-      }, style: { textAlign: this.textAlignState } }, this.cellValue, h("slot", null)));
-  }
-  static get is() { return "tds-body-cell"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["table-body-cell.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["table-body-cell.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "cellValue": {
-        "type": "any",
-        "mutable": false,
-        "complexType": {
-          "original": "string | number",
-          "resolved": "number | string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Value that will be presented as text inside a cell"
-        },
-        "attribute": "cell-value",
-        "reflect": true
-      },
-      "cellKey": {
-        "type": "any",
-        "mutable": false,
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Passing the same cell key for all body cells which is used in head cell enables features of text align and hovering"
-        },
-        "attribute": "cell-key",
-        "reflect": true
-      },
-      "disablePadding": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Disables internal padding. Useful when passing other components to cell."
-        },
-        "attribute": "disable-padding",
-        "reflect": true,
-        "defaultValue": "false"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "textAlignState": {},
-      "activeSorting": {},
-      "verticalDividers": {},
-      "compactDesign": {},
-      "noMinWidth": {},
-      "whiteBackground": {},
-      "tableId": {}
-    };
-  }
-  static get elementRef() { return "host"; }
-  static get listeners() {
-    return [{
-        "name": "internalTdsPropChange",
-        "method": "internalTdsPropChangeListener",
-        "target": "body",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "internalTdsHover",
-        "method": "internalTdsHoverListener",
-        "target": "body",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "internalTdsTextAlign",
-        "method": "internalTdsTextAlignListener",
-        "target": "body",
-        "capture": false,
-        "passive": false
-      }];
-  }
 }