@scania/tegel 1.25.0-tooltip-beta.0 → 1.26.0-onTdsChange-gets-triggered-unexpectedly-beta.0

package/dist/types/components/tabs/navigation-tabs/navigation-tab/navigation-tab.d.ts

@@ -2,10 +2,12 @@
  * @slot <default> - <b>Unnamed slot.</b> For the tab link or button.
  */
 export declare class TdsNavigationTab {
+    host: HTMLElement;
     /** Disables the Tab. */
     disabled: boolean;
     selected: boolean;
     /** @internal Method to set the Tab as selected. Used by the <tds-navigation-tabs> */
     setSelected(selected: boolean): Promise<void>;
+    connectedCallback(): void;
     render(): any;
 }

package/dist/types/components/tabs/navigation-tabs/navigation-tabs.d.ts

@@ -13,6 +13,10 @@ export declare class TdsNavigationTabs {
     selectedIndex: number;
     /** Custom left padding value for the wrapper element. */
     leftPadding: number;
+    /** Defines aria-label on left scroll button */
+    tdsScrollLeftAriaLabel: string;
+    /** Defines aria-label on right scroll button */
+    tdsScrollRightAriaLabel: string;
     showLeftScroll: boolean;
     showRightScroll: boolean;
     private navWrapperElement;

package/dist/types/components.d.ts

@@ -11,14 +11,12 @@ import { CollapseEvent, InternalTdsSideMenuPropChange } from "./components/side-
 import { CollapseEvent as CollapseEvent1 } from "./components/side-menu/side-menu";
 import { InternalTdsStepperPropChange } from "./components/stepper/stepper";
 import { InternalTdsTablePropChange } from "./components/table/table/table";
-import { Placement as Placement1 } from "./types/Tooltip";
 export { IconNames } from "./types/Icons";
 export { Placement } from "@popperjs/core";
 export { CollapseEvent, InternalTdsSideMenuPropChange } from "./components/side-menu/side-menu";
 export { CollapseEvent as CollapseEvent1 } from "./components/side-menu/side-menu";
 export { InternalTdsStepperPropChange } from "./components/stepper/stepper";
 export { InternalTdsTablePropChange } from "./components/table/table/table";
-export { Placement as Placement1 } from "./types/Tooltip";
 export namespace Components {
     interface TdsAccordion {
         /**
@@ -270,6 +268,14 @@ export namespace Components {
           * Make the Checkbox required
          */
         "required": boolean;
+        /**
+          * Value to be used for the aria-describedby attribute
+         */
+        "tdsAriaDescribedby": string;
+        /**
+          * Value to be used for the aria-label attribute
+         */
+        "tdsAriaLabel": string;
         /**
           * Toggles the checked value of the component.
          */
@@ -300,6 +306,10 @@ export namespace Components {
           * Size of the Chip component
          */
         "size": 'sm' | 'lg';
+        /**
+          * Value to be used for the aria-label attribute
+         */
+        "tdsAriaLabel": string;
         /**
           * Type of Chip, depends on usage
          */
@@ -505,6 +515,14 @@ export namespace Components {
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
          */
         "selectedIndex": number;
+        /**
+          * Defines aria-label on left scroll button
+         */
+        "tdsScrollLeftAriaLabel": string;
+        /**
+          * Defines aria-label on right scroll button
+         */
+        "tdsScrollRightAriaLabel": string;
     }
     interface TdsFooter {
         /**
@@ -682,6 +700,14 @@ export namespace Components {
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
          */
         "selectedIndex": number;
+        /**
+          * Defines aria-label on left scroll button
+         */
+        "tdsScrollLeftAriaLabel": string;
+        /**
+          * Defines aria-label on right scroll button
+         */
+        "tdsScrollRightAriaLabel": string;
     }
     interface TdsLink {
         /**
@@ -801,6 +827,14 @@ export namespace Components {
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
          */
         "selectedIndex": number;
+        /**
+          * Defines aria-label on left scroll button
+         */
+        "tdsScrollLeftAriaLabel": string;
+        /**
+          * Defines aria-label on right scroll button
+         */
+        "tdsScrollRightAriaLabel": string;
     }
     interface TdsPopoverCanvas {
         /**
@@ -1591,18 +1625,6 @@ export namespace Components {
          */
         "trigger": 'click' | 'hover';
     }
-    interface TdsTooltipBeta {
-        "defaultShow": boolean;
-        "mouseOverTooltip": boolean;
-        "offsetDistance": number;
-        "offsetSkidding": number;
-        "placement": Placement1;
-        "referenceEl"?: HTMLElement | null;
-        "selector": string;
-        "show": boolean;
-        "text": string;
-        "trigger": 'click' | 'hover';
-    }
 }
 export interface TdsAccordionItemCustomEvent<T> extends CustomEvent<T> {
     detail: T;
@@ -2643,12 +2665,6 @@ declare global {
         prototype: HTMLTdsTooltipElement;
         new (): HTMLTdsTooltipElement;
     };
-    interface HTMLTdsTooltipBetaElement extends Components.TdsTooltipBeta, HTMLStencilElement {
-    }
-    var HTMLTdsTooltipBetaElement: {
-        prototype: HTMLTdsTooltipBetaElement;
-        new (): HTMLTdsTooltipBetaElement;
-    };
     interface HTMLElementTagNameMap {
         "tds-accordion": HTMLTdsAccordionElement;
         "tds-accordion-item": HTMLTdsAccordionItemElement;
@@ -2732,7 +2748,6 @@ declare global {
         "tds-toast": HTMLTdsToastElement;
         "tds-toggle": HTMLTdsToggleElement;
         "tds-tooltip": HTMLTdsTooltipElement;
-        "tds-tooltip-beta": HTMLTdsTooltipBetaElement;
     }
 }
 declare namespace LocalJSX {
@@ -3009,6 +3024,14 @@ declare namespace LocalJSX {
           * Make the Checkbox required
          */
         "required"?: boolean;
+        /**
+          * Value to be used for the aria-describedby attribute
+         */
+        "tdsAriaDescribedby"?: string;
+        /**
+          * Value to be used for the aria-label attribute
+         */
+        "tdsAriaLabel"?: string;
         /**
           * Value for the Checkbox
          */
@@ -3049,6 +3072,10 @@ declare namespace LocalJSX {
           * Size of the Chip component
          */
         "size"?: 'sm' | 'lg';
+        /**
+          * Value to be used for the aria-label attribute
+         */
+        "tdsAriaLabel"?: string;
         /**
           * Type of Chip, depends on usage
          */
@@ -3276,6 +3303,14 @@ declare namespace LocalJSX {
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
          */
         "selectedIndex"?: number;
+        /**
+          * Defines aria-label on left scroll button
+         */
+        "tdsScrollLeftAriaLabel"?: string;
+        /**
+          * Defines aria-label on right scroll button
+         */
+        "tdsScrollRightAriaLabel"?: string;
     }
     interface TdsFooter {
         /**
@@ -3458,6 +3493,14 @@ declare namespace LocalJSX {
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
          */
         "selectedIndex"?: number;
+        /**
+          * Defines aria-label on left scroll button
+         */
+        "tdsScrollLeftAriaLabel"?: string;
+        /**
+          * Defines aria-label on right scroll button
+         */
+        "tdsScrollRightAriaLabel"?: string;
     }
     interface TdsLink {
         /**
@@ -3562,6 +3605,14 @@ declare namespace LocalJSX {
           * Sets the selected Tab. If this is set, all Tab changes need to be handled by the user.
          */
         "selectedIndex"?: number;
+        /**
+          * Defines aria-label on left scroll button
+         */
+        "tdsScrollLeftAriaLabel"?: string;
+        /**
+          * Defines aria-label on right scroll button
+         */
+        "tdsScrollRightAriaLabel"?: string;
     }
     interface TdsPopoverCanvas {
         /**
@@ -4427,18 +4478,6 @@ declare namespace LocalJSX {
          */
         "trigger"?: 'click' | 'hover';
     }
-    interface TdsTooltipBeta {
-        "defaultShow"?: boolean;
-        "mouseOverTooltip"?: boolean;
-        "offsetDistance"?: number;
-        "offsetSkidding"?: number;
-        "placement"?: Placement1;
-        "referenceEl"?: HTMLElement | null;
-        "selector"?: string;
-        "show"?: boolean;
-        "text"?: string;
-        "trigger"?: 'click' | 'hover';
-    }
     interface IntrinsicElements {
         "tds-accordion": TdsAccordion;
         "tds-accordion-item": TdsAccordionItem;
@@ -4522,7 +4561,6 @@ declare namespace LocalJSX {
         "tds-toast": TdsToast;
         "tds-toggle": TdsToggle;
         "tds-tooltip": TdsTooltip;
-        "tds-tooltip-beta": TdsTooltipBeta;
     }
 }
 export { LocalJSX as JSX };
@@ -4616,7 +4654,6 @@ declare module "@stencil/core" {
             "tds-toast": LocalJSX.TdsToast & JSXBase.HTMLAttributes<HTMLTdsToastElement>;
             "tds-toggle": LocalJSX.TdsToggle & JSXBase.HTMLAttributes<HTMLTdsToggleElement>;
             "tds-tooltip": LocalJSX.TdsTooltip & JSXBase.HTMLAttributes<HTMLTdsTooltipElement>;
-            "tds-tooltip-beta": LocalJSX.TdsTooltipBeta & JSXBase.HTMLAttributes<HTMLTdsTooltipBetaElement>;
         }
     }
 }

package/dist/types/types/Icons.d.ts

@@ -1 +1 @@
-export type IconNames = '24v_battery_inactive' | '24v_battery' | 'arrow_diagonal' | 'arrow_down' | 'arrow_left' | 'arrow_right' | 'arrow_up' | 'audio_inactive' | 'back' | 'backward_inactive' | 'backward' | 'bento' | 'burger' | 'calendar_inactive' | 'calendar' | 'card' | 'cart' | 'charging_speed_inactive' | 'charging_speed' | 'charging_stopped' | 'chevron_down' | 'chevron_left' | 'chevron_right' | 'chevron_up' | 'clock_inactive' | 'clock' | 'contact_inactive' | 'contact' | 'copy' | 'cross' | 'dashboard' | 'document_check' | 'document_doc' | 'document_eye' | 'document_pdf' | 'document_ppt' | 'document_tool' | 'document_wrong' | 'document_xls' | 'document' | 'dollar' | 'doner' | 'double_kebab' | 'download' | 'edit_inactive' | 'edit' | 'email' | 'error' | 'expand' | 'export_inactive' | 'export' | 'eye_inactive' | 'eye' | 'face_dissatisfied' | 'face_neutral' | 'face_satisfied' | 'filters_inactive' | 'filters' | 'flash' | 'folder' | 'forward_inactive' | 'fuel_gauge_inactive' | 'fuel_gauge' | 'global' | 'hatch_open_inactive' | 'heart_inactive' | 'heart' | 'heating_inactive_screen' | 'history_inactive' | 'history' | 'home_inactive' | 'home' | 'image_add' | 'image_inactive' | 'image_set' | 'image' | 'info' | 'insights' | 'kebab' | 'link_broken' | 'link' | 'lock_inactive' | 'lock' | 'maximize_fullscreen' | 'meatballs' | 'message_inactive' | 'message' | 'mileage_inactive' | 'mileage' | 'minimize_fullscreen' | 'minus' | 'notification_inactive' | 'notification' | 'pause_inactive' | 'pause' | 'phone_inactive' | 'phone' | 'pie_chart' | 'pin_inactive' | 'pin' | 'plus' | 'print_inactive' | 'print' | 'profile_inactive' | 'profile' | 'proportions_inactive' | 'proportions' | 'range_inactive' | 'range' | 'redirect' | 'refresh_inactive' | 'refresh' | 'reload_inactive' | 'reload' | 'report_inactive' | 'report' | 'save_inactive' | 'save' | 'search' | 'send_inactive' | 'send' | 'settings' | 'share' | 'skip_backwards' | 'skip_forward' | 'smartphone_inactive' | 'smartphone' | 'sorting' | 'speedometer_inactive' | 'speedometer' | 'star' | 'support' | 'target_inactive' | 'target' | 'text_inactive' | 'tick' | 'timer' | 'tool_inactive' | 'tool' | 'trailer' | 'trash_inactive' | 'trash' | 'truck' | 'upload' | 'wallet' | 'warning' | 'wifi_inactive' | 'wifi';
+export type IconNames = '24v_battery_inactive' | '24v_battery' | 'acceleration_inactive' | 'acceleration' | 'adblue_inactive' | 'adblue' | 'arrow_diagonal' | 'arrow_down' | 'arrow_left' | 'arrow_right' | 'arrow_up' | 'audio_inactive' | 'audio' | 'award' | 'back' | 'backward_inactive' | 'backward' | 'bento' | 'bug_inactive' | 'bug' | 'burger' | 'bus_inactive' | 'bus' | 'calendar_inactive' | 'calendar' | 'camera_inactive' | 'camera' | 'card' | 'cart' | 'charging_complete' | 'charging_failed' | 'charging_speed_inactive' | 'charging_speed' | 'charging_stopped' | 'chevron_down' | 'chevron_left' | 'chevron_right' | 'chevron_up' | 'clock_inactive' | 'clock' | 'contact_inactive' | 'contact' | 'cookie_inactive' | 'cookie' | 'coolant_level_inactive' | 'coolant_level' | 'copy' | 'cross' | 'cup_inactive' | 'cup' | 'dashboard' | 'department_inactive' | 'department' | 'departure_scheduling_inactive' | 'departure_scheduling' | 'diamond_inactive' | 'diamond' | 'document_check' | 'document_doc' | 'document_eye' | 'document_pdf' | 'document_plus_inactive' | 'document_plus' | 'document_ppt' | 'document_tool' | 'document_wrong' | 'document_xls' | 'document' | 'dollar' | 'doner' | 'double_kebab' | 'download' | 'driving_licence_inactive' | 'driving_licence' | 'drop_inactive' | 'drop' | 'edit_inactive' | 'edit' | 'email' | 'engine_inactive' | 'engine' | 'environment_inactive' | 'environment' | 'error' | 'exit' | 'expand_inactive' | 'expand' | 'export_inactive' | 'export' | 'eye_inactive' | 'eye' | 'face_dissatisfied' | 'face_neutral' | 'face_satisfied' | 'factory_inactive' | 'factory' | 'ferry_inactive' | 'ferry' | 'filters_inactive' | 'filters' | 'flash_inactive' | 'flash' | 'folder' | 'forward_inactive' | 'forward' | 'fuel_gauge_inactive' | 'fuel_gauge' | 'fuel_inactive' | 'fuel' | 'gift inactive' | 'gift' | 'global' | 'guided_tour_inactive' | 'guided_tour' | 'hatch_open_1' | 'hatch_open_2' | 'hatch_open_inactive' | 'hatch_open' | 'heart_inactive' | 'heart' | 'heating_inactive_screen' | 'history_inactive' | 'history' | 'home_inactive' | 'home' | 'idea_inactive' | 'idea' | 'image_add' | 'image_inactive' | 'image_set' | 'image' | 'info' | 'insights' | 'kebab' | 'key_inactive' | 'key' | 'layer_inactive' | 'layer' | 'link_broken' | 'link' | 'list_inactive' | 'list' | 'lock_inactive' | 'lock' | 'map_cursor_inactive' | 'map_cursor' | 'maximize_fullscreen' | 'meatballs' | 'merge_inactive' | 'merge' | 'message_inactive' | 'message' | 'mileage_inactive' | 'mileage' | 'minimize_fullscreen' | 'minus' | 'navigate_inactive' | 'navigate' | 'notification_inactive' | 'notification' | 'oil_level_inactive' | 'oil_level' | 'pause_inactive' | 'pause' | 'phone_inactive' | 'phone' | 'pie_chart' | 'pin_inactive' | 'pin' | 'placeholder' | 'play_inactive' | 'play' | 'plus' | 'powerplug_inactive' | 'powerplug' | 'print_inactive' | 'print' | 'privacy_inactive' | 'privacy' | 'profile_inactive' | 'profile' | 'proportions_inactive' | 'proportions' | 'range_inactive' | 'range' | 'redirect' | 'refresh_inactive' | 'refresh' | 'reload_inactive' | 'reload' | 'repeat' | 'report_inactive' | 'report' | 'route_inactive' | 'route' | 'save_inactive' | 'save' | 'search' | 'send_inactive' | 'send' | 'settings' | 'share' | 'skip_backwards' | 'skip_forward' | 'smartphone_inactive' | 'smartphone' | 'sorting' | 'speedometer_inactive' | 'speedometer' | 'star' | 'support' | 'target_inactive' | 'target' | 'temperature_inactive' | 'temperature' | 'text_inactive' | 'text' | 'thumbs_down' | 'thumbs_up' | 'tick' | 'timer' | 'tool_inactive' | 'tool' | 'trailer_inactive' | 'trailer' | 'trash_inactive' | 'trash' | 'truck_inactive' | 'truck' | 'undo_inactive' | 'undo' | 'unlock' | 'upload' | 'video_inactive' | 'video' | 'wallet' | 'warning' | 'weight_inactive' | 'weight' | 'wifi_inactive' | 'wifi' | 'windscreen_heating_inactive' | 'windscreen_heating';

package/dist/types/utils/axeHelpers.d.ts

@@ -1,2 +1 @@
-import type { Page } from '@playwright/test';
-export declare const tegelAnalyze: (page: Page) => Promise<import("axe-core").AxeResults>;
+export declare const tegelAnalyze: (page: any) => Promise<import("axe-core").AxeResults>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scania/tegel",
-  "version": "1.25.0-tooltip-beta.0",
+  "version": "1.26.0-onTdsChange-gets-triggered-unexpectedly-beta.0",
   "description": "Tegel Design System",
   "type": "module",
   "keywords": [

package/dist/cjs/tds-tooltip-beta.cjs.entry.js

@@ -1,123 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-ca8040ad.js');
-
-const tooltipBetaCss = ".sc-tds-tooltip-beta-h{position:absolute}.tds-tooltip.sc-tds-tooltip-beta{box-sizing:border-box;font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-tooltip-color);background-color:var(--tds-tooltip-background);border-radius:4px;padding:8px;word-wrap:break-word;white-space:normal;max-width:192px;z-index:900;opacity:0;visibility:hidden;transition:opacity 200ms ease-in, visibility 200ms ease-in}.tds-tooltip.sc-tds-tooltip-beta *.sc-tds-tooltip-beta{box-sizing:border-box}.tds-tooltip.tds-tooltip-top-left.sc-tds-tooltip-beta{border-radius:0 4px 4px}.tds-tooltip.tds-tooltip-top-right.sc-tds-tooltip-beta{border-radius:4px 0 4px 4px}.tds-tooltip.tds-tooltip-bottom-right.sc-tds-tooltip-beta{border-radius:4px 4px 0}.tds-tooltip.tds-tooltip-bottom-left.sc-tds-tooltip-beta{border-radius:4px 4px 4px 0}.tds-tooltip-show.sc-tds-tooltip-beta{opacity:1;visibility:visible}";
-const TdsTooltipBetaStyle0 = tooltipBetaCss;
-
-const TdsTooltipBeta = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.debounce = (func, delay) => (...args) => {
-            let debounceTimer;
-            clearTimeout(debounceTimer);
-            debounceTimer = setTimeout(() => func.apply(this, args), delay);
-        };
-        this.showTooltip = this.debounce(() => {
-            this.isVisible = true;
-            this.updateTooltipPosition();
-        }, 100);
-        this.hideTooltip = this.debounce(() => {
-            this.isVisible = false;
-        }, 100);
-        this.toggleTooltip = () => {
-            this.isVisible = !this.isVisible;
-            this.updateTooltipPosition();
-        };
-        this.setTooltipRef = (element) => {
-            this.tooltipEl = element;
-        };
-        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.isVisible = this.defaultShow;
-    }
-    componentDidLoad() {
-        if (!this.referenceEl && this.selector) {
-            this.referenceEl = document.querySelector(this.selector);
-        }
-        if (this.referenceEl) {
-            this.bindEvents();
-        }
-    }
-    connectedCallback() {
-        this.resizeObserver = new ResizeObserver(() => this.updateTooltipPosition());
-        if (this.referenceEl) {
-            this.resizeObserver.observe(this.referenceEl);
-        }
-        window.addEventListener('resize', this.updateTooltipPosition);
-    }
-    disconnectedCallback() {
-        this.resizeObserver.disconnect();
-        window.removeEventListener('resize', this.updateTooltipPosition);
-    }
-    bindEvents() {
-        var _a, _b;
-        if (this.trigger === 'hover') {
-            this.referenceEl.addEventListener('mouseenter', this.showTooltip);
-            this.referenceEl.addEventListener('mouseleave', this.hideTooltip);
-            if (this.mouseOverTooltip) {
-                (_a = this.tooltipEl) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseenter', this.showTooltip);
-                (_b = this.tooltipEl) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseleave', this.hideTooltip);
-            }
-        }
-        else if (this.trigger === 'click') {
-            this.referenceEl.addEventListener('click', this.toggleTooltip);
-        }
-    }
-    updateTooltipPosition() {
-        if (!this.tooltipEl || !this.referenceEl)
-            return;
-        requestAnimationFrame(() => {
-            const rect = this.referenceEl.getBoundingClientRect();
-            const { height, width, bottom } = rect;
-            let { top, left } = rect;
-            switch (this.placement) {
-                case 'top':
-                    top -= this.tooltipEl.offsetHeight + this.offsetDistance;
-                    left += width / 2 - this.tooltipEl.offsetWidth / 2;
-                    break;
-                case 'bottom':
-                    top += height + this.offsetDistance;
-                    left += width / 2 - this.tooltipEl.offsetWidth / 2;
-                    break;
-                case 'left':
-                    top += height / 2 - this.tooltipEl.offsetHeight / 2;
-                    left -= this.tooltipEl.offsetWidth + this.offsetDistance;
-                    break;
-                case 'right':
-                    top += height / 2 - this.tooltipEl.offsetHeight / 2;
-                    left += width + this.offsetDistance;
-                    break;
-                // Handle more complex placements like 'top-start', 'bottom-end', etc.
-                default:
-                    top = bottom + this.offsetDistance;
-                    left = left + width / 2 - this.tooltipEl.offsetWidth / 2;
-                    break;
-            }
-            // Additional offsets
-            left += this.offsetSkidding;
-            this.tooltipEl.style.top = `${top}px`;
-            this.tooltipEl.style.left = `${left}px`;
-        });
-    }
-    render() {
-        return (index.h(index.Host, { key: 'ccab2630363c007e8d4719d22ab140e80547251b' }, index.h("div", { key: '3c64224e0620e60f42089205e3ca8d0766df90cc', class: {
-                'tds-tooltip': true,
-                'tds-tooltip-show': this.isVisible,
-            }, ref: this.setTooltipRef }, this.text, index.h("slot", { key: '4674e18dbf5bfe563ca3c01757280ccd660c5049' }))));
-    }
-    get host() { return index.getElement(this); }
-};
-TdsTooltipBeta.style = TdsTooltipBetaStyle0;
-
-exports.tds_tooltip_beta = TdsTooltipBeta;

package/dist/collection/components/tooltip-beta/tooltip-beta.css

@@ -1,40 +0,0 @@
-:host {
-  position: absolute;
-}
-
-.tds-tooltip {
-  box-sizing: border-box;
-  font: var(--tds-detail-05);
-  letter-spacing: var(--tds-detail-05-ls);
-  color: var(--tds-tooltip-color);
-  background-color: var(--tds-tooltip-background);
-  border-radius: 4px;
-  padding: 8px;
-  word-wrap: break-word;
-  white-space: normal;
-  max-width: 192px;
-  z-index: 900;
-  opacity: 0;
-  visibility: hidden;
-  transition: opacity 200ms ease-in, visibility 200ms ease-in;
-}
-.tds-tooltip * {
-  box-sizing: border-box;
-}
-.tds-tooltip.tds-tooltip-top-left {
-  border-radius: 0 4px 4px;
-}
-.tds-tooltip.tds-tooltip-top-right {
-  border-radius: 4px 0 4px 4px;
-}
-.tds-tooltip.tds-tooltip-bottom-right {
-  border-radius: 4px 4px 0;
-}
-.tds-tooltip.tds-tooltip-bottom-left {
-  border-radius: 4px 4px 4px 0;
-}
-
-.tds-tooltip-show {
-  opacity: 1;
-  visibility: visible;
-}