@scania/tegel 1.40.0-stencil-core-4.38.1-beta.0 → 1.40.0-ts-strict-mode-beta.0

package/dist/collection/components/card/card.js

@@ -11,30 +11,6 @@ import hasSlot from "../../utils/hasSlot";
  */
 export class TdsCard {
     constructor() {
-        /** Variant of the Card based on the theme used. */
-        this.modeVariant = null;
-        /** Placement of the header */
-        this.imagePlacement = 'below-header';
-        /** Divider for the body */
-        this.bodyDivider = false;
-        /** Makes the Card clickable. */
-        this.clickable = false;
-        this.stretch = false;
-        /** ID for the Card, must be unique.
-         *
-         * **NOTE**: If you're listening for Card events, you need to set this ID yourself to identify the Card,
-         * as the default ID is random and will be different every time.
-         */
-        this.cardId = generateUniqueId();
-        /**
-         * Enables expandable behaviour.
-         * When true, clicking the header toggles content visibility.
-         */
-        this.expandable = false;
-        /**
-         * Tracks the current expanded state when expandable is enabled.
-         */
-        this.expanded = false;
         this.toggleExpand = () => {
             if (this.expandable) {
                 this.expanded = !this.expanded;
@@ -56,8 +32,20 @@ export class TdsCard {
             const usesBodyImageSlot = hasSlot('body-image', this.host);
             const usesActionsSlot = hasSlot('actions', this.host);
             const bodyId = `body-${this.cardId}`;
-            return (h("div", { class: this.stretch && 'stretch', "aria-describedby": usesBodySlot ? bodyId : null }, this.imagePlacement === 'below-header' && this.getCardHeader(), h("div", { class: "card-body", id: bodyId }, usesBodyImageSlot && h("slot", { name: "body-image" }), this.bodyImg && h("img", { class: "card-body-img", src: this.bodyImg, alt: this.bodyImgAlt }), this.imagePlacement === 'above-header' && this.getCardHeader(), this.bodyDivider && h("tds-divider", null), usesBodySlot && h("slot", { name: "body" })), usesActionsSlot && h("slot", { name: `actions` })));
+            return (h("div", { class: { 'stretch': this.stretch }, "aria-describedby": usesBodySlot ? bodyId : null }, this.imagePlacement === 'below-header' && this.getCardHeader(), h("div", { class: "card-body", id: bodyId }, usesBodyImageSlot && h("slot", { name: "body-image" }), this.bodyImg && h("img", { class: "card-body-img", src: this.bodyImg, alt: this.bodyImgAlt }), this.imagePlacement === 'above-header' && this.getCardHeader(), this.bodyDivider && h("tds-divider", null), usesBodySlot && h("slot", { name: "body" })), usesActionsSlot && h("slot", { name: `actions` })));
         };
+        this.modeVariant = null;
+        this.imagePlacement = 'below-header';
+        this.header = undefined;
+        this.subheader = undefined;
+        this.bodyImg = undefined;
+        this.bodyImgAlt = undefined;
+        this.bodyDivider = false;
+        this.clickable = false;
+        this.stretch = false;
+        this.cardId = generateUniqueId();
+        this.expandable = false;
+        this.expanded = false;
     }
     render() {
         const cardStyle = {
@@ -67,7 +55,7 @@ export class TdsCard {
             [`${this.imagePlacement}-stretch`]: this.stretch,
         };
         const ariaLabel = this.header ? this.header : `Card ${this.cardId}`;
-        return (h(Host, { key: '14e4d2ece54e021a186661c8dfef2dae78791782', class: this.modeVariant && `tds-mode-variant-${this.modeVariant}` }, this.clickable ? (h("button", { class: cardStyle, onClick: this.handleClick, "aria-label": ariaLabel, "aria-describedby": `header-${this.cardId}` }, this.getCardContent())) : (h("div", { class: cardStyle }, this.getCardContent()))));
+        return (h(Host, { key: '5f10ed76bc6c8da39e0316eaaf1d39047e4c1936', class: { [`tds-mode-variant-${this.modeVariant}`]: !!this.modeVariant } }, this.clickable ? (h("button", { class: cardStyle, onClick: this.handleClick, "aria-label": ariaLabel, "aria-describedby": `header-${this.cardId}` }, this.getCardContent())) : (h("div", { class: cardStyle }, this.getCardContent()))));
     }
     static get is() { return "tds-card"; }
     static get encapsulation() { return "shadow"; }
@@ -87,8 +75,8 @@ export class TdsCard {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "'primary' | 'secondary'",
-                    "resolved": "\"primary\" | \"secondary\"",
+                    "original": "'primary' | 'secondary' | null",
+                    "resolved": "\"primary\" | \"secondary\" | null",
                     "references": {}
                 },
                 "required": false,
@@ -97,10 +85,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Variant of the Card based on the theme used."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "mode-variant",
+                "reflect": false,
                 "defaultValue": "null"
             },
             "imagePlacement": {
@@ -117,10 +103,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Placement of the header"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "image-placement",
+                "reflect": false,
                 "defaultValue": "'below-header'"
             },
             "header": {
@@ -137,10 +121,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Text in the header"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "header"
+                "attribute": "header",
+                "reflect": false
             },
             "subheader": {
                 "type": "string",
@@ -156,10 +138,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Subheader text in the header"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "subheader"
+                "attribute": "subheader",
+                "reflect": false
             },
             "bodyImg": {
                 "type": "string",
@@ -175,10 +155,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Body image src"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "body-img"
+                "attribute": "body-img",
+                "reflect": false
             },
             "bodyImgAlt": {
                 "type": "string",
@@ -194,10 +172,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Alt text for the body image"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "body-img-alt"
+                "attribute": "body-img-alt",
+                "reflect": false
             },
             "bodyDivider": {
                 "type": "boolean",
@@ -213,10 +189,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Divider for the body"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "body-divider",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "clickable": {
@@ -233,10 +207,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Makes the Card clickable."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "clickable",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "stretch": {
@@ -253,10 +225,8 @@ export class TdsCard {
                     "tags": [],
                     "text": ""
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "stretch",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "cardId": {
@@ -273,10 +243,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "ID for the Card, must be unique.\n\n**NOTE**: If you're listening for Card events, you need to set this ID yourself to identify the Card,\nas the default ID is random and will be different every time."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "card-id",
+                "reflect": false,
                 "defaultValue": "generateUniqueId()"
             },
             "expandable": {
@@ -293,10 +261,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Enables expandable behaviour.\nWhen true, clicking the header toggles content visibility."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "expandable",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "expanded": {
@@ -313,10 +279,8 @@ export class TdsCard {
                     "tags": [],
                     "text": "Tracks the current expanded state when expandable is enabled."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
                 "attribute": "expanded",
+                "reflect": true,
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/checkbox/checkbox.js

@@ -5,16 +5,6 @@ import generateUniqueId from "../../utils/generateUniqueId";
  */
 export class TdsCheckbox {
     constructor() {
-        /** ID for the Checkbox's input element. Randomly generated if not specified. */
-        this.checkboxId = generateUniqueId();
-        /** Sets the Checkbox in a disabled state */
-        this.disabled = false;
-        /** Make the Checkbox required */
-        this.required = false;
-        /** Sets the Checkbox as checked */
-        this.checked = false;
-        /** Sets the Checkbox as indeterminate */
-        this.indeterminate = false;
         this.handleChange = () => {
             this.checked = !this.checked;
             this.indeterminate = false;
@@ -25,6 +15,15 @@ export class TdsCheckbox {
                 value: this.value,
             });
         };
+        this.name = undefined;
+        this.checkboxId = generateUniqueId();
+        this.disabled = false;
+        this.required = false;
+        this.checked = false;
+        this.indeterminate = false;
+        this.value = undefined;
+        this.tdsAriaLabel = undefined;
+        this.tdsAriaDescribedby = undefined;
     }
     /** Toggles the checked value of the component. */
     async toggleCheckbox() {
@@ -60,11 +59,14 @@ export class TdsCheckbox {
         }
     }
     render() {
-        return (h("div", { key: '87d4e8620e183b5fb8a885dca8081424c7497b21', class: "tds-checkbox" }, h("input", { key: 'fa5d4c8e9a33a7a88d1348f6eb66b474e94c0ad1',
+        return (h("div", { key: '87d4e8620e183b5fb8a885dca8081424c7497b21', class: "tds-checkbox" }, h("input", { key: 'a2bc2c3f7c1aad6ed32f564fa4df5c3cbabac03c',
             // eslint-disable-next-line no-return-assign
-            ref: (inputElement) => (this.inputElement = inputElement), indeterminate: this.indeterminate, "aria-checked": this.checked, "aria-required": this.required, "aria-label": this.tdsAriaLabel, "aria-describedby": this.tdsAriaDescribedby, required: this.required, type: "checkbox", name: this.name, value: this.value, id: this.checkboxId, checked: this.checked, disabled: this.disabled, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), onChange: () => {
+            ref: (inputElement) => {
+                if (inputElement)
+                    this.inputElement = inputElement;
+            }, indeterminate: this.indeterminate, "aria-checked": this.checked, "aria-required": this.required, "aria-label": this.tdsAriaLabel, "aria-describedby": this.tdsAriaDescribedby, required: this.required, type: "checkbox", name: this.name, value: this.value, id: this.checkboxId, checked: this.checked, disabled: this.disabled, onFocus: (event) => this.handleFocus(event), onBlur: (event) => this.handleBlur(event), onChange: () => {
                 this.handleChange();
-            } }), h("label", { key: '82545f01ad68fae4d613b58d82a770a0c1bce79e', htmlFor: this.checkboxId }, h("slot", { key: '99892e112b596a7f8517427cc42f75e90140c315', name: "label" }))));
+            } }), h("label", { key: 'fdc29f380023c086cd6b25bd37a6e6475a67059d', htmlFor: this.checkboxId }, h("slot", { key: '204674f2b46e308aa090aaef84827e58c18cb830', name: "label" }))));
     }
     static get is() { return "tds-checkbox"; }
     static get encapsulation() { return "scoped"; }
@@ -94,10 +96,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Name for the Checkbox's input element."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "name"
+                "attribute": "name",
+                "reflect": false
             },
             "checkboxId": {
                 "type": "string",
@@ -113,10 +113,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "ID for the Checkbox's input element. Randomly generated if not specified."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "checkbox-id",
+                "reflect": false,
                 "defaultValue": "generateUniqueId()"
             },
             "disabled": {
@@ -133,10 +131,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Sets the Checkbox in a disabled state"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "disabled",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "required": {
@@ -153,10 +149,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Make the Checkbox required"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "required",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "checked": {
@@ -173,10 +167,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Sets the Checkbox as checked"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
                 "attribute": "checked",
+                "reflect": true,
                 "defaultValue": "false"
             },
             "indeterminate": {
@@ -193,10 +185,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Sets the Checkbox as indeterminate"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "indeterminate",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "value": {
@@ -213,10 +203,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Value for the Checkbox"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "value"
+                "attribute": "value",
+                "reflect": false
             },
             "tdsAriaLabel": {
                 "type": "string",
@@ -232,10 +220,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Value to be used for the aria-label attribute"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "tds-aria-label"
+                "attribute": "tds-aria-label",
+                "reflect": false
             },
             "tdsAriaDescribedby": {
                 "type": "string",
@@ -251,10 +237,8 @@ export class TdsCheckbox {
                     "tags": [],
                     "text": "Value to be used for the aria-describedby attribute"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "tds-aria-describedby"
+                "attribute": "tds-aria-describedby",
+                "reflect": false
             }
         };
     }
@@ -271,7 +255,7 @@ export class TdsCheckbox {
                 },
                 "complexType": {
                     "original": "{\n    checkboxId: string;\n    checked: boolean;\n    indeterminate: boolean;\n    value?: string;\n  }",
-                    "resolved": "{ checkboxId: string; checked: boolean; indeterminate: boolean; value?: string; }",
+                    "resolved": "{ checkboxId: string; checked: boolean; indeterminate: boolean; value?: string | undefined; }",
                     "references": {}
                 }
             }, {

package/dist/collection/components/chip/chip.js

@@ -8,20 +8,6 @@ import hasSlot from "../../utils/hasSlot";
  */
 export class TdsChip {
     constructor() {
-        /** Type of Chip, depends on usage */
-        this.type = 'button';
-        /** Size of the Chip component */
-        this.size = 'lg';
-        /** ID used for internal Chip functionality and events, must be unique.
-         *
-         * **NOTE**: If you're listening for input events, you need to set this ID yourself to identify the input,
-         * as the default ID is random and will be different every time.
-         */
-        this.chipId = generateUniqueId();
-        /** Controls component's checked attribute. Valid only for type checkbox and radio. */
-        this.checked = false;
-        /** Sets the Chip in a disabled state */
-        this.disabled = false;
         this.handleChange = () => {
             if (!this.disabled) {
                 // Only proceed if not disabled
@@ -54,6 +40,14 @@ export class TdsChip {
                 });
             }
         };
+        this.type = 'button';
+        this.size = 'lg';
+        this.chipId = generateUniqueId();
+        this.checked = false;
+        this.name = undefined;
+        this.value = undefined;
+        this.disabled = false;
+        this.tdsAriaLabel = undefined;
     }
     handleInternaRadioChange(event) {
         const { chipId, checked, groupName } = event.detail;
@@ -117,10 +111,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "Type of Chip, depends on usage"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "type",
+                "reflect": false,
                 "defaultValue": "'button'"
             },
             "size": {
@@ -137,10 +129,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "Size of the Chip component"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "size",
+                "reflect": false,
                 "defaultValue": "'lg'"
             },
             "chipId": {
@@ -157,10 +147,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "ID used for internal Chip functionality and events, must be unique.\n\n**NOTE**: If you're listening for input events, you need to set this ID yourself to identify the input,\nas the default ID is random and will be different every time."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "chip-id",
+                "reflect": false,
                 "defaultValue": "generateUniqueId()"
             },
             "checked": {
@@ -177,10 +165,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "Controls component's checked attribute. Valid only for type checkbox and radio."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
                 "attribute": "checked",
+                "reflect": true,
                 "defaultValue": "false"
             },
             "name": {
@@ -197,10 +183,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "Name for the checkbox or radio input element. Also creates a reference between label and input. Valid only for type checkbox and radio."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "name"
+                "attribute": "name",
+                "reflect": false
             },
             "value": {
                 "type": "string",
@@ -216,10 +200,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "Value of input. Valid only for type checkbox and radio."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "value"
+                "attribute": "value",
+                "reflect": false
             },
             "disabled": {
                 "type": "boolean",
@@ -235,10 +217,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "Sets the Chip in a disabled state"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "disabled",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "tdsAriaLabel": {
@@ -255,10 +235,8 @@ export class TdsChip {
                     "tags": [],
                     "text": "Value to be used for the aria-label attribute"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "tds-aria-label"
+                "attribute": "tds-aria-label",
+                "reflect": false
             }
         };
     }
@@ -275,7 +253,7 @@ export class TdsChip {
                 },
                 "complexType": {
                     "original": "{\n    chipId: string;\n    value: string;\n    checked?: boolean;\n  }",
-                    "resolved": "{ chipId: string; value: string; checked?: boolean; }",
+                    "resolved": "{ chipId: string; value: string; checked?: boolean | undefined; }",
                     "references": {}
                 }
             }, {