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

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

@@ -1,2 +0,0 @@
-import{r as e,h as i,g as t}from"./p-6b122987.js";const o=".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}";const s=o;const n=class{constructor(i){e(this,i);this.titleText="";this.isFlush=false;this.creationTime=undefined;this.postTime=undefined;this.shownTime=undefined}setDisplayTime(e,i,t,o){if(e<=60){this.shownTime=`Just now`}else if(i<=60){this.shownTime=`${i} min. ago`}else if(t<=24){this.shownTime=t>1?`${t} hr. ago`:`${t} hrs. ago`}else if(o){this.shownTime=t<48?`1 day ago`:`${o} days ago`;if(t>168){this.shownTime=`${(new Date).getDay()}.${(new Date).getMonth()}.${(new Date).getFullYear()}`}}}stringToDate(e){if(!e)return null;let i=e.split("/");if(i[2]){if(i[2].split(" ")[1]){let e=i[2].split(" ")[1].split(":");i[2]=i[2].split(" ")[0];return new Date(+i[2],i[1]-1,+i[0],e[0],e[1],e[2])}}}getElapsedTime(e){let i=this.stringToDate(e);if(i){let e=Date.now()-i.getTime();let t=Math.floor(e/1e3);let o=Math.floor(e/6e4);let s=Math.floor(o/60);let n=Math.floor(s/24);this.setDisplayTime(t,o,s,n)}}setTimeInterval(e){this.postTime=window.setInterval((()=>{this.getElapsedTime(e)}),1e3)}componentWillLoad(){this.getElapsedTime(this.creationTime);this.setTimeInterval(this.creationTime);const e=this.el.closest("ifx-list-group");if(e.flush){this.isFlush=true}else this.isFlush=false}disconnectedCallback(){window.clearInterval(this.postTime)}render(){return i("div",{key:"91e1c400374162be139fed99ce0d7e4495b46eb6",class:`list-group-notification ${this.isFlush?"flush":""}`},i("div",{key:"f15575375e0698d0bedb1989e86bfcc24347d1a6",class:"heading__section"},i("h6",{key:"ea441212ebfe13f6d2714417dbe3f2770598fd6d",class:"heading__section-title"},this.titleText),i("div",{key:"0dffec118ce4c588e992531d68492382ad20476d",class:"heading__section-time"},this.shownTime)),i("div",{key:"063ccfbb83b2a2d839e6e230ec88fba4b9d59a1d",class:"description__section"},i("slot",{key:"e449dec2d47fba283a71b1f284963652d39b8ac8"})))}get el(){return t(this)}};n.style=s;export{n as ifx_list_notification};
-//# sourceMappingURL=p-dd339d82.entry.js.map

package/dist/infineon-design-system-stencil/p-dd339d82.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["listGroupNotificationCss","IfxListNotificationStyle0","ListGroupNotification","setDisplayTime","seconds","minutes","hours","days","this","shownTime","Date","getDay","getMonth","getFullYear","stringToDate","dataString","dateParts","split","timeParts","getElapsedTime","time","date","miliseconds","now","getTime","Math","floor","setTimeInterval","postTime","window","setInterval","componentWillLoad","creationTime","ifxListGroup","el","closest","flush","isFlush","disconnectedCallback","clearInterval","render","h","key","class","titleText"],"sources":["src/components/list-group/list-group-notification.scss?tag=ifx-list-notification&encapsulation=shadow","src/components/list-group/list-group-notification.tsx"],"sourcesContent":["@use \"~@infineon/design-system-tokens/dist/tokens\";\n\n.list-group-notification {\n  width: 350px;\n  height: 88px;\n  padding: 16px;\n  margin-bottom: 8px;\n  background-color: tokens.$ifxColorBaseWhite;\n  border: 1px solid tokens.$ifxColorEngineering200;\n  font-family: var(--ifx-font-family);\n\n  & .description__section {\n    display: -webkit-box;\n    -webkit-line-clamp: 1;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  &.flush {\n    border: none;\n    border-bottom: 1px solid tokens.$ifxColorEngineering200;\n  }\n\n  & .heading__section {\n    display: flex;\n    justify-content: space-between;\n    margin-bottom: 8px;\n    color: tokens.$ifxColorOcean500;\n  }\n\n  & .heading__section-title {\n    flex: 1;\n    margin: 0;\n    font-weight: tokens.$ifxFontWeightSemibold;\n    line-height: 1.2;\n    font-size: tokens.$ifxFontSizeM;\n\n    display: -webkit-box;\n    -webkit-line-clamp: 1;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  & .heading__section-time {\n    flex: none;\n    margin-left: 2px;\n    font-size: tokens.$ifxFontSizeS;\n    line-height: tokens.$ifxLineHeightS;\n    font-weight: 400;\n\n    display: -webkit-box;\n    -webkit-line-clamp: 1;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n}","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"],"mappings":"kDAAA,MAAMA,EAA2B,68BACjC,MAAAC,EAAeD,E,MCOFE,EAAqB,M,wCAEJ,G,aACD,M,6EAK3B,cAAAC,CAAeC,EAASC,EAASC,EAAOC,GACtC,GAAIH,GAAW,GAAI,CACjBI,KAAKC,UAAY,U,MACZ,GAAIJ,GAAW,GAAI,CACxBG,KAAKC,UAAY,GAAGJ,Y,MACf,GAAIC,GAAS,GAAI,CACtBE,KAAKC,UAAYH,EAAQ,EAAI,GAAGA,YAAkB,GAAGA,Y,MAChD,GAAIC,EAAM,CACfC,KAAKC,UAAYH,EAAQ,GAAK,YAAc,GAAGC,aAC/C,GAAID,EAAQ,IAAK,CACfE,KAAKC,UAAY,IAAG,IAAIC,MAAOC,aAAY,IAAID,MAAOE,eAAc,IAAIF,MAAOG,e,GAKrF,YAAAC,CAAaC,GACX,IAAKA,EAAY,OAAO,KACxB,IAAIC,EAAYD,EAAWE,MAAM,KACjC,GAAID,EAAU,GAAI,CAChB,GAAIA,EAAU,GAAGC,MAAM,KAAK,GAAI,CAC9B,IAAIC,EAAYF,EAAU,GAAGC,MAAM,KAAK,GAAGA,MAAM,KACjDD,EAAU,GAAKA,EAAU,GAAGC,MAAM,KAAK,GACvC,OAAO,IAAIP,MAAMM,EAAU,GAAIA,EAAU,GAAK,GAAIA,EAAU,GAAIE,EAAU,GAAIA,EAAU,GAAIA,EAAU,G,GAK5G,cAAAC,CAAeC,GACb,IAAIC,EAAOb,KAAKM,aAAaM,GAC7B,GAAIC,EAAM,CACR,IAAIC,EAAcZ,KAAKa,MAAQF,EAAKG,UACpC,IAAIpB,EAAUqB,KAAKC,MAAMJ,EAAc,KACvC,IAAIjB,EAAUoB,KAAKC,MAAMJ,EAAc,KACvC,IAAIhB,EAAQmB,KAAKC,MAAMrB,EAAU,IACjC,IAAIE,EAAOkB,KAAKC,MAAMpB,EAAQ,IAC9BE,KAAKL,eAAeC,EAASC,EAASC,EAAOC,E,EAIjD,eAAAoB,CAAgBP,GACdZ,KAAKoB,SAAWC,OAAOC,aAAY,KACjCtB,KAAKW,eAAeC,EAAK,GACxB,I,CAGL,iBAAAW,GACEvB,KAAKW,eAAeX,KAAKwB,cACzBxB,KAAKmB,gBAAgBnB,KAAKwB,cAC1B,MAAMC,EAAezB,KAAK0B,GAAGC,QAAQ,kBACrC,GAAIF,EAAaG,MAAO,CACtB5B,KAAK6B,QAAU,I,MACV7B,KAAK6B,QAAU,K,CAGxB,oBAAAC,GACET,OAAOU,cAAc/B,KAAKoB,S,CAG5B,MAAAY,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAO,2BAA2BnC,KAAK6B,QAAU,QAAU,MAC9DI,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBACTF,EAAA,MAAAC,IAAA,2CAAIC,MAAM,0BAA0BnC,KAAKoC,WACzCH,EAAA,OAAAC,IAAA,2CAAKC,MAAM,yBAAyBnC,KAAKC,YAE3CgC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,wBACTF,EAAA,QAAAC,IAAA,8C","ignoreList":[]}

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

