Remove with Text

Remove GetEngineeringSpcReview
Better error message
EnforceCodeStyleInBuild
NginxFileSystem
Remove Reactors and Working Directory
AppSettings
Delete self contained Thunder Tests
Back to .net8.0
api/v4/InfinityQS
ApiExplorerSettings
Wafer Counter

Server/wwwroot/package/dist/collection/components/tooltip/tooltip.css

@@ -0,0 +1,153 @@
+:root {
+  --ifx-font-family: "Source Sans 3";
+  font-family: var(--ifx-font-family, sans-serif);
+}
+
+:host {
+  display: inline-flex;
+}
+
+.tooltip__container {
+  display: inline-flex;
+  flex-direction: column;
+  position: relative;
+  font-family: var(--ifx-font-family);
+}
+
+.tooltip-extended, .tooltip-compact, .tooltip-dismissible {
+  background-color: #1D1D1D;
+  border: 1px solid black;
+  z-index: 1080;
+  display: none;
+  transition: opacity 0.3s;
+  position: relative;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 20px;
+  color: #FFFFFF;
+}
+.visible.tooltip-extended, .visible.tooltip-compact, .visible.tooltip-dismissible {
+  display: flex !important;
+  align-items: center;
+}
+
+.tooltip-dismissible {
+  min-width: 110px;
+  width: auto;
+}
+.tooltip-dismissible .close-button {
+  cursor: pointer;
+  position: relative;
+  top: 0px;
+  order: 2;
+  padding-right: 12px;
+}
+.tooltip-dismissible .tooltip-dismissible-content {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  padding: 12px;
+  flex-grow: 1;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  overflow-wrap: anywhere;
+}
+.tooltip-dismissible .tooltip-dismissible-header,
+.tooltip-dismissible .tooltip-dismissible-body {
+  font-size: 14px;
+  font-style: normal;
+  line-height: 20px;
+}
+.tooltip-dismissible .tooltip-dismissible-header {
+  font-weight: 600;
+}
+.tooltip-dismissible .tooltip-dismissible-body {
+  font-weight: 400;
+}
+
+.tooltip-compact {
+  padding: 4px 8px;
+  text-align: center;
+  flex-grow: 1;
+}
+
+.tooltip-extended {
+  min-width: 100px;
+  width: auto;
+  align-items: center;
+  padding: 12px;
+  gap: 10px;
+}
+.tooltip-extended .extended_icon {
+  display: flex;
+  align-self: flex-start;
+  align-items: center;
+  cursor: pointer;
+}
+.tooltip-extended .tooltip-extended-content {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  flex-grow: 1;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  overflow-wrap: anywhere;
+}
+.tooltip-extended .tooltip-extended-header,
+.tooltip-extended .tooltip-extended-body {
+  font-size: 14px;
+  font-style: normal;
+  line-height: 20px;
+}
+.tooltip-extended .tooltip-extended-header {
+  font-weight: 600;
+}
+.tooltip-extended .tooltip-extended-body {
+  font-weight: 400;
+}
+
+.tooltip__container .tooltip-arrow-svg {
+  position: absolute;
+  width: 8px;
+  height: 8px;
+}
+
+[data-placement=top].tooltip-extended > .tooltip-arrow-svg, [data-placement=top].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=top].tooltip-compact > .tooltip-arrow-svg {
+  bottom: -8px;
+  left: 50%;
+  transform: rotate(180deg) translateX(-50%);
+}
+[data-placement=top-start].tooltip-extended > .tooltip-arrow-svg, [data-placement=top-start].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=top-start].tooltip-compact > .tooltip-arrow-svg {
+  bottom: -8px;
+  left: 10px;
+  transform: rotate(180deg);
+}
+[data-placement=top-end].tooltip-extended > .tooltip-arrow-svg, [data-placement=top-end].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=top-end].tooltip-compact > .tooltip-arrow-svg {
+  bottom: -8px;
+  right: 10px;
+  transform: rotate(180deg);
+}
+[data-placement=bottom].tooltip-extended > .tooltip-arrow-svg, [data-placement=bottom].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=bottom].tooltip-compact > .tooltip-arrow-svg {
+  top: -8px;
+  left: 50%;
+  transform: translateX(-50%);
+}
+[data-placement=bottom-start].tooltip-extended > .tooltip-arrow-svg, [data-placement=bottom-start].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=bottom-start].tooltip-compact > .tooltip-arrow-svg {
+  top: -8px;
+  left: 10px;
+}
+[data-placement=bottom-end].tooltip-extended > .tooltip-arrow-svg, [data-placement=bottom-end].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=bottom-end].tooltip-compact > .tooltip-arrow-svg {
+  top: -8px;
+  right: 10px;
+}
+[data-placement=left].tooltip-extended > .tooltip-arrow-svg, [data-placement=left].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=left].tooltip-compact > .tooltip-arrow-svg {
+  right: -4px;
+  top: 50%;
+  transform: rotate(90deg) translateY(-50%) translateX(-50%);
+}
+[data-placement=right].tooltip-extended > .tooltip-arrow-svg, [data-placement=right].tooltip-dismissible > .tooltip-arrow-svg, [data-placement=right].tooltip-compact > .tooltip-arrow-svg {
+  left: -4px;
+  top: 50%;
+  transform: rotate(270deg) translateY(-50%) translateX(50%);
+}

