@zanichelli/albe-web-components 13.6.0 → 14.0.0

package/dist/web-components-library/{p-4cf24a3b.entry.js → p-cab235e5.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,g as o}from"./p-10bb4f4b.js";import{L as i}from"./p-025f494e.js";const s='footer{position:relative;z-index:5;top:0;width:auto;height:calc(var(--space-unit) * 6);padding:0;border-top:var(--border-size-medium) solid var(--color-surface03);margin:0;background-color:var(--color-surface01);border-radius:0 0 var(--border-radius) var(--border-radius);color:var(--color-surface05);font-family:var(--font-family-sans);font-weight:var(--font-rg);transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.real,footer.trial,footer.temp{border-top:var(--border-size-medium) solid var(--blue100)}footer .bold{font-family:var(--font-family-sans);font-weight:var(--font-sb)}footer>p{overflow:hidden;height:40px;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 2) var(--space-unit) calc(var(--space-unit) * 2);margin:0;background-color:var(--color-surface01);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);line-height:22px;transition:all 200ms linear}footer.isopen>p{background-color:var(--gray200);font-size:14px;font-weight:var(--font-sb);transition:all 200ms linear}footer.isopen.real>p,footer.isopen.trial>p,footer.isopen.temp>p{background-color:var(--blue100)}footer .visible{display:block}footer .hidden{display:none}footer>div.content{overflow:hidden;height:60px}footer>div.content>div:not(.slot-handler){padding:var(--space-unit) calc(var(--space-unit) * 2)}footer>div.content>div>p{overflow:hidden;height:20px;padding:0;margin:0;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}footer>div.content>div>p.year-isbn{display:flex;flex-direction:row;justify-content:space-between;padding-top:var(--space-unit)}footer>div.content>div>p.year-isbn>span.isbn{overflow:hidden;text-overflow:ellipsis}footer.isopen>div.content>div:not(.slot-handler){height:68px}footer.isopen>div.content>div>p.authors{height:40px;text-overflow:initial;white-space:initial}footer.isopen>div.content>div>p.year-isbn{height:50px;flex-direction:column;padding-left:0}footer.isopen>div.content>div>p.year-isbn>span.isbn{display:inline-grid;padding-left:0}footer.isopen{top:-212px;height:295px;transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.isopen.custom-content{top:-292px}footer.isopen>div.content{height:280px;transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.isopen.custom-content>div.content{height:230px}.toggle{position:absolute;z-index:10;top:-24px;left:16px}.faded{opacity:0.3;pointer-events:none}footer>p.custom-content,footer .content.custom-content{display:none}footer.isopen>p.custom-content,footer.isopen .content.custom-content{display:block}div.wrapper{position:relative;height:100%}div.wrapper ::slotted([slot="content"]){position:absolute;z-index:10;top:calc(var(--space-unit) * 2);display:block;width:100%;height:112px;box-sizing:border-box;padding:0 calc(var(--space-unit) * 2);border-top:var(--border-size-medium) solid transparent;background:var(--color-white)}div.wrapper.isopen ::slotted([slot="content"]){top:0;bottom:0;height:128px;padding:calc(var(--space-unit) * 2);border-color:var(--blue100)}';const n=s;const a=class{constructor(t){e(this,t);this.titolo=undefined;this.autori=undefined;this.isbn=undefined;this.faded=undefined;this.cardtype=undefined;this.opened=false;this.customContent=false;this.isOpen=false;this.allowTooltipAuthors=false}handleToggle(){this.isOpen=!this.isOpen;if(this.isOpen){const e=this.getFirstListItem();if(e){requestAnimationFrame((()=>{e.focus()}))}}}getTitleAuthors(){return this.allowTooltipAuthors?this.autori:""}componentWillLoad(){if(this.opened){this.isOpen=true}}elementsEllipsis(){this.allowTooltipAuthors=this.elementAuthorsHasEllipsis()?true:false}elementAuthorsHasEllipsis(){return this.ellipsisAuthors.offsetWidth<this.ellipsisAuthors.scrollWidth}retrieveClass(){return{isopen:this.isOpen,real:this.cardtype===i.REAL,trial:this.cardtype===i.TRIAL,temp:this.cardtype===i.TEMP,"custom-content":this.customContent}}footerTransitionHandler(e){if(["visibility","height"].includes(e.propertyName)){this.elementsEllipsis()}}getFirstListItem(){return this.host.querySelector("[slot=list] > li a")}render(){return t("div",{key:"d25703feb65157ccfd4fb42c79a73a1f727d84ab",class:Object.assign(Object.assign({},this.retrieveClass()),{wrapper:true})},t("footer",{key:"589c894f50804b126ccf3e187ca9dc7a0bff8c7d",class:this.retrieveClass(),onTransitionEnd:e=>this.footerTransitionHandler(e)},t("span",{key:"d8ee7a9624b45cd582ef83f17d87bccbc9e7ca3c",class:"toggle"},t("slot",{key:"9bd203e35e8843c35b9cf62d140fa06101babf04",name:"toggle"})),this.titolo&&t("p",{class:{"custom-content":this.customContent}},this.titolo),t("div",{key:"6cd83f729f597b1d7d0459487c7f7d750f313fd5",class:{content:true,"custom-content":this.customContent}},t("div",{key:"734463c250896fa385a64f661d9fe274adc012af"},t("p",{key:"02a46fe8a54a1a7c03779c61be3443eac21b0bf5",class:"authors",ref:e=>this.ellipsisAuthors=e},t("span",{key:"354b92a3744e1fc714d38de05c2edce826ab590e",title:this.getTitleAuthors()},t("span",{key:"43335f22836f4ca789a92cd787416af4dc5b877f","aria-description":"Autori",class:"bold"},this.autori))),t("p",{key:"5575991c3019e2446bc8940de8ba98feef8c6867",class:"year-isbn"},t("span",{key:"f831de5b649d3f4d05118d21014c40615bc3e8b3",class:"isbn"},t("span",{key:"947cb10c2d7f65b24e946d47d3a203af61fc1227"},t("span",{key:"5afac8722d1d9371f94de64d826daf0e9332b8cb","aria-description":"ISBN edizione cartacea",class:"bold"},this.isbn)," ","(ed. cartacea)")))),t("div",{key:"91a09f5fb5c6446df88d4f364a5faf2093c8670e",class:`slot-handler ${this.isOpen?"visible":"hidden"}`},t("slot",{key:"b25f5a65d17b3f403ecf3d9534a7fdfbbbfe9c22",name:"list"})))),this.customContent&&t("slot",{name:"content"}))}get host(){return o(this)}};a.style=n;export{a as z_myz_card_footer};
-//# sourceMappingURL=p-4cf24a3b.entry.js.map
+import{r as e,h as t,g as o}from"./p-10bb4f4b.js";import{L as i}from"./p-025f494e.js";const a='footer{position:relative;z-index:5;top:0;width:auto;height:calc(var(--space-unit) * 6);padding:0;border-top:var(--border-size-medium) solid var(--color-surface03);margin:0;background-color:var(--color-surface01);border-radius:0 0 var(--border-radius) var(--border-radius);color:var(--color-surface05);font-family:var(--font-family-sans);font-weight:var(--font-rg);transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.real,footer.trial,footer.temp{border-top:var(--border-size-medium) solid var(--blue100)}footer .bold{font-family:var(--font-family-sans);font-weight:var(--font-sb)}footer>p{overflow:hidden;height:40px;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 2) var(--space-unit) calc(var(--space-unit) * 2);margin:0;background-color:var(--color-surface01);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);line-height:22px;transition:all 200ms linear}footer.isopen>p{background-color:var(--gray200);font-size:14px;font-weight:var(--font-sb);transition:all 200ms linear}footer.isopen.real>p,footer.isopen.trial>p,footer.isopen.temp>p{background-color:var(--blue100)}footer .visible{display:block}footer .hidden{display:none}footer>div.content{overflow:hidden;height:60px}footer>div.content>div:not(.slot-handler){padding:var(--space-unit) calc(var(--space-unit) * 2)}footer>div.content>div>p{overflow:hidden;height:20px;padding:0;margin:0;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}footer>div.content>div>p.year-isbn{display:flex;flex-direction:row;justify-content:space-between;padding-top:var(--space-unit)}footer>div.content>div>p.year-isbn>span.isbn{overflow:hidden;text-overflow:ellipsis}footer.isopen>div.content>div:not(.slot-handler){height:68px}footer.isopen>div.content>div>p.authors{height:40px;text-overflow:initial;white-space:initial}footer.isopen>div.content>div>p.year-isbn{height:50px;flex-direction:column;padding-left:0}footer.isopen>div.content>div>p.year-isbn>span.isbn{display:inline-grid;padding-left:0}footer.isopen{top:-212px;height:295px;transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.isopen.custom-content{top:-292px}footer.isopen>div.content{height:280px;transition:height 500ms ease-in-out, top 500ms ease-in-out}footer.isopen.custom-content>div.content{height:230px}.toggle{position:absolute;z-index:10;top:-24px;left:16px}.faded{opacity:0.3;pointer-events:none}footer>p.custom-content,footer .content.custom-content{display:none}footer.isopen>p.custom-content,footer.isopen .content.custom-content{display:block}div.wrapper{position:relative;height:100%}div.wrapper ::slotted([slot="content"]){position:absolute;z-index:10;top:calc(var(--space-unit) * 2);display:block;width:100%;height:112px;box-sizing:border-box;padding:0 calc(var(--space-unit) * 2);border-top:var(--border-size-medium) solid transparent;background:var(--color-white)}div.wrapper.isopen ::slotted([slot="content"]){top:0;bottom:0;height:128px;padding:calc(var(--space-unit) * 2);border-color:var(--blue100)}';const s=a;const n=class{constructor(t){e(this,t);this.titolo=undefined;this.autori=undefined;this.isbn=undefined;this.faded=undefined;this.cardtype=undefined;this.opened=false;this.customContent=false;this.isOpen=false;this.allowTooltipAuthors=false}handleToggle(){this.isOpen=!this.isOpen;if(this.isOpen){const e=this.getFirstListItem();if(e){requestAnimationFrame((()=>{e.focus()}))}}}getTitleAuthors(){return this.allowTooltipAuthors?this.autori:""}componentWillLoad(){if(this.opened){this.isOpen=true}}elementsEllipsis(){this.allowTooltipAuthors=this.elementAuthorsHasEllipsis()?true:false}elementAuthorsHasEllipsis(){return this.ellipsisAuthors.offsetWidth<this.ellipsisAuthors.scrollWidth}retrieveClass(){return{isopen:this.isOpen,real:this.cardtype===i.REAL,trial:this.cardtype===i.TRIAL,temp:this.cardtype===i.TEMP,"custom-content":this.customContent}}footerTransitionHandler(e){if(["visibility","height"].includes(e.propertyName)){this.elementsEllipsis()}}getFirstListItem(){return this.host.querySelector("[slot=list] > li a")}render(){return t("div",{key:"eff686d5d74e259c149f24159ad11b8fa35678c5",class:Object.assign(Object.assign({},this.retrieveClass()),{wrapper:true})},t("footer",{key:"3d98d7d2b93a381fe5a30ffc759dbd5d9400e651",class:this.retrieveClass(),onTransitionEnd:e=>this.footerTransitionHandler(e)},t("span",{key:"5b3972c0da599babfe34be1e6272f32c9ac0caa8",class:"toggle"},t("slot",{key:"eac0e7c9dce28af1aa5b1105def1f9f07dfeef9a",name:"toggle"})),this.titolo&&t("p",{class:{"custom-content":this.customContent}},this.titolo),t("div",{key:"a93cb0b556c110b95f89a5ebac3fbfe0dab3ac74",class:{content:true,"custom-content":this.customContent}},t("div",{key:"c8aab3d52f2938cf75df111719f8e4bf1fdbeaf5"},t("p",{key:"d1658fc5bd5426afa3014d32f63b3f341f23745e",class:"authors",ref:e=>this.ellipsisAuthors=e},t("span",{key:"5e34c29544c596fbbcf3e63e7c6bc83d87ff769d",title:this.getTitleAuthors()},t("span",{key:"c2bafd8e92c1aea55c9fca61a5ce413ef798e8aa","aria-description":"Autori",class:"bold"},this.autori))),t("p",{key:"974b294cb52e721c89cd3cdd109912c37a4678c6",class:"year-isbn"},t("span",{key:"b3519bbf042c6dc6f03b30c8a58a93bcdfe2579f",class:"isbn"},t("span",{key:"212a231d499a2c2c9d11a91ffbf7c18c00963397"},t("span",{key:"d85d6ab5d999105f36cf2f90fffe42d352a75b67","aria-description":"ISBN edizione cartacea",class:"bold"},this.isbn)," ","(ed. cartacea)")))),t("div",{key:"bf8ae2a2c8544702c7643c5e39450d2960a4c10e",class:`slot-handler ${this.isOpen?"visible":"hidden"}`},t("slot",{key:"9774d27b4959431244b573ba9f7c08e112799427",name:"list"})))),this.customContent&&t("slot",{name:"content"}))}get host(){return o(this)}};n.style=s;export{n as z_myz_card_footer};
+//# sourceMappingURL=p-cab235e5.entry.js.map

package/dist/web-components-library/{p-c2d44867.entry.js → p-cb1cbc74.entry.js}

