@scania/tegel 1.47.2 → 1.48.0-beta.globals-test

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

@@ -2,6 +2,32 @@ 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 = '';
+        /** Listen to the focus state of the input */
+        this.focusInput = false;
         this.getDefaultValue = () => {
             const dateTimeObj = {
                 year: this.defaultValue.slice(0, 4),
@@ -26,23 +52,6 @@ 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 = false;
     }
     /** Method that resets the value of the Datetime, using defaultValue if is not 'none' */
     async reset() {
@@ -166,8 +175,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Sets an input type"
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "type",
                 "defaultValue": "'datetime-local'"
             },
             "value": {
@@ -184,8 +195,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Value of the input text"
                 },
-                "attribute": "value",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "value",
                 "defaultValue": "''"
             },
             "min": {
@@ -202,8 +215,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Sets min value. Example for different types: datetime=\"2023-01-31T00:00\" date=\"2023-01-01\" time=\"15:00\""
                 },
-                "attribute": "min",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "min"
             },
             "max": {
                 "type": "string",
@@ -219,8 +234,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Sets max value. Example for different types: datetime=\"2023-01-31T00:00\" date=\"2023-01-01\" time=\"15:00\""
                 },
-                "attribute": "max",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "max"
             },
             "defaultValue": {
                 "type": "string",
@@ -236,8 +253,10 @@ 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"
                 },
-                "attribute": "default-value",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "default-value",
                 "defaultValue": "'none'"
             },
             "disabled": {
@@ -254,8 +273,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Set input in disabled state"
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "size": {
@@ -272,8 +293,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Size of the input"
                 },
-                "attribute": "size",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "size",
                 "defaultValue": "'lg'"
             },
             "noMinWidth": {
@@ -290,8 +313,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Resets min width rule"
                 },
-                "attribute": "no-min-width",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "no-min-width",
                 "defaultValue": "false"
             },
             "modeVariant": {
@@ -308,8 +333,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Set the variant of the Datetime component."
                 },
-                "attribute": "mode-variant",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "mode-variant",
                 "defaultValue": "null"
             },
             "name": {
@@ -326,8 +353,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Name property. Uses a unique ID as fallback if not specified."
                 },
-                "attribute": "name",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "name",
                 "defaultValue": "`datetime-${generateUniqueId()}`"
             },
             "state": {
@@ -344,8 +373,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Error state of input"
                 },
-                "attribute": "state",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "state"
             },
             "autofocus": {
                 "type": "boolean",
@@ -361,8 +392,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Autofocus for input"
                 },
-                "attribute": "autofocus",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "autofocus",
                 "defaultValue": "false"
             },
             "label": {
@@ -379,8 +412,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Label text for the component"
                 },
-                "attribute": "label",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "label",
                 "defaultValue": "''"
             },
             "labelPosition": {
@@ -397,8 +432,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Position of the label"
                 },
-                "attribute": "label-position",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "label-position",
                 "defaultValue": "'no-label'"
             },
             "helper": {
@@ -415,8 +452,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Helper text for the component"
                 },
-                "attribute": "helper",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "helper",
                 "defaultValue": "''"
             },
             "tdsAriaLabel": {
@@ -433,8 +472,10 @@ export class TdsDatetime {
                     "tags": [],
                     "text": "Value for the aria-label attribute"
                 },
-                "attribute": "tds-aria-label",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "tds-aria-label"
             }
         };
     }

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

@@ -1,7 +1,9 @@
 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() {
@@ -44,8 +46,10 @@ export class Divider {
                     "tags": [],
                     "text": "Orientation of the Divider, horizontal if not specified."
                 },
-                "attribute": "orientation",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "orientation",
                 "defaultValue": "'horizontal'"
             },
             "variant": {
@@ -62,8 +66,10 @@ export class Divider {
                     "tags": [],
                     "text": "Variant of the Divider, subtle if not specified."
                 },
-                "attribute": "variant",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "variant",
                 "defaultValue": "'subtle'"
             }
         };

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