Server/wwwroot/package/dist/collection/components/tooltip/tooltip.e2e.js

@@ -0,0 +1,19 @@
+import { newE2EPage } from "@stencil/core/testing";
+describe('ifx-tooltip', () => {
+  it('renders', async () => {
+    const page = await newE2EPage();
+    await page.setContent('<ifx-tooltip></ifx-tooltip>');
+    const element = await page.find('ifx-tooltip');
+    expect(element).toHaveClass('hydrated');
+  });
+  it('renders tooltip when visible prop is set', async () => {
+    const page = await newE2EPage();
+    await page.setContent('<ifx-tooltip></ifx-tooltip>');
+    const component = await page.find('ifx-tooltip');
+    component.setProperty('visible', true);
+    await page.waitForChanges();
+    const tooltipEl = await page.find('ifx-tooltip >>> .tooltip-compact');
+    expect(tooltipEl).not.toBeNull();
+  });
+});
+//# sourceMappingURL=tooltip.e2e.js.map

Server/wwwroot/package/dist/collection/components/tooltip/tooltip.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.e2e.js","sourceRoot":"","sources":["../../../src/components/tooltip/tooltip.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAGnD,QAAQ,CAAC,aAAa,EAAE,GAAG,EAAE;EAE3B,EAAE,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IACvB,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,6BAA6B,CAAC,CAAC;IAErD,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAC/C,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;EAGH,EAAE,CAAC,0CAA0C,EAAE,KAAK,IAAI,EAAE;IACxD,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC,6BAA6B,CAAC,CAAC;IACrD,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAEjD,SAAS,CAAC,WAAW,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;IACvC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,kCAAkC,CAAC,CAAC;IACtE,MAAM,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;EACnC,CAAC,CAAC,CAAC;AAGL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from '@stencil/core/testing';\n\n\ndescribe('ifx-tooltip', () => {\n\n  it('renders', async () => {\n    const page = await newE2EPage();\n    await page.setContent('<ifx-tooltip></ifx-tooltip>');\n\n    const element = await page.find('ifx-tooltip');\n    expect(element).toHaveClass('hydrated');\n  });\n\n\n  it('renders tooltip when visible prop is set', async () => {\n    const page = await newE2EPage();\n    await page.setContent('<ifx-tooltip></ifx-tooltip>');\n    const component = await page.find('ifx-tooltip');\n\n    component.setProperty('visible', true);\n    await page.waitForChanges();\n\n    const tooltipEl = await page.find('ifx-tooltip >>> .tooltip-compact');\n    expect(tooltipEl).not.toBeNull();\n  });\n\n\n});\n\n"]}

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