@@ -1,2 +1,2 @@
-import{r as a,h as o}from"./p-10bb4f4b.js";const e=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{display:grid;padding-top:calc(var(--space-unit) * 1.5);border-bottom:var(--border-size-small) solid var(--color-surface03);color:var(--color-surface05);fill:var(--color-surface05);font-size:14px;grid-template-columns:36px auto;grid-template-rows:auto auto}:host>div>z-icon{grid-column:1 / 2;grid-row:1 / 2}:host>div>div.content{margin-bottom:var(--space-unit);grid-column:2 / 3;grid-row:1 / 2}:host>div>div.cta-wrapper{display:flex;flex-flow:column nowrap;align-items:center;justify-content:flex-start;margin-bottom:var(--space-unit);grid-column:1 / 3;grid-row:2 / 3}@media only screen and (min-width: 768px){:host>div>div.cta-wrapper{flex-direction:row;grid-column:2 / 3}}";const r=e;const t=class{constructor(o){a(this,o)}render(){return o("div",{key:"db10fcdf23fbd0da7833e01f8d72a6302f6cadba"},o("z-icon",{key:"7c241ba1a147f71db15162c5ee6d84738536430e",name:"exclamation-circle"}),o("div",{key:"7ec8936f539f19047c644be7b9ec1dd985d3d42e",class:"content"},o("slot",{key:"a6cd9ab932dcac28058640df1a08da9f174e1a2b"})),o("div",{key:"376e912ec9d49a7148b620b54ce26d9e8a278f1f",class:"cta-wrapper"},o("slot",{key:"3ccbb7a2cd41d211ab76734fb73e7b23aa100d9b",name:"cta"})))}};t.style=r;export{t as z_pocket_message};
-//# sourceMappingURL=p-c2d44867.entry.js.map
+import{r as a,h as o}from"./p-10bb4f4b.js";const c=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{display:grid;padding-top:calc(var(--space-unit) * 1.5);border-bottom:var(--border-size-small) solid var(--color-surface03);color:var(--color-surface05);fill:var(--color-surface05);font-size:14px;grid-template-columns:36px auto;grid-template-rows:auto auto}:host>div>z-icon{grid-column:1 / 2;grid-row:1 / 2}:host>div>div.content{margin-bottom:var(--space-unit);grid-column:2 / 3;grid-row:1 / 2}:host>div>div.cta-wrapper{display:flex;flex-flow:column nowrap;align-items:center;justify-content:flex-start;margin-bottom:var(--space-unit);grid-column:1 / 3;grid-row:2 / 3}@media only screen and (min-width: 768px){:host>div>div.cta-wrapper{flex-direction:row;grid-column:2 / 3}}";const e=c;const r=class{constructor(o){a(this,o)}render(){return o("div",{key:"fc7dd1f124a7891d06714e8e246fb9b7b9e51036"},o("z-icon",{key:"c1889b328efb70835d3049cd96c7893baf6fa0c9",name:"exclamation-circle"}),o("div",{key:"2d7adc5063f6207ef8ff0ca148fd8b77c1d9096d",class:"content"},o("slot",{key:"b16cc5a7086302b73baa229ef37f3df14bae4676"})),o("div",{key:"91e56d2ae0cf57cc0c6d2898fb05b3fc83b87f99",class:"cta-wrapper"},o("slot",{key:"c9e114961d136434110f37614ac725a59a54c8e3",name:"cta"})))}};r.style=e;export{r as z_pocket_message};
+//# sourceMappingURL=p-cb1cbc74.entry.js.map

package/dist/web-components-library/p-ceaf6262.entry.js

@@ -0,0 +1,2 @@
+import{r as o,c as t,h as i}from"./p-10bb4f4b.js";const r=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{display:flex;width:inherit;padding:calc(var(--space-unit) * 2);background:var(--color-primary03);border-radius:var(--border-radius)}:host>div>slot{color:var(--color-default-text);font-size:14px}:host>div>z-icon{margin-left:calc(var(--space-unit) * 2);cursor:pointer;fill:var(--color-primary01)}";const s=r;const a=class{constructor(i){o(this,i);this.infoBoxClose=t(this,"infoBoxClose",7);this.boxid=undefined;this.isclosable=true}emitInfoBoxClose(){this.infoBoxClose.emit({boxid:this.boxid})}render(){return i("div",{key:"dcefc3298cf5c600a7d53ab050df26bacb9bf7f0",id:this.boxid},i("slot",{key:"0a08e8819fcf0f852652716109b59efe3bf7ef09",name:"content"}),this.isclosable&&i("z-icon",{name:"multiply","data-action":"infoBoxClose",onClick:()=>this.emitInfoBoxClose()}))}};a.style=s;export{a as z_info_box};
+//# sourceMappingURL=p-ceaf6262.entry.js.map

package/dist/web-components-library/p-ceaf6262.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZInfoBoxStyle0","ZInfoBox","emitInfoBoxClose","this","infoBoxClose","emit","boxid","render","h","key","id","name","isclosable","onClick"],"sources":["src/components/notification/z-info-box/styles.css?tag=z-info-box&encapsulation=shadow","src/components/notification/z-info-box/index.tsx"],"sourcesContent":[":host {\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host > div {\n  display: flex;\n  width: inherit;\n  padding: calc(var(--space-unit) * 2);\n  background: var(--color-primary03);\n  border-radius: var(--border-radius);\n}\n\n:host > div > slot {\n  color: var(--color-default-text);\n  font-size: 14px;\n}\n\n:host > div > z-icon {\n  margin-left: calc(var(--space-unit) * 2);\n  cursor: pointer;\n  fill: var(--color-primary01);\n}\n","import {Component, Prop, h, Event, EventEmitter} from \"@stencil/core\";\n\n/**\n * @slot content - set the info box content\n */\n@Component({\n  tag: \"z-info-box\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZInfoBox {\n  /** info box unique id */\n  @Prop()\n  boxid: string;\n\n  /** render close icon flag */\n  @Prop()\n  isclosable = true;\n\n  /** emitted on close icon click */\n  @Event()\n  infoBoxClose: EventEmitter;\n\n  private emitInfoBoxClose(): void {\n    this.infoBoxClose.emit({boxid: this.boxid});\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div id={this.boxid}>\n        <slot name=\"content\" />\n        {this.isclosable && (\n          <z-icon\n            name=\"multiply\"\n            data-action=\"infoBoxClose\"\n            onClick={() => this.emitInfoBoxClose()}\n          />\n        )}\n      </div>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAY,wXAClB,MAAAC,EAAeD,E,MCSFE,EAAQ,M,yGAON,I,CAML,gBAAAC,GACNC,KAAKC,aAAaC,KAAK,CAACC,MAAOH,KAAKG,O,CAGtC,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,GAAIP,KAAKG,OACZE,EAAA,QAAAC,IAAA,2CAAME,KAAK,YACVR,KAAKS,YACJJ,EAAA,UACEG,KAAK,WAAU,cACH,eACZE,QAAS,IAAMV,KAAKD,qB"}

package/dist/web-components-library/p-ddf016c1.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as o,h as n,a as i}from"./p-10bb4f4b.js";const e=':host{--z-notification--top-offset:0;display:flex;width:100%;box-sizing:border-box;align-items:flex-start;padding:calc(var(--space-unit) * 2);border-bottom:var(--border-size-medium) solid var(--color-surface03);font-family:var(--font-family-sans);outline:none}:host[sticky]{position:sticky;top:var(--z-notification--top-offset)}:host[sticky],:host([showshadow]){box-shadow:var(--shadow-3)}:host([type="success"]){background:var(--color-success-inverse)}:host([type="warning"]){background:var(--color-warning-inverse)}:host([type="error"]){background:var(--color-error-inverse)}.status-icon,.close-button{display:flex;height:20px;align-items:center}:host([type="success"]) .status-icon{fill:var(--color-success01)}:host([type="warning"]) .status-icon{fill:var(--color-warning02)}:host([type="error"]) .status-icon{fill:var(--color-error01)}:host>button,.content-container>button{padding:0;border:none;margin:0;background:transparent;cursor:pointer;font-family:inherit}.status-icon+.content-container{margin-left:var(--space-unit)}.content-container{display:flex;flex:1 auto;flex-wrap:wrap;align-items:baseline;justify-content:space-between;row-gap:calc(var(--space-unit) * 2)}.content-text{max-width:800px;color:var(--color-default-text);font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:20px}.action-button{color:var(--color-primary01);font-size:var(--font-size-1);font-weight:var(--font-sb);letter-spacing:0.32px;line-height:16px}.content-container+.close-button{margin-left:calc(var(--space-unit) * 2)}.close-button z-icon{fill:var(--color-primary01)}@media and (min-width: 768px){.content-container{flex-wrap:nowrap}.content-text+.action-button{margin-left:calc(var(--space-unit) * 5)}}';const s=e;const a=class{handleActionButtonClick(t){t.preventDefault();this.notificationAction.emit()}handleCloseButtonClick(t){t.preventDefault();this.notificationClose.emit()}constructor(n){t(this,n);this.notificationAction=o(this,"notificationAction",7);this.notificationClose=o(this,"notificationClose",7);this.contenticonname=undefined;this.actiontext=undefined;this.type=undefined;this.showclose=false;this.showshadow=false;this.sticky=false;this.handleActionButtonClick=this.handleActionButtonClick.bind(this);this.handleCloseButtonClick=this.handleCloseButtonClick.bind(this)}render(){var t;return n(i,{key:"b610c9bba78b5d6773e97cdcc7d758e6e26e883b"},this.contenticonname&&n("z-icon",{class:"status-icon",name:this.contenticonname,width:16,height:16}),n("div",{key:"c3f2d084587396ece3e4a69db068cd11cd41a086",class:"content-container"},n("div",{key:"0c03f73bdad7fca93e1aba2f7946b33cf49690d5",class:"content-text"},n("slot",{key:"544dedd18270206a8ba2925edfa3aa84268e0c4f"})),!!((t=this.actiontext)===null||t===void 0?void 0:t.trim())&&n("button",{class:"action-button",type:"button",onClick:this.handleActionButtonClick},this.actiontext)),this.showclose&&n("button",{class:"close-button",type:"button",onClick:this.handleCloseButtonClick},n("z-icon",{name:"multiply-circle",width:16,height:16})))}};a.style=s;export{a as z_notification};
+//# sourceMappingURL=p-ddf016c1.entry.js.map

