@infineon/infineon-design-system-stencil 30.6.2--canary.1658.4e0299382cc78146674b539e7aec5baa0c8f1d1c.0 → 30.7.0--canary.1659.0e44124c828725a583b383fc9417f61d1ad0d432.0

package/dist/collection/components/list-group/list-group-item.js

@@ -1,110 +0,0 @@
-import { h } from "@stencil/core";
-export class ListGroupItem {
-    constructor() {
-        this.isFlush = false;
-        this.hasBulletpoint = false;
-        this.badge = false;
-        this.badgeValue = 0;
-    }
-    componentWillLoad() {
-        const ifxListGroup = this.el.closest('ifx-list-group');
-        if (ifxListGroup.flush) {
-            this.isFlush = true;
-        }
-        else
-            this.isFlush = false;
-        if (ifxListGroup.bulletpoint && !this.badge) {
-            this.hasBulletpoint = true;
-        }
-        else
-            this.hasBulletpoint = false;
-    }
-    render() {
-        return (h("div", { key: 'd50beef84939fea9d25bd5a7a0450683f4580f89', class: `list-group-item 
-        ${this.isFlush ? 'flush' : ""}
-        ${this.hasBulletpoint ? 'bulletpoint' : ""}` }, h("div", { key: '56373799f79b2379fb0f22ef0f2abf8468bd74c9', class: "list-group-item-content" }, h("slot", { key: '2080edc3978491aa3abd0de9dff866f5d8582a4b' })), this.badge && h("ifx-number-indicator", { key: '212364a9efd52a75d47f453c7652574c2332082c' }, this.badgeValue)));
-    }
-    static get is() { return "ifx-list-item"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["list-group-item.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["list-group-item.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "isFlush": {
-                "type": "boolean",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "is-flush",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "badge": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "badge",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "badgeValue": {
-                "type": "number",
-                "mutable": false,
-                "complexType": {
-                    "original": "number",
-                    "resolved": "number",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "badge-value",
-                "reflect": false,
-                "defaultValue": "0"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "hasBulletpoint": {}
-        };
-    }
-    static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=list-group-item.js.map

package/dist/collection/components/list-group/list-group-item.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"list-group-item.js","sourceRoot":"","sources":["../../../src/components/list-group/list-group-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAQnE,MAAM,OAAO,aAAa;;uBAEoB,KAAK;8BACd,KAAK;qBACf,KAAK;0BACD,CAAC;;IAE9B,iBAAiB;QACf,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAA;QACtD,IAAI,YAAY,CAAC,KAAK,EAAE,CAAC;YACvB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC;;YAAM,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QAE5B,IAAI,YAAY,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAC5C,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC7B,CAAC;;YAAM,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;IACrC,CAAC;IAED,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EACR;UACE,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE;UAC3B,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;YAC5C,4DAAK,KAAK,EAAC,yBAAyB;gBAClC,8DAAQ,CACJ;YACL,IAAI,CAAC,KAAK,IAAI,+EAAuB,IAAI,CAAC,UAAU,CAAwB,CACzE,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Element, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-list-item',\n  styleUrl: 'list-group-item.scss',\n  shadow: true,\n})\n\nexport class ListGroupItem {\n  @Element() el;\n  @Prop({ mutable: true }) isFlush: boolean = false;\n  @State() hasBulletpoint: boolean = false;\n  @Prop() badge: boolean = false;\n  @Prop() badgeValue: number = 0;\n\n  componentWillLoad() {\n    const ifxListGroup = this.el.closest('ifx-list-group')\n    if (ifxListGroup.flush) {\n      this.isFlush = true;\n    } else this.isFlush = false;\n\n    if (ifxListGroup.bulletpoint && !this.badge) {\n      this.hasBulletpoint = true;\n    } else this.hasBulletpoint = false;\n  }\n\n  render() {\n    return (\n      <div class={\n        `list-group-item \n        ${this.isFlush ? 'flush' : \"\"}\n        ${this.hasBulletpoint ? 'bulletpoint' : \"\"}`}>\n        <div class=\"list-group-item-content\">\n          <slot />\n        </div>\n        {this.badge && <ifx-number-indicator>{this.badgeValue}</ifx-number-indicator>}\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/list-group/list-group-notification.css

@@ -1,50 +0,0 @@
-.list-group-notification {
-  width: 350px;
-  height: 88px;
-  padding: 16px;
-  margin-bottom: 8px;
-  background-color: #FFFFFF;
-  border: 1px solid #EEEDED;
-  font-family: var(--ifx-font-family);
-}
-.list-group-notification .description__section {
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.list-group-notification.flush {
-  border: none;
-  border-bottom: 1px solid #EEEDED;
-}
-.list-group-notification .heading__section {
-  display: flex;
-  justify-content: space-between;
-  margin-bottom: 8px;
-  color: #0A8276;
-}
-.list-group-notification .heading__section-title {
-  flex: 1;
-  margin: 0;
-  font-weight: 600;
-  line-height: 1.2;
-  font-size: 1rem;
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.list-group-notification .heading__section-time {
-  flex: none;
-  margin-left: 2px;
-  font-size: 0.875rem;
-  line-height: 1.25rem;
-  font-weight: 400;
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}

package/dist/collection/components/list-group/list-group-notification.js

@@ -1,155 +0,0 @@
-import { h } from "@stencil/core";
-export class ListGroupNotification {
-    constructor() {
-        this.titleText = "";
-        this.isFlush = false;
-        this.creationTime = undefined;
-        this.postTime = undefined;
-        this.shownTime = undefined;
-    }
-    setDisplayTime(seconds, minutes, hours, days) {
-        if (seconds <= 60) {
-            this.shownTime = `Just now`;
-        }
-        else if (minutes <= 60) {
-            this.shownTime = `${minutes} min. ago`;
-        }
-        else if (hours <= 24) {
-            this.shownTime = hours > 1 ? `${hours} hr. ago` : `${hours} hrs. ago`;
-        }
-        else if (days) {
-            this.shownTime = hours < 48 ? `1 day ago` : `${days} days ago`;
-            if (hours > 168) {
-                this.shownTime = `${new Date().getDay()}.${new Date().getMonth()}.${new Date().getFullYear()}`;
-            }
-        }
-    }
-    stringToDate(dataString) {
-        if (!dataString)
-            return null;
-        let dateParts = dataString.split("/");
-        if (dateParts[2]) {
-            if (dateParts[2].split(" ")[1]) {
-                let timeParts = dateParts[2].split(" ")[1].split(":");
-                dateParts[2] = dateParts[2].split(" ")[0];
-                return new Date(+dateParts[2], dateParts[1] - 1, +dateParts[0], timeParts[0], timeParts[1], timeParts[2]);
-            }
-        }
-    }
-    getElapsedTime(time) {
-        let date = this.stringToDate(time);
-        if (date) {
-            let miliseconds = Date.now() - date.getTime();
-            let seconds = Math.floor(miliseconds / 1000);
-            let minutes = Math.floor(miliseconds / 60000);
-            let hours = Math.floor(minutes / 60);
-            let days = Math.floor(hours / 24);
-            this.setDisplayTime(seconds, minutes, hours, days);
-        }
-    }
-    setTimeInterval(time) {
-        this.postTime = window.setInterval(() => {
-            this.getElapsedTime(time);
-        }, 1000);
-    }
-    ;
-    componentWillLoad() {
-        this.getElapsedTime(this.creationTime);
-        this.setTimeInterval(this.creationTime); //if time update on refresh, delete this & clear interval
-        const ifxListGroup = this.el.closest('ifx-list-group');
-        if (ifxListGroup.flush) {
-            this.isFlush = true;
-        }
-        else
-            this.isFlush = false;
-    }
-    disconnectedCallback() {
-        window.clearInterval(this.postTime);
-    }
-    render() {
-        return (h("div", { key: '91e1c400374162be139fed99ce0d7e4495b46eb6', class: `list-group-notification ${this.isFlush ? 'flush' : ""}` }, h("div", { key: 'f15575375e0698d0bedb1989e86bfcc24347d1a6', class: "heading__section" }, h("h6", { key: 'ea441212ebfe13f6d2714417dbe3f2770598fd6d', class: "heading__section-title" }, this.titleText), h("div", { key: '0dffec118ce4c588e992531d68492382ad20476d', class: "heading__section-time" }, this.shownTime)), h("div", { key: '063ccfbb83b2a2d839e6e230ec88fba4b9d59a1d', class: "description__section" }, h("slot", { key: 'e449dec2d47fba283a71b1f284963652d39b8ac8' }))));
-    }
-    static get is() { return "ifx-list-notification"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["list-group-notification.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["list-group-notification.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "titleText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "title-text",
-                "reflect": false,
-                "defaultValue": "\"\""
-            },
-            "isFlush": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "is-flush",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "creationTime": {
-                "type": "any",
-                "mutable": false,
-                "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "creation-time",
-                "reflect": false
-            }
-        };
-    }
-    static get states() {
-        return {
-            "postTime": {},
-            "shownTime": {}
-        };
-    }
-    static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=list-group-notification.js.map

package/dist/collection/components/list-group/list-group-notification.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"list-group-notification.js","sourceRoot":"","sources":["../../../src/components/list-group/list-group-notification.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-list-notification',\n  styleUrl: 'list-group-notification.scss',\n  shadow: true,\n})\n\nexport class ListGroupNotification {\n  @Element() el;\n  @Prop() titleText: string = \"\"\n  @Prop() isFlush: boolean = false;\n  @Prop() creationTime: any;\n  @State() postTime: number;\n  @State() shownTime: string;\n\n  setDisplayTime(seconds, minutes, hours, days) {\n    if (seconds <= 60) {\n      this.shownTime = `Just now`\n    } else if (minutes <= 60) {\n      this.shownTime = `${minutes} min. ago`\n    } else if (hours <= 24) {\n      this.shownTime = hours > 1 ? `${hours} hr. ago` : `${hours} hrs. ago`\n    } else if (days) {\n      this.shownTime = hours < 48 ? `1 day ago` : `${days} days ago`\n      if (hours > 168) {\n        this.shownTime = `${new Date().getDay()}.${new Date().getMonth()}.${new Date().getFullYear()}`\n      }\n    }\n  }\n\n  stringToDate(dataString) {\n    if (!dataString) return null\n    let dateParts = dataString.split(\"/\");\n    if (dateParts[2]) {\n      if (dateParts[2].split(\" \")[1]) {\n        let timeParts = dateParts[2].split(\" \")[1].split(\":\");\n        dateParts[2] = dateParts[2].split(\" \")[0];\n        return new Date(+dateParts[2], dateParts[1] - 1, +dateParts[0], timeParts[0], timeParts[1], timeParts[2]);\n      }\n    }\n  }\n\n  getElapsedTime(time) {\n    let date = this.stringToDate(time)\n    if (date) {\n      let miliseconds = Date.now() - date.getTime()\n      let seconds = Math.floor(miliseconds / 1000);\n      let minutes = Math.floor(miliseconds / 60000);\n      let hours = Math.floor(minutes / 60);\n      let days = Math.floor(hours / 24);\n      this.setDisplayTime(seconds, minutes, hours, days)\n    }\n  }\n\n  setTimeInterval(time) {\n    this.postTime = window.setInterval(() => {\n      this.getElapsedTime(time)\n    }, 1000)\n  };\n\n  componentWillLoad() {\n    this.getElapsedTime(this.creationTime)\n    this.setTimeInterval(this.creationTime) //if time update on refresh, delete this & clear interval\n    const ifxListGroup = this.el.closest('ifx-list-group')\n    if (ifxListGroup.flush) {\n      this.isFlush = true;\n    } else this.isFlush = false;\n  }\n\n  disconnectedCallback() {\n    window.clearInterval(this.postTime);\n  }\n\n  render() {\n    return (\n      <div class={`list-group-notification ${this.isFlush ? 'flush' : \"\"}`}>\n        <div class=\"heading__section\">\n          <h6 class=\"heading__section-title\">{this.titleText}</h6>\n          <div class=\"heading__section-time\">{this.shownTime}</div>\n        </div>\n        <div class=\"description__section\">\n          <slot />\n        </div>\n      </div>\n    );\n  }\n}\n"]}

package/dist/collection/components/list-group/list-group.css

@@ -1,9 +0,0 @@
-:host {
-  display: inline-flex;
-}
-
-.list-group-container {
-  display: inline-flex;
-  flex-direction: column;
-  gap: 3px;
-}

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

@@ -1,91 +0,0 @@
-import { h, Host } from "@stencil/core";
-export class ListGroup {
-    constructor() {
-        this.flush = false;
-        this.bulletpoint = false;
-        this.notification = false;
-    }
-    render() {
-        return (h(Host, { key: '5d89f65af5f1b8e1f78b88f70065c55281eb8c27' }, h("div", { key: '0ae653b5307044468d507ee9be6539a430c2103c', class: `list-group-container 
-        ${this.flush ? 'flush' : ""} 
-        ${this.bulletpoint ? 'bulletpoint' : ""}` }, h("slot", { key: 'd7cd601c0b1bfd63aa5dee3f4f657082fa1e30e3', name: 'list-item' }), h("slot", { key: '77efa54a094a8f97081f0d2dd26e527e96a3d79f', name: "list-notification" }))));
-    }
-    static get is() { return "ifx-list-group"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["list-group.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["list-group.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "flush": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "flush",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "bulletpoint": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "bulletpoint",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "notification": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "notification",
-                "reflect": false,
-                "defaultValue": "false"
-            }
-        };
-    }
-    static get elementRef() { return "el"; }
-}
-//# sourceMappingURL=list-group.js.map

package/dist/collection/components/list-group/list-group.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"list-group.js","sourceRoot":"","sources":["../../../src/components/list-group/list-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AASlE,MAAM,OAAO,SAAS;;qBAEK,KAAK;2BACC,KAAK;4BACJ,KAAK;;IAGrC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,4DAAK,KAAK,EACR;UACA,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE;UACzB,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE;gBAEvC,6DAAM,IAAI,EAAC,WAAW,GAAG;gBACzB,6DAAM,IAAI,EAAC,mBAAmB,GAAG,CAC7B,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Element, Prop, Host } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-list-group',\n  styleUrl: 'list-group.scss',\n  shadow: true,\n})\n\nexport class ListGroup {\n  @Element() el;\n  @Prop() flush: boolean = false;\n  @Prop() bulletpoint: boolean = false;\n  @Prop() notification: boolean = false;\n\n\n  render() {\n    return (\n      <Host>\n        <div class={\n          `list-group-container \n        ${this.flush ? 'flush' : \"\"} \n        ${this.bulletpoint ? 'bulletpoint' : \"\"}`\n        }>\n          <slot name='list-item' />\n          <slot name=\"list-notification\" />\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/components/ifx-list-group.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IfxListGroup extends Components.IfxListGroup, HTMLElement {}
-export const IfxListGroup: {
-    prototype: IfxListGroup;
-    new (): IfxListGroup;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ifx-list-group.js

@@ -1,46 +0,0 @@
-import { p as proxyCustomElement, H, h, d as Host } from './p-68d90201.js';
-
-const listGroupCss = ":host{display:inline-flex}.list-group-container{display:inline-flex;flex-direction:column;gap:3px}";
-const IfxListGroupStyle0 = listGroupCss;
-
-const ListGroup = /*@__PURE__*/ proxyCustomElement(class ListGroup extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.flush = false;
-        this.bulletpoint = false;
-        this.notification = false;
-    }
-    render() {
-        return (h(Host, { key: '5d89f65af5f1b8e1f78b88f70065c55281eb8c27' }, h("div", { key: '0ae653b5307044468d507ee9be6539a430c2103c', class: `list-group-container 
-        ${this.flush ? 'flush' : ""} 
-        ${this.bulletpoint ? 'bulletpoint' : ""}` }, h("slot", { key: 'd7cd601c0b1bfd63aa5dee3f4f657082fa1e30e3', name: 'list-item' }), h("slot", { key: '77efa54a094a8f97081f0d2dd26e527e96a3d79f', name: "list-notification" }))));
-    }
-    get el() { return this; }
-    static get style() { return IfxListGroupStyle0; }
-}, [1, "ifx-list-group", {
-        "flush": [4],
-        "bulletpoint": [4],
-        "notification": [4]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ifx-list-group"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ifx-list-group":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ListGroup);
-            }
-            break;
-    } });
-}
-
-const IfxListGroup = ListGroup;
-const defineCustomElement = defineCustomElement$1;
-
-export { IfxListGroup, defineCustomElement };
-
-//# sourceMappingURL=ifx-list-group.js.map

package/dist/components/ifx-list-group.js.map

@@ -1 +0,0 @@
-{"file":"ifx-list-group.js","mappings":";;AAAA,MAAM,YAAY,GAAG,oGAAoG,CAAC;AAC1H,2BAAe,YAAY;;MCQd,SAAS;;;;;qBAEK,KAAK;2BACC,KAAK;4BACJ,KAAK;;IAGrC,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EACR;UACA,IAAI,CAAC,KAAK,GAAG,OAAO,GAAG,EAAE;UACzB,IAAI,CAAC,WAAW,GAAG,aAAa,GAAG,EAAE,EAAE,IAEvC,6DAAM,IAAI,EAAC,WAAW,GAAG,EACzB,6DAAM,IAAI,EAAC,mBAAmB,GAAG,CAC7B,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/list-group/list-group.scss?tag=ifx-list-group&encapsulation=shadow","src/components/list-group/list-group.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n\n:host  {\n  display: inline-flex;\n}\n\n.list-group-container {\n  display: inline-flex;\n  flex-direction: column;\n  gap: 3px;\n}","import { Component, h, Element, Prop, Host } from '@stencil/core';\n \n\n@Component({\n  tag: 'ifx-list-group',\n  styleUrl: 'list-group.scss',\n  shadow: true,\n})\n\nexport class ListGroup {\n  @Element() el;\n  @Prop() flush: boolean = false;\n  @Prop() bulletpoint: boolean = false;\n  @Prop() notification: boolean = false;\n\n\n  render() {\n    return (\n      <Host>\n        <div class={\n          `list-group-container \n        ${this.flush ? 'flush' : \"\"} \n        ${this.bulletpoint ? 'bulletpoint' : \"\"}`\n        }>\n          <slot name='list-item' />\n          <slot name=\"list-notification\" />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/ifx-list-item.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IfxListItem extends Components.IfxListItem, HTMLElement {}
-export const IfxListItem: {
-    prototype: IfxListItem;
-    new (): IfxListItem;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;

package/dist/components/ifx-list-item.js

@@ -1,67 +0,0 @@
-import { p as proxyCustomElement, H, h } from './p-68d90201.js';
-import { d as defineCustomElement$2 } from './p-aecf447b.js';
-
-const listGroupItemCss = "@charset \"UTF-8\";.list-group-item{display:flex;align-items:center;justify-content:space-between;height:40px;width:350px;padding:8px 16px;background-color:#FFFFFF;border:1px solid #EEEDED;border-radius:1px 1px 0px 0px;font-style:normal;font-weight:400;font-size:1rem;line-height:1.5rem;font-family:var(--ifx-font-family)}.list-group-item.flush{border:none;border-bottom:1px solid #EEEDED}.list-group-item.flush.bulletpoint{padding:8px}.list-group-item.bulletpoint .list-group-item-content::before{content:\"•\";display:inline-block;font-size:1.125rem;padding-right:10px}.list-group-item:hover:not(.show){background-color:#EEEDED}.list-group-item:active:not(.show){background-color:#0A8276;color:#FFFFFF}.list-group-item.show{display:block;height:88px;padding:16px}";
-const IfxListItemStyle0 = listGroupItemCss;
-
-const ListGroupItem = /*@__PURE__*/ proxyCustomElement(class ListGroupItem extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.isFlush = false;
-        this.hasBulletpoint = false;
-        this.badge = false;
-        this.badgeValue = 0;
-    }
-    componentWillLoad() {
-        const ifxListGroup = this.el.closest('ifx-list-group');
-        if (ifxListGroup.flush) {
-            this.isFlush = true;
-        }
-        else
-            this.isFlush = false;
-        if (ifxListGroup.bulletpoint && !this.badge) {
-            this.hasBulletpoint = true;
-        }
-        else
-            this.hasBulletpoint = false;
-    }
-    render() {
-        return (h("div", { key: 'd50beef84939fea9d25bd5a7a0450683f4580f89', class: `list-group-item 
-        ${this.isFlush ? 'flush' : ""}
-        ${this.hasBulletpoint ? 'bulletpoint' : ""}` }, h("div", { key: '56373799f79b2379fb0f22ef0f2abf8468bd74c9', class: "list-group-item-content" }, h("slot", { key: '2080edc3978491aa3abd0de9dff866f5d8582a4b' })), this.badge && h("ifx-number-indicator", { key: '212364a9efd52a75d47f453c7652574c2332082c' }, this.badgeValue)));
-    }
-    get el() { return this; }
-    static get style() { return IfxListItemStyle0; }
-}, [1, "ifx-list-item", {
-        "isFlush": [1028, "is-flush"],
-        "badge": [4],
-        "badgeValue": [2, "badge-value"],
-        "hasBulletpoint": [32]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ifx-list-item", "ifx-number-indicator"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ifx-list-item":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ListGroupItem);
-            }
-            break;
-        case "ifx-number-indicator":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const IfxListItem = ListGroupItem;
-const defineCustomElement = defineCustomElement$1;
-
-export { IfxListItem, defineCustomElement };
-
-//# sourceMappingURL=ifx-list-item.js.map

package/dist/components/ifx-list-item.js.map

@@ -1 +0,0 @@
-{"file":"ifx-list-item.js","mappings":";;;AAAA,MAAM,gBAAgB,GAAG,+vBAA+vB,CAAC;AACzxB,0BAAe,gBAAgB;;MCOlB,aAAa;;;;;uBAEoB,KAAK;8BACd,KAAK;qBACf,KAAK;0BACD,CAAC;;IAE9B,iBAAiB;QACf,MAAM,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAA;QACtD,IAAI,YAAY,CAAC,KAAK,EAAE;YACtB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;SACrB;;YAAM,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QAE5B,IAAI,YAAY,CAAC,WAAW,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YAC3C,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;SAC5B;;YAAM,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;KACpC;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EACR;UACE,IAAI,CAAC,OAAO,GAAG,OAAO,GAAG,EAAE;UAC3B,IAAI,CAAC,cAAc,GAAG,aAAa,GAAG,EAAE,EAAE,IAC5C,4DAAK,KAAK,EAAC,yBAAyB,IAClC,8DAAQ,CACJ,EACL,IAAI,CAAC,KAAK,IAAI,+EAAuB,IAAI,CAAC,UAAU,CAAwB,CACzE,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/list-group/list-group-item.scss?tag=ifx-list-item&encapsulation=shadow","src/components/list-group/list-group-item.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.list-group-item {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  height: tokens.$ifxSize500;\n  width: 350px;\n  padding: 8px 16px;\n  background-color: tokens.$ifxColorBaseWhite;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  border-radius: 1px 1px 0px 0px;\n  font-style: normal;\n  font-weight: 400;\n  font-size: tokens.$ifxFontSizeM;\n  line-height: tokens.$ifxLineHeightM;\n  font-family: var(--ifx-font-family);\n\n  &.flush {\n    border: none;\n    border-bottom: 1px solid tokens.$ifxColorEngineering200;\n\n    &.bulletpoint {\n      padding: 8px;\n    }\n  }\n\n  &.bulletpoint {\n    & .list-group-item-content::before {\n      content: \"•\";\n      display: inline-block;\n      font-size: tokens.$ifxFontSizeL;\n      padding-right: 10px;\n    }\n  }\n\n  &:hover:not(.show) {\n    background-color: tokens.$ifxColorEngineering200;\n  }\n\n  &:active:not(.show) {\n    background-color: tokens.$ifxColorOcean500;\n    color: tokens.$ifxColorBaseWhite;\n  }\n\n  &.show {\n    display: block;\n    height: 88px;\n    padding: 16px;\n  }\n}","import { Component, h, Element, Prop, State } from '@stencil/core';\n\n@Component({\n  tag: 'ifx-list-item',\n  styleUrl: 'list-group-item.scss',\n  shadow: true,\n})\n\nexport class ListGroupItem {\n  @Element() el;\n  @Prop({ mutable: true }) isFlush: boolean = false;\n  @State() hasBulletpoint: boolean = false;\n  @Prop() badge: boolean = false;\n  @Prop() badgeValue: number = 0;\n\n  componentWillLoad() {\n    const ifxListGroup = this.el.closest('ifx-list-group')\n    if (ifxListGroup.flush) {\n      this.isFlush = true;\n    } else this.isFlush = false;\n\n    if (ifxListGroup.bulletpoint && !this.badge) {\n      this.hasBulletpoint = true;\n    } else this.hasBulletpoint = false;\n  }\n\n  render() {\n    return (\n      <div class={\n        `list-group-item \n        ${this.isFlush ? 'flush' : \"\"}\n        ${this.hasBulletpoint ? 'bulletpoint' : \"\"}`}>\n        <div class=\"list-group-item-content\">\n          <slot />\n        </div>\n        {this.badge && <ifx-number-indicator>{this.badgeValue}</ifx-number-indicator>}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/ifx-list-notification.d.ts

@@ -1,11 +0,0 @@
-import type { Components, JSX } from "../types/components";
-
-interface IfxListNotification extends Components.IfxListNotification, HTMLElement {}
-export const IfxListNotification: {
-    prototype: IfxListNotification;
-    new (): IfxListNotification;
-};
-/**
- * Used to define this component and all nested components recursively.
- */
-export const defineCustomElement: () => void;