@@ -0,0 +1,268 @@
+import { h } from "@stencil/core";
+import { createPopper } from "@popperjs/core";
+export class Tooltip {
+  constructor() {
+    this.popperInstance = null;
+    this.onMouseEnter = () => {
+      var _a, _b;
+      // Enable the event listeners immediately
+      (_a = this.popperInstance) === null || _a === void 0 ? void 0 : _a.setOptions((options) => (Object.assign(Object.assign({}, options), { modifiers: [
+          ...options.modifiers,
+          { name: 'eventListeners', enabled: true },
+        ] })));
+      // Initialize the popper instance
+      this.initializePopper();
+      // Make the tooltip visible
+      this.tooltipVisible = true;
+      this.tooltipEl.style.display = 'block';
+      // Update the popper instance immediately after initialization
+      (_b = this.popperInstance) === null || _b === void 0 ? void 0 : _b.update();
+    };
+    this.onMouseLeave = () => {
+      this.tooltipVisible = false;
+      this.tooltipEl.style.display = 'none';
+    };
+    this.onClick = () => {
+      var _a;
+      if (this.variant.toLowerCase() === 'dismissible') {
+        this.initializePopper();
+        this.tooltipVisible = !this.tooltipVisible;
+        this.tooltipEl.style.display = this.tooltipVisible ? 'block' : 'none';
+        (_a = this.popperInstance) === null || _a === void 0 ? void 0 : _a.update();
+      }
+    };
+    this.tooltipVisible = false;
+    this.header = '';
+    this.text = '';
+    this.position = 'auto';
+    this.internalPosition = 'auto';
+    this.variant = 'compact';
+    this.icon = undefined;
+  }
+  componentWillLoad() {
+    if (this.variant.toLowerCase().trim() === "") {
+      this.variant = 'compact';
+    }
+  }
+  initializePopper() {
+    if (this.popperInstance)
+      return;
+    this.referenceEl = this.el;
+    this.tooltipEl;
+    if (this.variant.toLowerCase() === 'compact') {
+      this.tooltipEl = this.el.shadowRoot.querySelector('.tooltip-compact');
+    }
+    else if (this.variant.toLowerCase() === 'dismissible') {
+      this.tooltipEl = this.el.shadowRoot.querySelector('.tooltip-dismissible');
+    }
+    else {
+      this.tooltipEl = this.el.shadowRoot.querySelector('.tooltip-extended');
+    }
+    const effectivePosition = this.position === 'auto' ? this.determineBestPosition() : this.position;
+    // Set the internalPosition
+    this.internalPosition = effectivePosition;
+    if (this.tooltipEl && this.referenceEl) {
+      this.popperInstance = createPopper(this.referenceEl, this.tooltipEl, {
+        placement: this.internalPosition,
+        modifiers: [
+          {
+            name: 'offset',
+            options: {
+              offset: [0, 8] // this offset should be adjusted to ensure the tooltip doesn't overlap its reference element
+            }
+          },
+          {
+            name: 'arrow',
+            options: {
+              element: '.tooltip-arrow-svg'
+            }
+          }
+        ]
+      });
+    }
+    // Add this line to set the 'data-placement' attribute on the tooltip
+    this.tooltipEl.setAttribute('data-placement', effectivePosition);
+  }
+  determineBestPosition() {
+    // This is a simplified version, you can enhance this based on available viewport space.
+    const rect = this.referenceEl.getBoundingClientRect();
+    const yOffset = window.scrollY; // Get current scroll position
+    const xOffset = window.scrollX; // Get current horizontal scroll position
+    const verticalHalfwayPoint = rect.top + yOffset + rect.height / 2;
+    const horizontalHalfwayPoint = rect.left + xOffset + rect.width / 2;
+    if (this.position === 'auto') {
+      if (verticalHalfwayPoint > window.innerHeight / 2) {
+        if (horizontalHalfwayPoint > window.innerWidth / 2) {
+          return 'top-end';
+        }
+        else {
+          return 'top-start';
+        }
+      }
+      else {
+        if (horizontalHalfwayPoint > window.innerWidth / 2) {
+          return 'bottom-end';
+        }
+        else {
+          return 'bottom-start';
+        }
+      }
+    }
+    else {
+      return this.position;
+    }
+  }
+  positionChanged(newVal) {
+    var _a;
+    this.internalPosition = newVal;
+    (_a = this.popperInstance) === null || _a === void 0 ? void 0 : _a.destroy();
+    this.popperInstance = null; // Force re-initialization on next mouse enter
+  }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.popperInstance) === null || _a === void 0 ? void 0 : _a.destroy();
+  }
+  render() {
+    const tooltipDismissible = {
+      'tooltip-dismissible': true,
+      'visible': this.tooltipVisible,
+    };
+    const tooltipCompact = {
+      'tooltip-compact': true,
+      'visible': this.tooltipVisible,
+    };
+    const tooltipExtended = {
+      'tooltip-extended': true,
+      'visible': this.tooltipVisible,
+    };
+    const eventHandlers = this.variant.toLowerCase() === 'compact' || this.variant.toLowerCase() === 'extended' ? {
+      onMouseEnter: this.onMouseEnter,
+      onMouseLeave: this.onMouseLeave,
+    } : {
+      onClick: this.onClick,
+    };
+    return (h("div", Object.assign({ "aria-label": "a tooltip showing important information", "aria-value": this.header, class: "tooltip__container" }, eventHandlers), h("slot", null), this.variant.toLowerCase() === 'dismissible' && h("div", { class: tooltipDismissible }, h("ifx-icon", { icon: "cross16", class: "close-button" }), h("div", { class: "tooltip-dismissible-content" }, this.header && h("div", { class: "tooltip-dismissible-header" }, this.header), h("div", { class: "tooltip-dismissible-body" }, this.text)), h("svg", { class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'compact' &&
+      h("div", { class: tooltipCompact }, this.text, h("svg", { class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" }))), this.variant.toLowerCase() === 'extended' &&
+      h("div", { class: tooltipExtended }, h("slot", { name: "icon" }, this.icon ? h("div", { class: "extended_icon" }, h("ifx-icon", { icon: this.icon })) :
+        h("svg", { class: "extended_icon", xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", fill: "none", viewBox: "0 0 24 24" }, h("path", { stroke: "#fff", "stroke-linecap": "round", "stroke-linejoin": "round", d: "M20.5 2.5h-16a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-16a2 2 0 0 0-2-2Z" }), h("path", { stroke: "#fff", d: "M19 17H6l2.5-4 2.097 2.516.405.486.379-.506 4.118-5.49.003-.002L19 17Z" }), h("path", { fill: "#fff", d: "M10 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z" }))), h("div", { class: "tooltip-extended-content" }, this.header && h("div", { class: "tooltip-extended-header" }, this.header), h("div", { class: "tooltip-extended-body" }, this.text)), h("svg", { class: "tooltip-arrow-svg", width: "12", height: "8", viewBox: "0 0 12 8", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { id: "Indicator", d: "M6 0L12 8L0 8L6 0Z", fill: "#1D1D1D" })))));
+  }
+  static get is() { return "ifx-tooltip"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["tooltip.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["tooltip.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "header": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "header",
+        "reflect": false,
+        "defaultValue": "''"
+      },
+      "text": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "text",
+        "reflect": false,
+        "defaultValue": "''"
+      },
+      "position": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'bottom-start' | 'top-start' | 'left' | 'bottom-end' | 'top-end' | 'right' | 'bottom' | 'top' | 'auto'",
+          "resolved": "\"auto\" | \"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"right\" | \"top\" | \"top-end\" | \"top-start\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "position",
+        "reflect": false,
+        "defaultValue": "'auto'"
+      },
+      "variant": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'compact' | 'dismissible' | 'extended'",
+          "resolved": "\"compact\" | \"dismissible\" | \"extended\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "variant",
+        "reflect": false,
+        "defaultValue": "'compact'"
+      },
+      "icon": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "icon",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "tooltipVisible": {},
+      "internalPosition": {}
+    };
+  }
+  static get elementRef() { return "el"; }
+  static get watchers() {
+    return [{
+        "propName": "position",
+        "methodName": "positionChanged"
+      }];
+  }
+}
+//# sourceMappingURL=tooltip.js.map

Server/wwwroot/package/dist/collection/components/tooltip/tooltip.stories.js

@@ -0,0 +1,41 @@
+import { icons } from "@infineon/infineon-icons";
+export default {
+  title: "Components/Tooltip",
+  tags: ['autodocs'],
+  args: {
+    header: "Tooltip headline",
+    text: "Hi, I'm a tooltip",
+    position: 'auto',
+    variant: 'compact',
+    icon: "c-info-24",
+  },
+  argTypes: {
+    icon: {
+      options: Object.values(icons).map(i => i['name']),
+      control: { type: 'select' },
+    },
+    position: {
+      options: ['auto', 'bottom-start', 'top-start', 'left', 'bottom-end', 'top-end', 'right', 'bottom', 'top'],
+      control: { type: 'radio' }
+    },
+    variant: {
+      options: ['compact', 'dismissible', 'extended'],
+      control: { type: 'radio' }
+    },
+    header: { control: 'text', if: { arg: 'variant', neq: 'compact' } }
+  }
+};
+const DefaultTemplate = ({ header, text, variant, position, icon }) => {
+  const element = document.createElement('ifx-tooltip');
+  if (variant === 'dismissible' || variant === 'extended') {
+    element.setAttribute('header', header);
+  }
+  element.setAttribute('text', text);
+  element.setAttribute('variant', variant === 'extended' ? 'extended' : variant);
+  element.setAttribute('position', position);
+  element.setAttribute('icon', icon);
+  element.textContent = "I'm the tooltip reference element - Please hover me"; // Set content for the reference element
+  return element;
+};
+export const Default = DefaultTemplate.bind({});
+//# sourceMappingURL=tooltip.stories.js.map

Server/wwwroot/package/dist/collection/components/tooltip/tooltip.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.stories.js","sourceRoot":"","sources":["../../../src/components/tooltip/tooltip.stories.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;AAEhD,eAAe;EACb,KAAK,EAAE,oBAAoB;EAC3B,IAAI,EAAE,CAAC,UAAU,CAAC;EAClB,IAAI,EAAE;IACJ,MAAM,EAAE,kBAAkB;IAC1B,IAAI,EAAE,mBAAmB;IACzB,QAAQ,EAAE,MAAM;IAChB,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,WAAW;GAGlB;EACD,QAAQ,EAAE;IACR,IAAI,EAAE;MACJ,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;MACjD,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC5B;IACD,QAAQ,EAAE;MACR,OAAO,EAAE,CAAC,MAAM,EAAE,cAAc,EAAE,WAAW,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,CAAC;MACzG,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;KAC3B;IACD,OAAO,EAAE;MACP,OAAO,EAAE,CAAC,SAAS,EAAE,aAAa,EAAE,UAAU,CAAC;MAC/C,OAAO,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE;KAC3B;IACD,MAAM,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE;GACpE;CAEF,CAAC;AAGF,MAAM,eAAe,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAE,EAAE;EACpE,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;EACtD,IAAI,OAAO,KAAK,aAAa,IAAI,OAAO,KAAK,UAAU,EAAE;IACvD,OAAO,CAAC,YAAY,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;GACxC;EACD,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;EACnC,OAAO,CAAC,YAAY,CAAC,SAAS,EAAE,OAAO,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC;EAC/E,OAAO,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;EAC3C,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;EAEnC,OAAO,CAAC,WAAW,GAAG,qDAAqD,CAAC,CAAC,wCAAwC;EAErH,OAAO,OAAO,CAAC;AACjB,CAAC,CAAA;AAGD,MAAM,CAAC,MAAM,OAAO,GAAG,eAAe,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC","sourcesContent":["import { icons } from '@infineon/infineon-icons'\n\nexport default {\n  title: \"Components/Tooltip\",\n  tags: ['autodocs'],\n  args: {\n    header: \"Tooltip headline\",\n    text: \"Hi, I'm a tooltip\",\n    position: 'auto',\n    variant: 'compact',\n    icon: \"c-info-24\",\n\n\n  },\n  argTypes: {\n    icon: {\n      options: Object.values(icons).map(i => i['name']),\n      control: { type: 'select' },\n    },\n    position: {\n      options: ['auto', 'bottom-start', 'top-start', 'left', 'bottom-end', 'top-end', 'right', 'bottom', 'top'],\n      control: { type: 'radio' }\n    },\n    variant: {\n      options: ['compact', 'dismissible', 'extended'],\n      control: { type: 'radio' }\n    },\n    header: { control: 'text', if: { arg: 'variant', neq: 'compact' } }\n  }\n\n};\n\n\nconst DefaultTemplate = ({ header, text, variant, position, icon }) => {\n  const element = document.createElement('ifx-tooltip');\n  if (variant === 'dismissible' || variant === 'extended') {\n    element.setAttribute('header', header);\n  }\n  element.setAttribute('text', text);\n  element.setAttribute('variant', variant === 'extended' ? 'extended' : variant);\n  element.setAttribute('position', position);\n  element.setAttribute('icon', icon);\n\n  element.textContent = \"I'm the tooltip reference element - Please hover me\"; // Set content for the reference element\n\n  return element;\n}\n\n\nexport const Default = DefaultTemplate.bind({});\n\n"]}