package/dist/web-components-library/p-ddf016c1.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZNotificationStyle0","ZNotification","handleActionButtonClick","e","preventDefault","this","notificationAction","emit","handleCloseButtonClick","notificationClose","constructor","hostRef","bind","render","h","Host","key","contenticonname","class","name","width","height","_a","actiontext","trim","type","onClick","showclose"],"sources":["src/components/notification/z-notification/styles.css?tag=z-notification&encapsulation=shadow","src/components/notification/z-notification/index.tsx"],"sourcesContent":[":host {\n  --z-notification--top-offset: 0;\n\n  display: flex;\n  width: 100%;\n  box-sizing: border-box;\n  align-items: flex-start;\n  padding: calc(var(--space-unit) * 2);\n  border-bottom: var(--border-size-medium) solid var(--color-surface03);\n  font-family: var(--font-family-sans);\n  outline: none;\n}\n\n:host[sticky] {\n  position: sticky;\n  top: var(--z-notification--top-offset);\n}\n\n:host[sticky],\n:host([showshadow]) {\n  box-shadow: var(--shadow-3);\n}\n\n:host([type=\"success\"]) {\n  background: var(--color-success-inverse);\n}\n\n:host([type=\"warning\"]) {\n  background: var(--color-warning-inverse);\n}\n\n:host([type=\"error\"]) {\n  background: var(--color-error-inverse);\n}\n\n.status-icon,\n.close-button {\n  /* simulate the line-height of the text\n  to make the icon look correctly aligned with it. */\n  display: flex;\n  height: 20px;\n  align-items: center;\n}\n\n:host([type=\"success\"]) .status-icon {\n  fill: var(--color-success01);\n}\n\n:host([type=\"warning\"]) .status-icon {\n  fill: var(--color-warning02);\n}\n\n:host([type=\"error\"]) .status-icon {\n  fill: var(--color-error01);\n}\n\n:host > button,\n.content-container > button {\n  padding: 0;\n  border: none;\n  margin: 0;\n  background: transparent;\n  cursor: pointer;\n  font-family: inherit;\n}\n\n.status-icon + .content-container {\n  margin-left: var(--space-unit);\n}\n\n.content-container {\n  display: flex;\n  flex: 1 auto;\n  flex-wrap: wrap;\n  align-items: baseline;\n  justify-content: space-between;\n  row-gap: calc(var(--space-unit) * 2);\n}\n\n.content-text {\n  max-width: 800px;\n  color: var(--color-default-text);\n  font-size: var(--font-size-2);\n  font-weight: var(--font-rg);\n  letter-spacing: 0.16px;\n  line-height: 20px;\n}\n\n.action-button {\n  color: var(--color-primary01);\n  font-size: var(--font-size-1);\n  font-weight: var(--font-sb);\n  letter-spacing: 0.32px;\n  line-height: 16px;\n}\n\n.content-container + .close-button {\n  margin-left: calc(var(--space-unit) * 2);\n}\n\n.close-button z-icon {\n  fill: var(--color-primary01);\n}\n\n/* Tablet breakpoint */\n@media and (min-width: 768px) {\n  .content-container {\n    flex-wrap: nowrap;\n  }\n\n  .content-text + .action-button {\n    margin-left: calc(var(--space-unit) * 5);\n  }\n}\n","import {Component, Prop, h, Event, EventEmitter, Host} from \"@stencil/core\";\nimport {NotificationType} from \"../../../beans\";\n\n/**\n * Notification bar component.\n * @slot - The text of the notification.\n * @cssprop --z-notification--top-offset - The top offset of the notification. Use it when `sticky` prop is set to `true` and you need the notification to stay under other sticky elements. Default: 0px.\n */\n@Component({\n  tag: \"z-notification\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZNotification {\n  /** Name of the icon on the left of the content */\n  @Prop()\n  contenticonname?: string;\n\n  /** Action button text */\n  @Prop()\n  actiontext?: string;\n\n  /** Alert variant type */\n  @Prop({reflect: true})\n  type: NotificationType;\n\n  /** Enable close icon */\n  @Prop()\n  showclose?: boolean = false;\n\n  /**\n   * Enable shadow.\n   * @deprecated shadow is available only for the `sticky` version of the notification.\n   */\n  @Prop({reflect: true})\n  showshadow?: boolean = false;\n\n  /** Enable sticky notification bar. */\n  @Prop({reflect: true})\n  sticky?: boolean = false;\n\n  /** Call to action clicked */\n  @Event()\n  notificationAction: EventEmitter;\n\n  private handleActionButtonClick(e: MouseEvent): void {\n    e.preventDefault();\n    this.notificationAction.emit();\n  }\n\n  /** Close button clicked */\n  @Event()\n  notificationClose: EventEmitter;\n\n  private handleCloseButtonClick(e: MouseEvent): void {\n    e.preventDefault();\n    this.notificationClose.emit();\n  }\n\n  constructor() {\n    this.handleActionButtonClick = this.handleActionButtonClick.bind(this);\n    this.handleCloseButtonClick = this.handleCloseButtonClick.bind(this);\n  }\n\n  render(): HTMLZNotificationElement {\n    return (\n      <Host>\n        {this.contenticonname && (\n          <z-icon\n            class=\"status-icon\"\n            name={this.contenticonname}\n            width={16}\n            height={16}\n          />\n        )}\n        <div class=\"content-container\">\n          <div class=\"content-text\">\n            <slot></slot>\n          </div>\n          {!!this.actiontext?.trim() && (\n            <button\n              class=\"action-button\"\n              type=\"button\"\n              onClick={this.handleActionButtonClick}\n            >\n              {this.actiontext}\n            </button>\n          )}\n        </div>\n        {this.showclose && (\n          <button\n            class=\"close-button\"\n            type=\"button\"\n            onClick={this.handleCloseButtonClick}\n          >\n            <z-icon\n              name=\"multiply-circle\"\n              width={16}\n              height={16}\n            />\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAY,osDAClB,MAAAC,EAAeD,E,MCYFE,EAAa,MAgChB,uBAAAC,CAAwBC,GAC9BA,EAAEC,iBACFC,KAAKC,mBAAmBC,M,CAOlB,sBAAAC,CAAuBL,GAC7BA,EAAEC,iBACFC,KAAKI,kBAAkBF,M,CAGzB,WAAAG,CAAAC,G,kNA/BsB,M,gBAOC,M,YAIJ,MAqBjBN,KAAKH,wBAA0BG,KAAKH,wBAAwBU,KAAKP,MACjEA,KAAKG,uBAAyBH,KAAKG,uBAAuBI,KAAKP,K,CAGjE,MAAAQ,G,MACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFX,KAAKY,iBACJH,EAAA,UACEI,MAAM,cACNC,KAAMd,KAAKY,gBACXG,MAAO,GACPC,OAAQ,KAGZP,EAAA,OAAAE,IAAA,2CAAKE,MAAM,qBACTJ,EAAA,OAAAE,IAAA,2CAAKE,MAAM,gBACTJ,EAAA,QAAAE,IAAA,kDAECM,EAAAjB,KAAKkB,cAAU,MAAAD,SAAA,SAAAA,EAAEE,SAClBV,EAAA,UACEI,MAAM,gBACNO,KAAK,SACLC,QAASrB,KAAKH,yBAEbG,KAAKkB,aAIXlB,KAAKsB,WACJb,EAAA,UACEI,MAAM,eACNO,KAAK,SACLC,QAASrB,KAAKG,wBAEdM,EAAA,UACEK,KAAK,kBACLC,MAAO,GACPC,OAAQ,M"}

package/dist/web-components-library/{p-59875f0f.entry.js → p-e0122d52.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as i}from"./p-10bb4f4b.js";const n="ul{padding:0;margin:0}";const s=n;const a=class{constructor(i){t(this,i);this.inputrawdata=undefined;this.list=undefined}componentWillLoad(){if(this.inputrawdata){this.parseinputrawdata(this.inputrawdata)}}parseinputrawdata(t){this.list=[...JSON.parse(t)]}oninputrawdataChange(t){this.parseinputrawdata(t)}render(){const t=this.list?this.list.length-1:-1;return i("ul",{key:"943b3633a4b233466186116698cb65f49ecde7ce"},this.list&&this.list.map(((n,s)=>i("z-myz-list-item",{listitemid:n.listitemid,text:n.text,link:n.link,linktarget:n.linktarget,icon:n.icon,underlined:t!=s}))))}static get watchers(){return{inputrawdata:["oninputrawdataChange"]}}};a.style=s;export{a as z_myz_list};
-//# sourceMappingURL=p-59875f0f.entry.js.map
+import{r as t,h as i}from"./p-10bb4f4b.js";const n="ul{padding:0;margin:0}";const s=n;const a=class{constructor(i){t(this,i);this.inputrawdata=undefined;this.list=undefined}componentWillLoad(){if(this.inputrawdata){this.parseinputrawdata(this.inputrawdata)}}parseinputrawdata(t){this.list=[...JSON.parse(t)]}oninputrawdataChange(t){this.parseinputrawdata(t)}render(){const t=this.list?this.list.length-1:-1;return i("ul",{key:"b581a0e630c75f05449a6dbf4eb45234085c0432"},this.list&&this.list.map(((n,s)=>i("z-myz-list-item",{listitemid:n.listitemid,text:n.text,link:n.link,linktarget:n.linktarget,icon:n.icon,underlined:t!=s}))))}static get watchers(){return{inputrawdata:["oninputrawdataChange"]}}};a.style=s;export{a as z_myz_list};
+//# sourceMappingURL=p-e0122d52.entry.js.map

package/dist/web-components-library/p-e0e322cc.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,a as s,g as a}from"./p-10bb4f4b.js";import{s as n}from"./p-025f494e.js";import{m as r}from"./p-2c886e8b.js";import{H as o}from"./p-54b0b04e.js";const l=":host{display:inline-block;width:100vw;min-width:200px;--percentuale:0}:host(.slide-in-left){animation:slideinleft 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-right){animation:slideinright 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-down){animation:slideindown 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-up){animation:slideinup 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-left){animation:slideoutleft 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-right){animation:slideoutright 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-down){animation:slideoutdown 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-up){animation:slideoutup 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}@keyframes slideinleft{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes slideinright{0%{transform:translateX(-100%)}100%{transform:translateX(0)}}@keyframes slideinup{0%{opacity:0;transform:translateY(100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideindown{0%{opacity:0;transform:translateY(-100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideoutleft{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(-100%)}}@keyframes slideoutright{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(100%)}}@keyframes slideoutup{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(-100%)}}@keyframes slideoutdown{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(100%)}}:host>#external-container{display:flex;min-height:52px;box-sizing:border-box;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);border-radius:4px;box-shadow:var(--shadow-3);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px}:host>#external-container.mobile-wrapped>#icon{align-self:flex-start}:host>#external-container.several-lines-padding{padding:calc(var(--space-unit) * 2)}:host>#external-container>#flex-container{display:flex;width:100%;flex-wrap:wrap;align-items:center;justify-content:space-between}:host>#external-container #text{margin-right:calc(var(--space-unit) * 2);color:var(--color-white);letter-spacing:0.16px;line-height:20px;text-align:left}:host>#external-container #text>.title{margin-right:4px;font-weight:600}:host>#external-container.mobile-wrapped #button ::slotted(z-button){margin-top:calc(var(--space-unit) * 2)}:host>#external-container #icon{margin-left:calc(var(--space-unit) * 2);cursor:pointer;fill:var(--color-white)}:host>#external-container.dark{background:var(--gray800)}:host>#external-container.light{background:var(--color-background)}:host>#external-container.light #icon,:host>#external-container.warning #text,:host>#external-container.warning #icon{fill:var(--color-primary01-icon)}:host>#external-container.light #text,:host>#external-container.warning #text{color:var(--gray800)}:host>#external-container.accent{background:var(--color-primary01)}:host>#external-container.error{background:var(--color-error-default)}:host>#external-container.success{background:var(--color-success-default)}:host>#external-container.warning{background:var(--color-warning-default)}@media only screen and (min-width: 768px){:host{width:unset;max-width:50vw}:host>#external-container>#flex-container{flex-wrap:nowrap}:host>#external-container #text{width:100%}}@media only screen and (min-width: 1366px){:host{width:unset;max-width:33vw}}";const h=l;const c=class{constructor(i){t(this,i);this.toastClose=e(this,"toastClose",7);this.isCloseEventCalled=false;this.heading=undefined;this.message=undefined;this.closebutton=undefined;this.autoclose=undefined;this.pauseonfocusloss=true;this.type=undefined;this.isdraggable=true;this.draggablepercentage=80;this.transition=undefined;this.percentage=undefined}watchPropIsdraggable(t){if(t){this.sliderManager.get("pan").set({enable:true})}else{this.sliderManager.get("pan").set({enable:false})}}watchPropAutoclose(t){clearTimeout(this.timeoutHandle);this.startClosingTimeout(t)}watchPropPauseonfocusloss(t){if(this.autoclose){if(t){document.addEventListener("visibilitychange",this.visibilityChangeEventHandler)}else{document.removeEventListener("visibilitychange",this.visibilityChangeEventHandler)}}}emitToastClose(t){this.timeoutHandle=null;this.elapsedTime=null;this.hostElement.classList.add(t);this.toastClose.emit()}componentWillLoad(){this.isMobile=window.innerWidth<=r;this.validateAutoclose();this.percentage=0}componentDidLoad(){this.isTextLong=this.detectWrap()||this.toastText.offsetHeight>20;this.startTime=Date.now();if(this.autoclose&&this.pauseonfocusloss){document.addEventListener("visibilitychange",this.visibilityChangeEventHandler)}this.isdraggable&&this.handleSlideOutDragAnimation()}visibilityChangeEventHandler(){if(document.visibilityState==="hidden"){this.timeoutHandle&&this.onBlur()}else{this.elapsedTime&&this.onFocus()}}validateAutoclose(){if(!this.autoclose&&!this.closebutton){console.error("At least one between autoclose and closebutton must be present")}}mapSlideOutClass(){switch(this.transition){case n.SLIDE_IN_DOWN:return n.SLIDE_OUT_UP;case n.SLIDE_IN_UP:return n.SLIDE_OUT_DOWN;case n.SLIDE_IN_LEFT:return n.SLIDE_OUT_RIGHT;case n.SLIDE_IN_RIGHT:return n.SLIDE_OUT_LEFT}}calculateDraggedPercentage(t){const e=this.hostElement.getBoundingClientRect();return Math.round(100*t.deltaX/e.width)}handleSlideOutDragAnimation(){this.sliderManager=new o(this.hostElement);this.sliderManager.get("pan").set({direction:o.DIRECTION_HORIZONTAL});this.sliderManager.on("pan",(t=>{this.percentage=this.calculateDraggedPercentage(t);this.hostElement.style.transition="none";this.hostElement.classList.remove(this.transition);const e={translate:`translateX(${this.percentage}%)`,translateBack:"translateX(0)"};this.hostElement.style.opacity=`${100-Math.abs(this.percentage)}%`;if(t.eventType===o.DIRECTION_LEFT||t.eventType===o.DIRECTION_RIGHT){this.hostElement.style.transform=e.translate;if(Math.abs(this.percentage)>this.draggablepercentage&&!this.isCloseEventCalled){this.isCloseEventCalled=true;this.emitToastClose(t.direction===o.DIRECTION_LEFT?"slide-out-left":"slide-out-right")}}if(t.isFinal&&Math.abs(this.percentage)<this.draggablepercentage){this.hostElement.style.transform=e.translateBack;this.hostElement.style.transition="all 1s";this.hostElement.style.opacity="100%";this.percentage=0}}))}onFocus(){let t=this.autoclose;if(this.elapsedTime){t=this.autoclose-this.elapsedTime}if(t>0){this.startClosingTimeout(t)}}onBlur(){this.elapsedTime=Date.now()-this.startTime;clearTimeout(this.timeoutHandle)}startClosingTimeout(t){this.timeoutHandle=window.setTimeout((()=>this.emitToastClose(this.mapSlideOutClass())),t)}detectWrap(){const t=this.container.offsetWidth;const e=this.container.children;let i=0;for(let t=0;t<e.length;t++){i+=e[t].offsetWidth}return i>t}renderText(){return i("div",{id:"text",ref:t=>this.toastText=t},i("span",{class:"title"},this.heading),i("span",{class:"message"},this.message))}renderButton(){return i("div",{id:"button"},i("slot",{name:"button"}))}renderCloseIcon(){if(!this.closebutton){return}return i("div",{id:"icon"},i("z-icon",{tabIndex:0,name:"multiply-circled",width:15,height:15,onClick:()=>this.emitToastClose(this.mapSlideOutClass()),onKeyPress:t=>{if(t.keyCode==32||t.keyCode==13){t.preventDefault();this.emitToastClose(this.mapSlideOutClass())}}}))}renderContainer(){return i("div",{tabIndex:0,id:"external-container",class:{[this.type]:!!this.type,"several-lines-padding":this.isTextLong},ref:t=>this.container=t},this.renderText(),this.renderButton(),this.renderCloseIcon())}renderMobileContainer(){return i("div",{id:"external-container",class:{[this.type]:!!this.type,"several-lines-padding":this.isTextLong,"mobile-wrapped":this.isTextLong}},i("div",{id:"flex-container",ref:t=>this.container=t},this.renderText(),this.renderButton()),this.renderCloseIcon())}render(){return i(s,{key:"d6ea4a44c85076f5db4dca3513e6f659f3405d13",style:{"--percentuale":`${this.percentage}%`},class:this.transition?this.transition:n.SLIDE_IN_DOWN,onAnimationEnd:t=>{if(this.autoclose&&t.animationName.includes("slidein")){this.startClosingTimeout(this.autoclose)}if(t.animationName.includes("slideout")){this.hostElement.parentNode.removeChild(this.hostElement)}}},this.isMobile?this.renderMobileContainer():this.renderContainer())}get hostElement(){return a(this)}static get watchers(){return{isdraggable:["watchPropIsdraggable"],autoclose:["watchPropAutoclose"],pauseonfocusloss:["watchPropPauseonfocusloss"]}}};c.style=h;export{c as z_toast_notification};
+//# sourceMappingURL=p-e0e322cc.entry.js.map