@@ -1,2 +0,0 @@
-import{r as e,h as s,a as t,g as i}from"./p-6b122987.js";const a=":host{display:inline-flex}.list-group-container{display:inline-flex;flex-direction:column;gap:3px}";const l=a;const n=class{constructor(s){e(this,s);this.flush=false;this.bulletpoint=false;this.notification=false}render(){return s(t,{key:"5d89f65af5f1b8e1f78b88f70065c55281eb8c27"},s("div",{key:"0ae653b5307044468d507ee9be6539a430c2103c",class:`list-group-container \n        ${this.flush?"flush":""} \n        ${this.bulletpoint?"bulletpoint":""}`},s("slot",{key:"d7cd601c0b1bfd63aa5dee3f4f657082fa1e30e3",name:"list-item"}),s("slot",{key:"77efa54a094a8f97081f0d2dd26e527e96a3d79f",name:"list-notification"})))}get el(){return i(this)}};n.style=l;export{n as ifx_list_group};
-//# sourceMappingURL=p-ddd9ece3.entry.js.map

package/dist/infineon-design-system-stencil/p-ddd9ece3.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["listGroupCss","IfxListGroupStyle0","ListGroup","render","h","Host","key","class","this","flush","bulletpoint","name"],"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"],"mappings":"yDAAA,MAAMA,EAAe,qGACrB,MAAAC,EAAeD,E,MCQFE,EAAS,M,oCAEK,M,iBACM,M,kBACC,K,CAGhC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MACH,kCACAC,KAAKC,MAAQ,QAAU,gBACvBD,KAAKE,YAAc,cAAgB,MAEnCN,EAAA,QAAAE,IAAA,2CAAMK,KAAK,cACXP,EAAA,QAAAE,IAAA,2CAAMK,KAAK,uB","ignoreList":[]}

package/dist/types/components/list-group/list-group-item.d.ts

@@ -1,9 +0,0 @@
-export declare class ListGroupItem {
-    el: any;
-    isFlush: boolean;
-    hasBulletpoint: boolean;
-    badge: boolean;
-    badgeValue: number;
-    componentWillLoad(): void;
-    render(): any;
-}

package/dist/types/components/list-group/list-group-notification.d.ts

@@ -1,15 +0,0 @@
-export declare class ListGroupNotification {
-    el: any;
-    titleText: string;
-    isFlush: boolean;
-    creationTime: any;
-    postTime: number;
-    shownTime: string;
-    setDisplayTime(seconds: any, minutes: any, hours: any, days: any): void;
-    stringToDate(dataString: any): Date;
-    getElapsedTime(time: any): void;
-    setTimeInterval(time: any): void;
-    componentWillLoad(): void;
-    disconnectedCallback(): void;
-    render(): any;
-}

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

@@ -1,7 +0,0 @@
-export declare class ListGroup {
-    el: any;
-    flush: boolean;
-    bulletpoint: boolean;
-    notification: boolean;
-    render(): any;
-}