@scania/tegel 1.38.0 → 1.40.0-stencil-core-4.38.1-beta.0

package/dist/collection/components/tooltip/tooltip.js

@@ -5,6 +5,22 @@ import inheritAttributes from "../../utils/inheritAttributes";
  */
 export class TdsTooltip {
     constructor() {
+        /** In case Tooltip contains only text, no HTML, a text can be passed by this prop */
+        this.text = '';
+        /** Decides if the component should be visible from the start. */
+        this.defaultShow = false;
+        /** Allow mouse over Tooltip. Useful when Tooltip contains clickable elements like link or button. */
+        this.mouseOverTooltip = false;
+        /** What triggers the popover to show */
+        this.trigger = 'hover';
+        /** Prop in control of showing and hiding prop. Takes precedence over `defaultOpen` prop. */
+        this.show = null;
+        /** Placement of Tooltip. */
+        this.placement = 'bottom';
+        /** Sets the offset skidding */
+        this.offsetSkidding = 0;
+        /** Sets the offset distance */
+        this.offsetDistance = 8;
         this.popperjsExtraModifiers = [
             {
                 name: 'positionCalc',
@@ -30,17 +46,6 @@ export class TdsTooltip {
             },
         ];
         this.inheritedAttributes = [];
-        this.text = '';
-        this.selector = undefined;
-        this.referenceEl = undefined;
-        this.defaultShow = false;
-        this.mouseOverTooltip = false;
-        this.trigger = 'hover';
-        this.show = null;
-        this.placement = 'bottom';
-        this.offsetSkidding = 0;
-        this.offsetDistance = 8;
-        this.tdsAriaDescribedby = undefined;
     }
     handleKeyDown(event) {
         if (event.key === 'Escape' && this.show) {
@@ -58,7 +63,7 @@ export class TdsTooltip {
     }
     render() {
         var _a;
-        return (h(Host, { key: 'f7cb08fb945145d94c8e839b002c22fc8a579395', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: 'ae724dbc9b49bd881c03c6c970f6bb6a8a77d61e' }, this.inheritedAttributes, { class: {
+        return (h(Host, { key: '69ced518e10ea5d65da8266257d7f7bba5db3f63', role: "tooltip", "aria-describedby": this.tdsAriaDescribedby, "aria-label": this.text }, h("tds-popover-core", Object.assign({ key: '9511b6fb5dcd5a270de5b6f9b50b40271b4f5030' }, this.inheritedAttributes, { class: {
                 'tds-tooltip': true,
                 [`tds-tooltip-${this.border}`]: true,
                 [(_a = this.inheritedAttributes.class) !== null && _a !== void 0 ? _a : '']: true,
@@ -71,7 +76,7 @@ export class TdsTooltip {
             // @ts-ignore
             onInternalTdsClose: () => {
                 this.show = false;
-            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: '5da20b1a16adbba2f8a211d8c1cb4885ae6806f6' }))));
+            }, defaultShow: this.defaultShow }), this.text, h("slot", { key: '8fb6467b2d1fa2ce6a70a171966ff245f8205b55' }))));
     }
     static get is() { return "tds-tooltip"; }
     static get encapsulation() { return "scoped"; }
@@ -101,8 +106,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "In case Tooltip contains only text, no HTML, a text can be passed by this prop"
                 },
-                "attribute": "text",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "text",
                 "defaultValue": "''"
             },
             "selector": {
@@ -119,8 +126,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "The CSS-selector for an element that will trigger the Tooltip"
                 },
-                "attribute": "selector",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "selector"
             },
             "referenceEl": {
                 "type": "unknown",
@@ -140,7 +149,9 @@ export class TdsTooltip {
                 "docs": {
                     "tags": [],
                     "text": "Element that will trigger the Tooltip (takes priority over selector)"
-                }
+                },
+                "getter": false,
+                "setter": false
             },
             "defaultShow": {
                 "type": "boolean",
@@ -156,8 +167,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "Decides if the component should be visible from the start."
                 },
-                "attribute": "default-show",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "default-show",
                 "defaultValue": "false"
             },
             "mouseOverTooltip": {
@@ -174,8 +187,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "Allow mouse over Tooltip. Useful when Tooltip contains clickable elements like link or button."
                 },
-                "attribute": "mouse-over-tooltip",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "mouse-over-tooltip",
                 "defaultValue": "false"
             },
             "trigger": {
@@ -192,8 +207,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "What triggers the popover to show"
                 },
-                "attribute": "trigger",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "trigger",
                 "defaultValue": "'hover'"
             },
             "show": {
@@ -210,8 +227,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "Prop in control of showing and hiding prop. Takes precedence over `defaultOpen` prop."
                 },
-                "attribute": "show",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "show",
                 "defaultValue": "null"
             },
             "placement": {
@@ -234,8 +253,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "Placement of Tooltip."
                 },
-                "attribute": "placement",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "placement",
                 "defaultValue": "'bottom'"
             },
             "offsetSkidding": {
@@ -252,8 +273,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "Sets the offset skidding"
                 },
-                "attribute": "offset-skidding",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "offset-skidding",
                 "defaultValue": "0"
             },
             "offsetDistance": {
@@ -270,8 +293,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "Sets the offset distance"
                 },
-                "attribute": "offset-distance",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "offset-distance",
                 "defaultValue": "8"
             },
             "tdsAriaDescribedby": {
@@ -288,8 +313,10 @@ export class TdsTooltip {
                     "tags": [],
                     "text": "Sets the aria-describedby attribute"
                 },
-                "attribute": "tds-aria-describedby",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "tds-aria-describedby"
             }
         };
     }

package/dist/collection/utils/dom.js

@@ -0,0 +1,7 @@
+export function isTag(el, tagName) {
+    return !!el && el.tagName === tagName.toUpperCase();
+}
+export function closestByTag(start, tagName) {
+    const found = start.closest(tagName);
+    return isTag(found, tagName) ? found : null;
+}

package/dist/collection/utils/getAriaInvalid.js

@@ -0,0 +1,21 @@
+/**
+ * Gets the appropriate aria-invalid value for form components.
+ *
+ * This utility handles cross-framework compatibility by checking for an explicit
+ * aria-invalid attribute on the host element first, then falling back to the
+ * component's state. It properly handles both string and boolean values that
+ * may be passed from different frameworks (especially React).
+ *
+ * @param host - The host element to check for aria-invalid attribute
+ * @param state - The component's state ('error', 'success', 'default')
+ * @returns The aria-invalid value as a string ('true' or 'false')
+ *
+ */
+export const getAriaInvalid = (host, state) => {
+    const hostAriaInvalid = host.getAttribute('aria-invalid');
+    if (hostAriaInvalid !== null) {
+        return String(hostAriaInvalid);
+    }
+    // Fallback to state-based aria-invalid
+    return state === 'error' ? 'true' : 'false';
+};