@scania/tegel 1.41.0-stencil-core-beta.0 → 1.42.0

package/dist/collection/components/datetime/datetime.js

@@ -2,30 +2,6 @@ import { h } from "@stencil/core";
 import generateUniqueId from "../../utils/generateUniqueId";
 export class TdsDatetime {
     constructor() {
-        /** Sets an input type */
-        this.type = 'datetime-local';
-        /** Value of the input text */
-        this.value = '';
-        /** Default value of the component. Format for time: HH-MM. Format for date: YY-MM-DD. Format for month: YY-MM. Format for week: YY-Www  Format for date-time: YY-MM-DDTHH-MM */
-        this.defaultValue = 'none';
-        /** Set input in disabled state */
-        this.disabled = false;
-        /** Size of the input */
-        this.size = 'lg';
-        /** Resets min width rule */
-        this.noMinWidth = false;
-        /** Set the variant of the Datetime component. */
-        this.modeVariant = null;
-        /** Name property. Uses a unique ID as fallback if not specified. */
-        this.name = `datetime-${generateUniqueId()}`;
-        /** Autofocus for input */
-        this.autofocus = false;
-        /** Label text for the component */
-        this.label = '';
-        /** Position of the label */
-        this.labelPosition = 'no-label';
-        /** Helper text for the component */
-        this.helper = '';
         this.getDefaultValue = () => {
             const dateTimeObj = {
                 year: this.defaultValue.slice(0, 4),
@@ -50,6 +26,23 @@ export class TdsDatetime {
                     throw new Error('Invalid type.');
             }
         };
+        this.type = 'datetime-local';
+        this.value = '';
+        this.min = undefined;
+        this.max = undefined;
+        this.defaultValue = 'none';
+        this.disabled = false;
+        this.size = 'lg';
+        this.noMinWidth = false;
+        this.modeVariant = null;
+        this.name = `datetime-${generateUniqueId()}`;
+        this.state = undefined;
+        this.autofocus = false;
+        this.label = '';
+        this.labelPosition = 'no-label';
+        this.helper = '';
+        this.tdsAriaLabel = undefined;
+        this.focusInput = undefined;
     }
     /** Method that resets the value of the Datetime, using defaultValue if is not 'none' */
     async reset() {
@@ -170,10 +163,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Sets an input type"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
                 "attribute": "type",
+                "reflect": true,
                 "defaultValue": "'datetime-local'"
             },
             "value": {
@@ -190,10 +181,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Value of the input text"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
                 "attribute": "value",
+                "reflect": true,
                 "defaultValue": "''"
             },
             "min": {
@@ -210,10 +199,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Sets min value. Example for different types: datetime=\"2023-01-31T00:00\" date=\"2023-01-01\" time=\"15:00\""
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "min"
+                "attribute": "min",
+                "reflect": false
             },
             "max": {
                 "type": "string",
@@ -229,10 +216,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Sets max value. Example for different types: datetime=\"2023-01-31T00:00\" date=\"2023-01-01\" time=\"15:00\""
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "max"
+                "attribute": "max",
+                "reflect": false
             },
             "defaultValue": {
                 "type": "string",
@@ -248,10 +233,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Default value of the component. Format for time: HH-MM. Format for date: YY-MM-DD. Format for month: YY-MM. Format for week: YY-Www  Format for date-time: YY-MM-DDTHH-MM"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "default-value",
+                "reflect": false,
                 "defaultValue": "'none'"
             },
             "disabled": {
@@ -268,10 +251,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Set input in disabled state"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "disabled",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "size": {
@@ -288,10 +269,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Size of the input"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "size",
+                "reflect": false,
                 "defaultValue": "'lg'"
             },
             "noMinWidth": {
@@ -308,10 +287,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Resets min width rule"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "no-min-width",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "modeVariant": {
@@ -328,10 +305,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Set the variant of the Datetime component."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "mode-variant",
+                "reflect": false,
                 "defaultValue": "null"
             },
             "name": {
@@ -348,10 +323,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Name property. Uses a unique ID as fallback if not specified."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "name",
+                "reflect": false,
                 "defaultValue": "`datetime-${generateUniqueId()}`"
             },
             "state": {
@@ -368,10 +341,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Error state of input"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "state"
+                "attribute": "state",
+                "reflect": false
             },
             "autofocus": {
                 "type": "boolean",
@@ -387,10 +358,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Autofocus for input"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "autofocus",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "label": {
@@ -407,10 +376,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Label text for the component"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "label",
+                "reflect": false,
                 "defaultValue": "''"
             },
             "labelPosition": {
@@ -427,10 +394,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Position of the label"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "label-position",
+                "reflect": false,
                 "defaultValue": "'no-label'"
             },
             "helper": {
@@ -447,10 +412,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Helper text for the component"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "helper",
+                "reflect": false,
                 "defaultValue": "''"
             },
             "tdsAriaLabel": {
@@ -467,10 +430,8 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Value for the aria-label attribute"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "tds-aria-label"
+                "attribute": "tds-aria-label",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/divider/divider.js

@@ -1,9 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class Divider {
     constructor() {
-        /** Orientation of the Divider, horizontal if not specified. */
         this.orientation = 'horizontal';
-        /** Variant of the Divider, subtle if not specified. */
         this.variant = 'subtle';
     }
     render() {
@@ -46,10 +44,8 @@ export class Divider {
                     "tags": [],
                     "text": "Orientation of the Divider, horizontal if not specified."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "orientation",
+                "reflect": false,
                 "defaultValue": "'horizontal'"
             },
             "variant": {
@@ -66,10 +62,8 @@ export class Divider {
                     "tags": [],
                     "text": "Variant of the Divider, subtle if not specified."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "variant",
+                "reflect": false,
                 "defaultValue": "'subtle'"
             }
         };

package/dist/collection/components/dropdown/dropdown-option/dropdown-option.js

@@ -5,11 +5,6 @@ import { convertToString } from "../../../utils/convertToString";
  */
 export class TdsDropdownOption {
     constructor() {
-        /** Sets the option as disabled. */
-        this.disabled = false;
-        this.selected = false;
-        this.multiselect = false;
-        this.size = 'lg';
         this.parentElement = null;
         // @ts-expect-error - label property is used internally for text content tracking
         // eslint-disable-next-line no-unused-vars,
@@ -75,6 +70,13 @@ export class TdsDropdownOption {
                 this.tdsBlur.emit(event);
             }
         };
+        this.value = undefined;
+        this.internalValue = undefined;
+        this.disabled = false;
+        this.tdsAriaLabel = undefined;
+        this.selected = false;
+        this.multiselect = false;
+        this.size = 'lg';
     }
     /** Method to select/deselect an option. */
     async setSelected(selected) {
@@ -134,10 +136,8 @@ export class TdsDropdownOption {
                     "tags": [],
                     "text": "Value of the dropdown option"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "value"
+                "attribute": "value",
+                "reflect": false
             },
             "disabled": {
                 "type": "boolean",
@@ -153,10 +153,8 @@ export class TdsDropdownOption {
                     "tags": [],
                     "text": "Sets the option as disabled."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "disabled",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "tdsAriaLabel": {
@@ -173,10 +171,8 @@ export class TdsDropdownOption {
                     "tags": [],
                     "text": "Defines aria-label attribute for the option"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "tds-aria-label"
+                "attribute": "tds-aria-label",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/dropdown/dropdown.js

@@ -14,31 +14,6 @@ function hasValueChanged(newValue, currentValue) {
  */
 export class TdsDropdown {
     constructor() {
-        /** Sets the Dropdown in a disabled state */
-        this.disabled = false;
-        /** Mode variant of the component, based on current mode. */
-        this.modeVariant = null;
-        /** The direction the Dropdown should open, auto if not specified. */
-        this.openDirection = 'auto';
-        /** The size of the Dropdown. */
-        this.size = 'lg';
-        this.animation = 'slide';
-        /** Sets the Dropdown in an error state */
-        this.error = false;
-        /** Enables multiselect in the Dropdown. */
-        this.multiselect = false;
-        /** Enables filtration in the Dropdown. */
-        this.filter = false;
-        /** Normalizes input text for fuzzier search */
-        this.normalizeText = true;
-        /** Text that is displayed if filter is used and there are no options that matches the search.
-         * Setting it to an empty string disables message from showing up. */
-        this.noResultText = 'No result';
-        /** Value of the dropdown. For multiselect, provide array of strings/numbers. For single select, provide a string/number. */
-        this.value = null;
-        this.open = false;
-        this.selectedOptions = [];
-        this.filterQuery = '';
         this.hasFocus = false;
         this.setDefaultOption = () => {
             if (this.internalDefaultValue) {
@@ -185,6 +160,31 @@ export class TdsDropdown {
                 this.reset();
             }
         };
+        this.name = undefined;
+        this.disabled = false;
+        this.helper = undefined;
+        this.label = undefined;
+        this.labelPosition = undefined;
+        this.modeVariant = null;
+        this.openDirection = 'auto';
+        this.placeholder = undefined;
+        this.size = 'lg';
+        this.animation = 'slide';
+        this.error = false;
+        this.multiselect = false;
+        this.filter = false;
+        this.normalizeText = true;
+        this.noResultText = 'No result';
+        this.defaultValue = undefined;
+        this.value = null;
+        this.tdsAriaLabel = undefined;
+        this.open = false;
+        this.internalValue = undefined;
+        this.filterResult = undefined;
+        this.filterFocus = undefined;
+        this.internalDefaultValue = undefined;
+        this.selectedOptions = [];
+        this.filterQuery = '';
     }
     handleValueChange(newValue) {
         // Normalize to array
@@ -583,10 +583,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Name for the Dropdowns input element."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "name"
+                "attribute": "name",
+                "reflect": false
             },
             "disabled": {
                 "type": "boolean",
@@ -602,10 +600,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Sets the Dropdown in a disabled state"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "disabled",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "helper": {
@@ -622,10 +618,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Helper text for the Dropdown."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "helper"
+                "attribute": "helper",
+                "reflect": false
             },
             "label": {
                 "type": "string",
@@ -641,10 +635,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Label text for the Dropdown."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "label"
+                "attribute": "label",
+                "reflect": false
             },
             "labelPosition": {
                 "type": "string",
@@ -660,10 +652,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Label text position"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "label-position"
+                "attribute": "label-position",
+                "reflect": false
             },
             "modeVariant": {
                 "type": "string",
@@ -679,10 +669,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Mode variant of the component, based on current mode."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "mode-variant",
+                "reflect": false,
                 "defaultValue": "null"
             },
             "openDirection": {
@@ -699,10 +687,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "The direction the Dropdown should open, auto if not specified."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "open-direction",
+                "reflect": false,
                 "defaultValue": "'auto'"
             },
             "placeholder": {
@@ -719,10 +705,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Placeholder text for the Dropdown."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "placeholder"
+                "attribute": "placeholder",
+                "reflect": false
             },
             "size": {
                 "type": "string",
@@ -738,10 +722,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "The size of the Dropdown."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "size",
+                "reflect": false,
                 "defaultValue": "'lg'"
             },
             "animation": {
@@ -758,10 +740,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": ""
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "animation",
+                "reflect": false,
                 "defaultValue": "'slide'"
             },
             "error": {
@@ -778,10 +758,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Sets the Dropdown in an error state"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "error",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "multiselect": {
@@ -798,10 +776,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Enables multiselect in the Dropdown."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "multiselect",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "filter": {
@@ -818,10 +794,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Enables filtration in the Dropdown."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "filter",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "normalizeText": {
@@ -838,10 +812,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Normalizes input text for fuzzier search"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "normalize-text",
+                "reflect": false,
                 "defaultValue": "true"
             },
             "noResultText": {
@@ -858,10 +830,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Text that is displayed if filter is used and there are no options that matches the search.\nSetting it to an empty string disables message from showing up."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "no-result-text",
+                "reflect": false,
                 "defaultValue": "'No result'"
             },
             "defaultValue": {
@@ -878,10 +848,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Default value selected in the Dropdown."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "default-value"
+                "attribute": "default-value",
+                "reflect": false
             },
             "value": {
                 "type": "any",
@@ -897,10 +865,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Value of the dropdown. For multiselect, provide array of strings/numbers. For single select, provide a string/number."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
                 "attribute": "value",
+                "reflect": false,
                 "defaultValue": "null"
             },
             "tdsAriaLabel": {
@@ -917,10 +883,8 @@ export class TdsDropdown {
                     "tags": [],
                     "text": "Defines aria-label attribute for input"
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "tds-aria-label"
+                "attribute": "tds-aria-label",
+                "reflect": false
             }
         };
     }

package/dist/collection/components/footer/footer-group/footer-group.js

@@ -6,13 +6,15 @@ import hasSlot from "../../../utils/hasSlot";
  */
 export class TdsFooterGroup {
     constructor() {
-        /** In mobile, this indicates when the group (if it's in the top part) is opened/closed. */
-        this.open = false;
         /** If the group is placed in the main part of the Footer,
          * it can have either start or end as a slot position otherwise undefined. */
         this.slotPosition = null;
         /** Indicates if a group is part of the top part of the Footer. */
         this.topPartGroup = false;
+        this.titleText = undefined;
+        this.tdsListAriaLabel = undefined;
+        this.open = false;
+        this.isMobile = undefined;
     }
     updateIsMobile() {
         this.isMobile = window.innerWidth <= 992;
@@ -74,10 +76,8 @@ export class TdsFooterGroup {
                     "tags": [],
                     "text": "Title text for the link group, only valid on top part of Footer."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "title-text"
+                "attribute": "title-text",
+                "reflect": false
             },
             "tdsListAriaLabel": {
                 "type": "string",
@@ -93,10 +93,8 @@ export class TdsFooterGroup {
                     "tags": [],
                     "text": "Value to be used for the aria-label attribute for the nav element wrapping the list. Should be unique for accessibility."
                 },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "tds-list-aria-label"
+                "attribute": "tds-list-aria-label",
+                "reflect": false
             }
         };
     }