@infineon/infineon-design-system-stencil 18.0.14 → 18.0.15

package/dist/cjs/ifx-progress-bar.cjs.entry.js

@@ -16,7 +16,12 @@ const ProgressBar = class {
     this.showLabel = false;
   }
   onPercentageChanged(newValue) {
-    this.percentageChange.emit(newValue);
+    const event = new CustomEvent('percentage-change', {
+      bubbles: true,
+      composed: true,
+      detail: newValue
+    });
+    this.percentageChange.emit(event);
   }
   render() {
     return (index.h("div", { class: `progress-bar ${this.size}` }, index.h("div", { class: "progress", style: { width: `${this.percentage}%` } }, this.showLabel && this.size !== "s" && index.h("span", { class: "label" }, `${this.percentage}%`))));

package/dist/collection/components/progress-bar/progress-bar.js

@@ -7,7 +7,12 @@ export class ProgressBar {
     this.showLabel = false;
   }
   onPercentageChanged(newValue) {
-    this.percentageChange.emit(newValue);
+    const event = new CustomEvent('percentage-change', {
+      bubbles: true,
+      composed: true,
+      detail: newValue
+    });
+    this.percentageChange.emit(event);
   }
   render() {
     return (h("div", { class: `progress-bar ${this.size}` }, h("div", { class: "progress", style: { width: `${this.percentage}%` } }, this.showLabel && this.size !== "s" && h("span", { class: "label" }, `${this.percentage}%`))));
@@ -111,9 +116,13 @@ export class ProgressBar {
           "text": ""
         },
         "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
+          "original": "CustomEvent",
+          "resolved": "CustomEvent<any>",
+          "references": {
+            "CustomEvent": {
+              "location": "global"
+            }
+          }
         }
       }];
   }

package/dist/collection/components/progress-bar/progress-bar.stories.js