package/dist/web-components-library/p-e0e322cc.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZToastNotificationStyle0","ZToastNotification","this","isCloseEventCalled","watchPropIsdraggable","newValue","sliderManager","get","set","enable","watchPropAutoclose","clearTimeout","timeoutHandle","startClosingTimeout","watchPropPauseonfocusloss","autoclose","document","addEventListener","visibilityChangeEventHandler","removeEventListener","emitToastClose","cssClass","elapsedTime","hostElement","classList","add","toastClose","emit","componentWillLoad","isMobile","window","innerWidth","mobileBreakpoint","validateAutoclose","percentage","componentDidLoad","isTextLong","detectWrap","toastText","offsetHeight","startTime","Date","now","pauseonfocusloss","isdraggable","handleSlideOutDragAnimation","visibilityState","onBlur","onFocus","closebutton","console","error","mapSlideOutClass","transition","ToastNotificationTransition","SLIDE_IN_DOWN","SLIDE_OUT_UP","SLIDE_IN_UP","SLIDE_OUT_DOWN","SLIDE_IN_LEFT","SLIDE_OUT_RIGHT","SLIDE_IN_RIGHT","SLIDE_OUT_LEFT","calculateDraggedPercentage","e","bounding","getBoundingClientRect","Math","round","deltaX","width","Hammer","direction","DIRECTION_HORIZONTAL","on","style","remove","translateObj","translate","translateBack","opacity","abs","eventType","DIRECTION_LEFT","DIRECTION_RIGHT","transform","draggablepercentage","isFinal","time","setTimeout","parentWidth","container","offsetWidth","children","totalWidth","i","length","renderText","h","id","ref","el","class","heading","message","renderButton","name","renderCloseIcon","tabIndex","height","onClick","onKeyPress","keyCode","preventDefault","renderContainer","type","renderMobileContainer","render","Host","key","onAnimationEnd","animationName","includes","parentNode","removeChild"],"sources":["src/components/notification/z-toast-notification/styles.css?tag=z-toast-notification&encapsulation=shadow","src/components/notification/z-toast-notification/index.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  width: 100vw;\n  min-width: 200px;\n\n  --percentuale: 0;\n}\n\n:host(.slide-in-left) {\n  animation: slideinleft 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n:host(.slide-in-right) {\n  animation: slideinright 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n:host(.slide-in-down) {\n  animation: slideindown 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n:host(.slide-in-up) {\n  animation: slideinup 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n:host(.slide-out-left) {\n  animation: slideoutleft 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n:host(.slide-out-right) {\n  animation: slideoutright 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n:host(.slide-out-down) {\n  animation: slideoutdown 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n:host(.slide-out-up) {\n  animation: slideoutup 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);\n  animation-fill-mode: forwards;\n}\n\n@keyframes slideinleft {\n  0% {\n    transform: translateX(100%);\n  }\n\n  100% {\n    transform: translateX(0);\n  }\n}\n\n@keyframes slideinright {\n  0% {\n    transform: translateX(-100%);\n  }\n\n  100% {\n    transform: translateX(0);\n  }\n}\n\n@keyframes slideinup {\n  0% {\n    opacity: 0;\n    transform: translateY(100%);\n  }\n\n  100% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes slideindown {\n  0% {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n\n  100% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes slideoutleft {\n  0% {\n    /* stylelint-disable-next-line alpha-value-notation */\n    opacity: calc(100% - var(--percentuale));\n    transform: translateX(var(--percentuale));\n  }\n\n  100% {\n    opacity: 0;\n    transform: translateX(-100%);\n  }\n}\n\n@keyframes slideoutright {\n  0% {\n    /* stylelint-disable-next-line alpha-value-notation */\n    opacity: calc(100% - var(--percentuale));\n    transform: translateX(var(--percentuale));\n  }\n\n  100% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n}\n\n@keyframes slideoutup {\n  0% {\n    opacity: 1;\n    transform: translateY(var(--percentuale));\n  }\n\n  100% {\n    opacity: 0;\n    transform: translateY(-100%);\n  }\n}\n\n@keyframes slideoutdown {\n  0% {\n    opacity: 1;\n    transform: translateY(var(--percentuale));\n  }\n\n  100% {\n    opacity: 0;\n    transform: translateY(100%);\n  }\n}\n\n:host > #external-container {\n  display: flex;\n  min-height: 52px;\n  box-sizing: border-box;\n  align-items: center;\n  justify-content: space-between;\n  padding: calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);\n  border-radius: 4px;\n  box-shadow: var(--shadow-3);\n  font-family: var(--font-family-sans);\n  font-size: 14px;\n  font-weight: var(--font-rg);\n  letter-spacing: 0.16px;\n}\n\n:host > #external-container.mobile-wrapped > #icon {\n  align-self: flex-start;\n}\n\n:host > #external-container.several-lines-padding {\n  padding: calc(var(--space-unit) * 2);\n}\n\n:host > #external-container > #flex-container {\n  display: flex;\n  width: 100%;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: space-between;\n}\n\n:host > #external-container #text {\n  margin-right: calc(var(--space-unit) * 2);\n  color: var(--color-white);\n  letter-spacing: 0.16px;\n  line-height: 20px;\n  text-align: left;\n}\n\n:host > #external-container #text > .title {\n  margin-right: 4px;\n  font-weight: 600;\n}\n\n:host > #external-container.mobile-wrapped #button ::slotted(z-button) {\n  margin-top: calc(var(--space-unit) * 2);\n}\n\n:host > #external-container #icon {\n  margin-left: calc(var(--space-unit) * 2);\n  cursor: pointer;\n  fill: var(--color-white);\n}\n\n:host > #external-container.dark {\n  background: var(--gray800);\n}\n\n:host > #external-container.light {\n  background: var(--color-background);\n}\n\n:host > #external-container.light #icon,\n:host > #external-container.warning #text,\n:host > #external-container.warning #icon {\n  fill: var(--color-primary01-icon);\n}\n\n:host > #external-container.light #text,\n:host > #external-container.warning #text {\n  color: var(--gray800);\n}\n\n:host > #external-container.accent {\n  background: var(--color-primary01);\n}\n\n:host > #external-container.error {\n  background: var(--color-error-default);\n}\n\n:host > #external-container.success {\n  background: var(--color-success-default);\n}\n\n:host > #external-container.warning {\n  background: var(--color-warning-default);\n}\n\n/* Tablet breakpoint */\n@media only screen and (min-width: 768px) {\n  :host {\n    width: unset;\n    max-width: 50vw;\n  }\n\n  :host > #external-container > #flex-container {\n    flex-wrap: nowrap;\n  }\n\n  :host > #external-container #text {\n    width: 100%;\n  }\n}\n\n/* Wide breakpoint */\n@media only screen and (min-width: 1366px) {\n  :host {\n    width: unset;\n    max-width: 33vw;\n  }\n}\n","import {Component, Prop, h, Event, EventEmitter, Element, Host, State, Watch} from \"@stencil/core\";\nimport {ToastNotificationTransition, ToastNotification} from \"../../../beans\";\nimport {mobileBreakpoint} from \"../../../constants/breakpoints\";\n\nimport Hammer from \"hammerjs\";\n\n@Component({\n  tag: \"z-toast-notification\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZToastNotification {\n  @Element() hostElement: HTMLZToastNotificationElement;\n\n  /** toast notification's title */\n  @Prop()\n  heading?: string;\n\n  /** toast notification's message */\n  @Prop()\n  message: string;\n\n  /** toggles closing button rendering */\n  @Prop()\n  closebutton: boolean;\n\n  /** toast notification closing timeout (ms) */\n  @Prop()\n  autoclose?: number;\n\n  /** toast notification autoclose can be paused */\n  @Prop()\n  pauseonfocusloss?: boolean = true;\n\n  /** toast notification type: dark, light, accent, error, success, warning */\n  @Prop()\n  type?: ToastNotification;\n\n  /** toast notification can be draggable*/\n  @Prop()\n  isdraggable?: boolean = true;\n\n  /** toast notification draggable percentage*/\n  @Prop()\n  draggablepercentage?: number = 80;\n\n  /** toast notification animation type: slide-in-left, slide-in-right, slide-in-down, slide-in-up*/\n  @Prop()\n  transition?: ToastNotificationTransition;\n\n  @State()\n  percentage: number;\n\n  private isTextLong: boolean;\n\n  private container!: HTMLElement;\n\n  private toastText!: HTMLElement;\n\n  private sliderManager: HammerManager;\n\n  private elapsedTime: number;\n\n  private timeoutHandle: number;\n\n  private startTime: number;\n\n  private isMobile: boolean;\n\n  private isCloseEventCalled = false;\n\n  @Watch(\"isdraggable\")\n  watchPropIsdraggable(newValue: boolean): void {\n    if (newValue) {\n      this.sliderManager.get(\"pan\").set({enable: true});\n    } else {\n      this.sliderManager.get(\"pan\").set({enable: false});\n    }\n  }\n\n  @Watch(\"autoclose\")\n  watchPropAutoclose(newValue: number): void {\n    clearTimeout(this.timeoutHandle);\n    this.startClosingTimeout(newValue);\n  }\n\n  @Watch(\"pauseonfocusloss\")\n  watchPropPauseonfocusloss(newValue: boolean): void {\n    if (this.autoclose) {\n      if (newValue) {\n        document.addEventListener(\"visibilitychange\", this.visibilityChangeEventHandler);\n      } else {\n        document.removeEventListener(\"visibilitychange\", this.visibilityChangeEventHandler);\n      }\n    }\n  }\n\n  /** notification close event */\n  @Event()\n  toastClose: EventEmitter;\n\n  private emitToastClose(cssClass: string): void {\n    this.timeoutHandle = null;\n    this.elapsedTime = null;\n    this.hostElement.classList.add(cssClass);\n    this.toastClose.emit();\n  }\n\n  componentWillLoad(): void {\n    this.isMobile = window.innerWidth <= mobileBreakpoint;\n    this.validateAutoclose();\n    this.percentage = 0;\n  }\n\n  componentDidLoad(): void {\n    this.isTextLong = this.detectWrap() || this.toastText.offsetHeight > 20;\n    this.startTime = Date.now();\n    if (this.autoclose && this.pauseonfocusloss) {\n      document.addEventListener(\"visibilitychange\", this.visibilityChangeEventHandler);\n    }\n\n    this.isdraggable && this.handleSlideOutDragAnimation();\n  }\n\n  private visibilityChangeEventHandler(): void {\n    if (document.visibilityState === \"hidden\") {\n      this.timeoutHandle && this.onBlur();\n    } else {\n      this.elapsedTime && this.onFocus();\n    }\n  }\n\n  private validateAutoclose(): void {\n    if (!this.autoclose && !this.closebutton) {\n      console.error(\"At least one between autoclose and closebutton must be present\");\n    }\n  }\n\n  private mapSlideOutClass(): ToastNotificationTransition {\n    switch (this.transition) {\n      case ToastNotificationTransition.SLIDE_IN_DOWN:\n        return ToastNotificationTransition.SLIDE_OUT_UP;\n      case ToastNotificationTransition.SLIDE_IN_UP:\n        return ToastNotificationTransition.SLIDE_OUT_DOWN;\n      case ToastNotificationTransition.SLIDE_IN_LEFT:\n        return ToastNotificationTransition.SLIDE_OUT_RIGHT;\n      case ToastNotificationTransition.SLIDE_IN_RIGHT:\n        return ToastNotificationTransition.SLIDE_OUT_LEFT;\n    }\n  }\n\n  private calculateDraggedPercentage(e): number {\n    const bounding = this.hostElement.getBoundingClientRect();\n\n    return Math.round((100 * e.deltaX) / bounding.width);\n  }\n\n  private handleSlideOutDragAnimation(): void {\n    this.sliderManager = new Hammer(this.hostElement);\n    this.sliderManager.get(\"pan\").set({\n      direction: Hammer.DIRECTION_HORIZONTAL,\n    });\n\n    this.sliderManager.on(\"pan\", (e) => {\n      this.percentage = this.calculateDraggedPercentage(e);\n      this.hostElement.style.transition = \"none\";\n      this.hostElement.classList.remove(this.transition);\n      const translateObj = {\n        translate: `translateX(${this.percentage}%)`,\n        translateBack: \"translateX(0)\",\n      };\n\n      this.hostElement.style.opacity = `${100 - Math.abs(this.percentage)}%`;\n      if (e.eventType === Hammer.DIRECTION_LEFT || e.eventType === Hammer.DIRECTION_RIGHT) {\n        this.hostElement.style.transform = translateObj.translate;\n        if (Math.abs(this.percentage) > this.draggablepercentage && !this.isCloseEventCalled) {\n          this.isCloseEventCalled = true;\n          this.emitToastClose(e.direction === Hammer.DIRECTION_LEFT ? \"slide-out-left\" : \"slide-out-right\");\n        }\n      }\n\n      if (e.isFinal && Math.abs(this.percentage) < this.draggablepercentage) {\n        this.hostElement.style.transform = translateObj.translateBack;\n        this.hostElement.style.transition = \"all 1s\";\n        this.hostElement.style.opacity = \"100%\";\n        this.percentage = 0;\n      }\n    });\n  }\n\n  private onFocus(): void {\n    let time = this.autoclose;\n    if (this.elapsedTime) {\n      time = this.autoclose - this.elapsedTime;\n    }\n    if (time > 0) {\n      this.startClosingTimeout(time);\n    }\n  }\n\n  private onBlur(): void {\n    this.elapsedTime = Date.now() - this.startTime;\n    clearTimeout(this.timeoutHandle);\n  }\n\n  private startClosingTimeout(time: number): void {\n    this.timeoutHandle = window.setTimeout(() => this.emitToastClose(this.mapSlideOutClass()), time);\n  }\n\n  private detectWrap(): boolean {\n    const parentWidth = this.container.offsetWidth;\n    const children = this.container.children;\n    let totalWidth = 0;\n\n    for (let i = 0; i < children.length; i++) {\n      totalWidth += (children[i] as HTMLElement).offsetWidth;\n    }\n\n    return totalWidth > parentWidth;\n  }\n\n  private renderText(): HTMLDivElement {\n    return (\n      <div\n        id=\"text\"\n        ref={(el) => (this.toastText = el as HTMLElement)}\n      >\n        <span class=\"title\">{this.heading}</span>\n        <span class=\"message\">{this.message}</span>\n      </div>\n    );\n  }\n\n  private renderButton(): HTMLDivElement {\n    return (\n      <div id=\"button\">\n        <slot name=\"button\" />\n      </div>\n    );\n  }\n\n  private renderCloseIcon(): HTMLDivElement {\n    if (!this.closebutton) {\n      return;\n    }\n\n    return (\n      <div id=\"icon\">\n        <z-icon\n          tabIndex={0}\n          name=\"multiply-circled\"\n          width={15}\n          height={15}\n          onClick={() => this.emitToastClose(this.mapSlideOutClass())}\n          onKeyPress={(e) => {\n            if (e.keyCode == 32 || e.keyCode == 13) {\n              e.preventDefault();\n              this.emitToastClose(this.mapSlideOutClass());\n            }\n          }}\n        />\n      </div>\n    );\n  }\n\n  private renderContainer(): HTMLDivElement {\n    return (\n      <div\n        tabIndex={0}\n        id=\"external-container\"\n        class={{\n          [this.type]: !!this.type,\n          \"several-lines-padding\": this.isTextLong,\n        }}\n        ref={(el) => (this.container = el as HTMLElement)}\n      >\n        {this.renderText()}\n        {this.renderButton()}\n        {this.renderCloseIcon()}\n      </div>\n    );\n  }\n\n  private renderMobileContainer(): HTMLDivElement {\n    return (\n      <div\n        id=\"external-container\"\n        class={{\n          [this.type]: !!this.type,\n          \"several-lines-padding\": this.isTextLong,\n          \"mobile-wrapped\": this.isTextLong,\n        }}\n      >\n        <div\n          id=\"flex-container\"\n          ref={(el) => (this.container = el as HTMLElement)}\n        >\n          {this.renderText()}\n          {this.renderButton()}\n        </div>\n        {this.renderCloseIcon()}\n      </div>\n    );\n  }\n\n  render(): HTMLZToastNotificationElement {\n    return (\n      <Host\n        style={{\n          \"--percentuale\": `${this.percentage}%`,\n        }}\n        class={this.transition ? this.transition : ToastNotificationTransition.SLIDE_IN_DOWN}\n        onAnimationEnd={(e: AnimationEvent) => {\n          if (this.autoclose && e.animationName.includes(\"slidein\")) {\n            this.startClosingTimeout(this.autoclose);\n          }\n          if (e.animationName.includes(\"slideout\")) {\n            this.hostElement.parentNode.removeChild(this.hostElement);\n          }\n        }}\n      >\n        {this.isMobile ? this.renderMobileContainer() : this.renderContainer()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"4KAAA,MAAMA,EAAY,4xHAClB,MAAAC,EAAeD,E,MCUFE,EAAkB,M,gEA0DrBC,KAAAC,mBAAqB,M,wHArCA,K,qCAQL,K,yBAIO,G,oDA4B/B,oBAAAC,CAAqBC,GACnB,GAAIA,EAAU,CACZH,KAAKI,cAAcC,IAAI,OAAOC,IAAI,CAACC,OAAQ,M,KACtC,CACLP,KAAKI,cAAcC,IAAI,OAAOC,IAAI,CAACC,OAAQ,O,EAK/C,kBAAAC,CAAmBL,GACjBM,aAAaT,KAAKU,eAClBV,KAAKW,oBAAoBR,E,CAI3B,yBAAAS,CAA0BT,GACxB,GAAIH,KAAKa,UAAW,CAClB,GAAIV,EAAU,CACZW,SAASC,iBAAiB,mBAAoBf,KAAKgB,6B,KAC9C,CACLF,SAASG,oBAAoB,mBAAoBjB,KAAKgB,6B,GASpD,cAAAE,CAAeC,GACrBnB,KAAKU,cAAgB,KACrBV,KAAKoB,YAAc,KACnBpB,KAAKqB,YAAYC,UAAUC,IAAIJ,GAC/BnB,KAAKwB,WAAWC,M,CAGlB,iBAAAC,GACE1B,KAAK2B,SAAWC,OAAOC,YAAcC,EACrC9B,KAAK+B,oBACL/B,KAAKgC,WAAa,C,CAGpB,gBAAAC,GACEjC,KAAKkC,WAAalC,KAAKmC,cAAgBnC,KAAKoC,UAAUC,aAAe,GACrErC,KAAKsC,UAAYC,KAAKC,MACtB,GAAIxC,KAAKa,WAAab,KAAKyC,iBAAkB,CAC3C3B,SAASC,iBAAiB,mBAAoBf,KAAKgB,6B,CAGrDhB,KAAK0C,aAAe1C,KAAK2C,6B,CAGnB,4BAAA3B,GACN,GAAIF,SAAS8B,kBAAoB,SAAU,CACzC5C,KAAKU,eAAiBV,KAAK6C,Q,KACtB,CACL7C,KAAKoB,aAAepB,KAAK8C,S,EAIrB,iBAAAf,GACN,IAAK/B,KAAKa,YAAcb,KAAK+C,YAAa,CACxCC,QAAQC,MAAM,iE,EAIV,gBAAAC,GACN,OAAQlD,KAAKmD,YACX,KAAKC,EAA4BC,cAC/B,OAAOD,EAA4BE,aACrC,KAAKF,EAA4BG,YAC/B,OAAOH,EAA4BI,eACrC,KAAKJ,EAA4BK,cAC/B,OAAOL,EAA4BM,gBACrC,KAAKN,EAA4BO,eAC/B,OAAOP,EAA4BQ,e,CAIjC,0BAAAC,CAA2BC,GACjC,MAAMC,EAAW/D,KAAKqB,YAAY2C,wBAElC,OAAOC,KAAKC,MAAO,IAAMJ,EAAEK,OAAUJ,EAASK,M,CAGxC,2BAAAzB,GACN3C,KAAKI,cAAgB,IAAIiE,EAAOrE,KAAKqB,aACrCrB,KAAKI,cAAcC,IAAI,OAAOC,IAAI,CAChCgE,UAAWD,EAAOE,uBAGpBvE,KAAKI,cAAcoE,GAAG,OAAQV,IAC5B9D,KAAKgC,WAAahC,KAAK6D,2BAA2BC,GAClD9D,KAAKqB,YAAYoD,MAAMtB,WAAa,OACpCnD,KAAKqB,YAAYC,UAAUoD,OAAO1E,KAAKmD,YACvC,MAAMwB,EAAe,CACnBC,UAAW,cAAc5E,KAAKgC,eAC9B6C,cAAe,iBAGjB7E,KAAKqB,YAAYoD,MAAMK,QAAU,GAAG,IAAMb,KAAKc,IAAI/E,KAAKgC,eACxD,GAAI8B,EAAEkB,YAAcX,EAAOY,gBAAkBnB,EAAEkB,YAAcX,EAAOa,gBAAiB,CACnFlF,KAAKqB,YAAYoD,MAAMU,UAAYR,EAAaC,UAChD,GAAIX,KAAKc,IAAI/E,KAAKgC,YAAchC,KAAKoF,sBAAwBpF,KAAKC,mBAAoB,CACpFD,KAAKC,mBAAqB,KAC1BD,KAAKkB,eAAe4C,EAAEQ,YAAcD,EAAOY,eAAiB,iBAAmB,kB,EAInF,GAAInB,EAAEuB,SAAWpB,KAAKc,IAAI/E,KAAKgC,YAAchC,KAAKoF,oBAAqB,CACrEpF,KAAKqB,YAAYoD,MAAMU,UAAYR,EAAaE,cAChD7E,KAAKqB,YAAYoD,MAAMtB,WAAa,SACpCnD,KAAKqB,YAAYoD,MAAMK,QAAU,OACjC9E,KAAKgC,WAAa,C,KAKhB,OAAAc,GACN,IAAIwC,EAAOtF,KAAKa,UAChB,GAAIb,KAAKoB,YAAa,CACpBkE,EAAOtF,KAAKa,UAAYb,KAAKoB,W,CAE/B,GAAIkE,EAAO,EAAG,CACZtF,KAAKW,oBAAoB2E,E,EAIrB,MAAAzC,GACN7C,KAAKoB,YAAcmB,KAAKC,MAAQxC,KAAKsC,UACrC7B,aAAaT,KAAKU,c,CAGZ,mBAAAC,CAAoB2E,GAC1BtF,KAAKU,cAAgBkB,OAAO2D,YAAW,IAAMvF,KAAKkB,eAAelB,KAAKkD,qBAAqBoC,E,CAGrF,UAAAnD,GACN,MAAMqD,EAAcxF,KAAKyF,UAAUC,YACnC,MAAMC,EAAW3F,KAAKyF,UAAUE,SAChC,IAAIC,EAAa,EAEjB,IAAK,IAAIC,EAAI,EAAGA,EAAIF,EAASG,OAAQD,IAAK,CACxCD,GAAeD,EAASE,GAAmBH,W,CAG7C,OAAOE,EAAaJ,C,CAGd,UAAAO,GACN,OACEC,EAAA,OACEC,GAAG,OACHC,IAAMC,GAAQnG,KAAKoC,UAAY+D,GAE/BH,EAAA,QAAMI,MAAM,SAASpG,KAAKqG,SAC1BL,EAAA,QAAMI,MAAM,WAAWpG,KAAKsG,S,CAK1B,YAAAC,GACN,OACEP,EAAA,OAAKC,GAAG,UACND,EAAA,QAAMQ,KAAK,W,CAKT,eAAAC,GACN,IAAKzG,KAAK+C,YAAa,CACrB,M,CAGF,OACEiD,EAAA,OAAKC,GAAG,QACND,EAAA,UACEU,SAAU,EACVF,KAAK,mBACLpC,MAAO,GACPuC,OAAQ,GACRC,QAAS,IAAM5G,KAAKkB,eAAelB,KAAKkD,oBACxC2D,WAAa/C,IACX,GAAIA,EAAEgD,SAAW,IAAMhD,EAAEgD,SAAW,GAAI,CACtChD,EAAEiD,iBACF/G,KAAKkB,eAAelB,KAAKkD,mB,MAQ7B,eAAA8D,GACN,OACEhB,EAAA,OACEU,SAAU,EACVT,GAAG,qBACHG,MAAO,CACL,CAACpG,KAAKiH,QAASjH,KAAKiH,KACpB,wBAAyBjH,KAAKkC,YAEhCgE,IAAMC,GAAQnG,KAAKyF,UAAYU,GAE9BnG,KAAK+F,aACL/F,KAAKuG,eACLvG,KAAKyG,kB,CAKJ,qBAAAS,GACN,OACElB,EAAA,OACEC,GAAG,qBACHG,MAAO,CACL,CAACpG,KAAKiH,QAASjH,KAAKiH,KACpB,wBAAyBjH,KAAKkC,WAC9B,iBAAkBlC,KAAKkC,aAGzB8D,EAAA,OACEC,GAAG,iBACHC,IAAMC,GAAQnG,KAAKyF,UAAYU,GAE9BnG,KAAK+F,aACL/F,KAAKuG,gBAEPvG,KAAKyG,kB,CAKZ,MAAAU,GACE,OACEnB,EAACoB,EAAI,CAAAC,IAAA,2CACH5C,MAAO,CACL,gBAAiB,GAAGzE,KAAKgC,eAE3BoE,MAAOpG,KAAKmD,WAAanD,KAAKmD,WAAaC,EAA4BC,cACvEiE,eAAiBxD,IACf,GAAI9D,KAAKa,WAAaiD,EAAEyD,cAAcC,SAAS,WAAY,CACzDxH,KAAKW,oBAAoBX,KAAKa,U,CAEhC,GAAIiD,EAAEyD,cAAcC,SAAS,YAAa,CACxCxH,KAAKqB,YAAYoG,WAAWC,YAAY1H,KAAKqB,Y,IAIhDrB,KAAK2B,SAAW3B,KAAKkH,wBAA0BlH,KAAKgH,kB"}

package/dist/web-components-library/{p-eb10781f.entry.js → p-e10e6827.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as i,h as n}from"./p-10bb4f4b.js";import{f as r}from"./p-025f494e.js";const e=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}.digits-container{display:flex;justify-content:flex-start}input{width:calc(var(--space-unit) * 5);height:72px;box-sizing:border-box;padding:0;caret-color:transparent;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:32px;font-weight:300;text-align:center}input.error{border:1px solid;border-color:var(--color-error01);background-color:var(--color-error-inverse);border-radius:4px}input:not(:last-of-type){margin-right:var(--space-unit)}@media only screen and (min-width: 768px){input:not(:last-of-type){margin-right:calc(var(--space-unit) * 2)}}@media only screen and (min-width: 1025px){input{width:calc(var(--space-unit) * 6)}}";const s=e;const a=class{constructor(n){t(this,n);this.otpChange=i(this,"otpChange",7);this.inputNum=6;this.status=undefined;this.message=undefined}emitInputChange(t){this.otpChange.emit({value:t})}componentWillLoad(){this.otp=[...Array(this.inputNum)];this.otpRef=[...Array(this.inputNum)]}render(){return n("div",{key:"a7f919ee8d83098adb6303d6af70a701684d9752",class:"otp-container"},n("div",{key:"07143c3078db7cd5dd9f5bf48c977d87df9457e9",class:"digits-container"},this.otp.map(((t,i)=>n("input",{class:this.status==r.ERROR?"error":null,onKeyDown:t=>{if(t.keyCode>47){this.otpRef[i].value=""}},onKeyUp:t=>{if(t.keyCode>47){i<this.inputNum-1&&this.otpRef[i+1].focus()}},onInput:t=>{this.otp[i]=t.target.value;this.emitInputChange(this.otp.join(""))},type:"text",minlength:"1",maxlength:"1",autoComplete:"off",ref:t=>this.otpRef[i]=t})))),n("z-input-message",{key:"19663f9110cfe610c76ca900938192fb4f7fb96c",message:this.message,status:this.status}))}};a.style=s;export{a as z_otp};
-//# sourceMappingURL=p-eb10781f.entry.js.map
+import{r as t,c as i,h as e}from"./p-10bb4f4b.js";import{f as n}from"./p-025f494e.js";const r=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}.digits-container{display:flex;justify-content:flex-start}input{width:calc(var(--space-unit) * 5);height:72px;box-sizing:border-box;padding:0;caret-color:transparent;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:32px;font-weight:300;text-align:center}input.error{border:1px solid;border-color:var(--color-error01);background-color:var(--color-error-inverse);border-radius:4px}input:not(:last-of-type){margin-right:var(--space-unit)}@media only screen and (min-width: 768px){input:not(:last-of-type){margin-right:calc(var(--space-unit) * 2)}}@media only screen and (min-width: 1025px){input{width:calc(var(--space-unit) * 6)}}";const s=r;const a=class{constructor(e){t(this,e);this.otpChange=i(this,"otpChange",7);this.inputNum=6;this.status=undefined;this.message=undefined}emitInputChange(t){this.otpChange.emit({value:t})}componentWillLoad(){this.otp=[...Array(this.inputNum)];this.otpRef=[...Array(this.inputNum)]}render(){return e("div",{key:"995d76c97533e24975e62c98ecd08b4558a45687",class:"otp-container"},e("div",{key:"97f2ddc116b3c6b41f197037b0612cb39706bed8",class:"digits-container"},this.otp.map(((t,i)=>e("input",{class:this.status==n.ERROR?"error":null,onKeyDown:t=>{if(t.keyCode>47){this.otpRef[i].value=""}},onKeyUp:t=>{if(t.keyCode>47){i<this.inputNum-1&&this.otpRef[i+1].focus()}},onInput:t=>{this.otp[i]=t.target.value;this.emitInputChange(this.otp.join(""))},type:"text",minlength:"1",maxlength:"1",autoComplete:"off",ref:t=>this.otpRef[i]=t})))),e("z-input-message",{key:"ce5613a45e4a578a16b63580207359b02b78cba1",message:this.message,status:this.status}))}};a.style=s;export{a as z_otp};
+//# sourceMappingURL=p-e10e6827.entry.js.map

package/dist/web-components-library/p-e358dce6.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as t,h as s}from"./p-10bb4f4b.js";import{a as e}from"./p-955da62e.js";import"./p-025f494e.js";import"./p-2c886e8b.js";const a=":host li{all:unset;all:reset;width:100%;line-height:14px;list-style-type:none}:host li>span{display:flex;padding:calc(var(--space-unit) * 2) 0;color:var(--color-default-text);fill:var(--color-default-icon);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);letter-spacing:0.23px;line-height:14px}:host(.small) li>span{padding:calc(var(--space-unit) * 1.5) 0;font-size:var(--font-size-2)}:host(.x-small) li>span{padding:var(--space-unit) 0;font-size:var(--font-size-2)}:host(.small) li>span>z-icon,:host(.x-small) li>span>z-icon{--z-icon-width:16px;--z-icon-height:16px;--z-icon-right-margin:calc(var(--space-unit) * 0.5);padding:0}:host li>span.border{border-bottom:2px solid var(--color-surface03)}:host li span:hover,a:hover{color:var(--color-primary01);fill:var(--color-primary01)}a,a:visited,a:active{color:inherit;fill:inherit;text-decoration:none}:host li span z-icon{width:calc(var(--space-unit) * 2);height:calc(var(--space-unit) * 2);padding:0 calc(var(--space-unit) * 1.5) 0 0;background-repeat:no-repeat;background-size:contain;color:var(--color-primary01);fill:var(--color-primary01)}";const n=a;const o=class{emitZListItemLinkClick(i,t){this.zListItemLinkClick.emit({e:i,linkId:t})}emitZListItemClick(i,t){this.zListItemClick.emit({e:i,listitemid:t})}constructor(s){i(this,s);this.zListItemLinkClick=t(this,"zListItemLinkClick",7);this.zListItemClick=t(this,"zListItemClick",7);this.text=undefined;this.link=undefined;this.linktarget="_self";this.icon=undefined;this.listitemid=undefined;this.action=undefined;this.underlined=true;this.emitZListItemLinkClick=this.emitZListItemLinkClick.bind(this);this.emitZListItemClick=this.emitZListItemClick.bind(this)}render(){const i=this.listitemid?`link_${this.listitemid}`:"";return s("li",{key:"f5a9c40546be666fc079a381db8714175c129dec",role:"button",id:this.listitemid,"data-action":this.action,onClick:i=>this.emitZListItemClick(i,this.listitemid),onKeyPress:i=>e(i,this.emitZListItemClick,this.listitemid)},s("span",{key:"06b4ec6cbaa6e5c27f84d0c7df28c246d3d35152",class:this.underlined&&"border"},this.icon&&s("z-icon",{name:this.icon}),this.link?s("a",{href:this.link?this.link:null,target:this.linktarget,id:i,onClick:t=>this.emitZListItemLinkClick(t,i),onKeyPress:t=>e(t,this.emitZListItemLinkClick,i),role:this.link?"link":"button",tabindex:"0"},this.text):s("span",{innerHTML:this.text}),s("slot",{key:"3290eb16cc5f0d79f01f9e7f7c277e227ee6b4e0"})))}};o.style=n;export{o as z_myz_list_item};
+//# sourceMappingURL=p-e358dce6.entry.js.map

package/dist/web-components-library/p-e358dce6.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZMyzListItemStyle0","ZMyzListItem","emitZListItemLinkClick","e","linkId","this","zListItemLinkClick","emit","emitZListItemClick","listitemid","zListItemClick","constructor","hostRef","bind","render","h","key","role","id","action","onClick","onKeyPress","ev","handleKeyboardSubmit","class","underlined","icon","name","link","href","target","linktarget","tabindex","text","innerHTML"],"sources":["src/snowflakes/myz/list/z-myz-list-item/styles.css?tag=z-myz-list-item&encapsulation=shadow","src/snowflakes/myz/list/z-myz-list-item/index.tsx"],"sourcesContent":[":host li {\n  all: unset;\n  all: reset;\n  width: 100%;\n  line-height: 14px;\n  list-style-type: none;\n}\n\n:host li > span {\n  display: flex;\n  padding: calc(var(--space-unit) * 2) 0;\n  color: var(--color-default-text);\n  fill: var(--color-default-icon);\n  font-family: var(--font-family-sans);\n  font-size: 16px;\n  font-weight: var(--font-rg);\n  letter-spacing: 0.23px;\n  line-height: 14px;\n}\n\n:host(.small) li > span {\n  padding: calc(var(--space-unit) * 1.5) 0;\n  font-size: var(--font-size-2);\n}\n\n:host(.x-small) li > span {\n  padding: var(--space-unit) 0;\n  font-size: var(--font-size-2);\n}\n\n:host(.small) li > span > z-icon,\n:host(.x-small) li > span > z-icon {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n  --z-icon-right-margin: calc(var(--space-unit) * 0.5);\n\n  padding: 0;\n}\n\n:host li > span.border {\n  border-bottom: 2px solid var(--color-surface03);\n}\n\n:host li span:hover,\na:hover {\n  color: var(--color-primary01);\n  fill: var(--color-primary01);\n}\n\na,\na:visited,\na:active {\n  color: inherit;\n  fill: inherit;\n  text-decoration: none;\n}\n\n:host li span z-icon {\n  width: calc(var(--space-unit) * 2);\n  height: calc(var(--space-unit) * 2);\n  padding: 0 calc(var(--space-unit) * 1.5) 0 0;\n  background-repeat: no-repeat;\n  background-size: contain;\n  color: var(--color-primary01);\n  fill: var(--color-primary01);\n}\n","import {Component, Prop, h, Event, EventEmitter} from \"@stencil/core\";\nimport {handleKeyboardSubmit} from \"../../../../utils/utils\";\n\n@Component({\n  tag: \"z-myz-list-item\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzListItem {\n  /** content text */\n  @Prop()\n  text: string;\n\n  /** link url (optional) */\n  @Prop()\n  link?: string;\n\n  /** link target (optional) */\n  @Prop()\n  linktarget?: string = \"_self\";\n\n  /** icon name (optional) */\n  @Prop()\n  icon?: string;\n\n  /** id (optional) */\n  @Prop()\n  listitemid?: string;\n\n  /** data-action attribute (optional) */\n  @Prop()\n  action?: string;\n\n  /** underlined style flag */\n  @Prop()\n  underlined = true;\n\n  /** emitted on list item link click, returns linkId */\n  @Event()\n  zListItemLinkClick: EventEmitter;\n\n  private emitZListItemLinkClick(e: MouseEvent, linkId): void {\n    this.zListItemLinkClick.emit({e, linkId});\n  }\n\n  /** emitted on list item click, returns listitemid */\n  @Event()\n  zListItemClick: EventEmitter;\n\n  private emitZListItemClick(e: MouseEvent, listitemid): void {\n    this.zListItemClick.emit({e, listitemid});\n  }\n\n  constructor() {\n    this.emitZListItemLinkClick = this.emitZListItemLinkClick.bind(this);\n    this.emitZListItemClick = this.emitZListItemClick.bind(this);\n  }\n\n  render(): HTMLLIElement {\n    const linkId = this.listitemid ? `link_${this.listitemid}` : \"\";\n\n    return (\n      <li\n        role=\"button\"\n        id={this.listitemid}\n        data-action={this.action}\n        onClick={(e: MouseEvent) => this.emitZListItemClick(e, this.listitemid)}\n        onKeyPress={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.emitZListItemClick, this.listitemid)}\n      >\n        <span class={this.underlined && \"border\"}>\n          {this.icon && <z-icon name={this.icon} />}\n          {this.link ? (\n            <a\n              href={this.link ? this.link : null}\n              target={this.linktarget}\n              id={linkId}\n              onClick={(e: MouseEvent) => this.emitZListItemLinkClick(e, linkId)}\n              onKeyPress={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.emitZListItemLinkClick, linkId)}\n              role={this.link ? \"link\" : \"button\"}\n              tabindex=\"0\"\n            >\n              {this.text}\n            </a>\n          ) : (\n            <span innerHTML={this.text}></span>\n          )}\n          <slot />\n        </span>\n      </li>\n    );\n  }\n}\n"],"mappings":"sIAAA,MAAMA,EAAY,smCAClB,MAAAC,EAAeD,E,MCOFE,EAAY,MAiCf,sBAAAC,CAAuBC,EAAeC,GAC5CC,KAAKC,mBAAmBC,KAAK,CAACJ,IAAGC,U,CAO3B,kBAAAI,CAAmBL,EAAeM,GACxCJ,KAAKK,eAAeH,KAAK,CAACJ,IAAGM,c,CAG/B,WAAAE,CAAAC,G,wKAlCsB,Q,oFAgBT,KAmBXP,KAAKH,uBAAyBG,KAAKH,uBAAuBW,KAAKR,MAC/DA,KAAKG,mBAAqBH,KAAKG,mBAAmBK,KAAKR,K,CAGzD,MAAAS,GACE,MAAMV,EAASC,KAAKI,WAAa,QAAQJ,KAAKI,aAAe,GAE7D,OACEM,EAAA,MAAAC,IAAA,2CACEC,KAAK,SACLC,GAAIb,KAAKI,WAAU,cACNJ,KAAKc,OAClBC,QAAUjB,GAAkBE,KAAKG,mBAAmBL,EAAGE,KAAKI,YAC5DY,WAAaC,GAAsBC,EAAqBD,EAAIjB,KAAKG,mBAAoBH,KAAKI,aAE1FM,EAAA,QAAAC,IAAA,2CAAMQ,MAAOnB,KAAKoB,YAAc,UAC7BpB,KAAKqB,MAAQX,EAAA,UAAQY,KAAMtB,KAAKqB,OAChCrB,KAAKuB,KACJb,EAAA,KACEc,KAAMxB,KAAKuB,KAAOvB,KAAKuB,KAAO,KAC9BE,OAAQzB,KAAK0B,WACbb,GAAId,EACJgB,QAAUjB,GAAkBE,KAAKH,uBAAuBC,EAAGC,GAC3DiB,WAAaC,GAAsBC,EAAqBD,EAAIjB,KAAKH,uBAAwBE,GACzFa,KAAMZ,KAAKuB,KAAO,OAAS,SAC3BI,SAAS,KAER3B,KAAK4B,MAGRlB,EAAA,QAAMmB,UAAW7B,KAAK4B,OAExBlB,EAAA,QAAAC,IAAA,8C"}

package/dist/web-components-library/p-ec879ac7.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as o,a as i,g as s}from"./p-10bb4f4b.js";const a=':host{display:inline-flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0;font-family:var(--font-family-sans)}:host,::slotted(*),*{box-sizing:border-box}::slotted(a){text-decoration:none}::slotted(*){color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host(:is([active],[open])) .label,.label:hover{border-color:var(--color-secondary01)}:host(:is([active],[open])) .label ::slotted(*),.label:focus:focus-visible ::slotted(*),.label:hover ::slotted(*){font-weight:var(--font-bd)}.label{display:flex;width:100%;align-items:center;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) / 2);border:0;border-bottom:var(--border-size-small) solid var(--color-surface05);margin:0;background:transparent;border-radius:0;cursor:pointer;text-align:left}::slotted([data-text]){display:inline-flex;flex-direction:column}::slotted([data-text])::after{overflow:hidden;height:0;content:attr(data-text);content:attr(data-text) / "";font-weight:var(--font-bd);pointer-events:none;user-select:none;visibility:hidden}@media speech{::slotted([data-text])::after{display:none}}.label ::slotted(*){width:100%;margin:0;font-size:var(--font-size-3);line-height:1.25}.label:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}.label z-icon{margin-left:calc(var(--space-unit) * 4);fill:var(--color-default-icon)}.items{display:flex;width:100%;flex-direction:column;padding:calc(var(--space-unit) / 2);padding-bottom:calc(var(--space-unit) * 1.5)}.items>::slotted([slot="item"]){display:inline-flex;padding:calc(var(--space-unit) / 2);margin:0;font-size:var(--font-size-2);line-height:1.4;outline:none}.items>::slotted([slot="item"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);color:var(--color-secondary01)}.items>::slotted([slot="item"]:hover),.items>::slotted([slot="item"]:focus:focus-visible),.items>::slotted([slot="item"][active]){color:var(--color-secondary01);font-weight:var(--font-bd)}';const n=a;const l=class{constructor(o){t(this,o);this.opened=e(this,"opened",7);this.closed=e(this,"closed",7);this.active=undefined;this.open=undefined;this.hasContent=undefined}toggle(){if(!this.hasContent){return}this.open=!this.open;this.open?this.opened.emit():this.closed.emit()}handleClick(t){if(!this.open||this.hostElement.contains(t.target)){return}this.open=false;this.closed.emit()}checkContent(){this.hasContent=this.hostElement.querySelectorAll('[slot="item"]').length>0}onLabelSlotChange(t){const e=t.target.assignedElements()[0];e.dataset.text=(e===null||e===void 0?void 0:e.innerText)||null}componentWillLoad(){this.checkContent()}render(){return o(i,{key:"beadad10be10337d069e96c4144372b3ae9188d7",role:"menu",open:this.open},o("button",{key:"d76a6e7da3bb60238571b5a4e9c76b2923b07a97",class:"label","aria-pressed":this.open?"true":"false",onClick:this.toggle.bind(this)},o("slot",{key:"ba6a653482a7e3f5de77877e7e69225c236b85f8",onSlotchange:this.onLabelSlotChange.bind(this)}),this.hasContent&&o("z-icon",{name:this.open?"chevron-up":"chevron-down"})),this.open&&o("div",{class:"items"},o("slot",{name:"item",onSlotchange:this.checkContent.bind(this)})))}get hostElement(){return s(this)}};l.style=n;export{l as z_menu_section};
+//# sourceMappingURL=p-ec879ac7.entry.js.map

package/dist/web-components-library/p-ec879ac7.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZMenuSectionStyle0","ZMenuSection","toggle","this","hasContent","open","opened","emit","closed","handleClick","ev","hostElement","contains","target","checkContent","querySelectorAll","length","onLabelSlotChange","labelElement","assignedElements","dataset","text","innerText","componentWillLoad","render","h","Host","key","role","class","onClick","bind","onSlotchange","name"],"sources":["src/components/navigation/z-menu-section/styles.css?tag=z-menu-section&encapsulation=shadow","src/components/navigation/z-menu-section/index.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  padding: 0;\n  font-family: var(--font-family-sans);\n}\n\n:host,\n::slotted(*),\n* {\n  box-sizing: border-box;\n}\n\n::slotted(a) {\n  text-decoration: none;\n}\n\n::slotted(*) {\n  color: var(--color-default-text);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n:host(:is([active], [open])) .label,\n.label:hover {\n  border-color: var(--color-secondary01);\n}\n\n:host(:is([active], [open])) .label ::slotted(*),\n.label:focus:focus-visible ::slotted(*),\n.label:hover ::slotted(*) {\n  font-weight: var(--font-bd);\n}\n\n.label {\n  display: flex;\n  width: 100%;\n  align-items: center;\n  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) / 2);\n  border: 0;\n  border-bottom: var(--border-size-small) solid var(--color-surface05);\n  margin: 0;\n  background: transparent;\n  border-radius: 0;\n  cursor: pointer;\n  text-align: left;\n}\n\n::slotted([data-text]) {\n  display: inline-flex;\n  flex-direction: column;\n}\n\n/* Trick to prevent layout shifts on font-weight changes.\nThe trick is to put an hidden copy of the text already set to bold,\nso the needed space is correctly calculated before any hover/active state changes the\nfont-weight of the real text.\nThe hidden text has an height of 0px so it can expand the width without changing the height\nwhen placed below the real text using `flex-direction: column`. */\n::slotted([data-text])::after {\n  overflow: hidden;\n  height: 0;\n  content: attr(data-text);\n  content: attr(data-text) / \"\";\n  font-weight: var(--font-bd);\n  pointer-events: none;\n  user-select: none;\n  visibility: hidden;\n}\n\n@media speech {\n  ::slotted([data-text])::after {\n    display: none;\n  }\n}\n\n.label ::slotted(*) {\n  width: 100%;\n  margin: 0;\n  font-size: var(--font-size-3);\n  line-height: 1.25;\n}\n\n.label:focus:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.label z-icon {\n  margin-left: calc(var(--space-unit) * 4);\n  fill: var(--color-default-icon);\n}\n\n.items {\n  display: flex;\n  width: 100%;\n  flex-direction: column;\n  padding: calc(var(--space-unit) / 2);\n  padding-bottom: calc(var(--space-unit) * 1.5);\n}\n\n.items > ::slotted([slot=\"item\"]) {\n  display: inline-flex;\n  padding: calc(var(--space-unit) / 2);\n  margin: 0;\n  font-size: var(--font-size-2);\n  line-height: 1.4;\n  outline: none;\n}\n\n.items > ::slotted([slot=\"item\"]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n  color: var(--color-secondary01);\n}\n\n.items > ::slotted([slot=\"item\"]:hover),\n.items > ::slotted([slot=\"item\"]:focus:focus-visible),\n.items > ::slotted([slot=\"item\"][active]) {\n  color: var(--color-secondary01);\n  font-weight: var(--font-bd);\n}\n","import {Component, h, Prop, State, Event, EventEmitter, Element, Listen, Host} from \"@stencil/core\";\n\n/**\n * A component to create submenus inside the ZMenu.\n * @slot - Label of the menu section.\n * @slot item - Single entry of the section. Set the same slot name to different items to put many of them. Add the `active` attribute to a slotted item to highlight it.\n */\n@Component({\n  tag: \"z-menu-section\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMenuSection {\n  @Element() hostElement: HTMLZMenuSectionElement;\n\n  /** Active state */\n  @Prop({reflect: true})\n  active?: boolean;\n\n  @State()\n  open: boolean;\n\n  @State()\n  hasContent: boolean;\n\n  /** The section has been opened. */\n  @Event()\n  opened: EventEmitter;\n\n  /** The section has been closed. */\n  @Event()\n  closed: EventEmitter;\n\n  private toggle(): void {\n    if (!this.hasContent) {\n      return;\n    }\n\n    this.open = !this.open;\n    this.open ? this.opened.emit() : this.closed.emit();\n  }\n\n  /** Close the list when a click is performed outside of this Element. */\n  @Listen(\"click\", {target: \"document\"})\n  handleClick(ev: MouseEvent): void {\n    if (!this.open || this.hostElement.contains(ev.target as Node)) {\n      return;\n    }\n\n    this.open = false;\n    this.closed.emit();\n  }\n\n  /**\n   * Check if some content slot is set.\n   */\n  private checkContent(): void {\n    this.hasContent = this.hostElement.querySelectorAll('[slot=\"item\"]').length > 0;\n  }\n\n  /**\n   * Sets slotted item text as `data-text` attribute value, to let CSS use it through `attr()`.\n   * @param ev Slotchange event\n   */\n  private onLabelSlotChange(ev: Event): void {\n    const labelElement = (ev.target as HTMLSlotElement).assignedElements()[0] as HTMLElement;\n    labelElement.dataset.text = labelElement?.innerText || null;\n  }\n\n  componentWillLoad(): void {\n    this.checkContent();\n  }\n\n  render(): HTMLZMenuSectionElement {\n    return (\n      <Host\n        role=\"menu\"\n        open={this.open}\n      >\n        <button\n          class=\"label\"\n          aria-pressed={this.open ? \"true\" : \"false\"}\n          onClick={this.toggle.bind(this)}\n        >\n          <slot onSlotchange={this.onLabelSlotChange.bind(this)}></slot>\n          {this.hasContent && <z-icon name={this.open ? \"chevron-up\" : \"chevron-down\"} />}\n        </button>\n        {this.open && (\n          <div class=\"items\">\n            <slot\n              name=\"item\"\n              onSlotchange={this.checkContent.bind(this)}\n            ></slot>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAY,m8DAClB,MAAAC,EAAeD,E,MCWFE,EAAY,M,2JAqBf,MAAAC,GACN,IAAKC,KAAKC,WAAY,CACpB,M,CAGFD,KAAKE,MAAQF,KAAKE,KAClBF,KAAKE,KAAOF,KAAKG,OAAOC,OAASJ,KAAKK,OAAOD,M,CAK/C,WAAAE,CAAYC,GACV,IAAKP,KAAKE,MAAQF,KAAKQ,YAAYC,SAASF,EAAGG,QAAiB,CAC9D,M,CAGFV,KAAKE,KAAO,MACZF,KAAKK,OAAOD,M,CAMN,YAAAO,GACNX,KAAKC,WAAaD,KAAKQ,YAAYI,iBAAiB,iBAAiBC,OAAS,C,CAOxE,iBAAAC,CAAkBP,GACxB,MAAMQ,EAAgBR,EAAGG,OAA2BM,mBAAmB,GACvED,EAAaE,QAAQC,MAAOH,IAAY,MAAZA,SAAY,SAAZA,EAAcI,YAAa,I,CAGzD,iBAAAC,GACEpB,KAAKW,c,CAGP,MAAAU,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,OACLvB,KAAMF,KAAKE,MAEXoB,EAAA,UAAAE,IAAA,2CACEE,MAAM,QAAO,eACC1B,KAAKE,KAAO,OAAS,QACnCyB,QAAS3B,KAAKD,OAAO6B,KAAK5B,OAE1BsB,EAAA,QAAAE,IAAA,2CAAMK,aAAc7B,KAAKc,kBAAkBc,KAAK5B,QAC/CA,KAAKC,YAAcqB,EAAA,UAAQQ,KAAM9B,KAAKE,KAAO,aAAe,kBAE9DF,KAAKE,MACJoB,EAAA,OAAKI,MAAM,SACTJ,EAAA,QACEQ,KAAK,OACLD,aAAc7B,KAAKW,aAAaiB,KAAK5B,S"}

package/dist/web-components-library/{p-303663a9.entry.js → p-f41da106.entry.js}

@@ -1,2 +1,2 @@
-import{r,c as o,h as i}from"./p-10bb4f4b.js";const a="button{display:flex;height:36px;align-items:center;padding-right:calc(var(--space-unit) * 2);padding-left:0;border:var(--border-size-medium) solid;border-color:transparent;background-color:var(--color-surface01);border-radius:var(--border-radius);box-shadow:0 0 4px 0 rgb(0 0 0 / 20%);color:var(--color-primary01);cursor:pointer;fill:var(--color-primary01);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);outline:none;text-transform:uppercase}button::-moz-focus-inner{border:0}button:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary)}button:focus{box-shadow:var(--shadow-focus-primary)}button:active{border-color:var(--color-pressed-primary);box-shadow:var(--shadow-2);color:var(--color-pressed-primary);fill:var(--color-pressed-primary)}button:disabled{color:var(--color-disabled02);fill:var(--color-disabled02)}z-icon{display:inline-block;margin:0 var(--space-unit) 0 calc(var(--space-unit) * 2);transform:rotate(360deg);transition:all 200ms linear}button.isopen{top:-20px}button.avoid-clicks{pointer-events:none}";const t=a;const e=class{constructor(i){r(this,i);this.toggleClick=o(this,"toggleClick",7);this.label=undefined;this.isdisabled=false;this.avoidclick=undefined;this.opened=false;this.ariaLabel=""}emitToggleClick(){if(this.isdisabled){return}this.opened=!this.opened;this.toggleClick.emit(this.opened)}render(){return i("button",{key:"45734652da19db32f9ca48cc87ae096a961b8fdb",tabindex:this.avoidclick?"-1":"0",class:{isopen:this.opened,"avoid-clicks":this.avoidclick},disabled:this.isdisabled,"aria-expanded":this.opened?"true":"false","aria-label":this.ariaLabel,onClick:()=>this.emitToggleClick()},i("z-icon",{key:"0630ac16f3c2fe347cf9c81cdbf07a06bc526778",name:this.opened?"chevron-down":"chevron-up",width:16,height:16}),this.label)}};e.style=t;export{e as z_toggle_button};
-//# sourceMappingURL=p-303663a9.entry.js.map
+import{r,c as o,h as i}from"./p-10bb4f4b.js";const a="button{display:flex;height:36px;align-items:center;padding-right:calc(var(--space-unit) * 2);padding-left:0;border:var(--border-size-medium) solid;border-color:transparent;background-color:var(--color-surface01);border-radius:var(--border-radius);box-shadow:0 0 4px 0 rgb(0 0 0 / 20%);color:var(--color-primary01);cursor:pointer;fill:var(--color-primary01);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);outline:none;text-transform:uppercase}button::-moz-focus-inner{border:0}button:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary)}button:focus{box-shadow:var(--shadow-focus-primary)}button:active{border-color:var(--color-pressed-primary);box-shadow:var(--shadow-2);color:var(--color-pressed-primary);fill:var(--color-pressed-primary)}button:disabled{color:var(--color-disabled03);fill:var(--color-disabled03)}z-icon{display:inline-block;margin:0 var(--space-unit) 0 calc(var(--space-unit) * 2);transform:rotate(360deg);transition:all 200ms linear}button.isopen{top:-20px}button.avoid-clicks{pointer-events:none}";const t=a;const e=class{constructor(i){r(this,i);this.toggleClick=o(this,"toggleClick",7);this.label=undefined;this.isdisabled=false;this.avoidclick=undefined;this.opened=false;this.ariaLabel=""}emitToggleClick(){if(this.isdisabled){return}this.opened=!this.opened;this.toggleClick.emit(this.opened)}render(){return i("button",{key:"45734652da19db32f9ca48cc87ae096a961b8fdb",tabindex:this.avoidclick?"-1":"0",class:{isopen:this.opened,"avoid-clicks":this.avoidclick},disabled:this.isdisabled,"aria-expanded":this.opened?"true":"false","aria-label":this.ariaLabel,onClick:()=>this.emitToggleClick()},i("z-icon",{key:"0630ac16f3c2fe347cf9c81cdbf07a06bc526778",name:this.opened?"chevron-down":"chevron-up",width:16,height:16}),this.label)}};e.style=t;export{e as z_toggle_button};
+//# sourceMappingURL=p-f41da106.entry.js.map

package/dist/web-components-library/{p-303663a9.entry.js.map → p-f41da106.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["stylesCss","ZToggleButtonStyle0","ZToggleButton","emitToggleClick","this","isdisabled","opened","toggleClick","emit","render","h","key","tabindex","avoidclick","class","isopen","disabled","ariaLabel","onClick","name","width","height","label"],"sources":["src/components/buttons/z-toggle-button/styles.css?tag=z-toggle-button&encapsulation=shadow","src/components/buttons/z-toggle-button/index.tsx"],"sourcesContent":["button {\n  display: flex;\n  height: 36px;\n  align-items: center;\n  padding-right: calc(var(--space-unit) * 2);\n  padding-left: 0;\n  border: var(--border-size-medium) solid;\n  border-color: transparent;\n  background-color: var(--color-surface01);\n  border-radius: var(--border-radius);\n  box-shadow: 0 0 4px 0 rgb(0 0 0 / 20%);\n  color: var(--color-primary01);\n  cursor: pointer;\n  fill: var(--color-primary01);\n  font-family: var(--font-family-sans);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  outline: none;\n  text-transform: uppercase;\n}\n\nbutton::-moz-focus-inner {\n  border: 0;\n}\n\nbutton:hover {\n  color: var(--color-hover-primary);\n  fill: var(--color-hover-primary);\n}\n\nbutton:focus {\n  box-shadow: var(--shadow-focus-primary);\n}\n\nbutton:active {\n  border-color: var(--color-pressed-primary);\n  box-shadow: var(--shadow-2);\n  color: var(--color-pressed-primary);\n  fill: var(--color-pressed-primary);\n}\n\nbutton:disabled {\n  color: var(--color-disabled02);\n  fill: var(--color-disabled02);\n}\n\nz-icon {\n  display: inline-block;\n  margin: 0 var(--space-unit) 0 calc(var(--space-unit) * 2);\n  transform: rotate(360deg);\n  transition: all 200ms linear;\n}\n\nbutton.isopen {\n  top: -20px;\n}\n\nbutton.avoid-clicks {\n  pointer-events: none;\n}\n","import {Component, Prop, h, Event, EventEmitter} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-toggle-button\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZToggleButton {\n  /** label text */\n  @Prop()\n  label: string;\n\n  /** disabled status flag (optional) */\n  @Prop()\n  isdisabled?: boolean = false;\n\n  /** avoidclick status flag */\n  @Prop()\n  avoidclick: boolean;\n\n  /** open by default (optional) */\n  @Prop({mutable: true})\n  opened?: boolean = false;\n\n  /**  aria-label for the button */\n  @Prop()\n  ariaLabel = \"\";\n\n  /** emitted on toggle button click, returns isOpen */\n  @Event()\n  toggleClick: EventEmitter;\n\n  private emitToggleClick(): void {\n    if (this.isdisabled) {\n      return;\n    }\n\n    this.opened = !this.opened;\n    this.toggleClick.emit(this.opened);\n  }\n\n  render(): HTMLButtonElement {\n    return (\n      <button\n        tabindex={this.avoidclick ? \"-1\" : \"0\"}\n        class={{\n          \"isopen\": this.opened,\n          \"avoid-clicks\": this.avoidclick,\n        }}\n        disabled={this.isdisabled}\n        aria-expanded={this.opened ? \"true\" : \"false\"}\n        aria-label={this.ariaLabel}\n        onClick={() => this.emitToggleClick()}\n      >\n        <z-icon\n          name={this.opened ? \"chevron-down\" : \"chevron-up\"}\n          width={16}\n          height={16}\n        />\n        {this.label}\n      </button>\n    );\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAY,6iCAClB,MAAAC,EAAeD,E,MCMFE,EAAa,M,uGAOD,M,sCAQJ,M,eAIP,E,CAMJ,eAAAC,GACN,GAAIC,KAAKC,WAAY,CACnB,M,CAGFD,KAAKE,QAAUF,KAAKE,OACpBF,KAAKG,YAAYC,KAAKJ,KAAKE,O,CAG7B,MAAAG,GACE,OACEC,EAAA,UAAAC,IAAA,2CACEC,SAAUR,KAAKS,WAAa,KAAO,IACnCC,MAAO,CACLC,OAAUX,KAAKE,OACf,eAAgBF,KAAKS,YAEvBG,SAAUZ,KAAKC,WAAU,gBACVD,KAAKE,OAAS,OAAS,QAAO,aACjCF,KAAKa,UACjBC,QAAS,IAAMd,KAAKD,mBAEpBO,EAAA,UAAAC,IAAA,2CACEQ,KAAMf,KAAKE,OAAS,eAAiB,aACrCc,MAAO,GACPC,OAAQ,KAETjB,KAAKkB,M"}
+{"version":3,"names":["stylesCss","ZToggleButtonStyle0","ZToggleButton","emitToggleClick","this","isdisabled","opened","toggleClick","emit","render","h","key","tabindex","avoidclick","class","isopen","disabled","ariaLabel","onClick","name","width","height","label"],"sources":["src/components/buttons/z-toggle-button/styles.css?tag=z-toggle-button&encapsulation=shadow","src/components/buttons/z-toggle-button/index.tsx"],"sourcesContent":["button {\n  display: flex;\n  height: 36px;\n  align-items: center;\n  padding-right: calc(var(--space-unit) * 2);\n  padding-left: 0;\n  border: var(--border-size-medium) solid;\n  border-color: transparent;\n  background-color: var(--color-surface01);\n  border-radius: var(--border-radius);\n  box-shadow: 0 0 4px 0 rgb(0 0 0 / 20%);\n  color: var(--color-primary01);\n  cursor: pointer;\n  fill: var(--color-primary01);\n  font-family: var(--font-family-sans);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  outline: none;\n  text-transform: uppercase;\n}\n\nbutton::-moz-focus-inner {\n  border: 0;\n}\n\nbutton:hover {\n  color: var(--color-hover-primary);\n  fill: var(--color-hover-primary);\n}\n\nbutton:focus {\n  box-shadow: var(--shadow-focus-primary);\n}\n\nbutton:active {\n  border-color: var(--color-pressed-primary);\n  box-shadow: var(--shadow-2);\n  color: var(--color-pressed-primary);\n  fill: var(--color-pressed-primary);\n}\n\nbutton:disabled {\n  color: var(--color-disabled03);\n  fill: var(--color-disabled03);\n}\n\nz-icon {\n  display: inline-block;\n  margin: 0 var(--space-unit) 0 calc(var(--space-unit) * 2);\n  transform: rotate(360deg);\n  transition: all 200ms linear;\n}\n\nbutton.isopen {\n  top: -20px;\n}\n\nbutton.avoid-clicks {\n  pointer-events: none;\n}\n","import {Component, Prop, h, Event, EventEmitter} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-toggle-button\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZToggleButton {\n  /** label text */\n  @Prop()\n  label: string;\n\n  /** disabled status flag (optional) */\n  @Prop()\n  isdisabled?: boolean = false;\n\n  /** avoidclick status flag */\n  @Prop()\n  avoidclick: boolean;\n\n  /** open by default (optional) */\n  @Prop({mutable: true})\n  opened?: boolean = false;\n\n  /**  aria-label for the button */\n  @Prop()\n  ariaLabel = \"\";\n\n  /** emitted on toggle button click, returns isOpen */\n  @Event()\n  toggleClick: EventEmitter;\n\n  private emitToggleClick(): void {\n    if (this.isdisabled) {\n      return;\n    }\n\n    this.opened = !this.opened;\n    this.toggleClick.emit(this.opened);\n  }\n\n  render(): HTMLButtonElement {\n    return (\n      <button\n        tabindex={this.avoidclick ? \"-1\" : \"0\"}\n        class={{\n          \"isopen\": this.opened,\n          \"avoid-clicks\": this.avoidclick,\n        }}\n        disabled={this.isdisabled}\n        aria-expanded={this.opened ? \"true\" : \"false\"}\n        aria-label={this.ariaLabel}\n        onClick={() => this.emitToggleClick()}\n      >\n        <z-icon\n          name={this.opened ? \"chevron-down\" : \"chevron-up\"}\n          width={16}\n          height={16}\n        />\n        {this.label}\n      </button>\n    );\n  }\n}\n"],"mappings":"6CAAA,MAAMA,EAAY,6iCAClB,MAAAC,EAAeD,E,MCMFE,EAAa,M,uGAOD,M,sCAQJ,M,eAIP,E,CAMJ,eAAAC,GACN,GAAIC,KAAKC,WAAY,CACnB,M,CAGFD,KAAKE,QAAUF,KAAKE,OACpBF,KAAKG,YAAYC,KAAKJ,KAAKE,O,CAG7B,MAAAG,GACE,OACEC,EAAA,UAAAC,IAAA,2CACEC,SAAUR,KAAKS,WAAa,KAAO,IACnCC,MAAO,CACLC,OAAUX,KAAKE,OACf,eAAgBF,KAAKS,YAEvBG,SAAUZ,KAAKC,WAAU,gBACVD,KAAKE,OAAS,OAAS,QAAO,aACjCF,KAAKa,UACjBC,QAAS,IAAMd,KAAKD,mBAEpBO,EAAA,UAAAC,IAAA,2CACEQ,KAAMf,KAAKE,OAAS,eAAiB,aACrCc,MAAO,GACPC,OAAQ,KAETjB,KAAKkB,M"}

package/dist/web-components-library/{p-36f7ed38.entry.js → p-f6221ddd.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as n}from"./p-10bb4f4b.js";const e='ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary01);font-family:var(--font-family-sans);list-style:none}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;padding-top:calc(var(--space-unit) * 0.5);color:var(--color-primary01);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}ul>li>a::before{padding-right:5px;content:"•"}ul>li>span{padding:0 calc(var(--space-unit) * 2);color:var(--color-surface04);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}';const a=e;const i=class{constructor(n){t(this,n);this.listdata=undefined;this.renderList=this.renderList.bind(this)}handleSpaceKeyPress(t,n){if(t.keyCode==32||t.keyCode==13){t.preventDefault();window.open(n,"_blank")}}formatListContent(t){const{value:e,isLink:a,url:i}=t;if(!a){return n("span",null,e)}return n("a",{role:"button",onKeyPress:t=>this.handleSpaceKeyPress(t,i),href:i,target:"_blank"},e)}renderList(t){return t.map((t=>n("li",null,this.formatListContent(t))))}render(){return n("ul",{key:"eabe41902a685c9b541606cd45920f379b6d1362"},this.renderList(JSON.parse(this.listdata)))}};i.style=a;export{i as z_myz_card_list};
-//# sourceMappingURL=p-36f7ed38.entry.js.map
+import{r as t,h as n}from"./p-10bb4f4b.js";const e='ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary01);font-family:var(--font-family-sans);list-style:none}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;padding-top:calc(var(--space-unit) * 0.5);color:var(--color-primary01);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}ul>li>a::before{padding-right:5px;content:"•"}ul>li>span{padding:0 calc(var(--space-unit) * 2);color:var(--color-surface04);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}';const i=e;const a=class{constructor(n){t(this,n);this.listdata=undefined;this.renderList=this.renderList.bind(this)}handleSpaceKeyPress(t,n){if(t.keyCode==32||t.keyCode==13){t.preventDefault();window.open(n,"_blank")}}formatListContent(t){const{value:e,isLink:i,url:a}=t;if(!i){return n("span",null,e)}return n("a",{role:"button",onKeyPress:t=>this.handleSpaceKeyPress(t,a),href:a,target:"_blank"},e)}renderList(t){return t.map((t=>n("li",null,this.formatListContent(t))))}render(){return n("ul",{key:"8375d62edd6ef039ccf8211c2c1b72ec84a87b3f"},this.renderList(JSON.parse(this.listdata)))}};a.style=i;export{a as z_myz_card_list};
+//# sourceMappingURL=p-f6221ddd.entry.js.map