@@ -5,7 +5,14 @@ import { convertToString } from "../../../utils/convertToString";
  */
 export class TdsDropdownOption {
     constructor() {
-        this.parentElement = null;
+        /** Internal value storage that's always a string */
+        this.internalValue = '';
+        /** Sets the option as disabled. */
+        this.disabled = false;
+        this.selected = false;
+        this.multiselect = false;
+        this.size = 'lg';
+        this.parentDropdown = null;
         // @ts-expect-error - label property is used internally for text content tracking
         // eslint-disable-next-line no-unused-vars,
         this.label = '';
@@ -14,13 +21,13 @@ export class TdsDropdownOption {
             if (!this.host.parentElement) {
                 return;
             }
-            this.parentElement =
+            this.parentDropdown =
                 ((_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.tagName) === 'TDS-DROPDOWN'
                     ? this.host.parentElement
                     : this.host.getRootNode().host;
-            if (this.parentElement) {
-                this.multiselect = (_b = this.parentElement.multiselect) !== null && _b !== void 0 ? _b : false;
-                this.size = this.parentElement.size || 'lg';
+            if (this.parentDropdown) {
+                this.multiselect = (_b = this.parentDropdown.multiselect) !== null && _b !== void 0 ? _b : false;
+                this.size = this.parentDropdown.size || 'lg';
             }
             this.label = ((_c = this.host.textContent) === null || _c === void 0 ? void 0 : _c.trim()) || '';
         };
@@ -28,8 +35,8 @@ export class TdsDropdownOption {
             var _a, _b;
             if (!this.disabled) {
                 this.selected = true;
-                (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.appendValue(this.internalValue);
-                (_b = this.parentElement) === null || _b === void 0 ? void 0 : _b.close();
+                (_a = this.parentDropdown) === null || _a === void 0 ? void 0 : _a.appendValue(this.internalValue);
+                (_b = this.parentDropdown) === null || _b === void 0 ? void 0 : _b.close();
                 this.tdsSelect.emit({
                     value: this.internalValue,
                     selected: this.selected,
@@ -40,7 +47,7 @@ export class TdsDropdownOption {
             var _a, _b;
             if (!this.disabled) {
                 if (event.detail.checked) {
-                    (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.appendValue(this.internalValue);
+                    (_a = this.parentDropdown) === null || _a === void 0 ? void 0 : _a.appendValue(this.internalValue);
                     this.selected = true;
                     this.tdsSelect.emit({
                         value: this.internalValue,
@@ -48,7 +55,7 @@ export class TdsDropdownOption {
                     });
                 }
                 else {
-                    (_b = this.parentElement) === null || _b === void 0 ? void 0 : _b.removeValue(this.internalValue);
+                    (_b = this.parentDropdown) === null || _b === void 0 ? void 0 : _b.removeValue(this.internalValue);
                     this.selected = false;
                     this.tdsSelect.emit({
                         value: this.internalValue,
@@ -61,24 +68,17 @@ export class TdsDropdownOption {
         this.handleFocus = (event) => {
             // Focus events are now handled by the parent dropdown component
             // Only emit if this is a standalone option (not within a dropdown)
-            if (!this.parentElement) {
+            if (!this.parentDropdown) {
                 this.tdsFocus.emit(event);
             }
         };
         this.handleBlur = (event) => {
             // Blur events are now handled by the parent dropdown component
             // Only emit if this is a standalone option (not within a dropdown)
-            if (!this.parentElement) {
+            if (!this.parentDropdown) {
                 this.tdsBlur.emit(event);
             }
         };
-        this.value = undefined;
-        this.internalValue = '';
-        this.disabled = false;
-        this.tdsAriaLabel = undefined;
-        this.selected = false;
-        this.multiselect = false;
-        this.size = 'lg';
     }
     /** Method to select/deselect an option. */
     async setSelected(selected) {
@@ -91,14 +91,14 @@ export class TdsDropdownOption {
         this.internalValue = convertToString(this.value);
     }
     render() {
-        return (h(Host, { key: '5276b572424933484ff6d923e5210dcd647b9554' }, h("div", { key: '5eea7afac6ba6c1badfbc8ccf1f53ceb24df567d', class: `dropdown-option
+        return (h(Host, { key: '86c25479c6637ede6c666d71de99a0454c3898f6' }, h("div", { key: 'c50a83c098aea9ac99fb5797d246335836daef80', class: `dropdown-option
           ${this.size}
           ${this.selected ? 'selected' : ''}
           ${this.disabled ? 'disabled' : ''}
           ` }, this.multiselect ? (h("div", { class: "multiselect", onKeyDown: (event) => {
                 var _a;
                 if (event.key === 'Escape') {
-                    (_a = this.parentElement) === null || _a === void 0 ? void 0 : _a.close();
+                    (_a = this.parentDropdown) === null || _a === void 0 ? void 0 : _a.close();
                 }
             } }, h("tds-checkbox", { onTdsChange: (event) => {
                 this.handleMultiselect(event);
@@ -139,8 +139,10 @@ export class TdsDropdownOption {
                     "tags": [],
                     "text": "Value of the dropdown option"
                 },
-                "attribute": "value",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "value"
             },
             "disabled": {
                 "type": "boolean",
@@ -156,8 +158,10 @@ export class TdsDropdownOption {
                     "tags": [],
                     "text": "Sets the option as disabled."
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "tdsAriaLabel": {
@@ -174,8 +178,10 @@ export class TdsDropdownOption {
                     "tags": [],
                     "text": "Defines aria-label attribute for the option"
                 },
-                "attribute": "tds-aria-label",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "tds-aria-label"
             }
         };
     }