@@ -28,8 +28,8 @@ const Template = (args) => {
   `;
   const progressBar = wrapper.querySelector('ifx-progress-bar');
   progressBar.addEventListener('percentageChange', (event) => {
-    console.log('Percentage:', event === null || event === void 0 ? void 0 : event.detail);
-    action('Percentage:')(event === null || event === void 0 ? void 0 : event.detail);
+    console.log('Percentage:', event);
+    action('Percentage:')(event);
   });
   // Run this useEffect hook whenever the percentage changes
   useEffect(() => {

package/dist/components/ifx-progress-bar.js

@@ -14,7 +14,12 @@ const ProgressBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.showLabel = false;
   }
   onPercentageChanged(newValue) {
-    this.percentageChange.emit(newValue);
+    const event = new CustomEvent('percentage-change', {
+      bubbles: true,
+      composed: true,
+      detail: newValue
+    });
+    this.percentageChange.emit(event);
   }
   render() {
     return (h("div", { class: `progress-bar ${this.size}` }, h("div", { class: "progress", style: { width: `${this.percentage}%` } }, this.showLabel && this.size !== "s" && h("span", { class: "label" }, `${this.percentage}%`))));

package/dist/esm/ifx-progress-bar.entry.js

@@ -12,7 +12,12 @@ const ProgressBar = class {
     this.showLabel = false;
   }
   onPercentageChanged(newValue) {
-    this.percentageChange.emit(newValue);
+    const event = new CustomEvent('percentage-change', {
+      bubbles: true,
+      composed: true,
+      detail: newValue
+    });
+    this.percentageChange.emit(event);
   }
   render() {
     return (h("div", { class: `progress-bar ${this.size}` }, h("div", { class: "progress", style: { width: `${this.percentage}%` } }, this.showLabel && this.size !== "s" && h("span", { class: "label" }, `${this.percentage}%`))));

package/dist/infineon-design-system-stencil/infineon-design-system-stencil.esm.js

@@ -1 +1 @@
-import{p as e,H as i,b as o}from"./p-cd9011ba.js";export{s as setNonce}from"./p-cd9011ba.js";const t=e=>{const i=e.cloneNode;e.cloneNode=function(e){if("TEMPLATE"===this.nodeName)return i.call(this,e);const o=i.call(this,!1),t=this.childNodes;if(e)for(let e=0;e<t.length;e++)2!==t[e].nodeType&&o.appendChild(t[e].cloneNode(!0));return o}};(()=>{t(i.prototype);const o=import.meta.url,a={};return""!==o&&(a.resourcesUrl=new URL(".",o).href),e(a)})().then((e=>o([["p-b47a7121",[[1,"ifx-alert",{color:[1],icon:[1],overflowing:[4]}]]],["p-cb46613b",[[1,"ifx-button",{variant:[1],color:[1],size:[1],disabled:[4],icon:[1],position:[1025],href:[1],target:[1],setFocus:[64]}]]],["p-14ecab2a",[[1,"ifx-icon-button",{variant:[1],color:[1],size:[1],disabled:[4],icon:[1],href:[1],target:[1],shape:[1],setFocus:[64]}]]],["p-c5b36433",[[1,"ifx-icons-preview",{iconsArray:[32],isCopied:[32],copiedIndex:[32]}]]],["p-63551799",[[1,"ifx-list-item",{isFlush:[4,"is-flush"],badge:[4],badgeValue:[2,"badge-value"],hasBulletpoint:[32]}]]],["p-ffe2c265",[[1,"ifx-range",{min:[2],max:[2],value:[1026],disabled:[4],showPercentage:[4,"show-percentage"],leftIcon:[1,"left-icon"],rightIcon:[1,"right-icon"],leftText:[1,"left-text"],rightText:[1,"right-text"]}]]],["p-2a2f79fd",[[1,"ifx-accordion",null,[[16,"itemOpened","onItemOpened"]]]]],["p-b92af18e",[[1,"ifx-accordion-item",{caption:[1],open:[32],close:[64],isOpen:[64]}]]],["p-cb4bc2a9",[[1,"ifx-badge"]]],["p-f4b92bbe",[[1,"ifx-card",{hasBtn:[1028,"has-btn"],direction:[1025],alignment:[1025],hasDesc:[1028,"has-desc"],hasAll:[1028,"has-all"],largeSize:[1028,"large-size"],smallSize:[1028,"small-size"]}]]],["p-c9ad329a",[[1,"ifx-card-headline",{direction:[1025],hasDesc:[1028,"has-desc"]}]]],["p-1da873c5",[[1,"ifx-card-overline"]]],["p-ad301002",[[1,"ifx-card-text",{hasBtn:[1028,"has-btn"]}]]],["p-4976a719",[[1,"ifx-dropdown",{label:[1],size:[1],disabled:[4],icon:[4],search:[4],filter:[4]},[[5,"mousedown","handleOutsideClick"]]]]],["p-6429607e",[[1,"ifx-filter-input",{label:[1],size:[1],disabled:[4],icon:[4],search:[4],filter:[4],options:[32]}]]],["p-8fde9c35",[[1,"ifx-list-group",{flush:[4],bulletpoint:[4],notification:[4]}]]],["p-84952e7e",[[1,"ifx-list-notification",{titleText:[1,"title-text"],isFlush:[4,"is-flush"],creationTime:[8,"creation-time"],postTime:[32],shownTime:[32]}]]],["p-304579be",[[1,"ifx-progress-bar",{percentage:[2],label:[1],size:[1],showLabel:[4,"show-label"]}]]],["p-25e72c76",[[1,"ifx-radio-button",{disabled:[4],checked:[1028],error:[4],hasSlot:[32]}]]],["p-89c70190",[[1,"ifx-spinner",{size:[1]}]]],["p-a660c68c",[[1,"ifx-status",{text:[1],border:[4],color:[1]}]]],["p-c95eaa6c",[[4,"ifx-tab",{header:[1]}]]],["p-224514d2",[[1,"ifx-tabs",{tabs:[16],orientation:[1],small:[4],activeTabIndex:[32],tabRefs:[32],tabHeaderRefs:[32],tabTitles:[32]},[[0,"slotchange","onSlotChange"]]]]],["p-b6ea6950",[[1,"ifx-tag",{text:[1]}]]],["p-16e8416c",[[1,"ifx-toggle",{checked:[1028]}]]],["p-022094c3",[[0,"infineon-icon-stencil",{icon:[8],path:[32],svgWidth:[32],svgHeight:[32],pathD:[32],svgStroke:[32],svgStrokeLinecap:[32],svgLineJoin:[32]}]]],["p-c4f437db",[[1,"ifx-number-indicator",{inverted:[4]}]]],["p-2d9310c6",[[1,"ifx-search-bar",{icon:[1],showCloseButton:[4,"show-close-button"],isOpen:[1028,"is-open"],hideLabel:[4,"hide-label"],size:[1]}],[1,"ifx-checkbox",{disabled:[4],checked:[1028],error:[4],hasSlot:[32]}],[1,"ifx-dropdown-item",{label:[1],size:[1],disabled:[4],icon:[1],checkable:[4],checkboxColor:[32]}],[1,"ifx-navbar",{applicationName:[1,"application-name"],main:[32],products:[32],applications:[32],design:[32],support:[32],about:[32],hasLeftMenuItems:[32]}],[1,"ifx-navbar-menu-item",{isProfile:[1028,"is-profile"],hideLabel:[4,"hide-label"],icon:[1]}],[1,"ifx-dropdown-menu",{label:[1],size:[1],disabled:[4],icon:[4],search:[4],filter:[4],isShown:[32]}],[1,"ifx-footer",{variant:[1],large:[32],default:[32],showFacebook:[32]}],[1,"ifx-footer-column"],[1,"ifx-search-input",{width:[1],showDeleteIcon:[4,"show-delete-icon"],disabled:[4],borderColor:[1,"border-color"],size:[1],insideDropdown:[32]}],[1,"ifx-link",{href:[1],target:[1],color:[1],bold:[4],underline:[1032]}],[0,"ifx-icon",{icon:[1032],ifxIcon:[1032,"ifx-icon"]}]]]],e)));
+import{p as e,H as i,b as o}from"./p-cd9011ba.js";export{s as setNonce}from"./p-cd9011ba.js";const t=e=>{const i=e.cloneNode;e.cloneNode=function(e){if("TEMPLATE"===this.nodeName)return i.call(this,e);const o=i.call(this,!1),t=this.childNodes;if(e)for(let e=0;e<t.length;e++)2!==t[e].nodeType&&o.appendChild(t[e].cloneNode(!0));return o}};(()=>{t(i.prototype);const o=import.meta.url,a={};return""!==o&&(a.resourcesUrl=new URL(".",o).href),e(a)})().then((e=>o([["p-b47a7121",[[1,"ifx-alert",{color:[1],icon:[1],overflowing:[4]}]]],["p-cb46613b",[[1,"ifx-button",{variant:[1],color:[1],size:[1],disabled:[4],icon:[1],position:[1025],href:[1],target:[1],setFocus:[64]}]]],["p-14ecab2a",[[1,"ifx-icon-button",{variant:[1],color:[1],size:[1],disabled:[4],icon:[1],href:[1],target:[1],shape:[1],setFocus:[64]}]]],["p-c5b36433",[[1,"ifx-icons-preview",{iconsArray:[32],isCopied:[32],copiedIndex:[32]}]]],["p-63551799",[[1,"ifx-list-item",{isFlush:[4,"is-flush"],badge:[4],badgeValue:[2,"badge-value"],hasBulletpoint:[32]}]]],["p-ffe2c265",[[1,"ifx-range",{min:[2],max:[2],value:[1026],disabled:[4],showPercentage:[4,"show-percentage"],leftIcon:[1,"left-icon"],rightIcon:[1,"right-icon"],leftText:[1,"left-text"],rightText:[1,"right-text"]}]]],["p-2a2f79fd",[[1,"ifx-accordion",null,[[16,"itemOpened","onItemOpened"]]]]],["p-b92af18e",[[1,"ifx-accordion-item",{caption:[1],open:[32],close:[64],isOpen:[64]}]]],["p-cb4bc2a9",[[1,"ifx-badge"]]],["p-f4b92bbe",[[1,"ifx-card",{hasBtn:[1028,"has-btn"],direction:[1025],alignment:[1025],hasDesc:[1028,"has-desc"],hasAll:[1028,"has-all"],largeSize:[1028,"large-size"],smallSize:[1028,"small-size"]}]]],["p-c9ad329a",[[1,"ifx-card-headline",{direction:[1025],hasDesc:[1028,"has-desc"]}]]],["p-1da873c5",[[1,"ifx-card-overline"]]],["p-ad301002",[[1,"ifx-card-text",{hasBtn:[1028,"has-btn"]}]]],["p-4976a719",[[1,"ifx-dropdown",{label:[1],size:[1],disabled:[4],icon:[4],search:[4],filter:[4]},[[5,"mousedown","handleOutsideClick"]]]]],["p-6429607e",[[1,"ifx-filter-input",{label:[1],size:[1],disabled:[4],icon:[4],search:[4],filter:[4],options:[32]}]]],["p-8fde9c35",[[1,"ifx-list-group",{flush:[4],bulletpoint:[4],notification:[4]}]]],["p-84952e7e",[[1,"ifx-list-notification",{titleText:[1,"title-text"],isFlush:[4,"is-flush"],creationTime:[8,"creation-time"],postTime:[32],shownTime:[32]}]]],["p-3f6d75bd",[[1,"ifx-progress-bar",{percentage:[2],label:[1],size:[1],showLabel:[4,"show-label"]}]]],["p-25e72c76",[[1,"ifx-radio-button",{disabled:[4],checked:[1028],error:[4],hasSlot:[32]}]]],["p-89c70190",[[1,"ifx-spinner",{size:[1]}]]],["p-a660c68c",[[1,"ifx-status",{text:[1],border:[4],color:[1]}]]],["p-c95eaa6c",[[4,"ifx-tab",{header:[1]}]]],["p-224514d2",[[1,"ifx-tabs",{tabs:[16],orientation:[1],small:[4],activeTabIndex:[32],tabRefs:[32],tabHeaderRefs:[32],tabTitles:[32]},[[0,"slotchange","onSlotChange"]]]]],["p-b6ea6950",[[1,"ifx-tag",{text:[1]}]]],["p-16e8416c",[[1,"ifx-toggle",{checked:[1028]}]]],["p-022094c3",[[0,"infineon-icon-stencil",{icon:[8],path:[32],svgWidth:[32],svgHeight:[32],pathD:[32],svgStroke:[32],svgStrokeLinecap:[32],svgLineJoin:[32]}]]],["p-c4f437db",[[1,"ifx-number-indicator",{inverted:[4]}]]],["p-2d9310c6",[[1,"ifx-search-bar",{icon:[1],showCloseButton:[4,"show-close-button"],isOpen:[1028,"is-open"],hideLabel:[4,"hide-label"],size:[1]}],[1,"ifx-checkbox",{disabled:[4],checked:[1028],error:[4],hasSlot:[32]}],[1,"ifx-dropdown-item",{label:[1],size:[1],disabled:[4],icon:[1],checkable:[4],checkboxColor:[32]}],[1,"ifx-navbar",{applicationName:[1,"application-name"],main:[32],products:[32],applications:[32],design:[32],support:[32],about:[32],hasLeftMenuItems:[32]}],[1,"ifx-navbar-menu-item",{isProfile:[1028,"is-profile"],hideLabel:[4,"hide-label"],icon:[1]}],[1,"ifx-dropdown-menu",{label:[1],size:[1],disabled:[4],icon:[4],search:[4],filter:[4],isShown:[32]}],[1,"ifx-footer",{variant:[1],large:[32],default:[32],showFacebook:[32]}],[1,"ifx-footer-column"],[1,"ifx-search-input",{width:[1],showDeleteIcon:[4,"show-delete-icon"],disabled:[4],borderColor:[1,"border-color"],size:[1],insideDropdown:[32]}],[1,"ifx-link",{href:[1],target:[1],color:[1],bold:[4],underline:[1032]}],[0,"ifx-icon",{icon:[1032],ifxIcon:[1032,"ifx-icon"]}]]]],e)));

package/dist/infineon-design-system-stencil/p-3f6d75bd.entry.js

@@ -0,0 +1 @@
+import{r as e,c as s,h as t}from"./p-cd9011ba.js";const r=class{constructor(t){e(this,t),this.percentageChange=s(this,"percentageChange",7),this.percentage=0,this.label="",this.size=void 0,this.showLabel=!1}onPercentageChanged(e){const s=new CustomEvent("percentage-change",{bubbles:!0,composed:!0,detail:e});this.percentageChange.emit(s)}render(){return t("div",{class:`progress-bar ${this.size}`},t("div",{class:"progress",style:{width:`${this.percentage}%`}},this.showLabel&&"s"!==this.size&&t("span",{class:"label"},`${this.percentage}%`)))}static get watchers(){return{percentage:["onPercentageChanged"]}}};r.style='.progress-bar{height:16px;border-radius:1px;bottom:0;right:0;top:0;left:0}.progress-bar .label{height:17px;border-radius:1px 0px 0px 1px}.progress-bar.s{height:4px}.progress-bar .progress{height:100%;background-color:#0A8276;position:relative}.progress-bar .progress:after{content:"";background-color:#EEEDED;height:100%;position:absolute}.progress-bar .label{display:flex;align-items:center;justify-content:center;position:absolute;font-style:normal;font-weight:400;font-size:14px;line-height:20px;font-family:"Source Sans Pro";color:#fff;top:0;bottom:0;left:0;right:0}';export{r as ifx_progress_bar}

package/dist/types/components/progress-bar/progress-bar.d.ts

@@ -4,7 +4,7 @@ export declare class ProgressBar {
   label: string;
   size: string;
   showLabel: boolean;
-  percentageChange: EventEmitter<number>;
+  percentageChange: EventEmitter<CustomEvent>;
   onPercentageChanged(newValue: number): void;
   render(): any;
 }

package/dist/types/components.d.ts

@@ -640,7 +640,7 @@ declare namespace LocalJSX {
     }
     interface IfxProgressBar {
         "label"?: string;
-        "onPercentageChange"?: (event: IfxProgressBarCustomEvent<number>) => void;
+        "onPercentageChange"?: (event: IfxProgressBarCustomEvent<CustomEvent>) => void;
         "percentage"?: number;
         "showLabel"?: boolean;
         "size"?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@infineon/infineon-design-system-stencil",
-  "version": "18.0.14",
+  "version": "18.0.15",
   "private": false,
   "description": "Infineon design system Stencil web components",
   "homepage": "https://github.com/Infineon/infineon-design-system-stencil#readme",

package/dist/infineon-design-system-stencil/p-304579be.entry.js

@@ -1 +0,0 @@
-import{r as s,c as r,h as t}from"./p-cd9011ba.js";const e=class{constructor(t){s(this,t),this.percentageChange=r(this,"percentageChange",7),this.percentage=0,this.label="",this.size=void 0,this.showLabel=!1}onPercentageChanged(s){this.percentageChange.emit(s)}render(){return t("div",{class:`progress-bar ${this.size}`},t("div",{class:"progress",style:{width:`${this.percentage}%`}},this.showLabel&&"s"!==this.size&&t("span",{class:"label"},`${this.percentage}%`)))}static get watchers(){return{percentage:["onPercentageChanged"]}}};e.style='.progress-bar{height:16px;border-radius:1px;bottom:0;right:0;top:0;left:0}.progress-bar .label{height:17px;border-radius:1px 0px 0px 1px}.progress-bar.s{height:4px}.progress-bar .progress{height:100%;background-color:#0A8276;position:relative}.progress-bar .progress:after{content:"";background-color:#EEEDED;height:100%;position:absolute}.progress-bar .label{display:flex;align-items:center;justify-content:center;position:absolute;font-style:normal;font-weight:400;font-size:14px;line-height:20px;font-family:"Source Sans Pro";color:#fff;top:0;bottom:0;left:0;right:0}';export{e as ifx_progress_bar}