@zanichelli/albe-web-components 19.6.1 → 20.0.0

package/dist/web-components-library/p-5af96c6f.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as o,h as e,H as s,d as r}from"./p-BcDWN4F1.js";import{P as i,g as n,p as a}from"./p-DdetsoIY.js";import{a as h,k as c,l as f,g as p,m as l}from"./p-C_25lDQa.js";import"./p-Q-tWjk7P.js";const u=()=>`:host{position:fixed;display:none;max-width:calc(100dvw - var(--grid-margin) * 2);max-height:calc(100dvh - var(--grid-margin) * 2);padding:var(--z-popover-padding, 0);background:var(--z-popover-theme--surface, var(--color-surface01));border-radius:var(--border-radius-small);color:var(--z-popover-theme--text, var(--color-default-text));fill:currentcolor;filter:var(--z-popover-shadow-filter, drop-shadow(0 1px 2px var(--shadow-color-base)));text-align:center;visibility:hidden;}:host([open]:not([open="false"])[current-position]){display:block}:host([center][current-position="top"]),:host([center][current-position="bottom"]){transform:translateX(-50%)}:host([center][current-position="right"]),:host([center][current-position="left"]){transform:translateY(-50%)}:host([current-position^="top"]){margin:0 0 var(--space-unit)}:host([current-position^="bottom"]){margin:var(--space-unit) 0 0}:host([current-position^="left"]){margin:0 var(--space-unit) 0 0}:host([current-position^="right"]){margin:0 0 0 var(--space-unit)}:host([current-position])::before{--arrow-size:6px;--arrow-edge-offset:calc(100% - var(--space-unit) - (var(--arrow-size) / 2));--arrow-center-x-offset:calc(50% - (var(--arrow-size) / 2));--arrow-center-y-offset:calc(100% - (var(--arrow-size) / 2));position:absolute;display:block;width:var(--arrow-size);height:var(--arrow-size);background:var(--z-popover-theme--surface, var(--color-surface01));content:"";transform:rotate(45deg)}:host([show-arrow="false"])::before,:host(:not([show-arrow]))::before{display:none}:host([current-position^="top"])::before{top:var(--arrow-center-y-offset)}:host([current-position^="bottom"])::before{bottom:var(--arrow-center-y-offset)}:host([current-position="top"])::before,:host([current-position="bottom"])::before{right:var(--arrow-edge-offset)}:host([current-position="right"])::before,:host([current-position="left"])::before{bottom:var(--arrow-edge-offset)}:host([current-position="right"])::before{right:var(--arrow-center-y-offset)}:host([current-position="left"])::before{left:var(--arrow-center-y-offset)}:host([current-position="top_right"])::before,:host([current-position="bottom_right"])::before{right:var(--arrow-edge-offset)}:host([current-position="top_left"])::before,:host([current-position="bottom_left"])::before{left:var(--arrow-edge-offset)}:host([current-position="right_top"])::before,:host([current-position="left_top"])::before{top:var(--arrow-edge-offset)}:host([current-position="right_top"])::before,:host([current-position="right_bottom"])::before{right:var(--arrow-center-y-offset)}:host([current-position="left_top"])::before,:host([current-position="left_bottom"])::before{left:var(--arrow-center-y-offset)}:host([current-position="right_bottom"])::before,:host([current-position="left_bottom"])::before{bottom:var(--arrow-edge-offset)}:host([center][current-position="top"])::before,:host([center][current-position="bottom"])::before{right:auto;left:var(--arrow-center-x-offset)}:host([center][current-position="right"])::before,:host([center][current-position="left"])::before{top:var(--arrow-center-x-offset);bottom:auto}`;const b=class{constructor(e){t(this,e);this.positionChange=o(this,"positionChange",7);this.openChange=o(this,"openChange",7);this.position=i.TOP;this.open=false;this.showArrow=false;this.center=false;this.closable=true;this.spaceTolerance=3}closePopoverWithKeyboard(t){if(this.closable&&t.key===n.ESC){t.stopPropagation();this.open=false}}handleOutsideClick(t){const o=t.target;if(!this.closable||!this.open||h(this.host,o)){return}if(h(this.boundElement,o)){t.stopPropagation()}this.open=false}validatePosition(t){if(!Object.values(i).includes(t)||t===i.AUTO){t=i.TOP;this.position=t}this.currentPosition=t;if(this.open){this.setPosition()}}onOpen(){cancelAnimationFrame(this.animationFrameRequestId);this.openChange.emit({open:this.open});if(!this.open){Object.assign(this.host.style,{top:"auto",right:"auto",bottom:"auto",left:"auto",maxWidth:"",maxHeight:"",visibility:"hidden"});this.currentPosition=undefined;return}const t=()=>{if(!this.open){return}this.setPosition();this.animationFrameRequestId=requestAnimationFrame(t)};setTimeout((()=>{t()}),0)}onBindingChange(){this.findBoundElement()}get offsetModifier(){return this.center?.5:0}findBoundElement(){if(typeof this.bindTo==="string"){this.boundElement=this.host.ownerDocument.querySelector(this.bindTo)}else if(this.bindTo){this.boundElement=this.bindTo}else{this.boundElement=c(this.host);if(this.boundElement.tagName.toLowerCase()==="z-tooltip"){this.boundElement=c(this.boundElement)}}}hasCenteredHorizontalSpace(t,o,e,s){const r=(e-s)*(1-this.offsetModifier);if(!this.center){return o>=r-this.spaceTolerance}return o>=r-this.spaceTolerance&&t>=r-this.spaceTolerance}hasCenteredVerticalSpace(t,o,e,s){const r=(e-s)*(1-this.offsetModifier);if(!this.center){return o>=r-this.spaceTolerance}return t>=r-this.spaceTolerance&&o>=r-this.spaceTolerance}hasEnoughSideSpace(t,o,e,s){return t>=o-e*(1-s)-this.spaceTolerance}getOptimalPopoverPosition(t,o){const e=this.host.offsetWidth;const s=this.host.offsetHeight;const r=this.boundElement.getBoundingClientRect().width;const n=this.boundElement.getBoundingClientRect().height;const a=this.offsetModifier;const h=t=>{switch(t){case i.TOP:return o.top>=s-this.spaceTolerance&&this.hasCenteredHorizontalSpace(o.left,o.right,e,r);case i.TOP_RIGHT:return o.top>=s&&this.hasEnoughSideSpace(o.right,e,r,a);case i.TOP_LEFT:return o.top>=s&&this.hasEnoughSideSpace(o.left,e,r,a);case i.RIGHT:return o.right>=e&&this.hasCenteredVerticalSpace(o.top,o.bottom,s,n);case i.RIGHT_BOTTOM:return o.right>=e&&this.hasEnoughSideSpace(o.bottom,s,n,a);case i.RIGHT_TOP:return o.right>=e&&this.hasEnoughSideSpace(o.top,s,n,a);case i.BOTTOM:return o.bottom>=s&&this.hasCenteredHorizontalSpace(o.left,o.right,e,r);case i.BOTTOM_LEFT:return o.bottom>=s&&this.hasEnoughSideSpace(o.left,e,r,a);case i.BOTTOM_RIGHT:return o.bottom>=s&&this.hasEnoughSideSpace(o.right,e,r,a);case i.LEFT:return o.left>=e&&this.hasCenteredVerticalSpace(o.top,o.bottom,s,n);case i.LEFT_TOP:return o.left>=e&&this.hasEnoughSideSpace(o.top,s,n,a);case i.LEFT_BOTTOM:return o.left>=e&&this.hasEnoughSideSpace(o.bottom,s,n,a);default:return false}};if(h(t)){return t}const c=b.positionOrder;const f=c.indexOf(t);if(f===-1){return t}for(let t=1;t<c.length;t++){const o=(f+t)%c.length;const e=c[o];if(h(e)){return e}}return this.findBestFallbackPosition(o)}findBestFallbackPosition(t){const o=t.right>=t.left?i.RIGHT:i.LEFT;const e=t.bottom>=t.top?i.BOTTOM:i.TOP;const s=Math.max(t.right,t.left);const r=Math.max(t.bottom,t.top);const n=r>=s?e:o;let a=false;if(n===e){const o=Math.min(t.right,t.left);a=s>=o*2}else{const o=Math.min(t.bottom,t.top);a=r>=o*2}if(!a){return n}const h=n===e?o:e;return`${n}_${h}`}findScrollableAncestor(t){let o=c(t);while(o){if(o===t.ownerDocument.documentElement){return o}const e=getComputedStyle(o);const{overflow:s,overflowX:r,overflowY:i}=e;const n=s==="hidden"||i==="hidden"||r==="hidden";const a=o.scrollHeight>o.clientHeight&&s!=="visible"&&i!=="visible"||o.scrollWidth>o.clientWidth&&s!=="visible"&&r!=="visible";if(!n&&a){return o}o=c(o)}return t.ownerDocument.documentElement}calculateAvailableSpace(){const t=this.boundElement.getBoundingClientRect();if(this.lastBoundRect&&this.lastBoundRect.x===t.x&&this.lastBoundRect.y===t.y&&this.lastBoundRect.width===t.width&&this.lastBoundRect.height===t.height&&this.cachedAvailableSpace){return this.cachedAvailableSpace}this.lastBoundRect=t;const o=this.findScrollableAncestor(this.boundElement);const e=o.getBoundingClientRect();const s=o!==this.boundElement.ownerDocument.documentElement;const r=this.boundElement.ownerDocument.documentElement.clientWidth;const i=this.boundElement.ownerDocument.documentElement.clientHeight;const n=8;const a=s?e.top:0;const h=s?r-e.right:0;const c=s?i-e.bottom:0;const f=s?e.left:0;this.cachedAvailableSpace={top:t.top-a-n,right:r-t.right-h-n,bottom:i-t.bottom-c-n,left:t.left-f-n};return this.cachedAvailableSpace}getBoundElementOffsets(){const t=this.boundElement.getBoundingClientRect();const o=this.boundElement.ownerDocument.documentElement.clientWidth;const e=this.boundElement.ownerDocument.documentElement.clientHeight;return{top:t.top,right:o-t.right,bottom:e-t.bottom,left:t.left}}computePositionOffsets(){const t=this.getBoundElementOffsets();const o=f(this.host);const e=o===this.host.ownerDocument.documentElement;if(e){return t}const s=o.getBoundingClientRect();const r=getComputedStyle(o);const i={top:s.top+parseFloat(r.borderTopWidth),right:s.right-parseFloat(r.borderRightWidth),bottom:s.bottom-parseFloat(r.borderBottomWidth),left:s.left+parseFloat(r.borderLeftWidth)};const n=this.boundElement.getBoundingClientRect();const a={top:n.top-i.top,right:i.right-n.right,bottom:i.bottom-n.bottom,left:n.left-i.left};return{top:a.top+o.scrollTop,right:a.right-o.scrollLeft,bottom:a.bottom-o.scrollTop,left:a.left+o.scrollLeft}}applyPositionStyles(t,o){const e=this.boundElement.offsetWidth;const s=this.boundElement.offsetHeight;const r=this.offsetModifier;const n=this.showArrow&&this.center?8:0;const h=this.host.style;const c=parseFloat(getComputedStyle(this.host).marginTop.replace("px",""))||0;const f=this.computePositionOffsets();const l=f.left+e*r;const u=f.right+e*r;const b=f.top+s;const d=f.bottom+s;const g=f.top+s*r;const m=f.bottom+s*r;let v;let w;switch(t){case i.TOP:case i.TOP_RIGHT:h.bottom=`${d}px`;h.left=`${l-(t===i.TOP_RIGHT?n:0)}px`;w=o.top-c;if(t===i.TOP_RIGHT){v=o.right+e*r}break;case i.TOP_LEFT:h.right=`${u-n}px`;h.bottom=`${d}px`;v=o.left+e*r;w=o.top-c;break;case i.BOTTOM:case i.BOTTOM_RIGHT:h.top=`${b}px`;h.left=`${l-(t===i.BOTTOM_RIGHT?n:0)}px`;w=o.bottom-c;if(t===i.BOTTOM_RIGHT){v=o.right+e*r}break;case i.BOTTOM_LEFT:h.top=`${b}px`;h.right=`${u-n}px`;v=o.left+e*r;w=o.bottom-c;break;case i.RIGHT:case i.RIGHT_BOTTOM:h.top=`${g-(t===i.RIGHT_BOTTOM?n:0)}px`;h.left=`${f.left+e}px`;v=o.right-c;if(t===i.RIGHT){w=o.top+o.bottom+s}else{w=o.bottom+s*r}break;case i.RIGHT_TOP:h.bottom=`${m-n}px`;h.left=`${f.left+e}px`;v=o.right-c;w=o.top+s*r;break;case i.LEFT:case i.LEFT_BOTTOM:h.top=`${g-(t===i.LEFT_BOTTOM?n:0)}px`;h.right=`${f.right+e}px`;v=o.left-c;if(t===i.LEFT_BOTTOM){w=o.bottom+s*r}break;case i.LEFT_TOP:h.right=`${f.right+e}px`;h.bottom=`${m-n}px`;v=o.left-c;w=o.top+s*r;break}if(p()!==a.MOBILE){Object.assign(h,{maxWidth:v?`${v}px`:"",maxHeight:w?`${w}px`:""})}}setPosition(){if(!this.boundElement){return}if(!l(this.boundElement,this.findScrollableAncestor(this.boundElement))){this.open=false;return}Object.assign(this.host.style,{top:"auto",right:"auto",bottom:"auto",left:"auto",maxWidth:"",maxHeight:"",visibility:"hidden"});const t=this.calculateAvailableSpace();const o=this.getOptimalPopoverPosition(this.position,t);this.applyPositionStyles(o,t);this.currentPosition=o;this.positionChange.emit({position:this.currentPosition});this.host.style.visibility="visible"}componentWillLoad(){this.validatePosition(this.position)}componentDidLoad(){this.findBoundElement();if(this.open){this.onOpen()}}disconnectedCallback(){cancelAnimationFrame(this.animationFrameRequestId)}render(){return e(s,{key:"797563b1602bb4c64fb75dabc54286c24b292577","current-position":this.currentPosition},e("slot",{key:"84d724dbb9bd512fb2101cf8e27af2b71658a09b"}))}get host(){return r(this)}static get watchers(){return{position:[{validatePosition:0}],open:[{onOpen:0}],bindTo:[{onBindingChange:0}]}}};b.positionOrder=[i.TOP,i.TOP_RIGHT,i.TOP_LEFT,i.RIGHT,i.RIGHT_BOTTOM,i.RIGHT_TOP,i.BOTTOM,i.BOTTOM_LEFT,i.BOTTOM_RIGHT,i.LEFT,i.LEFT_TOP,i.LEFT_BOTTOM];b.style=u();export{b as z_popover};
-//# sourceMappingURL=p-5af96c6f.entry.js.map

package/dist/web-components-library/p-5c012917.entry.js

@@ -1,2 +0,0 @@
-import{r as a,c as o,h as r,d as i}from"./p-BcDWN4F1.js";import{e,a0 as s}from"./p-DdetsoIY.js";const t=()=>`:host,:host *,:host ::slotted(*){box-sizing:border-box}:host{--z-accordion-highlight-color:transparent;--z-accordion-bg:var(--color-surface01);--z-accordion-label-color:var(--color-default-text);--z-accordion-disabled-label-color:var(--color-text03);--z-accordion-content-bg:var(--color-surface01);--z-accordion-content-fg:var(--color-default-text);--z-accordion-hover-color:var(--color-surface02);--z-accordion-left-padding:calc(var(--space-unit) * 2);--z-accordion-right-padding:var(--space-unit);--z-accordion-label-font-weight:var(--font-sb);display:block;border-top:var(--border-size-small) solid var(--color-surface03);border-bottom:var(--border-size-small) solid var(--color-surface03);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host([variant="background"]){border:var(--border-size-small) solid var(--color-surface03);border-radius:var(--border-radius)}:host([variant="background"][shadow]){box-shadow:var(--shadow-2)}details{background-color:transparent}summary{--summary-x-small-height:32px;--summary-small-height:36px;--summary-big-height:44px;--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit);position:relative;display:flex;min-height:var(--summary-height);align-items:center;padding:var(--summary-y-padding) var(--z-accordion-right-padding) var(--summary-y-padding)     var(--z-accordion-left-padding);background-color:var(--z-accordion-bg);column-gap:var(--space-unit);cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}:host([size="x-small"]) summary{--summary-height:var(--summary-x-small-height)}:host([size="small"]) summary{--summary-height:var(--summary-small-height)}:host(:is([size="x-small"],[size="small"])) summary{--summary-y-padding:calc(var(--space-unit) / 2)}:host([variant="background"]) summary{padding-right:calc(var(--space-unit) * 2);border-radius:calc(var(--border-radius) - var(--border-size-small))}:host([variant="background"][open]) summary{border-bottom-left-radius:0;border-bottom-right-radius:0}:host([is-disabled]) summary{cursor:default}summary:focus:focus-visible{background-color:var(--z-accordion-hover-color);box-shadow:var(--shadow-focus-primary);outline:none}summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{position:absolute;top:0;left:0;display:block;width:var(--space-unit);height:100%;content:""}:host([highlight][variant="background"]) summary::before{border-top-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight][variant="background"]:not([open])) summary::before,:host([highlight][variant="background"][open]) .z-accordion-content::before{border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight]) summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-highlight-color, transparent)}:host([is-disabled][highlight]) summary::before,:host([is-disabled][highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-disabled-label-color)}summary>z-icon{fill:var(--z-accordion-label-color)}:host([is-disabled]) summary>z-icon{fill:var(--z-accordion-disabled-label-color)}.z-accordion-label{color:var(--z-accordion-label-color);font-size:var(--font-size-3);font-weight:var(--z-accordion-label-font-weight)}:host([size="x-small"]) .z-accordion-label{font-size:var(--font-size-2)}:host([size="x-small"]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:16px;--z-icon-height:16px}.z-accordion-tags{display:flex;align-items:center;column-gap:calc(var(--space-unit) / 2)}summary z-icon.z-accordion-chevron{margin-left:auto}.z-accordion-content{position:relative;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2) calc(var(--space-unit) * 2);background-color:var(--z-accordion-content-bg);color:var(--z-accordion-content-fg);font-size:var(--font-size-2);}:host(:is([size="x-small"],[size="small"])) .z-accordion-content{padding-bottom:var(--space-unit)}:host([size="x-small"]) .z-accordion-content{font-size:var(--font-size-1)}:host([variant="background"]) .z-accordion-content{padding-right:calc(var(--space-unit) * 2);border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small));border-bottom-right-radius:calc(var(--border-radius) - var(--border-size-small))}:host([is-disabled]) .z-accordion-label{color:var(--z-accordion-disabled-label-color)}:host([is-disabled]) .z-accordion-tags ::slotted(z-tag[slot="tag"]){--z-tag-bg:var(--z-accordion-disabled-label-color) !important;--z-tag-text-color:var(--color-text-inverse) !important}@media (hover: hover){summary:focus:focus-visible{position:relative;z-index:1}:host(:not([is-disabled])) summary:hover{background-color:var(--z-accordion-hover-color)}:host(:not([is-disabled])) summary:hover .z-accordion-label{text-decoration:underline}}@media (hover: none){:host([size]) summary{--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit)}:host([size]) .z-accordion-label{font-size:var(--font-size-3)}:host([size]) .z-accordion-content{font-size:var(--font-size-2)}:host([size]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:18px;--z-icon-height:18px}}`;const c=class{constructor(r){a(this,r);this.toggled=o(this,"toggled",7);this.size=e.BIG;this.isDisabled=false;this.open=false;this.highlight=false;this.variant=s.DEFAULT;this.shadow=true;this.hasSlottedTags=false}onDisabledChange(){if(this.isDisabled){this.open=false}}checkSlottedTags(){this.hasSlottedTags=!!this.host.querySelector('[slot="tag"]')}onDetailsToggle(){if(this.isDisabled){this.open=false;this.detailsElm.open=false;return}this.open=this.detailsElm.open;this.toggled.emit(this.open)}componentWillLoad(){this.checkSlottedTags()}render(){return r("details",{key:"e957004c881c5d6d78ef08e2e0e2e5d6a24c89b7",ref:a=>this.detailsElm=a,onToggle:this.onDetailsToggle.bind(this),open:this.open},r("summary",{key:"2aee81012aa94c58ef08c9a6095523efb00b8c9c",tabIndex:this.isDisabled?-1:null,part:"summary"},this.icon&&r("z-icon",{key:"6a09efbc17df94ff2141ae999904e281ff9d6136",class:"z-accordion-label-icon",name:this.icon}),r("span",{key:"6b925bf04adee74c040cbcf09488a4e58d2b5c02",class:"z-accordion-label"},this.label),this.hasSlottedTags&&r("span",{key:"95a6cd60ebf18ffc2d7a94c9b0204225b932a810",class:"z-accordion-tags"},r("slot",{key:"179c326ffd592f16947999151b08ebc968e46cf5",name:"tag",onSlotchange:()=>this.checkSlottedTags()})),r("z-icon",{key:"88a53ab505c15735e911d27fd89676de76b488cc",class:"z-accordion-chevron",name:this.open?"chevron-up":"chevron-down"})),!this.isDisabled&&r("div",{key:"327a2c6da908bb660b0e2301a1e345ab1eafbe15",class:"z-accordion-content",part:"content"},r("slot",{key:"950f8a2c6c44d1e3e4411a940e4bee191cc6b3a6"})))}get host(){return i(this)}static get watchers(){return{isDisabled:[{onDisabledChange:0}]}}};c.style=t();export{c as z_accordion};
-//# sourceMappingURL=p-5c012917.entry.js.map

package/dist/web-components-library/p-6c5937db.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e}from"./p-BcDWN4F1.js";const o=()=>`:host{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:0 -1px -1px 0;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}`;const r=class{constructor(e){t(this,e)}render(){return e("slot",{key:"c0d4c33ff0e304a0e2c6b1f708fb48aaa3f45fc5"})}};r.style=o();export{r as z_visually_hidden};
-//# sourceMappingURL=p-6c5937db.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZChip","constructor","hostRef","this","type","ZChipType","DEFAULT","variant","ZChipVariant","OUTLINE","disabled","ariaLabel","render","h","key","class","interactiveIcon","undefined","icon","name","onClick","interactiveIconClick","emit"],"sources":["src/components/z-chip/styles.css?tag=z-chip&encapsulation=scoped","src/components/z-chip/index.tsx"],"sourcesContent":[":host,\n:host * {\n  box-sizing: border-box;\n}\n\n:host {\n  display: block;\n}\n\n:host > .z-chip-container {\n  display: inline-flex;\n  min-height: 28px;\n  align-items: center;\n  padding: 0 calc(var(--space-unit) * 2);\n  border: var(--border-size-small) solid var(--color-surface03);\n  background-color: var(--color-surface01);\n  border-radius: 14px;\n  color: var(--color-primary01);\n  fill: var(--color-default-icon);\n  font-family: var(--font-family-sans);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  gap: var(--space-unit);\n  line-height: 1;\n}\n\n:host > .z-chip-container > button {\n  position: relative;\n  display: flex;\n  width: 28px;\n  height: 28px;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  border-radius: 50%;\n  cursor: pointer;\n}\n\n:host > .z-chip-container .interactive-icon {\n  fill: var(--color-primary01);\n}\n\n:host > .z-chip-container:not([aria-disabled]) button:hover .interactive-icon {\n  color: var(--color-hover-primary);\n  fill: var(--color-hover-primary);\n}\n\n/* Variants */\n:host > .z-chip-container.filled {\n  border-color: transparent;\n  background-color: var(--color-primary01);\n  color: var(--color-text-inverse);\n  fill: var(--color-inverse-icon);\n}\n\n:host > .z-chip-container.filled .interactive-icon {\n  fill: var(--color-inverse-icon);\n}\n\n:host > .z-chip-container.filled:not([aria-disabled]) button::before {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background-color: var(--color-inverse-icon);\n  border-radius: 50%;\n  content: \"\";\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity 0.2s;\n}\n\n:host > .z-chip-container.filled:not([aria-disabled]) button:hover::before {\n  opacity: 0.16;\n}\n\n:host > .z-chip-container.filled:not([aria-disabled]) button:hover .interactive-icon {\n  color: var(--color-inverse-icon);\n  fill: var(--color-inverse-icon);\n}\n\n:host > .z-chip-container.soft {\n  border-color: transparent;\n  background-color: var(--color-primary02);\n  color: var(--color-default-text);\n}\n\n:host > .z-chip-container.soft .interactive-icon {\n  fill: var(--color-primary01);\n}\n\n/* Disabled state */\n:host > .z-chip-container[aria-disabled],\n:host > .z-chip-container[aria-disabled] .interactive-icon {\n  color: var(--color-disabled03);\n  cursor: auto;\n  fill: var(--color-disabled03);\n}\n\n:host > .z-chip-container[aria-disabled] {\n  border: var(--border-size-small) solid var(--color-disabled01);\n  background-color: transparent;\n}\n\n:host > .z-chip-container.filled[aria-disabled],\n:host > .z-chip-container.soft[aria-disabled] {\n  border-color: transparent;\n  background-color: var(--color-disabled01);\n}\n\n:host > .z-chip-container > button:focus:focus-visible {\n  border-radius: 100%;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host > .z-chip-container > z-icon,\n:host > .z-chip-container .interactive-icon {\n  --z-icon-width: 22px;\n  --z-icon-height: 22px;\n}\n\n/* :host type */\n:host > .z-chip-container.default {\n  min-height: 44px;\n  border-radius: 22px;\n}\n\n:host > .z-chip-container.medium {\n  min-height: 40px;\n  border-radius: 22px;\n}\n\n:host > .z-chip-container.small {\n  min-height: 36px;\n  border-radius: 22px;\n}\n\n/* Desktop breakpoint */\n@media (min-width: 1152px) {\n  :host > .z-chip-container {\n    padding: 0 calc(var(--space-unit) * 1.5);\n    font-size: 12px;\n    gap: calc(var(--space-unit) / 2);\n  }\n\n  /* :host type */\n  :host > .z-chip-container.default {\n    min-height: 32px;\n    border-radius: 16px;\n  }\n\n  :host > .z-chip-container.medium {\n    min-height: 28px;\n    border-radius: 16px;\n  }\n\n  :host > .z-chip-container.small {\n    min-height: 24px;\n    border-radius: 16px;\n  }\n\n  :host > .z-chip-container > z-icon,\n  :host > .z-chip-container .interactive-icon {\n    --z-icon-width: 14px;\n    --z-icon-height: 14px;\n  }\n\n  :host > .z-chip-container > button {\n    width: 20px;\n    height: 20px;\n  }\n}\n","import {Component, ComponentInterface, Element, Event, EventEmitter, Prop, h} from \"@stencil/core\";\nimport {ZChipType, ZChipVariant} from \"../../beans\";\n\n@Component({\n  tag: \"z-chip\",\n  styleUrl: \"styles.css\",\n  shadow: false,\n  scoped: true,\n})\nexport class ZChip implements ComponentInterface {\n  @Element() el: HTMLZChipElement;\n\n  /** Non interactive icon */\n  @Prop()\n  icon?: string;\n\n  /** z-chip size type, can be default, medium or small */\n  @Prop({reflect: true})\n  type?: ZChipType = ZChipType.DEFAULT;\n\n  /** z-chip variant type, can be outline, filled or soft */\n  @Prop({reflect: true})\n  variant?: ZChipVariant = ZChipVariant.OUTLINE;\n\n  /** z-chip interactive icon */\n  @Prop({reflect: true})\n  interactiveIcon?: string;\n\n  /** set z-chip as disabled */\n  @Prop({reflect: true})\n  disabled?: boolean = false;\n\n  /** z-chip aria-label string */\n  @Prop()\n  ariaLabel = \"\";\n\n  /** click on interactive icon */\n  @Event()\n  interactiveIconClick: EventEmitter;\n\n  render(): HTMLDivElement {\n    return (\n      <div\n        class={{\n          \"z-chip-container\": true,\n          \"z-chip-interactive\": !!this.interactiveIcon,\n          [this.type]: true,\n          [this.variant]: true,\n        }}\n        aria-disabled={this.disabled ? \"true\" : undefined}\n      >\n        {this.icon && <z-icon name={this.icon} />}\n        <slot />\n        {this.interactiveIcon && (\n          <button\n            type=\"button\"\n            onClick={() => this.interactiveIconClick.emit()}\n            aria-label={this.ariaLabel}\n            disabled={this.disabled}\n          >\n            <z-icon\n              class=\"interactive-icon\"\n              name={this.interactiveIcon}\n            />\n          </button>\n        )}\n      </div>\n    );\n  }\n}\n"],"mappings":"+FAAA,MAAMA,EAAY,IAAM,yzH,MCSXC,EAAK,MANlB,WAAAC,CAAAC,G,qEAeEC,KAAAC,KAAmBC,EAAUC,QAI7BH,KAAAI,QAAyBC,EAAaC,QAQtCN,KAAAO,SAAqB,MAIrBP,KAAAQ,UAAY,EAmCb,CA7BC,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CACEC,MAAO,CACL,mBAAoB,KACpB,uBAAwBZ,KAAKa,gBAC7B,CAACb,KAAKC,MAAO,KACb,CAACD,KAAKI,SAAU,MACjB,gBACcJ,KAAKO,SAAW,OAASO,WAEvCd,KAAKe,MAAQL,EAAA,UAAAC,IAAA,2CAAQK,KAAMhB,KAAKe,OACjCL,EAAA,QAAAC,IAAA,6CACCX,KAAKa,iBACJH,EAAA,UAAAC,IAAA,2CACEV,KAAK,SACLgB,QAAS,IAAMjB,KAAKkB,qBAAqBC,OAAM,aACnCnB,KAAKQ,UACjBD,SAAUP,KAAKO,UAEfG,EAAA,UAAAC,IAAA,2CACEC,MAAM,mBACNI,KAAMhB,KAAKa,mB","ignoreList":[]}

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZInfoReveal","constructor","hostRef","this","icon","position","InfoRevealPosition","BOTTOM_RIGHT","ariaLabel","size","ControlSize","BIG","open","adjustPanelPosition","panel","rect","host","getBoundingClientRect","gridMargin","parseInt","getComputedStyle","document","documentElement","getPropertyValue","pageWidth","offsetWidth","availableSpace","Math","round","includes","left","right","style","maxWidth","togglePanel","closePanel","handleEscapeKey","event","key","render","h","Host","class","type","onClick","bind","label","undefined","name","id","ref","el","hidden"],"sources":["src/components/z-info-reveal/styles.css?tag=z-info-reveal&encapsulation=shadow","src/components/z-info-reveal/index.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --z-info-reveal-panel-width: Width of the info panel.\n   * @prop --trigger-icon-size: Size of the trigger icon for big size.\n   * @prop --trigger-icon-size-small: Size of the trigger icon for small size.\n   * @prop --trigger-icon-size-x-small: Size of the trigger icon for x-small size.\n   */\n  --z-info-reveal-panel-width: 384px; /* defaults to half the maximum size of the mobile breakpoint */\n  --trigger-size: 44px;\n\n  position: relative;\n}\n\n:host * {\n  box-sizing: border-box;\n}\n\nbutton {\n  --trigger-icon-size: calc(var(--trigger-size) / 2);\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  font-family: inherit;\n  letter-spacing: inherit;\n}\n\nbutton:focus:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.z-info-reveal-trigger {\n  min-width: var(--trigger-size);\n  height: var(--trigger-size);\n  padding: calc((var(--trigger-size) - var(--trigger-icon-size)) / 2);\n  background-color: var(--color-surface05);\n  border-radius: var(--border-radius);\n  color: var(--color-text-inverse);\n  column-gap: var(--space-unit);\n  font-weight: var(--font-sb);\n  line-height: 1rem;\n}\n\n:host([size=\"big\"]) .z-info-reveal-trigger {\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"small\"]) .z-info-reveal-trigger {\n  --trigger-size: 36px;\n\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) .z-info-reveal-trigger {\n  --trigger-size: 32px;\n\n  padding: var(--space-unit);\n  font-size: var(--font-size-1);\n}\n\n:host > .z-info-reveal-trigger z-icon {\n  --z-icon-width: var(--trigger-icon-size);\n  --z-icon-height: var(--trigger-icon-size);\n\n  display: flex;\n  fill: var(--color-inverse-icon);\n}\n\n:host([size=\"small\"]) > .z-info-reveal-trigger z-icon {\n  --trigger-icon-size: var(--trigger-icon-size-small, 18px);\n}\n\n:host([size=\"x-small\"]) > .z-info-reveal-trigger z-icon {\n  --trigger-icon-size: var(--trigger-icon-size-x-small, 16px);\n}\n\n.z-info-reveal-panel {\n  position: absolute;\n  z-index: 19;\n  display: flex;\n  width: var(--z-info-reveal-panel-width);\n  height: fit-content;\n  align-items: flex-start;\n  padding: calc(var(--space-unit) * 1.5);\n  background-color: var(--color-surface05);\n  border-radius: var(--border-radius);\n  box-shadow: var(--shadow-4);\n  color: var(--color-text-inverse);\n  column-gap: var(--space-unit);\n}\n\n.z-info-reveal-panel[hidden] {\n  display: none;\n}\n\n:host([position=\"top_left\"]) .z-info-reveal-panel,\n:host([position=\"top_right\"]) .z-info-reveal-panel {\n  top: 0;\n}\n\n:host([position=\"bottom_left\"]) .z-info-reveal-panel,\n:host([position=\"bottom_right\"]) .z-info-reveal-panel {\n  bottom: 0;\n}\n\n:host([position=\"top_right\"]) .z-info-reveal-panel,\n:host([position=\"bottom_right\"]) .z-info-reveal-panel {\n  right: 0;\n}\n\n:host([position=\"top_left\"]) .z-info-reveal-panel,\n:host([position=\"bottom_left\"]) .z-info-reveal-panel {\n  left: 0;\n}\n\n.z-info-reveal-panel .z-info-reveal-close {\n  margin-left: auto;\n}\n\n.z-info-reveal-panel z-icon {\n  fill: var(--color-inverse-icon);\n}\n\n@media (max-width: 767px) {\n  .z-info-reveal-panel {\n    top: auto !important;\n    bottom: auto !important;\n    width: calc(var(--z-info-reveal-panel-width) - (var(--grid-margin) * 4)) !important;\n    margin-top: calc(var(--trigger-size) * -1);\n  }\n}\n","import {Component, ComponentInterface, Element, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ControlSize, InfoRevealPosition} from \"../../beans\";\n\n/**\n * Info reveal component.\n *\n * @slot - content of the info panel.\n */\n@Component({\n  tag: \"z-info-reveal\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZInfoReveal implements ComponentInterface {\n  /** Name of the icon for the trigger button */\n  @Prop()\n  icon? = \"informationsource\";\n\n  /**\n   * The position of the z-info-reveal in the page. This helps to correctly place the info panel.\n   * The panel will grow in the opposite direction of the position.\n   * For example, with the default position `BOTTOM_RIGHT`, the panel will grow vertically upwards and horizontally to the left.\n   */\n  @Prop({reflect: true})\n  position?: InfoRevealPosition = InfoRevealPosition.BOTTOM_RIGHT;\n\n  /** Label of the trigger button. */\n  @Prop()\n  label?: string;\n\n  /** Aria label of the trigger button. It will be only used when `label` prop is empty. */\n  @Prop()\n  ariaLabel = \"Apri pannello informazioni\";\n\n  /** Size of the trigger button */\n  @Prop({reflect: true})\n  size?: ControlSize = ControlSize.BIG;\n\n  /** Whether the info panel is open. */\n  @State()\n  open = false;\n\n  @Element() host: HTMLZInfoRevealElement;\n\n  private panel: HTMLDivElement;\n\n  /**\n   * Adjust the position of the info panel to prevent exiting the viewport.\n   */\n  @Watch(\"position\")\n  @Watch(\"open\")\n  @Listen(\"resize\", {target: \"window\", passive: true})\n  adjustPanelPosition(): void {\n    if (!this.open || !this.panel) {\n      return;\n    }\n\n    const rect = this.host.getBoundingClientRect();\n    const gridMargin = parseInt(getComputedStyle(document.documentElement).getPropertyValue(\"--grid-margin\"), 10);\n    const pageWidth = document.documentElement.offsetWidth;\n    // Available space for the info panel to grow towards the edge of the page, based on the `position` prop.\n    const availableSpace = Math.round(\n      (this.position.includes(\"left\") ? pageWidth - rect.left : rect.right) - gridMargin\n    );\n    this.panel.style.maxWidth = `${availableSpace}px`;\n  }\n\n  /**\n   * Toggle the open state of the info panel.\n   */\n  private togglePanel(): void {\n    this.open = !this.open;\n  }\n\n  /**\n   * Close the info panel.\n   */\n  private closePanel(): void {\n    this.open = false;\n  }\n\n  @Listen(\"keydown\", {target: \"window\", capture: true})\n  handleEscapeKey(event: KeyboardEvent): void {\n    if (event.key === \"Escape\" && this.open) {\n      this.closePanel();\n    }\n  }\n\n  render(): HTMLZInfoRevealElement {\n    return (\n      <Host open={this.open}>\n        <button\n          class=\"z-info-reveal-trigger\"\n          type=\"button\"\n          onClick={this.togglePanel.bind(this)}\n          aria-label={!this.label ? this.ariaLabel : undefined}\n          aria-expanded={this.open ? \"true\" : \"false\"}\n          aria-controls=\"z-info-reveal-panel\"\n        >\n          {this.icon && <z-icon name={this.icon} />}\n          {this.label && <span class=\"z-info-reveal-label\">{this.label}</span>}\n        </button>\n        <div\n          class=\"z-info-reveal-panel\"\n          id=\"z-info-reveal-panel\"\n          ref={(el) => (this.panel = el)}\n          hidden={!this.open}\n        >\n          <slot></slot>\n          <button\n            class=\"z-info-reveal-close\"\n            type=\"button\"\n            onClick={this.closePanel.bind(this)}\n            aria-label=\"Chiudi pannello informazioni\"\n          >\n            <z-icon name=\"multiply\" />\n          </button>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAY,IAAM,ghF,MCaXC,EAAW,MALxB,WAAAC,CAAAC,G,UAQEC,KAAAC,KAAQ,oBAQRD,KAAAE,SAAgCC,EAAmBC,aAQnDJ,KAAAK,UAAY,6BAIZL,KAAAM,KAAqBC,EAAYC,IAIjCR,KAAAS,KAAO,KAiFR,CArEC,mBAAAC,GACE,IAAKV,KAAKS,OAAST,KAAKW,MAAO,CAC7B,M,CAGF,MAAMC,EAAOZ,KAAKa,KAAKC,wBACvB,MAAMC,EAAaC,SAASC,iBAAiBC,SAASC,iBAAiBC,iBAAiB,iBAAkB,IAC1G,MAAMC,EAAYH,SAASC,gBAAgBG,YAE3C,MAAMC,EAAiBC,KAAKC,OACzBzB,KAAKE,SAASwB,SAAS,QAAUL,EAAYT,EAAKe,KAAOf,EAAKgB,OAASb,GAE1Ef,KAAKW,MAAMkB,MAAMC,SAAW,GAAGP,K,CAMzB,WAAAQ,GACN/B,KAAKS,MAAQT,KAAKS,I,CAMZ,UAAAuB,GACNhC,KAAKS,KAAO,K,CAId,eAAAwB,CAAgBC,GACd,GAAIA,EAAMC,MAAQ,UAAYnC,KAAKS,KAAM,CACvCT,KAAKgC,Y,EAIT,MAAAI,GACE,OACEC,EAACC,EAAI,CAAAH,IAAA,2CAAC1B,KAAMT,KAAKS,MACf4B,EAAA,UAAAF,IAAA,2CACEI,MAAM,wBACNC,KAAK,SACLC,QAASzC,KAAK+B,YAAYW,KAAK1C,MAAK,cACvBA,KAAK2C,MAAQ3C,KAAKK,UAAYuC,UAAS,gBACrC5C,KAAKS,KAAO,OAAS,QAAO,gBAC7B,uBAEbT,KAAKC,MAAQoC,EAAA,UAAAF,IAAA,2CAAQU,KAAM7C,KAAKC,OAChCD,KAAK2C,OAASN,EAAA,QAAAF,IAAA,2CAAMI,MAAM,uBAAuBvC,KAAK2C,QAEzDN,EAAA,OAAAF,IAAA,2CACEI,MAAM,sBACNO,GAAG,sBACHC,IAAMC,GAAQhD,KAAKW,MAAQqC,EAC3BC,QAASjD,KAAKS,MAEd4B,EAAA,QAAAF,IAAA,6CACAE,EAAA,UAAAF,IAAA,2CACEI,MAAM,sBACNC,KAAK,SACLC,QAASzC,KAAKgC,WAAWU,KAAK1C,MAAK,aACxB,gCAEXqC,EAAA,UAAAF,IAAA,2CAAQU,KAAK,e","ignoreList":[]}

package/dist/web-components-library/p-817630e4.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as a,H as n,d as e}from"./p-BcDWN4F1.js";import{N as o,a as s,b as r}from"./p-DdetsoIY.js";const l=()=>`z-navigation-tabs{position:relative;z-index:0;display:flex;overflow:hidden;flex-direction:row;font-family:var(--font-family-sans);font-weight:var(--font-rg)}z-navigation-tabs,z-navigation-tabs *{box-sizing:border-box}z-navigation-tabs>nav::-webkit-scrollbar{display:none}z-navigation-tabs .navigation-button{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;border:none;margin:0;background-color:var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));border-radius:var(--border-no-radius);box-shadow:0 0 4px 1px var(--shadow-color-base);cursor:pointer;fill:var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));outline:none}z-navigation-tabs .navigation-button:disabled{display:none}z-navigation-tabs>nav{z-index:0;display:flex;overflow:auto;align-items:center;justify-content:flex-start;scroll-behavior:smooth;scrollbar-width:none}z-navigation-tabs[orientation="horizontal"]>nav{width:100%}z-navigation-tabs[orientation="horizontal"] .navigation-button{top:0;width:calc(var(--space-unit) * 4);height:100%}z-navigation-tabs[orientation="horizontal"] .navigation-button:first-child{left:0}z-navigation-tabs[orientation="horizontal"] .navigation-button:last-child{right:0}z-navigation-tabs[orientation="vertical"]{width:fit-content;flex-direction:column}z-navigation-tabs[orientation="vertical"]>nav{height:100%;flex-direction:column;align-items:stretch}z-navigation-tabs[orientation="vertical"] .navigation-button{left:0;width:100%;height:calc(var(--space-unit) * 4)}z-navigation-tabs[orientation="vertical"] .navigation-button:first-child{top:0}z-navigation-tabs[orientation="vertical"] .navigation-button:last-child{bottom:0}z-navigation-tabs[size="small"][orientation="vertical"] .navigation-button{height:calc(var(--space-unit) * 4)}z-navigation-tabs>nav>*{position:relative;z-index:0;display:inline-flex;width:auto;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);border:none;margin:0;background-color:unset;border-radius:var(--border-no-radius);color:var(--color-primary01);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:inherit;gap:var(--space-unit);letter-spacing:inherit;line-height:inherit;outline:none;text-align:center;white-space:nowrap}z-navigation-tabs>nav>a{text-decoration:none}z-navigation-tabs>nav>*:focus:focus-visible{z-index:1;box-shadow:inset 0 0 2px 2px var(--shadow-color-base)}z-navigation-tabs>nav>:not([disabled]):hover{background-color:var(--color-background)}z-navigation-tabs>nav>button[disabled]{color:var(--color-disabled03);cursor:not-allowed;fill:currentcolor;pointer-events:all}z-navigation-tabs>nav>:not([disabled]):hover,nav>[aria-selected="true"]{color:var(--color-hover-primary);fill:currentcolor}z-navigation-tabs>nav>:not([disabled]):hover::after,nav>[aria-selected="true"]::after{position:absolute;background-color:var(--color-hover-primary);content:""}z-navigation-tabs[orientation="horizontal"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation="horizontal"]>nav>[aria-selected="true"]::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tabs>nav>* z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tabs[size="small"][orientation="horizontal"]>nav>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tabs[size="small"][orientation="horizontal"]>nav>:not([disabled]):hover::after,z-navigation-tabs[size="small"][orientation="horizontal"]>nav>[aria-selected="true"]::after{height:var(--border-size-medium)}z-navigation-tabs[size="small"]:not([orientation="vertical"])>nav>* z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tabs[orientation="vertical"]>nav>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tabs[orientation="vertical"]>nav>*>:not(z-icon){display:none}z-navigation-tabs[orientation="vertical"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation="vertical"]>nav>[aria-selected="true"]::after{top:0;right:0;width:var(--border-size-large);height:100%}`;const c=class{constructor(a){t(this,a);this.selected=i(this,"selected",7);this.ariaLabel="";this.orientation=o.HORIZONTAL;this.size=s.BIG;this.selectedTab=undefined;this.focusedTab=undefined}get direction(){return this.orientation==o.HORIZONTAL?"Left":"Top"}get dimension(){return this.orientation==o.HORIZONTAL?"Width":"Height"}get tabs(){return Array.from(this.nav.children)}scrollToTab(t){const i=t.parentElement;if(!i){return}setTimeout((()=>{const a=this.orientation===o.HORIZONTAL;const n=i.getBoundingClientRect();const e=t.getBoundingClientRect();const s=a?e.left-n.left:e.top-n.top;const r=a?i.clientWidth:i.clientHeight;const l=a?t.clientWidth:t.clientHeight;const c=s-r/2+l/2;i.scrollTo({[a?"left":"top"]:i[a?"scrollLeft":"scrollTop"]+c,behavior:"smooth"})}),100)}navigateBackwards(){this.nav.scrollBy({[this.direction.toLowerCase()]:0-this.nav[`client${this.dimension}`]/2,behavior:"smooth"})}navigateForward(){this.nav.scrollBy({[this.direction.toLowerCase()]:this.nav[`scroll${this.direction}`]+this.nav[`client${this.dimension}`]/2,behavior:"smooth"})}isArrowNavigation(t){return Object.values(r).includes(t.key)}checkScrollVisible(){if(!this.nav){return}this.canNavigate=this.nav[`scroll${this.dimension}`]>this.nav[`client${this.dimension}`]}checkScrollEnabled(){if(!this.nav){return}this.canNavigateNext=this.nav[`scroll${this.direction}`]+this.nav[`client${this.dimension}`]<this.nav[`scroll${this.dimension}`];this.canNavigatePrev=this.nav[`scroll${this.direction}`]>0}onTabSelected(){this.tabs.forEach(((t,i)=>{const a=t.querySelector("z-icon");const n=a===null||a===void 0?void 0:a.name.replace("-filled","");if(i!==this.selectedTab){t.setAttribute("aria-selected","false");t.tabIndex=-1;if(a){a.name=n}return}if(a){a.name=`${n}-filled`}t.setAttribute("aria-selected","true")}));this.selected.emit(this.selectedTab);if(this.selectedTab!==undefined){this.scrollToTab(this.tabs[this.selectedTab])}}handleTabClick(t){const i=t.target.closest("[role='tab']");if(!this.tabs.some((t=>t.contains(i)))){return}this.selectedTab=this.tabs.indexOf(i)}onTabFocusIn(t){const i=this.tabs.findIndex((i=>i.contains(t.target)));if(i===-1){return}if(this.selectedTab!==undefined){this.tabs[this.selectedTab].tabIndex=-1}this.focusedTab=i;this.tabs[this.focusedTab].tabIndex=-1;this.scrollToTab(this.tabs[this.focusedTab])}navigateThroughTabs(t){if(!this.tabs.some((i=>i.contains(t.target)))||!this.isArrowNavigation(t)){return true}t.preventDefault();if(t.key===r.RIGHT&&this.orientation==o.HORIZONTAL||t.key===r.DOWN&&this.orientation==o.VERTICAL){this.focusedTab++;if(this.focusedTab>=this.tabs.length){this.focusedTab=0}}else if(t.key===r.LEFT&&this.orientation==o.HORIZONTAL||t.key===r.UP&&this.orientation==o.VERTICAL){this.focusedTab--;if(this.focusedTab<0){this.focusedTab=this.tabs.length-1}}if(this.tabs[this.focusedTab].hasAttribute("disabled")&&this.tabs[this.focusedTab].getAttribute("disabled")!=="false"){return this.navigateThroughTabs(t)}this.tabs[this.focusedTab].focus();this.scrollToTab(this.tabs[this.focusedTab])}onTabFocusOut(t){var i;if(!this.tabs.some((i=>i.contains(t.relatedTarget)))){this.tabs[(i=this.selectedTab)!==null&&i!==void 0?i:0].tabIndex=0;this.focusedTab=undefined}}connectedCallback(){this.resizeObserver=new ResizeObserver((()=>this.checkScrollVisible()))}componentDidLoad(){var t;this.tabs.forEach((t=>{t.setAttribute("role","tab");t.tabIndex=-1}));const i=(t=this.selectedTab)!==null&&t!==void 0?t:this.tabs.findIndex((t=>t.ariaSelected==="true"));if(i!==-1){this.selectedTab=i;this.tabs[i].tabIndex=0;this.onTabSelected()}else{this.tabs[0].tabIndex=0}this.resizeObserver.observe(this.nav)}disconnectedCallback(){var t;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect()}render(){return a(n,{key:"c01be594e11d9cf1d698b06c83ec4a888c7af5b4",class:{"interactive-2":this.size===s.SMALL,"interactive-1":this.size!==s.SMALL},scrollable:this.canNavigate},a("button",{key:"aa791c858ad0dd69592c8a3e2edb439bce3168dc",class:"navigation-button",onClick:this.navigateBackwards.bind(this),tabIndex:-1,disabled:!this.canNavigatePrev,"aria-label":"Mostra elementi precedenti",hidden:!this.canNavigate},a("z-icon",{key:"50092cbfdfec8f07917d3c6aaed9886aef333ba7",name:this.orientation===o.HORIZONTAL?"chevron-left":"chevron-up",width:16,height:16})),a("nav",{key:"c4a2563c2179dc1e345d8793643cf786243d96b6",role:"tablist","aria-label":this.ariaLabel,ref:t=>this.nav=t!==null&&t!==void 0?t:this.nav,onScroll:this.checkScrollEnabled.bind(this),"aria-orientation":this.orientation},a("slot",{key:"56dfd0a8c140b9d426a3ee5675b7d602b0ca2434"})),a("button",{key:"1ffabd713e915b0973f4f4958564a842cb898c30",class:"navigation-button",onClick:this.navigateForward.bind(this),tabIndex:-1,disabled:!this.canNavigateNext,"aria-label":"Mostra elementi successivi",hidden:!this.canNavigate},a("z-icon",{key:"a0dd7e2d95fab2c2a0cfeeca289b040ee72d5bc8",name:this.orientation===o.HORIZONTAL?"chevron-right":"chevron-down",width:16,height:16})))}get host(){return e(this)}static get watchers(){return{canNavigate:[{checkScrollEnabled:0}],selectedTab:[{onTabSelected:0}]}}};c.style=l();export{c as z_navigation_tabs};
-//# sourceMappingURL=p-817630e4.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZNavigationTabs","constructor","hostRef","this","ariaLabel","orientation","NavigationTabsOrientation","HORIZONTAL","size","NavigationTabsSize","BIG","selectedTab","undefined","focusedTab","direction","dimension","tabs","Array","from","nav","children","scrollToTab","tabElement","container","parentElement","setTimeout","isHorizontal","containerRect","getBoundingClientRect","tabRect","offset","left","top","containerSize","clientWidth","clientHeight","tabSize","scrollAmount","scrollTo","behavior","navigateBackwards","scrollBy","toLowerCase","navigateForward","isArrowNavigation","e","Object","values","NavigationTabsKeyboardEvents","includes","key","checkScrollVisible","canNavigate","checkScrollEnabled","canNavigateNext","canNavigatePrev","onTabSelected","forEach","tab","i","zicon","querySelector","strokeIcon","name","replace","setAttribute","tabIndex","selected","emit","handleTabClick","event","clickedTab","target","closest","some","child","contains","indexOf","onTabFocusIn","focused","findIndex","navigateThroughTabs","preventDefault","RIGHT","DOWN","VERTICAL","length","LEFT","UP","hasAttribute","getAttribute","focus","onTabFocusOut","relatedTarget","_a","connectedCallback","resizeObserver","ResizeObserver","componentDidLoad","preselectedTab","ariaSelected","observe","disconnectedCallback","disconnect","render","h","Host","class","SMALL","scrollable","onClick","bind","disabled","hidden","width","height","role","ref","el","onScroll"],"sources":["src/components/z-navigation-tabs/styles.css?tag=z-navigation-tabs","src/components/z-navigation-tabs/index.tsx"],"sourcesContent":["z-navigation-tabs {\n  /**\n   * @prop --z-navigation-tabs-nav-buttons-bg: Background color of the navigation buttons. The default is `--color-surface01`.\n   * @prop --z-navigation-tabs-nav-buttons-fg: Foreground color of the navigation buttons. The default is `--color-primary01`.\n   */\n  --z-navigation-tabs-nav-buttons-bg: ;\n  --z-navigation-tabs-nav-buttons-fg: ;\n\n  position: relative;\n  z-index: 0;\n  display: flex;\n  overflow: hidden;\n  flex-direction: row;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\nz-navigation-tabs,\nz-navigation-tabs * {\n  box-sizing: border-box;\n}\n\nz-navigation-tabs > nav::-webkit-scrollbar {\n  display: none;\n}\n\nz-navigation-tabs .navigation-button {\n  position: absolute;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  margin: 0;\n  background-color: var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));\n  border-radius: var(--border-no-radius);\n  box-shadow: 0 0 4px 1px var(--shadow-color-base);\n  cursor: pointer;\n  fill: var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));\n  outline: none;\n}\n\nz-navigation-tabs .navigation-button:disabled {\n  display: none;\n}\n\nz-navigation-tabs > nav {\n  z-index: 0;\n  display: flex;\n  overflow: auto;\n  align-items: center;\n  justify-content: flex-start;\n  scroll-behavior: smooth;\n\n  /* hide scrollbar in Firefox */\n  scrollbar-width: none;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav {\n  width: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button {\n  top: 0;\n  width: calc(var(--space-unit) * 4);\n  height: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:first-child {\n  left: 0;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:last-child {\n  right: 0;\n}\n\n/* Orientation vertical */\nz-navigation-tabs[orientation=\"vertical\"] {\n  width: fit-content;\n  flex-direction: column;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav {\n  height: 100%;\n  flex-direction: column;\n  align-items: stretch;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button {\n  left: 0;\n  width: 100%;\n  height: calc(var(--space-unit) * 4);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:first-child {\n  top: 0;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:last-child {\n  bottom: 0;\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"vertical\"] .navigation-button {\n  height: calc(var(--space-unit) * 4);\n}\n\n/* Style for the tabs */\n\nz-navigation-tabs > nav > * {\n  position: relative;\n  z-index: 0;\n  display: inline-flex;\n  width: auto;\n  align-items: center;\n  justify-content: center;\n  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);\n  border: none;\n  margin: 0;\n  background-color: unset;\n  border-radius: var(--border-no-radius);\n  color: var(--color-primary01);\n  cursor: pointer;\n  fill: currentcolor;\n  font-family: var(--font-family-sans);\n  font-size: inherit;\n  gap: var(--space-unit);\n  letter-spacing: inherit;\n  line-height: inherit;\n  outline: none;\n  text-align: center;\n  white-space: nowrap;\n}\n\nz-navigation-tabs > nav > a {\n  text-decoration: none;\n}\n\nz-navigation-tabs > nav > *:focus:focus-visible {\n  z-index: 1;\n  box-shadow: inset 0 0 2px 2px var(--shadow-color-base);\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover {\n  background-color: var(--color-background);\n}\n\nz-navigation-tabs > nav > button[disabled] {\n  color: var(--color-disabled03);\n  cursor: not-allowed;\n  fill: currentcolor;\n  pointer-events: all;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover,\nnav > [aria-selected=\"true\"] {\n  color: var(--color-hover-primary);\n  fill: currentcolor;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover::after,\nnav > [aria-selected=\"true\"]::after {\n  position: absolute;\n  background-color: var(--color-hover-primary);\n  content: \"\";\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n  bottom: 0;\n  left: 0;\n  width: 100%;\n  height: var(--border-size-large);\n}\n\nz-navigation-tabs > nav > * z-icon {\n  --z-icon-width: calc(var(--space-unit) * 2);\n  --z-icon-height: calc(var(--space-unit) * 2);\n\n  display: flex;\n  margin: 0;\n}\n\n/* `small` size (only available for horizontal orientation) */\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > * {\n  padding: var(--space-unit) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n  height: var(--border-size-medium);\n}\n\nz-navigation-tabs[size=\"small\"]:not([orientation=\"vertical\"]) > nav > * z-icon {\n  --z-icon-width: 14px;\n  --z-icon-height: 14px;\n}\n\n/* Orientation Vertical */\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > * {\n  padding: calc(var(--space-unit) * 3) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > * > :not(z-icon) {\n  display: none;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"vertical\"] > nav > [aria-selected=\"true\"]::after {\n  top: 0;\n  right: 0;\n  width: var(--border-size-large);\n  height: 100%;\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  h,\n} from \"@stencil/core\";\nimport {NavigationTabsKeyboardEvents, NavigationTabsOrientation, NavigationTabsSize} from \"../../beans\";\n\n/**\n * Navigation tabs component.\n * To select a specific tab programmatically, set the `aria-selected` attribute to `true` on the desired tab.\n * @slot - Main slot. Use `<button>` or `<a>` tags as children.\n */\n@Component({\n  tag: \"z-navigation-tabs\",\n  styleUrl: \"styles.css\",\n})\nexport class ZNavigationTabs implements ComponentInterface {\n  /**\n   * Set `aria-label` attribute to the internal `<nav>` element with `tablist` role.\n   */\n  @Prop()\n  ariaLabel = \"\";\n\n  /**\n   * Navigation tabs orientation.\n   */\n  @Prop({reflect: true})\n  orientation? = NavigationTabsOrientation.HORIZONTAL;\n\n  /**\n   * Navigation tabs size.\n   */\n  @Prop({reflect: true})\n  size? = NavigationTabsSize.BIG;\n\n  /**\n   * Index of the selected tab.\n   * Useful to programmatically select a tab.\n   * The tab can also be selected by setting the `aria-selected` attribute to `true` on the desired tab.\n   */\n  @Prop({mutable: true})\n  selectedTab: number = undefined;\n\n  /**\n   * Emitted when the selected tab changes.\n   * Contains the index of the new selected tab in the `detail` of the event.\n   */\n  @Event()\n  selected: EventEmitter<number>;\n\n  /**\n   * Whether to show navigation buttons.\n   */\n  @State()\n  canNavigate: boolean;\n\n  /**\n   * Whether backwards navigation is allowed.\n   */\n  @State()\n  canNavigatePrev: boolean;\n\n  /**\n   * Whether forward navigation is allowed.\n   */\n  @State()\n  canNavigateNext: boolean;\n\n  @Element() host: HTMLZNavigationTabsElement;\n\n  /**\n   * Index of the last tab that held focus.\n   */\n  private focusedTab = undefined;\n\n  /**\n   * Reference to the `<nav>` element\n   */\n  private nav: HTMLElement;\n\n  /**\n   * Getter for the direction to check based on current orientation.\n   */\n  get direction(): string {\n    return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Left\" : \"Top\";\n  }\n\n  /**\n   * Getter for the dimension to check based on current orientation.\n   */\n  get dimension(): string {\n    return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Width\" : \"Height\";\n  }\n\n  get tabs(): HTMLElement[] {\n    return Array.from(this.nav.children) as HTMLElement[];\n  }\n\n  private resizeObserver: ResizeObserver;\n\n  /**\n   * Scroll into view to center the tab.\n   */\n  private scrollToTab(tabElement: HTMLElement): void {\n    const container = tabElement.parentElement;\n\n    if (!container) {\n      return;\n    }\n\n    setTimeout(() => {\n      const isHorizontal = this.orientation === NavigationTabsOrientation.HORIZONTAL;\n\n      const containerRect = container.getBoundingClientRect();\n      const tabRect = tabElement.getBoundingClientRect();\n\n      const offset = isHorizontal ? tabRect.left - containerRect.left : tabRect.top - containerRect.top;\n      const containerSize = isHorizontal ? container.clientWidth : container.clientHeight;\n      const tabSize = isHorizontal ? tabElement.clientWidth : tabElement.clientHeight;\n      const scrollAmount = offset - containerSize / 2 + tabSize / 2;\n\n      container.scrollTo({\n        [isHorizontal ? \"left\" : \"top\"]: container[isHorizontal ? \"scrollLeft\" : \"scrollTop\"] + scrollAmount,\n        behavior: \"smooth\",\n      });\n    }, 100);\n  }\n\n  /**\n   * Scroll the navigation bar half of its size backward.\n   */\n  private navigateBackwards(): void {\n    this.nav.scrollBy({\n      [this.direction.toLowerCase()]: 0 - this.nav[`client${this.dimension}`] / 2,\n      behavior: \"smooth\",\n    });\n  }\n\n  /**\n   * Scroll the navigation bar half of its size forward.\n   */\n  private navigateForward(): void {\n    this.nav.scrollBy({\n      [this.direction.toLowerCase()]: this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] / 2,\n      behavior: \"smooth\",\n    });\n  }\n\n  /**\n   * Check if a keyboard event was triggered by an arrow key.\n   */\n  private isArrowNavigation(e: KeyboardEvent): boolean {\n    return Object.values(NavigationTabsKeyboardEvents).includes(e.key as NavigationTabsKeyboardEvents);\n  }\n\n  /**\n   * Check if the navigation buttons are needed.\n   */\n  private checkScrollVisible(): void {\n    if (!this.nav) {\n      return;\n    }\n\n    this.canNavigate = this.nav[`scroll${this.dimension}`] > this.nav[`client${this.dimension}`];\n  }\n\n  /**\n   * Check if navigation buttons can be enabled for each direction.\n   */\n  @Watch(\"canNavigate\")\n  checkScrollEnabled(): void {\n    if (!this.nav) {\n      return;\n    }\n\n    this.canNavigateNext =\n      this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] < this.nav[`scroll${this.dimension}`];\n    this.canNavigatePrev = this.nav[`scroll${this.direction}`] > 0;\n  }\n\n  /**\n   * When the selected tab changes, update the `aria-selected` attribute on each tab and scroll to the selected tab.\n   */\n  @Watch(\"selectedTab\")\n  onTabSelected(): void {\n    this.tabs.forEach((tab, i) => {\n      const zicon = tab.querySelector(\"z-icon\");\n      const strokeIcon = zicon?.name.replace(\"-filled\", \"\");\n      if (i !== this.selectedTab) {\n        tab.setAttribute(\"aria-selected\", \"false\");\n        tab.tabIndex = -1;\n        if (zicon) {\n          zicon.name = strokeIcon;\n        }\n\n        return;\n      }\n\n      if (zicon) {\n        zicon.name = `${strokeIcon}-filled`;\n      }\n      tab.setAttribute(\"aria-selected\", \"true\");\n    });\n    this.selected.emit(this.selectedTab);\n    if (this.selectedTab !== undefined) {\n      this.scrollToTab(this.tabs[this.selectedTab]);\n    }\n  }\n\n  /**\n   * Handle click on the tabs.\n   * @param event `click` event triggered by a child tab\n   */\n  @Listen(\"click\")\n  handleTabClick(event: MouseEvent): void {\n    const clickedTab = (event.target as HTMLElement).closest<HTMLElement>(\"[role='tab']\");\n    if (!this.tabs.some((child) => child.contains(clickedTab))) {\n      return;\n    }\n\n    this.selectedTab = this.tabs.indexOf(clickedTab);\n  }\n\n  /**\n   * When a tab is focused, temporarily set to -1 the `tabindex` of the selected tab (if any) and set the `focusedTab` to the index of the focused tab.\n   */\n  @Listen(\"focusin\")\n  onTabFocusIn(event: FocusEvent): void {\n    const focused = this.tabs.findIndex((tab) => tab.contains(event.target as HTMLElement));\n    if (focused === -1) {\n      return;\n    }\n\n    if (this.selectedTab !== undefined) {\n      this.tabs[this.selectedTab].tabIndex = -1;\n    }\n    this.focusedTab = focused;\n    this.tabs[this.focusedTab].tabIndex = -1;\n    this.scrollToTab(this.tabs[this.focusedTab]);\n  }\n\n  /**\n   * Handle keyboard navigation through tabs with arrow keys.\n   */\n  @Listen(\"keydown\")\n  navigateThroughTabs(event: KeyboardEvent): void | boolean {\n    if (!this.tabs.some((tab) => tab.contains(event.target as HTMLElement)) || !this.isArrowNavigation(event)) {\n      return true;\n    }\n\n    event.preventDefault();\n    if (\n      (event.key === NavigationTabsKeyboardEvents.RIGHT && this.orientation == NavigationTabsOrientation.HORIZONTAL) ||\n      (event.key === NavigationTabsKeyboardEvents.DOWN && this.orientation == NavigationTabsOrientation.VERTICAL)\n    ) {\n      // Move forward\n      this.focusedTab++;\n      if (this.focusedTab >= this.tabs.length) {\n        this.focusedTab = 0;\n      }\n    } else if (\n      (event.key === NavigationTabsKeyboardEvents.LEFT && this.orientation == NavigationTabsOrientation.HORIZONTAL) ||\n      (event.key === NavigationTabsKeyboardEvents.UP && this.orientation == NavigationTabsOrientation.VERTICAL)\n    ) {\n      // Move backward\n      this.focusedTab--;\n      if (this.focusedTab < 0) {\n        this.focusedTab = this.tabs.length - 1;\n      }\n    }\n    // Ignore disabled tabs\n    if (\n      this.tabs[this.focusedTab].hasAttribute(\"disabled\") &&\n      this.tabs[this.focusedTab].getAttribute(\"disabled\") !== \"false\"\n    ) {\n      return this.navigateThroughTabs(event);\n    }\n\n    this.tabs[this.focusedTab].focus();\n    this.scrollToTab(this.tabs[this.focusedTab]);\n  }\n\n  /**\n   * If the focus is not going on a tab (`relatedTarget` is the new focused element), set to 0 the `tabindex` of the selected tab or the one of the first tab, then unset the `focusedTab`.\n   */\n  @Listen(\"focusout\")\n  onTabFocusOut(event: FocusEvent): void {\n    if (!this.tabs.some((tab) => tab.contains(event.relatedTarget as HTMLElement))) {\n      this.tabs[this.selectedTab ?? 0].tabIndex = 0;\n      this.focusedTab = undefined;\n    }\n  }\n\n  connectedCallback(): void {\n    this.resizeObserver = new ResizeObserver(() => this.checkScrollVisible());\n  }\n\n  componentDidLoad(): void {\n    // Set role and tabindex to each slotted tab\n    this.tabs.forEach((tab) => {\n      tab.setAttribute(\"role\", \"tab\");\n      tab.tabIndex = -1;\n    });\n\n    const preselectedTab = this.selectedTab ?? this.tabs.findIndex((tab) => tab.ariaSelected === \"true\");\n    if (preselectedTab !== -1) {\n      this.selectedTab = preselectedTab;\n      this.tabs[preselectedTab].tabIndex = 0;\n      this.onTabSelected();\n    } else {\n      this.tabs[0].tabIndex = 0;\n    }\n\n    this.resizeObserver.observe(this.nav);\n  }\n\n  disconnectedCallback(): void {\n    this.resizeObserver?.disconnect();\n  }\n\n  render(): HTMLZNavigationTabsElement {\n    return (\n      <Host\n        class={{\n          \"interactive-2\": this.size === NavigationTabsSize.SMALL,\n          \"interactive-1\": this.size !== NavigationTabsSize.SMALL,\n        }}\n        scrollable={this.canNavigate}\n      >\n        <button\n          class=\"navigation-button\"\n          onClick={this.navigateBackwards.bind(this)}\n          tabIndex={-1}\n          disabled={!this.canNavigatePrev}\n          aria-label=\"Mostra elementi precedenti\"\n          hidden={!this.canNavigate}\n        >\n          <z-icon\n            name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-left\" : \"chevron-up\"}\n            width={16}\n            height={16}\n          />\n        </button>\n\n        <nav\n          role=\"tablist\"\n          aria-label={this.ariaLabel}\n          ref={(el) => (this.nav = el ?? this.nav)}\n          onScroll={this.checkScrollEnabled.bind(this)}\n          aria-orientation={this.orientation}\n        >\n          <slot></slot>\n        </nav>\n\n        <button\n          class=\"navigation-button\"\n          onClick={this.navigateForward.bind(this)}\n          tabIndex={-1}\n          disabled={!this.canNavigateNext}\n          aria-label=\"Mostra elementi successivi\"\n          hidden={!this.canNavigate}\n        >\n          <z-icon\n            name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-right\" : \"chevron-down\"}\n            width={16}\n            height={16}\n          />\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/web-components-library/p-831d85f5.entry.js

@@ -1,2 +0,0 @@
-import{r as t,h as e,H as i,d as o}from"./p-BcDWN4F1.js";import{z as s,D as r}from"./p-DdetsoIY.js";const a=()=>`:host{--z-section-title--divider-color:var(--red500);display:flex;width:fit-content;flex-direction:column;align-items:flex-start;font-family:var(--font-family-sans)}:host,:host ::slotted(*){box-sizing:border-box}::slotted(*){margin:0}::slotted([slot="secondary-title"]){padding-bottom:calc(var(--space-unit) / 2);border-bottom:var(--border-size-large) solid var(--z-section-title--divider-color);font-size:var(--font-size-3);font-weight:var(--font-sb);line-height:1.5rem;text-transform:uppercase}::slotted([slot="primary-title"]){font-size:var(--font-size-6);font-weight:var(--font-sb);line-height:2rem}:host([uppercase]:not([uppercase="false"])) ::slotted([slot="primary-title"]){text-transform:uppercase}@media (min-width: 1152px){::slotted([slot="primary-title"]){font-size:var(--font-size-7);line-height:2.25rem}}`;const d=class{constructor(e){t(this,e);this.dividerPosition=s.BEFORE;this.uppercase=true}componentWillRender(){this.hasSecondaryTitle=!!this.host.querySelector("[slot=secondary-title]")}render(){return e(i,{key:"020c1a41ff7fa0881464463322b54754e7664957"},e("slot",{key:"c6d7baf944465d1092749cf288636fcd502e659c",name:"secondary-title"}),!this.hasSecondaryTitle&&this.dividerPosition===s.BEFORE&&e("z-divider",{key:"ea70a8579ed61ba8b1d6488566473b90c47540d1",size:r.LARGE,color:"z-section-title--divider-color"}),e("slot",{key:"4cf602491394aaf97cead51bbc7f9b2da299bef3",name:"primary-title"}),!this.hasSecondaryTitle&&this.dividerPosition===s.AFTER&&e("z-divider",{key:"47275d6411b00769db2e244bad13032d43cc9144",size:r.LARGE,color:"z-section-title--divider-color"}))}get host(){return o(this)}};d.style=a();export{d as z_section_title};
-//# sourceMappingURL=p-831d85f5.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZSectionTitle","constructor","hostRef","this","dividerPosition","ZSectionTitleDividerPosition","BEFORE","uppercase","componentWillRender","hasSecondaryTitle","host","querySelector","render","h","Host","key","name","size","DividerSize","LARGE","color","AFTER"],"sources":["src/components/deprecated/z-section-title/styles.css?tag=z-section-title&encapsulation=shadow","src/components/deprecated/z-section-title/index.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --z-section-title--divider-color: Color of the divider. Use a CSS prop string like `\"--red500\"`. Default is `\"--red500\"`.\n   */\n  --z-section-title--divider-color: var(--red500);\n\n  display: flex;\n  width: fit-content;\n  flex-direction: column;\n  align-items: flex-start;\n  font-family: var(--font-family-sans);\n}\n\n:host,\n:host ::slotted(*) {\n  box-sizing: border-box;\n}\n\n::slotted(*) {\n  margin: 0;\n}\n\n::slotted([slot=\"secondary-title\"]) {\n  padding-bottom: calc(var(--space-unit) / 2);\n  border-bottom: var(--border-size-large) solid var(--z-section-title--divider-color);\n  font-size: var(--font-size-3);\n  font-weight: var(--font-sb);\n  line-height: 1.5rem;\n  text-transform: uppercase;\n}\n\n::slotted([slot=\"primary-title\"]) {\n  font-size: var(--font-size-6);\n  font-weight: var(--font-sb);\n  line-height: 2rem;\n}\n\n:host([uppercase]:not([uppercase=\"false\"])) ::slotted([slot=\"primary-title\"]) {\n  text-transform: uppercase;\n}\n\n/* Desktop breakpoint */\n@media (min-width: 1152px) {\n  ::slotted([slot=\"primary-title\"]) {\n    font-size: var(--font-size-7);\n    line-height: 2.25rem;\n  }\n}\n","import {Component, ComponentInterface, Element, h, Host, Prop} from \"@stencil/core\";\nimport {DividerSize, ZSectionTitleDividerPosition} from \"../../../beans\";\n\n/**\n * Section title component.\n * An optional secondary title can be put over the primary one.\n *\n * @slot secondary-title - Slot for the secondary title. When present, the divider is always displayed under it,\n * following its width and removing the one for the primary title.\n * @slot primary-title - Slot for the primary title.\n */\n@Component({\n  tag: \"z-section-title\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZSectionTitle implements ComponentInterface {\n  /**\n   * Divider position for the primary title.\n   * This prop only works if the secondary title is not set.\n   */\n  @Prop()\n  dividerPosition: ZSectionTitleDividerPosition = ZSectionTitleDividerPosition.BEFORE;\n\n  /**\n   * Whether the primary title text is uppercase.\n   */\n  @Prop({reflect: true})\n  uppercase = true;\n\n  @Element() host: HTMLZSectionTitleElement;\n\n  private hasSecondaryTitle: boolean;\n\n  componentWillRender(): void {\n    this.hasSecondaryTitle = !!this.host.querySelector(\"[slot=secondary-title]\");\n  }\n\n  render(): HTMLZSectionTitleElement {\n    return (\n      <Host>\n        <slot name=\"secondary-title\" />\n        {!this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.BEFORE && (\n          <z-divider\n            size={DividerSize.LARGE}\n            color=\"z-section-title--divider-color\"\n          />\n        )}\n        <slot name=\"primary-title\" />\n        {!this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.AFTER && (\n          <z-divider\n            size={DividerSize.LARGE}\n            color=\"z-section-title--divider-color\"\n          />\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAY,IAAM,ozB,MCgBXC,EAAa,MAL1B,WAAAC,CAAAC,G,UAWEC,KAAAC,gBAAgDC,EAA6BC,OAM7EH,KAAAI,UAAY,IA8Bb,CAxBC,mBAAAC,GACEL,KAAKM,oBAAsBN,KAAKO,KAAKC,cAAc,yB,CAGrD,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,2CAAMC,KAAK,qBACTb,KAAKM,mBAAqBN,KAAKC,kBAAoBC,EAA6BC,QAChFO,EAAA,aAAAE,IAAA,2CACEE,KAAMC,EAAYC,MAClBC,MAAM,mCAGVP,EAAA,QAAAE,IAAA,2CAAMC,KAAK,mBACTb,KAAKM,mBAAqBN,KAAKC,kBAAoBC,EAA6BgB,OAChFR,EAAA,aAAAE,IAAA,2CACEE,KAAMC,EAAYC,MAClBC,MAAM,mC","ignoreList":[]}

package/dist/web-components-library/p-873e12a2.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as a,h as t,H as i,d as r}from"./p-BcDWN4F1.js";import{e as n,B as h,u as o,v as s}from"./p-DdetsoIY.js";const p=()=>`:host{--app-header-typography-1-size:24px;--app-header-typography-2-size:28px;--app-header-typography-3-size:32px;--app-header-typography-4-size:36px;--app-header-typography-5-size:42px;--app-header-typography-6-size:48px;--app-header-typography-7-size:54px;--app-header-typography-8-size:60px;--app-header-typography-9-size:68px;--app-header-typography-10-size:76px;--app-header-typography-11-size:84px;--app-header-typography-12-size:92px;--app-header-typography-1-lineheight:1.33;--app-header-typography-2-lineheight:1.29;--app-header-typography-3-lineheight:1.25;--app-header-typography-4-lineheight:1.24;--app-header-typography-5-lineheight:1.24;--app-header-typography-6-lineheight:1.25;--app-header-typography-7-lineheight:1.2;--app-header-typography-8-lineheight:1.26;--app-header-typography-9-lineheight:1.24;--app-header-typography-10-lineheight:1.26;--app-header-typography-11-lineheight:1.2;--app-header-typography-12-lineheight:1.2;--app-header-typography-1-tracking:calc(-0.2 / 1em);--app-header-typography-2-tracking:calc(-0.4 / 1em);--app-header-typography-3-tracking:calc(-0.6 / 1em);--app-header-typography-4-tracking:calc(-0.8 / 1em);--app-header-typography-5-tracking:calc(-1 / 1em);--app-header-typography-6-tracking:calc(-1.2 / 1em);--app-header-typography-7-tracking:calc(-1.4 / 1em);--app-header-typography-8-tracking:calc(-1.6 / 1em);--app-header-typography-9-tracking:calc(-1.8 / 1em);--app-header-typography-10-tracking:calc(-2 / 1em);--app-header-typography-11-tracking:calc(-2.2 / 1em);--app-header-typography-12-tracking:calc(-2.4 / 1em);--app-header-content-max-width:100%;--app-header-height:auto;--app-header-top-offset:48px;--app-header-drawer-trigger-size:calc(var(--space-unit) * 4);--app-header-bg:var(--color-surface01);--app-header-stucked-bg:var(--color-surface01);--app-header-text-color:var(--color-default-text);--app-header-title-font-size:var(--app-header-typography-3-size);--app-header-title-lineheight:var(--app-header-typography-3-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-3-tracking);--app-header-stucked-text-color:var(--color-default-text);position:relative;display:block;height:var(--app-header-height);color:var(--app-header-text-color)}:host,*{box-sizing:border-box}.heading-panel{position:relative;display:flex;width:100%;max-width:var(--app-header-content-max-width);flex-direction:column;flex-grow:0;flex-shrink:0;align-items:baseline;padding:var(--grid-margin);margin:0 auto;background:var(--app-header-bg);gap:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5)}.hero-container+.heading-panel{background:transparent}:host(:empty) .heading-panel{padding:0}.heading-container{position:relative;z-index:1;display:flex;width:100%;max-width:100%;flex:1 auto;flex-direction:column;justify-content:flex-start}.heading-title{display:flex;max-width:100%;flex-direction:row;align-items:flex-start;column-gap:calc(var(--space-unit) * 2)}::slotted([slot="title"]),.heading-stuck .heading-title>*,::slotted([slot="stucked-title"]){margin:0;font-family:"IBM Plex Serif", serif;font-weight:var(--font-bd)}::slotted([slot="title"]){font-size:var(--app-header-title-font-size);letter-spacing:var(--app-header-title-letter-spacing);line-height:var(--app-header-title-lineheight)}.heading-stuck .heading-title>*,::slotted([slot="stucked-title"]){font-size:var(--app-header-typography-3-size);letter-spacing:var(--app-header-typography-3-tracking);line-height:var(--app-header-typography-3-lineheight)}:host(:not([menu-length="0"])) .heading-subtitle{padding-left:calc(var(--app-header-drawer-trigger-size) + (var(--space-unit) * 2))}::slotted([slot="top-subtitle"]),::slotted([slot="subtitle"]){margin:0;font-family:var(--font-family-sans);font-size:20px;font-style:italic;line-height:26px}::slotted([slot="subtitle"]){font-weight:500}::slotted([slot="top-subtitle"]){font-weight:400}.menu-container{display:flex;width:100%;flex:1 auto;flex-flow:row wrap}:host([menu-length="0"]:not([enable-search])) .menu-container,.menu-container:empty{display:none}.menu-container ::slotted([open]){position:relative;z-index:3}z-searchbar{z-index:0;display:flex;width:auto;min-width:calc(var(--space-unit) * 32);flex:1 auto;align-items:center;margin-left:auto}.heading-stuck{position:fixed;z-index:20;top:var(--app-header-top-offset);left:0;width:100%;max-width:100%;animation:slide-stuck-heading-in 250ms ease-out;background:var(--app-header-stucked-bg);box-shadow:var(--shadow-2);color:var(--app-header-stucked-text-color)}.heading-stuck-content{display:flex;max-width:var(--app-header-content-max-width);align-items:center;padding:var(--space-unit) var(--grid-margin);margin:0 auto;column-gap:calc(var(--space-unit) * 2)}.heading-stuck .heading-title{overflow:hidden}.heading-stuck .heading-title>*,.heading-stuck .heading-title ::slotted([slot="stucked-title"]){display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.heading-stuck-content z-button{margin-left:auto}.drawer-trigger{padding:0;border:0;margin:0;appearance:none;background:none;border-radius:0;color:inherit;cursor:pointer}.drawer-trigger z-icon{--z-icon-width:var(--app-header-drawer-trigger-size);--z-icon-height:var(--app-header-drawer-trigger-size);fill:currentcolor}.heading-container :is(.drawer-trigger,z-button.search-page-button){display:flex;height:calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight));align-items:center}.heading-container z-button.search-page-button{margin-left:auto}.drawer-content{display:none}z-offcanvas[open] .drawer-content{display:flex;width:100%;flex:1 auto;flex-direction:column;row-gap:calc(var(--space-unit) * 2.5)}z-offcanvas[open] .drawer-content ::slotted(z-menu){width:100%}.drawer-close{--z-icon-width:var(--app-header-drawer-trigger-size);--z-icon-height:var(--app-header-drawer-trigger-size);padding:0;border:0;margin:var(--space-unit) 0 calc(var(--space-unit) * 2.5);appearance:none;background:transparent;border-radius:0;color:inherit;cursor:pointer;fill:currentcolor;font-size:inherit;outline:none}.drawer-close:focus-visible{box-shadow:var(--shadow-focus-primary)}.hero-container{position:absolute;z-index:0;top:0;left:0;width:100%;height:100%}:host([overlay]) .heading-panel .drawer-trigger z-icon,:host([overlay]) .heading-panel .heading-container,:host([overlay]) .heading-panel .menu-container{color:var(--color-white);fill:var(--color-white)}:host([overlay]) .heading-panel .menu-container ::slotted(z-menu){--z-menu-label-color:var(--color-white)}:host([overlay]) .hero-container::after{position:absolute;z-index:0;top:0;left:0;width:100%;height:100%;background:var(--color-black);content:"";opacity:0.5}.hero-container img,.hero-container ::slotted(*){position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:top center;-webkit-user-drag:none}@media (min-width: 768px){:host{--app-header-title-font-size:var(--app-header-typography-6-size);--app-header-title-lineheight:var(--app-header-typography-6-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-6-tracking)}.heading-panel{flex-flow:row wrap;align-items:center;padding-bottom:calc(var(--space-unit) * 2)}.heading-container{margin-right:auto}:host(:is([flow="offcanvas"],[menu-length="0"])) :is(.heading-container,.menu-container){width:auto}:host(:not([flow="offcanvas"])) .heading-subtitle{padding-left:0}.menu-container{flex:initial;align-items:center}:host([menu-length="0"]) .menu-container:not(:empty){height:calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight))}:host(:not([flow="offcanvas"])) .menu-container{gap:var(--space-unit) calc(var(--space-unit) * 5)}:host(:not([flow="offcanvas"])) .heading-container .drawer-trigger{display:none}}@media (min-width: 1152px){:host{--app-header-title-font-size:var(--app-header-typography-7-size);--app-header-title-lineheight:var(--app-header-typography-7-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-7-tracking)}.heading-panel{justify-content:flex-start;padding-bottom:calc(var(--space-unit) * 3)}.heading-container,.menu-container{width:auto}:host([flow="stack"]) .heading-panel{flex-flow:column;align-items:flex-start}:host([flow="stack"]) .menu-container{width:100%}:host(:not([flow="offcanvas"],[menu-length="0"])) .heading-panel{row-gap:calc(var(--space-unit) * 3)}z-searchbar{min-width:calc(var(--space-unit) * 45);flex:initial}}@media (min-width: 1366px){:host{--app-header-title-font-size:var(--app-header-typography-9-size);--app-header-title-lineheight:var(--app-header-typography-9-lineheight);--app-header-title-letter-spacing:var(--app-header-typography-9-tracking)}}@keyframes slide-stuck-heading-in{0%{transform:translate3d(0, -100%, 0)}100%{transform:none}}`;const d=typeof IntersectionObserver!=="undefined";const c=class{constructor(t){e(this,t);this.sticking=a(this,"sticking",7);this.stuck=false;this.overlay=false;this.flow="auto";this.drawerOpen=false;this.enableSearch=false;this.searchPlaceholder="Cerca";this.searchString="";this._stuck=false;this.currentViewport="mobile";this.observer=d&&new IntersectionObserver((([e])=>{this._stuck=!e.isIntersecting}),{threshold:.5});this.openDrawer=this.openDrawer.bind(this);this.closeDrawer=this.closeDrawer.bind(this);this.collectMenuElements=this.collectMenuElements.bind(this)}evaluateViewport(){if(window.innerWidth<768){this.currentViewport="mobile"}else if(window.innerWidth>=768&&window.innerWidth<1152){this.currentViewport="tablet"}else{this.currentViewport="desktop"}}onStuck(){const e=this.scrollParent;if(!e){return}this.sticking.emit(this._stuck)}setMenuFloatingMode(){if(this.menuElements.length===0){return}const e=this.menuElements;e.forEach((e=>{e.open=false;e.floating=!this.drawerOpen;e.verticalContext=this.drawerOpen}))}get title(){const e=this.hostElement.querySelector('[slot="title"]');if(e===null){return""}return e.textContent.trim()}get scrollParent(){const e=this.hostElement.offsetParent;if(e===document.body||e===document.documentElement){return window}return e}get canShowMenu(){return this.flow!=="offcanvas"&&this.currentViewport!=="mobile"&&!this.drawerOpen}get canShowSearchbar(){if(!this.enableSearch){return false}if(this.searchPageUrl){return this.currentViewport==="desktop"}return true}get hasHero(){return!!this.hero||this.hostElement.querySelector("[slot=hero]")!==null}openDrawer(){this.drawerOpen=true}closeDrawer(){this.drawerOpen=false}collectMenuElements(){const e=this.menuElements=this.hostElement.querySelectorAll('[slot="menu"]');this.menuLength=e.length;this.setMenuFloatingMode()}enableStuckObserver(){if(this.observer){this.observer.observe(this.container)}}disableStuckMode(){this._stuck=false;if(this.observer){this.observer.unobserve(this.container)}}onStuckMode(){if(this.stuck){this.enableStuckObserver()}else{this.disableStuckMode()}}renderSearchLinkButton(){if(!this.enableSearch||!this.searchPageUrl||this.currentViewport==="desktop"){return null}return t("z-button",{class:"search-page-button",variant:h.SECONDARY,href:this.searchPageUrl,icon:"search",size:n.X_SMALL})}renderSeachbar(e){return t("z-searchbar",{value:this.searchString,placeholder:this.searchPlaceholder,showSearchButton:true,searchButtonIconOnly:e,size:n.X_SMALL,variant:h.SECONDARY,preventSubmit:this.searchString.length<3,onSearchTyping:e=>this.searchString=e.detail})}componentDidLoad(){this.collectMenuElements();this.onStuckMode();this.evaluateViewport()}render(){return t(i,{key:"aded309a3cb1033c51f95d94de1cd796f643fea0","menu-length":this.menuLength},this.hasHero&&t("div",{key:"78458badadf63a3366eaba9481ed709f7cb455c5",class:"hero-container"},t("slot",{key:"1296c2091f4dd8b2f5215f07ea096772fc700abb",name:"hero"},this.hero&&t("img",{key:"ed06c899fb3e2b7316161555b307033a6821f64a",alt:"",src:this.hero}))),t("div",{key:"d8e275bde97fe5d694a50c33b5b32db7aee7699e",class:"heading-panel",ref:e=>this.container=e},t("div",{key:"ce6fe29fd508558b3d75dba200006dfa31ba5ad9",class:"heading-container"},t("div",{key:"5464ae272a15fcd6a975b62f5d2d6206d6f3f060",class:"heading-subtitle"},t("slot",{key:"53c143c49c40cd3cef1475af920122ca5abd5329",name:"top-subtitle"})),t("div",{key:"0c4c147537d3ece12fd35e4a5ca553aeff2a8f1c",class:"heading-title"},this.menuLength>0&&t("button",{key:"68e24b4435b6ee099f288cb4cb28794834ab1f72",class:"drawer-trigger","aria-label":"Apri menu",onClick:this.openDrawer},t("z-icon",{key:"220a3096e3275ec8e6bee6b715926f891ed09045",name:"burger-menu"})),t("slot",{key:"52e89fe9902914e6daafe61f47de9ea4f02bf93e",name:"title"}),this.renderSearchLinkButton()),t("div",{key:"c1f90edc6ecb0063d53f3ed68ee718fc86397751",class:"heading-subtitle"},t("slot",{key:"84398e5cd8bf522e13b9f29118ba20d46510fbb1",name:"subtitle"}))),(this.canShowMenu||this.canShowSearchbar)&&t("div",{key:"e6d6d1fa5040a7c6d54869fac4c92a19407145fb",class:"menu-container"},this.canShowMenu&&t("slot",{key:"3c442f00807b6a4ff33349709a24b6096bce3b3c",name:"menu",onSlotchange:this.collectMenuElements}),this.canShowSearchbar&&this.renderSeachbar(this.currentViewport!=="desktop"))),t("z-offcanvas",{key:"268fa9a09f449e5e277ed56134cd1a5be9e9713e",variant:s.OVERLAY,transitiondirection:o.RIGHT,open:this.drawerOpen,onCanvasOpenStatusChanged:e=>this.drawerOpen=e.detail},t("button",{key:"be0350100f473da07ac89c22b950c0ff5f2dc14a",class:"drawer-close","aria-label":"Chiudi menu",onClick:this.closeDrawer,slot:"canvasContent","aria-hidden":`${!this.drawerOpen}`,disabled:!this.drawerOpen},t("z-icon",{key:"ebe1a2dd92cb3d010741e8745c5359a852e46253",name:"close"})),t("div",{key:"cb6b380cfddc334c84fae9a045d4b886ff8d3f26",class:"drawer-content",slot:"canvasContent","aria-hidden":`${!this.drawerOpen}`},t("slot",{key:"e120aa846065db5a7c0d9827e7b74a98f7b41f25",name:"menu",onSlotchange:this.collectMenuElements}))),this._stuck&&t("div",{key:"7d0460155469d822b7f608804dc1465f08e28b02",class:"heading-stuck"},t("div",{key:"b570cf1d407aad9a9c2a10af56835f3a3d5f1379",class:"heading-stuck-content"},this.menuLength>0&&t("button",{key:"06929d598cab5b080e0f3b23606ca6e4ee50a113",class:"drawer-trigger","aria-label":"Apri menu",onClick:this.openDrawer},t("z-icon",{key:"807ee08ed6a4db7ca124114007e1a2d52dca75e0",name:"burger-menu"})),t("div",{key:"dfbb47685f209528aa6a70f29b5cb5ca83a4a2e6",class:"heading-title"},t("slot",{key:"aff80bd515be456bc15b5fa91dbc85ce33fe6562",name:"stucked-title"},this.title)),this.renderSearchLinkButton(),this.canShowSearchbar&&this.currentViewport==="desktop"&&this.renderSeachbar(false))))}get hostElement(){return r(this)}static get watchers(){return{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckMode:0}]}}};c.style=p();export{c as z_app_header_deprecated};
-//# sourceMappingURL=p-873e12a2.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","SUPPORT_INTERSECTION_OBSERVER","IntersectionObserver","ZAppHeaderDeprecated","constructor","hostRef","this","stuck","overlay","flow","drawerOpen","enableSearch","searchPlaceholder","searchString","_stuck","currentViewport","observer","entry","isIntersecting","threshold","openDrawer","bind","closeDrawer","collectMenuElements","evaluateViewport","window","innerWidth","onStuck","scrollParent","sticking","emit","setMenuFloatingMode","menuElements","length","elements","forEach","element","open","floating","verticalContext","title","titleElement","hostElement","querySelector","textContent","trim","parent","offsetParent","document","body","documentElement","canShowMenu","canShowSearchbar","searchPageUrl","hasHero","hero","querySelectorAll","menuLength","enableStuckObserver","observe","container","disableStuckMode","unobserve","onStuckMode","renderSearchLinkButton","h","class","variant","ButtonVariant","SECONDARY","href","icon","size","ControlSize","X_SMALL","renderSeachbar","searchButtonIconOnly","value","placeholder","showSearchButton","preventSubmit","onSearchTyping","e","detail","componentDidLoad","render","Host","key","name","alt","src","ref","el","onClick","onSlotchange","OffCanvasVariant","OVERLAY","transitiondirection","TransitionDirection","RIGHT","onCanvasOpenStatusChanged","ev","slot","disabled"],"sources":["src/components/deprecated/z-app-header-deprecated/styles.css?tag=z-app-header-deprecated&encapsulation=shadow","src/components/deprecated/z-app-header-deprecated/index.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --app-header-typography-1-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `24px`.\n   * @prop --app-header-typography-2-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `28px`.\n   * @prop --app-header-typography-3-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `32px`.\n   * @prop --app-header-typography-4-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `36px`.\n   * @prop --app-header-typography-5-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `42px`.\n   * @prop --app-header-typography-6-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `48px`.\n   * @prop --app-header-typography-7-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `54px`.\n   * @prop --app-header-typography-8-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `60px`.\n   * @prop --app-header-typography-9-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `68px`.\n   * @prop --app-header-typography-10-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `76px`.\n   * @prop --app-header-typography-11-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `84px`.\n   * @prop --app-header-typography-12-size: Part of the heading typography's scale. Use it if you have to override the default value. Value: `92px`.\n   * @prop --app-header-typography-1-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.33`.\n   * @prop --app-header-typography-2-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.29`.\n   * @prop --app-header-typography-3-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.25`.\n   * @prop --app-header-typography-4-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.24`.\n   * @prop --app-header-typography-5-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.24`.\n   * @prop --app-header-typography-6-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.25`.\n   * @prop --app-header-typography-7-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.2`.\n   * @prop --app-header-typography-8-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.26`.\n   * @prop --app-header-typography-9-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.24`.\n   * @prop --app-header-typography-10-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.26`.\n   * @prop --app-header-typography-11-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.2`.\n   * @prop --app-header-typography-12-lineheight: Part of the heading typography's scale. Use it if you have to override the default value. Value: `1.2`.\n   * @prop --app-header-typography-1-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.2 / 1em)`.\n   * @prop --app-header-typography-2-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.4 / 1em)`.\n   * @prop --app-header-typography-3-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.6 / 1em)`.\n   * @prop --app-header-typography-4-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-0.8 / 1em)`.\n   * @prop --app-header-typography-5-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1 / 1em)`.\n   * @prop --app-header-typography-6-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.2 / 1em)`.\n   * @prop --app-header-typography-7-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.4 / 1em)`.\n   * @prop --app-header-typography-8-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.6 / 1em)`.\n   * @prop --app-header-typography-9-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-1.8 / 1em)`.\n   * @prop --app-header-typography-10-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-2 / 1em)`.\n   * @prop --app-header-typography-11-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-2.2 / 1em)`.\n   * @prop --app-header-typography-12-tracking: Part of the heading typography's scale. Use it if you have to override the default value. Value: `calc(-2.4 / 1em)`.\n   * @prop --app-header-content-max-width: Use it to set header's content max width. Useful when the project use a fixed width layout. Defaults to `100%`.\n   * @prop --app-header-height: Defaults to `auto`.\n   * @prop --app-header-top-offset: Top offset for the stuck header. Useful when there are other fixed elements above the header. Defaults to `48px` (the height of the main topbar).\n   * @prop --app-header-drawer-trigger-size: The size of the drawer icon. Defaults to `--space-unit * 4`.\n   * @prop --app-header-bg: Header background color. Defaults to `--color-surface01`.\n   * @prop --app-header-stucked-bg: Stuck header background color. Defaults to `--color-surface01`.\n   * @prop --app-header-text-color: Text color. Useful on `hero` variant to set text color based on the colors of the background image. Defaults to `--color-default-text`.\n   * @prop --app-header-title-font-size: Variable to customize the title's font size. NOTE: Only use one of the exported `--app-header-typography-*-size` as a value. Defaults to `--app-header-typography-3-size`.\n   * @prop --app-header-title-lineheight: Variable to customize the title's line-height. NOTE: Only use one of the exported `--app-header-typography-*-lineheight` as a value and use the same level as the one of the font size. Defaults to `--app-header-typography-3-lineheight`.\n   * @prop --app-header-title-letter-spacing: Variable to customize the title's letter-spacing. NOTE: Only use one of the exported `--app-header-typography-*-tracking` as a value and use the same level as the one of the font size. Defaults to `--app-header-typography-3-tracking`.\n   * @prop --app-header-stucked-text-color: Stuck header text color. Defaults to `--color-default-text`.\n   */\n  --app-header-typography-1-size: 24px;\n  --app-header-typography-2-size: 28px;\n  --app-header-typography-3-size: 32px;\n  --app-header-typography-4-size: 36px;\n  --app-header-typography-5-size: 42px;\n  --app-header-typography-6-size: 48px;\n  --app-header-typography-7-size: 54px;\n  --app-header-typography-8-size: 60px;\n  --app-header-typography-9-size: 68px;\n  --app-header-typography-10-size: 76px;\n  --app-header-typography-11-size: 84px;\n  --app-header-typography-12-size: 92px;\n  --app-header-typography-1-lineheight: 1.33;\n  --app-header-typography-2-lineheight: 1.29;\n  --app-header-typography-3-lineheight: 1.25;\n  --app-header-typography-4-lineheight: 1.24;\n  --app-header-typography-5-lineheight: 1.24;\n  --app-header-typography-6-lineheight: 1.25;\n  --app-header-typography-7-lineheight: 1.2;\n  --app-header-typography-8-lineheight: 1.26;\n  --app-header-typography-9-lineheight: 1.24;\n  --app-header-typography-10-lineheight: 1.26;\n  --app-header-typography-11-lineheight: 1.2;\n  --app-header-typography-12-lineheight: 1.2;\n  --app-header-typography-1-tracking: calc(-0.2 / 1em);\n  --app-header-typography-2-tracking: calc(-0.4 / 1em);\n  --app-header-typography-3-tracking: calc(-0.6 / 1em);\n  --app-header-typography-4-tracking: calc(-0.8 / 1em);\n  --app-header-typography-5-tracking: calc(-1 / 1em);\n  --app-header-typography-6-tracking: calc(-1.2 / 1em);\n  --app-header-typography-7-tracking: calc(-1.4 / 1em);\n  --app-header-typography-8-tracking: calc(-1.6 / 1em);\n  --app-header-typography-9-tracking: calc(-1.8 / 1em);\n  --app-header-typography-10-tracking: calc(-2 / 1em);\n  --app-header-typography-11-tracking: calc(-2.2 / 1em);\n  --app-header-typography-12-tracking: calc(-2.4 / 1em);\n  --app-header-content-max-width: 100%;\n  --app-header-height: auto;\n\n  /* Variable to set stuck header and drawer's top offset.\n  Useful when something is absolutely positioned above the header. */\n  --app-header-top-offset: 48px;\n  --app-header-drawer-trigger-size: calc(var(--space-unit) * 4);\n\n  /* Variable to customize header background color. */\n  --app-header-bg: var(--color-surface01);\n\n  /* Variable to customize stuck header background color. */\n  --app-header-stucked-bg: var(--color-surface01);\n\n  /* Variable to customize text and icon color. */\n  --app-header-text-color: var(--color-default-text);\n\n  /* Variable to customize the title's font size.\n  NOTE: Only use one of the exported `--app-header-typography-*-size` as a value. */\n  --app-header-title-font-size: var(--app-header-typography-3-size);\n\n  /* Variable to customize the title's line-height.\n  NOTE: Only use one of the exported `--app-header-typography-*-lineheight` as a value\n  and use the same level as the one of the font size. */\n  --app-header-title-lineheight: var(--app-header-typography-3-lineheight);\n\n  /* Variable to customize the title's letter-spacing.\n  NOTE: Only use one of the exported `--app-header-typography-*-tracking` as a value\n  and use the same level as the one of the font size. */\n  --app-header-title-letter-spacing: var(--app-header-typography-3-tracking);\n\n  /* Variable to customize stuck header's text and icon color. */\n  --app-header-stucked-text-color: var(--color-default-text);\n\n  position: relative;\n  display: block;\n  height: var(--app-header-height);\n  color: var(--app-header-text-color);\n}\n\n:host,\n* {\n  box-sizing: border-box;\n}\n\n.heading-panel {\n  position: relative;\n  display: flex;\n  width: 100%;\n  max-width: var(--app-header-content-max-width);\n  flex-direction: column;\n  flex-grow: 0;\n  flex-shrink: 0;\n  align-items: baseline;\n  padding: var(--grid-margin);\n  margin: 0 auto;\n  background: var(--app-header-bg);\n  gap: calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);\n}\n\n.hero-container + .heading-panel {\n  background: transparent;\n}\n\n:host(:empty) .heading-panel {\n  padding: 0;\n}\n\n.heading-container {\n  position: relative;\n  z-index: 1;\n  display: flex;\n  width: 100%;\n  max-width: 100%;\n  flex: 1 auto;\n  flex-direction: column;\n  justify-content: flex-start;\n}\n\n.heading-title {\n  display: flex;\n  max-width: 100%;\n  flex-direction: row;\n  align-items: flex-start;\n  column-gap: calc(var(--space-unit) * 2);\n}\n\n::slotted([slot=\"title\"]),\n.heading-stuck .heading-title > *,\n::slotted([slot=\"stucked-title\"]) {\n  margin: 0;\n  font-family: \"IBM Plex Serif\", serif;\n  font-weight: var(--font-bd);\n}\n\n::slotted([slot=\"title\"]) {\n  font-size: var(--app-header-title-font-size);\n  letter-spacing: var(--app-header-title-letter-spacing);\n  line-height: var(--app-header-title-lineheight);\n}\n\n.heading-stuck .heading-title > *,\n::slotted([slot=\"stucked-title\"]) {\n  font-size: var(--app-header-typography-3-size);\n  letter-spacing: var(--app-header-typography-3-tracking);\n  line-height: var(--app-header-typography-3-lineheight);\n}\n\n:host(:not([menu-length=\"0\"])) .heading-subtitle {\n  padding-left: calc(var(--app-header-drawer-trigger-size) + (var(--space-unit) * 2));\n}\n\n::slotted([slot=\"top-subtitle\"]),\n::slotted([slot=\"subtitle\"]) {\n  margin: 0;\n  font-family: var(--font-family-sans);\n  font-size: 20px;\n  font-style: italic;\n  line-height: 26px;\n}\n\n::slotted([slot=\"subtitle\"]) {\n  font-weight: 500;\n}\n\n::slotted([slot=\"top-subtitle\"]) {\n  font-weight: 400;\n}\n\n.menu-container {\n  display: flex;\n  width: 100%;\n  flex: 1 auto;\n  flex-flow: row wrap;\n}\n\n:host([menu-length=\"0\"]:not([enable-search])) .menu-container,\n.menu-container:empty {\n  display: none;\n}\n\n.menu-container ::slotted([open]) {\n  position: relative;\n  z-index: 3;\n}\n\nz-searchbar {\n  z-index: 0;\n  display: flex;\n  width: auto;\n  min-width: calc(var(--space-unit) * 32);\n  flex: 1 auto;\n  align-items: center;\n  margin-left: auto;\n}\n\n.heading-stuck {\n  position: fixed;\n  z-index: 20;\n  top: var(--app-header-top-offset);\n  left: 0;\n  width: 100%;\n  max-width: 100%;\n  animation: slide-stuck-heading-in 250ms ease-out;\n  background: var(--app-header-stucked-bg);\n  box-shadow: var(--shadow-2);\n  color: var(--app-header-stucked-text-color);\n}\n\n.heading-stuck-content {\n  display: flex;\n  max-width: var(--app-header-content-max-width);\n  align-items: center;\n  padding: var(--space-unit) var(--grid-margin);\n  margin: 0 auto;\n  column-gap: calc(var(--space-unit) * 2);\n}\n\n.heading-stuck .heading-title {\n  overflow: hidden;\n}\n\n.heading-stuck .heading-title > *,\n.heading-stuck .heading-title ::slotted([slot=\"stucked-title\"]) {\n  display: block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.heading-stuck-content z-button {\n  margin-left: auto;\n}\n\n.drawer-trigger {\n  padding: 0;\n  border: 0;\n  margin: 0;\n  appearance: none;\n  background: none;\n  border-radius: 0;\n  color: inherit;\n  cursor: pointer;\n}\n\n.drawer-trigger z-icon {\n  --z-icon-width: var(--app-header-drawer-trigger-size);\n  --z-icon-height: var(--app-header-drawer-trigger-size);\n\n  fill: currentcolor;\n}\n\n/* Simulate the height of the first line of text,\nto correctly align drawer icon and search page button with the title */\n.heading-container :is(.drawer-trigger, z-button.search-page-button) {\n  display: flex;\n  height: calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight));\n  align-items: center;\n}\n\n.heading-container z-button.search-page-button {\n  margin-left: auto;\n}\n\n.drawer-content {\n  display: none;\n}\n\nz-offcanvas[open] .drawer-content {\n  display: flex;\n  width: 100%;\n  flex: 1 auto;\n  flex-direction: column;\n  row-gap: calc(var(--space-unit) * 2.5);\n}\n\nz-offcanvas[open] .drawer-content ::slotted(z-menu) {\n  width: 100%;\n}\n\n.drawer-close {\n  --z-icon-width: var(--app-header-drawer-trigger-size);\n  --z-icon-height: var(--app-header-drawer-trigger-size);\n\n  padding: 0;\n  border: 0;\n  margin: var(--space-unit) 0 calc(var(--space-unit) * 2.5);\n  appearance: none;\n  background: transparent;\n  border-radius: 0;\n  color: inherit;\n  cursor: pointer;\n  fill: currentcolor;\n  font-size: inherit;\n  outline: none;\n}\n\n.drawer-close:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n.hero-container {\n  position: absolute;\n  z-index: 0;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n}\n\n:host([overlay]) .heading-panel .drawer-trigger z-icon,\n:host([overlay]) .heading-panel .heading-container,\n:host([overlay]) .heading-panel .menu-container {\n  color: var(--color-white);\n  fill: var(--color-white);\n}\n\n:host([overlay]) .heading-panel .menu-container ::slotted(z-menu) {\n  --z-menu-label-color: var(--color-white);\n}\n\n:host([overlay]) .hero-container::after {\n  position: absolute;\n  z-index: 0;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: var(--color-black);\n  content: \"\";\n  opacity: 0.5;\n}\n\n.hero-container img,\n.hero-container ::slotted(*) {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: top center;\n  -webkit-user-drag: none;\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n  :host {\n    --app-header-title-font-size: var(--app-header-typography-6-size);\n    --app-header-title-lineheight: var(--app-header-typography-6-lineheight);\n    --app-header-title-letter-spacing: var(--app-header-typography-6-tracking);\n  }\n\n  .heading-panel {\n    flex-flow: row wrap;\n    align-items: center;\n    padding-bottom: calc(var(--space-unit) * 2);\n  }\n\n  .heading-container {\n    margin-right: auto;\n  }\n\n  :host(:is([flow=\"offcanvas\"], [menu-length=\"0\"])) :is(.heading-container, .menu-container) {\n    width: auto;\n  }\n\n  :host(:not([flow=\"offcanvas\"])) .heading-subtitle {\n    padding-left: 0;\n  }\n\n  .menu-container {\n    flex: initial;\n    align-items: center;\n  }\n\n  :host([menu-length=\"0\"]) .menu-container:not(:empty) {\n    height: calc(var(--app-header-title-font-size) * var(--app-header-title-lineheight));\n  }\n\n  :host(:not([flow=\"offcanvas\"])) .menu-container {\n    gap: var(--space-unit) calc(var(--space-unit) * 5);\n  }\n\n  :host(:not([flow=\"offcanvas\"])) .heading-container .drawer-trigger {\n    display: none;\n  }\n}\n\n/* Desktop breakpoint */\n@media (min-width: 1152px) {\n  :host {\n    --app-header-title-font-size: var(--app-header-typography-7-size);\n    --app-header-title-lineheight: var(--app-header-typography-7-lineheight);\n    --app-header-title-letter-spacing: var(--app-header-typography-7-tracking);\n  }\n\n  .heading-panel {\n    justify-content: flex-start;\n    padding-bottom: calc(var(--space-unit) * 3);\n  }\n\n  .heading-container,\n  .menu-container {\n    width: auto;\n  }\n\n  :host([flow=\"stack\"]) .heading-panel {\n    flex-flow: column;\n    align-items: flex-start;\n  }\n\n  :host([flow=\"stack\"]) .menu-container {\n    width: 100%;\n  }\n\n  :host(:not([flow=\"offcanvas\"], [menu-length=\"0\"])) .heading-panel {\n    row-gap: calc(var(--space-unit) * 3);\n  }\n\n  z-searchbar {\n    min-width: calc(var(--space-unit) * 45);\n    flex: initial;\n  }\n}\n\n/* Wide breakpoint */\n@media (min-width: 1366px) {\n  :host {\n    --app-header-title-font-size: var(--app-header-typography-9-size);\n    --app-header-title-lineheight: var(--app-header-typography-9-lineheight);\n    --app-header-title-letter-spacing: var(--app-header-typography-9-tracking);\n  }\n}\n\n@keyframes slide-stuck-heading-in {\n  0% {\n    transform: translate3d(0, -100%, 0);\n  }\n\n  100% {\n    transform: none;\n  }\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  h,\n} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, OffCanvasVariant, TransitionDirection} from \"../../../beans\";\n\nconst SUPPORT_INTERSECTION_OBSERVER = typeof IntersectionObserver !== \"undefined\";\n\n/**\n * @slot title - Slot for the main title\n * @slot subtitle - Slot for the bottom subtitle. It will not appear in stuck header.\n * @slot top-subtitle - Slot for the top subtitle. It will not appear in stuck header.\n * @slot stucked-title - Title for the stuck header. By default it uses the text from the `title` slot.\n */\n@Component({\n  tag: \"z-app-header-deprecated\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZAppHeaderDeprecated implements ComponentInterface {\n  @Element() hostElement: HTMLZAppHeaderDeprecatedElement;\n\n  /**\n   * Stuck mode for the header.\n   * You can programmatically set it using an IntersectionObserver.\n   */\n  @Prop({reflect: true})\n  stuck = false;\n\n  /**\n   * Set the hero image source for the header.\n   * You can also use a [slot=\"hero\"] node for advanced customization.\n   */\n  @Prop()\n  hero: string;\n\n  /**\n   * Should place an overlay over the hero image.\n   * Useful for legibility purpose.\n   */\n  @Prop({reflect: true})\n  overlay = false;\n\n  /**\n   * Control menu bar position in the header.\n   * - auto: the menu bar is positioned near the title\n   * - stack: the menu bar is positioned below the title\n   * - offcanvas: the menu bar is not displayed and a burger icon appears to open the offcanvas menu\n   */\n  @Prop({reflect: true})\n  flow: \"auto\" | \"stack\" | \"offcanvas\" = \"auto\";\n\n  /**\n   * The opening state of the drawer.\n   */\n  @Prop({reflect: true})\n  drawerOpen = false;\n\n  /**\n   * Enable the search bar.\n   */\n  @Prop({reflect: true})\n  enableSearch = false;\n\n  /**\n   * Placeholder text for the search bar.\n   */\n  @Prop()\n  searchPlaceholder = \"Cerca\";\n\n  /**\n   * Search string for the search bar.\n   */\n  @Prop({mutable: true})\n  searchString = \"\";\n\n  /**\n   * Url to the search page.\n   * Set this prop and `enableSearch` to show a link-button on mobile and tablet viewports, instead of the normal searchbar.\n   * The link will also appear on the sticky header.\n   */\n  @Prop()\n  searchPageUrl: string;\n\n  /**\n   * The stuck state of the bar.\n   */\n  @State()\n  private _stuck = false;\n\n  /**\n   * Current viewport.\n   * Used to change the aspect of the search button (icon only) on mobile and tablet.\n   */\n  @State()\n  private currentViewport: \"mobile\" | \"tablet\" | \"desktop\" = \"mobile\";\n\n  /**\n   * Current count of menu items.\n   */\n  @State()\n  menuLength: number;\n\n  /**\n   * Emitted when the `stuck` state of the header changes\n   */\n  @Event()\n  sticking: EventEmitter;\n\n  private container?: HTMLDivElement;\n\n  private menuElements?: NodeListOf<HTMLElement>;\n\n  private observer?: IntersectionObserver =\n    SUPPORT_INTERSECTION_OBSERVER &&\n    new IntersectionObserver(\n      ([entry]) => {\n        this._stuck = !entry.isIntersecting;\n      },\n      {\n        threshold: 0.5,\n      }\n    );\n\n  constructor() {\n    this.openDrawer = this.openDrawer.bind(this);\n    this.closeDrawer = this.closeDrawer.bind(this);\n    this.collectMenuElements = this.collectMenuElements.bind(this);\n  }\n\n  @Listen(\"resize\", {target: \"window\", passive: true})\n  evaluateViewport(): void {\n    if (window.innerWidth < 768) {\n      this.currentViewport = \"mobile\";\n    } else if (window.innerWidth >= 768 && window.innerWidth < 1152) {\n      this.currentViewport = \"tablet\";\n    } else {\n      this.currentViewport = \"desktop\";\n    }\n  }\n\n  @Watch(\"_stuck\")\n  onStuck(): void {\n    const scrollParent = this.scrollParent;\n    if (!scrollParent) {\n      return;\n    }\n\n    this.sticking.emit(this._stuck);\n  }\n\n  @Watch(\"drawerOpen\")\n  setMenuFloatingMode(): void {\n    if (this.menuElements.length === 0) {\n      return;\n    }\n\n    const elements = this.menuElements;\n    elements.forEach((element) => {\n      (element as HTMLZMenuDeprecatedElement).open = false;\n      (element as HTMLZMenuDeprecatedElement).floating = !this.drawerOpen;\n      (element as HTMLZMenuDeprecatedElement).verticalContext = this.drawerOpen;\n    });\n  }\n\n  private get title(): string {\n    const titleElement = this.hostElement.querySelector('[slot=\"title\"]');\n    if (titleElement === null) {\n      return \"\";\n    }\n\n    return titleElement.textContent.trim();\n  }\n\n  private get scrollParent(): Window | Element {\n    const parent = this.hostElement.offsetParent;\n    if (parent === document.body || parent === document.documentElement) {\n      return window;\n    }\n\n    return parent;\n  }\n\n  private get canShowMenu(): boolean {\n    return this.flow !== \"offcanvas\" && this.currentViewport !== \"mobile\" && !this.drawerOpen;\n  }\n\n  private get canShowSearchbar(): boolean {\n    if (!this.enableSearch) {\n      return false;\n    }\n\n    // Always show the searchbar on desktop, even if a searchPageUrl is set\n    if (this.searchPageUrl) {\n      return this.currentViewport === \"desktop\";\n    }\n\n    return true;\n  }\n\n  /**\n   * Whether the header has a hero image, either as a prop or as a slot.\n   */\n  private get hasHero(): boolean {\n    return !!this.hero || this.hostElement.querySelector(\"[slot=hero]\") !== null;\n  }\n\n  private openDrawer(): void {\n    this.drawerOpen = true;\n  }\n\n  private closeDrawer(): void {\n    this.drawerOpen = false;\n  }\n\n  private collectMenuElements(): void {\n    const menuElements = (this.menuElements = this.hostElement.querySelectorAll('[slot=\"menu\"]'));\n    this.menuLength = menuElements.length;\n    this.setMenuFloatingMode();\n  }\n\n  private enableStuckObserver(): void {\n    if (this.observer) {\n      this.observer.observe(this.container);\n    }\n  }\n\n  private disableStuckMode(): void {\n    this._stuck = false;\n    if (this.observer) {\n      this.observer.unobserve(this.container);\n    }\n  }\n\n  @Watch(\"stuck\")\n  onStuckMode(): void {\n    if (this.stuck) {\n      this.enableStuckObserver();\n    } else {\n      this.disableStuckMode();\n    }\n  }\n\n  private renderSearchLinkButton(): HTMLZButtonElement | null {\n    if (!this.enableSearch || !this.searchPageUrl || this.currentViewport === \"desktop\") {\n      return null;\n    }\n\n    return (\n      <z-button\n        class=\"search-page-button\"\n        variant={ButtonVariant.SECONDARY}\n        href={this.searchPageUrl}\n        icon=\"search\"\n        size={ControlSize.X_SMALL}\n      ></z-button>\n    );\n  }\n\n  private renderSeachbar(searchButtonIconOnly: boolean): HTMLZSearchbarElement {\n    return (\n      <z-searchbar\n        value={this.searchString}\n        placeholder={this.searchPlaceholder}\n        showSearchButton={true}\n        searchButtonIconOnly={searchButtonIconOnly}\n        size={ControlSize.X_SMALL}\n        variant={ButtonVariant.SECONDARY}\n        preventSubmit={this.searchString.length < 3}\n        onSearchTyping={(e) => (this.searchString = e.detail)}\n      />\n    );\n  }\n\n  componentDidLoad(): void {\n    this.collectMenuElements();\n    this.onStuckMode();\n    this.evaluateViewport();\n  }\n\n  render(): HTMLZAppHeaderElement {\n    return (\n      <Host menu-length={this.menuLength}>\n        {this.hasHero && (\n          <div class=\"hero-container\">\n            <slot name=\"hero\">\n              {this.hero && (\n                <img\n                  alt=\"\"\n                  src={this.hero}\n                />\n              )}\n            </slot>\n          </div>\n        )}\n\n        <div\n          class=\"heading-panel\"\n          ref={(el) => (this.container = el)}\n        >\n          <div class=\"heading-container\">\n            <div class=\"heading-subtitle\">\n              <slot name=\"top-subtitle\"></slot>\n            </div>\n            <div class=\"heading-title\">\n              {this.menuLength > 0 && (\n                <button\n                  class=\"drawer-trigger\"\n                  aria-label=\"Apri menu\"\n                  onClick={this.openDrawer}\n                >\n                  <z-icon name=\"burger-menu\"></z-icon>\n                </button>\n              )}\n\n              <slot name=\"title\"></slot>\n\n              {this.renderSearchLinkButton()}\n            </div>\n\n            <div class=\"heading-subtitle\">\n              <slot name=\"subtitle\"></slot>\n            </div>\n          </div>\n\n          {(this.canShowMenu || this.canShowSearchbar) && (\n            <div class=\"menu-container\">\n              {this.canShowMenu && (\n                <slot\n                  name=\"menu\"\n                  onSlotchange={this.collectMenuElements}\n                ></slot>\n              )}\n\n              {this.canShowSearchbar && this.renderSeachbar(this.currentViewport !== \"desktop\")}\n            </div>\n          )}\n        </div>\n\n        <z-offcanvas\n          variant={OffCanvasVariant.OVERLAY}\n          transitiondirection={TransitionDirection.RIGHT}\n          open={this.drawerOpen}\n          onCanvasOpenStatusChanged={(ev) => (this.drawerOpen = ev.detail)}\n        >\n          <button\n            class=\"drawer-close\"\n            aria-label=\"Chiudi menu\"\n            onClick={this.closeDrawer}\n            slot=\"canvasContent\"\n            aria-hidden={`${!this.drawerOpen}`}\n            disabled={!this.drawerOpen}\n          >\n            <z-icon name=\"close\"></z-icon>\n          </button>\n\n          <div\n            class=\"drawer-content\"\n            slot=\"canvasContent\"\n            aria-hidden={`${!this.drawerOpen}`}\n          >\n            <slot\n              name=\"menu\"\n              onSlotchange={this.collectMenuElements}\n            ></slot>\n          </div>\n        </z-offcanvas>\n\n        {this._stuck && (\n          <div class=\"heading-stuck\">\n            <div class=\"heading-stuck-content\">\n              {this.menuLength > 0 && (\n                <button\n                  class=\"drawer-trigger\"\n                  aria-label=\"Apri menu\"\n                  onClick={this.openDrawer}\n                >\n                  <z-icon name=\"burger-menu\"></z-icon>\n                </button>\n              )}\n\n              <div class=\"heading-title\">\n                <slot name=\"stucked-title\">{this.title}</slot>\n              </div>\n\n              {this.renderSearchLinkButton()}\n              {this.canShowSearchbar && this.currentViewport === \"desktop\" && this.renderSeachbar(false)}\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"yHAAA,MAAMA,EAAY,IAAM,4gRCexB,MAAMC,SAAuCC,uBAAyB,Y,MAazDC,EAAoB,MAyG/B,WAAAC,CAAAC,G,6CAjGAC,KAAAC,MAAQ,MAcRD,KAAAE,QAAU,MASVF,KAAAG,KAAuC,OAMvCH,KAAAI,WAAa,MAMbJ,KAAAK,aAAe,MAMfL,KAAAM,kBAAoB,QAMpBN,KAAAO,aAAe,GAcPP,KAAAQ,OAAS,MAOTR,KAAAS,gBAAmD,SAkBnDT,KAAAU,SACNf,GACA,IAAIC,sBACF,EAAEe,MACAX,KAAKQ,QAAUG,EAAMC,cAAc,GAErC,CACEC,UAAW,KAKfb,KAAKc,WAAad,KAAKc,WAAWC,KAAKf,MACvCA,KAAKgB,YAAchB,KAAKgB,YAAYD,KAAKf,MACzCA,KAAKiB,oBAAsBjB,KAAKiB,oBAAoBF,KAAKf,KAC1D,CAGD,gBAAAkB,GACE,GAAIC,OAAOC,WAAa,IAAK,CAC3BpB,KAAKS,gBAAkB,Q,MAClB,GAAIU,OAAOC,YAAc,KAAOD,OAAOC,WAAa,KAAM,CAC/DpB,KAAKS,gBAAkB,Q,KAClB,CACLT,KAAKS,gBAAkB,S,EAK3B,OAAAY,GACE,MAAMC,EAAetB,KAAKsB,aAC1B,IAAKA,EAAc,CACjB,M,CAGFtB,KAAKuB,SAASC,KAAKxB,KAAKQ,O,CAI1B,mBAAAiB,GACE,GAAIzB,KAAK0B,aAAaC,SAAW,EAAG,CAClC,M,CAGF,MAAMC,EAAW5B,KAAK0B,aACtBE,EAASC,SAASC,IACfA,EAAuCC,KAAO,MAC9CD,EAAuCE,UAAYhC,KAAKI,WACxD0B,EAAuCG,gBAAkBjC,KAAKI,UAAU,G,CAI7E,SAAY8B,GACV,MAAMC,EAAenC,KAAKoC,YAAYC,cAAc,kBACpD,GAAIF,IAAiB,KAAM,CACzB,MAAO,E,CAGT,OAAOA,EAAaG,YAAYC,M,CAGlC,gBAAYjB,GACV,MAAMkB,EAASxC,KAAKoC,YAAYK,aAChC,GAAID,IAAWE,SAASC,MAAQH,IAAWE,SAASE,gBAAiB,CACnE,OAAOzB,M,CAGT,OAAOqB,C,CAGT,eAAYK,GACV,OAAO7C,KAAKG,OAAS,aAAeH,KAAKS,kBAAoB,WAAaT,KAAKI,U,CAGjF,oBAAY0C,GACV,IAAK9C,KAAKK,aAAc,CACtB,OAAO,K,CAIT,GAAIL,KAAK+C,cAAe,CACtB,OAAO/C,KAAKS,kBAAoB,S,CAGlC,OAAO,I,CAMT,WAAYuC,GACV,QAAShD,KAAKiD,MAAQjD,KAAKoC,YAAYC,cAAc,iBAAmB,I,CAGlE,UAAAvB,GACNd,KAAKI,WAAa,I,CAGZ,WAAAY,GACNhB,KAAKI,WAAa,K,CAGZ,mBAAAa,GACN,MAAMS,EAAgB1B,KAAK0B,aAAe1B,KAAKoC,YAAYc,iBAAiB,iBAC5ElD,KAAKmD,WAAazB,EAAaC,OAC/B3B,KAAKyB,qB,CAGC,mBAAA2B,GACN,GAAIpD,KAAKU,SAAU,CACjBV,KAAKU,SAAS2C,QAAQrD,KAAKsD,U,EAIvB,gBAAAC,GACNvD,KAAKQ,OAAS,MACd,GAAIR,KAAKU,SAAU,CACjBV,KAAKU,SAAS8C,UAAUxD,KAAKsD,U,EAKjC,WAAAG,GACE,GAAIzD,KAAKC,MAAO,CACdD,KAAKoD,qB,KACA,CACLpD,KAAKuD,kB,EAID,sBAAAG,GACN,IAAK1D,KAAKK,eAAiBL,KAAK+C,eAAiB/C,KAAKS,kBAAoB,UAAW,CACnF,OAAO,I,CAGT,OACEkD,EAAA,YACEC,MAAM,qBACNC,QAASC,EAAcC,UACvBC,KAAMhE,KAAK+C,cACXkB,KAAK,SACLC,KAAMC,EAAYC,S,CAKhB,cAAAC,CAAeC,GACrB,OACEX,EAAA,eACEY,MAAOvE,KAAKO,aACZiE,YAAaxE,KAAKM,kBAClBmE,iBAAkB,KAClBH,qBAAsBA,EACtBJ,KAAMC,EAAYC,QAClBP,QAASC,EAAcC,UACvBW,cAAe1E,KAAKO,aAAaoB,OAAS,EAC1CgD,eAAiBC,GAAO5E,KAAKO,aAAeqE,EAAEC,Q,CAKpD,gBAAAC,GACE9E,KAAKiB,sBACLjB,KAAKyD,cACLzD,KAAKkB,kB,CAGP,MAAA6D,GACE,OACEpB,EAACqB,EAAI,CAAAC,IAAA,yDAAcjF,KAAKmD,YACrBnD,KAAKgD,SACJW,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,kBACTD,EAAA,QAAAsB,IAAA,2CAAMC,KAAK,QACRlF,KAAKiD,MACJU,EAAA,OAAAsB,IAAA,2CACEE,IAAI,GACJC,IAAKpF,KAAKiD,SAOpBU,EAAA,OAAAsB,IAAA,2CACErB,MAAM,gBACNyB,IAAMC,GAAQtF,KAAKsD,UAAYgC,GAE/B3B,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,qBACTD,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,oBACTD,EAAA,QAAAsB,IAAA,2CAAMC,KAAK,kBAEbvB,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,iBACR5D,KAAKmD,WAAa,GACjBQ,EAAA,UAAAsB,IAAA,2CACErB,MAAM,iBAAgB,aACX,YACX2B,QAASvF,KAAKc,YAEd6C,EAAA,UAAAsB,IAAA,2CAAQC,KAAK,iBAIjBvB,EAAA,QAAAsB,IAAA,2CAAMC,KAAK,UAEVlF,KAAK0D,0BAGRC,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,oBACTD,EAAA,QAAAsB,IAAA,2CAAMC,KAAK,gBAIblF,KAAK6C,aAAe7C,KAAK8C,mBACzBa,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,kBACR5D,KAAK6C,aACJc,EAAA,QAAAsB,IAAA,2CACEC,KAAK,OACLM,aAAcxF,KAAKiB,sBAItBjB,KAAK8C,kBAAoB9C,KAAKqE,eAAerE,KAAKS,kBAAoB,aAK7EkD,EAAA,eAAAsB,IAAA,2CACEpB,QAAS4B,EAAiBC,QAC1BC,oBAAqBC,EAAoBC,MACzC9D,KAAM/B,KAAKI,WACX0F,0BAA4BC,GAAQ/F,KAAKI,WAAa2F,EAAGlB,QAEzDlB,EAAA,UAAAsB,IAAA,2CACErB,MAAM,eAAc,aACT,cACX2B,QAASvF,KAAKgB,YACdgF,KAAK,gBAAe,cACP,IAAIhG,KAAKI,aACtB6F,UAAWjG,KAAKI,YAEhBuD,EAAA,UAAAsB,IAAA,2CAAQC,KAAK,WAGfvB,EAAA,OAAAsB,IAAA,2CACErB,MAAM,iBACNoC,KAAK,gBAAe,cACP,IAAIhG,KAAKI,cAEtBuD,EAAA,QAAAsB,IAAA,2CACEC,KAAK,OACLM,aAAcxF,KAAKiB,wBAKxBjB,KAAKQ,QACJmD,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,iBACTD,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,yBACR5D,KAAKmD,WAAa,GACjBQ,EAAA,UAAAsB,IAAA,2CACErB,MAAM,iBAAgB,aACX,YACX2B,QAASvF,KAAKc,YAEd6C,EAAA,UAAAsB,IAAA,2CAAQC,KAAK,iBAIjBvB,EAAA,OAAAsB,IAAA,2CAAKrB,MAAM,iBACTD,EAAA,QAAAsB,IAAA,2CAAMC,KAAK,iBAAiBlF,KAAKkC,QAGlClC,KAAK0D,yBACL1D,KAAK8C,kBAAoB9C,KAAKS,kBAAoB,WAAaT,KAAKqE,eAAe,S","ignoreList":[]}

package/dist/web-components-library/p-908b8d73.entry.js

@@ -1,2 +0,0 @@
-import{r as e,h as t,d as o}from"./p-BcDWN4F1.js";import{L as i}from"./p-DdetsoIY.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=class{constructor(t){e(this,t);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:"17bf2d03f2a895a184818a3d0ecc8b4b0ff45ad6",class:Object.assign(Object.assign({},this.retrieveClass()),{wrapper:true})},t("footer",{key:"18ba7b3cf576b52ff8cf457d878c2a98b48c8954",class:this.retrieveClass(),onTransitionEnd:e=>this.footerTransitionHandler(e)},t("span",{key:"87a14b83735cad610accac1b5fad637d58418941",class:"toggle"},t("slot",{key:"07df34b036660a3d17071f931fd8fd1a66d274bd",name:"toggle"})),this.titolo&&t("p",{key:"56fd76cc8f3048d6224466ce4737a73553a88d5b",class:{"custom-content":this.customContent}},this.titolo),t("div",{key:"90c5dee7244ebc98141a16756820f7e0452c50d4",class:{content:true,"custom-content":this.customContent}},t("div",{key:"6ea62882251ba40b585b654649339dd2453fae35"},t("p",{key:"063b4b395ef2a1050381d5b12dd06cba3885d0aa",class:"authors",ref:e=>this.ellipsisAuthors=e},t("span",{key:"8b8f219162a186142909eba931870ee9fa00f6bd",title:this.getTitleAuthors()},t("span",{key:"088707aba02823b9c2d241151854f619a9fbc495","aria-description":"Autori",class:"bold"},this.autori))),t("p",{key:"95c331bf4b5e45d26fad783252b718393ac44e4c",class:"year-isbn"},t("span",{key:"7aa80242fc621eeb2ed4f1737ef0f9b444f1a841",class:"isbn"},t("span",{key:"0f300748a0b1e5daf25c03b4bf11e8bb87e83428"},t("span",{key:"ac25fb014db97edc0bd4dc1ebfe76d04672104a0","aria-description":"ISBN edizione cartacea",class:"bold"},this.isbn)," ","(ed. cartacea)")))),t("div",{key:"b0875abb1a63f1cc69d15dae73e1f4b320536e25",class:`slot-handler ${this.isOpen?"visible":"hidden"}`},t("slot",{key:"f090c851076f8bb8fdeec5adf8792c78b22cd199",name:"list"})))),this.customContent&&t("slot",{key:"eb1b50ef5229ff3f51596c58b7a037a39a3ae5ec",name:"content"}))}get host(){return o(this)}};s.style=a();export{s as z_myz_card_footer};
-//# sourceMappingURL=p-908b8d73.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZMyzCardFooter","constructor","hostRef","this","opened","customContent","isOpen","allowTooltipAuthors","handleToggle","firstElem","getFirstListItem","requestAnimationFrame","focus","getTitleAuthors","autori","componentWillLoad","elementsEllipsis","elementAuthorsHasEllipsis","ellipsisAuthors","offsetWidth","scrollWidth","retrieveClass","isopen","real","cardtype","LicenseType","REAL","trial","TRIAL","temp","TEMP","footerTransitionHandler","e","includes","propertyName","host","querySelector","render","h","key","class","Object","assign","wrapper","onTransitionEnd","name","titolo","content","ref","el","title","isbn"],"sources":["src/snowflakes/myz/card/z-myz-card-footer/styles.css?tag=z-myz-card-footer&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-footer/index.tsx"],"sourcesContent":["footer {\n  position: relative;\n  z-index: 5;\n  top: 0;\n  width: auto;\n  height: calc(var(--space-unit) * 6);\n  padding: 0;\n  border-top: var(--border-size-medium) solid var(--color-surface03);\n  margin: 0;\n  background-color: var(--color-surface01);\n  border-radius: 0 0 var(--border-radius) var(--border-radius);\n  color: var(--color-surface05);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n  transition:\n    height 500ms ease-in-out,\n    top 500ms ease-in-out;\n}\n\nfooter.real,\nfooter.trial,\nfooter.temp {\n  border-top: var(--border-size-medium) solid var(--blue100);\n}\n\nfooter .bold {\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-sb);\n}\n\nfooter > p {\n  overflow: hidden;\n  height: 40px;\n  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 2) var(--space-unit) calc(var(--space-unit) * 2);\n  margin: 0;\n  background-color: var(--color-surface01);\n  font-family: var(--font-family-sans);\n  font-size: 16px;\n  font-weight: var(--font-rg);\n  line-height: 22px;\n  transition: all 200ms linear;\n}\n\nfooter.isopen > p {\n  background-color: var(--gray200);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  transition: all 200ms linear;\n}\n\nfooter.isopen.real > p,\nfooter.isopen.trial > p,\nfooter.isopen.temp > p {\n  background-color: var(--blue100);\n}\n\nfooter .visible {\n  display: block;\n}\n\nfooter .hidden {\n  display: none;\n}\n\nfooter > div.content {\n  overflow: hidden;\n  height: 60px;\n}\n\nfooter > div.content > div:not(.slot-handler) {\n  padding: var(--space-unit) calc(var(--space-unit) * 2);\n}\n\nfooter > div.content > div > p {\n  overflow: hidden;\n  height: 20px;\n  padding: 0;\n  margin: 0;\n  font-size: 14px;\n  line-height: 20px;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\nfooter > div.content > div > p.year-isbn {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  padding-top: var(--space-unit);\n}\n\nfooter > div.content > div > p.year-isbn > span.isbn {\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\nfooter.isopen > div.content > div:not(.slot-handler) {\n  height: 68px;\n}\n\nfooter.isopen > div.content > div > p.authors {\n  height: 40px;\n  text-overflow: initial;\n  white-space: initial;\n}\n\nfooter.isopen > div.content > div > p.year-isbn {\n  height: 50px;\n  flex-direction: column;\n  padding-left: 0;\n}\n\nfooter.isopen > div.content > div > p.year-isbn > span.isbn {\n  display: inline-grid;\n  padding-left: 0;\n}\n\nfooter.isopen {\n  top: -212px;\n  height: 295px;\n  transition:\n    height 500ms ease-in-out,\n    top 500ms ease-in-out;\n}\n\nfooter.isopen.custom-content {\n  top: -292px;\n}\n\nfooter.isopen > div.content {\n  height: 280px;\n  transition:\n    height 500ms ease-in-out,\n    top 500ms ease-in-out;\n}\n\nfooter.isopen.custom-content > div.content {\n  height: 230px;\n}\n\n.toggle {\n  position: absolute;\n  z-index: 10;\n  top: -24px;\n  left: 16px;\n}\n\n.faded {\n  opacity: 0.3;\n  pointer-events: none;\n}\n\nfooter > p.custom-content,\nfooter .content.custom-content {\n  display: none;\n}\n\nfooter.isopen > p.custom-content,\nfooter.isopen .content.custom-content {\n  display: block;\n}\n\ndiv.wrapper {\n  position: relative;\n  height: 100%;\n}\n\ndiv.wrapper ::slotted([slot=\"content\"]) {\n  position: absolute;\n  z-index: 10;\n  top: calc(var(--space-unit) * 2);\n  display: block;\n  width: 100%;\n  height: 112px;\n  box-sizing: border-box;\n  padding: 0 calc(var(--space-unit) * 2);\n  border-top: var(--border-size-medium) solid transparent;\n  background: var(--color-white);\n}\n\ndiv.wrapper.isopen ::slotted([slot=\"content\"]) {\n  top: 0;\n  bottom: 0;\n  height: 128px;\n  padding: calc(var(--space-unit) * 2);\n  border-color: var(--blue100);\n}\n","import {Component, ComponentInterface, Element, Listen, Prop, State, h} from \"@stencil/core\";\nimport {JSXBase} from \"@stencil/core/internal\";\nimport {LicenseType} from \"../../../../beans/index\";\n\n/**\n * @slot toggle - toggle button slot\n * @slot list - card resources list slot\n */\n@Component({\n  tag: \"z-myz-card-footer\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardFooter implements ComponentInterface {\n  @Element() host: HTMLZMyzCardFooterElement;\n\n  /** volume title */\n  @Prop()\n  titolo: string;\n\n  /** authors name text */\n  @Prop()\n  autori: string;\n\n  /** volume isbn */\n  @Prop()\n  isbn: string;\n\n  /** faded status */\n  @Prop()\n  faded: boolean;\n\n  /** card graphic variant (optional) */\n  @Prop()\n  cardtype?: LicenseType;\n\n  /** footer opened by default (optional) */\n  @Prop()\n  opened?: boolean = false;\n\n  /** display footer custom slotted content */\n  @Prop()\n  customContent = false;\n\n  @State()\n  isOpen = false;\n\n  @State()\n  allowTooltipAuthors = false;\n\n  private ellipsisAuthors?: HTMLElement;\n\n  @Listen(\"toggleClick\")\n  handleToggle(): void {\n    this.isOpen = !this.isOpen;\n    if (this.isOpen) {\n      const firstElem = this.getFirstListItem();\n      if (firstElem) {\n        requestAnimationFrame(() => {\n          firstElem.focus();\n        });\n      }\n    }\n  }\n\n  private getTitleAuthors(): string {\n    return this.allowTooltipAuthors ? this.autori : \"\";\n  }\n\n  componentWillLoad(): void {\n    if (this.opened) {\n      this.isOpen = true;\n    }\n  }\n\n  private elementsEllipsis(): void {\n    this.allowTooltipAuthors = this.elementAuthorsHasEllipsis() ? true : false;\n  }\n\n  private elementAuthorsHasEllipsis(): boolean {\n    return this.ellipsisAuthors.offsetWidth < this.ellipsisAuthors.scrollWidth;\n  }\n\n  private retrieveClass(): JSXBase.HTMLAttributes[\"class\"] {\n    return {\n      \"isopen\": this.isOpen,\n      \"real\": this.cardtype === LicenseType.REAL,\n      \"trial\": this.cardtype === LicenseType.TRIAL,\n      \"temp\": this.cardtype === LicenseType.TEMP,\n      \"custom-content\": this.customContent,\n    };\n  }\n\n  private footerTransitionHandler(e: TransitionEvent): void {\n    if ([\"visibility\", \"height\"].includes(e.propertyName)) {\n      this.elementsEllipsis();\n    }\n  }\n\n  private getFirstListItem(): HTMLElement {\n    return this.host.querySelector(\"[slot=list] > li a\");\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div class={{...(this.retrieveClass() as Record<string, boolean>), wrapper: true}}>\n        <footer\n          class={this.retrieveClass()}\n          onTransitionEnd={(e: TransitionEvent) => this.footerTransitionHandler(e)}\n        >\n          <span class=\"toggle\">\n            <slot name=\"toggle\" />\n          </span>\n          {this.titolo && <p class={{\"custom-content\": this.customContent}}>{this.titolo}</p>}\n          <div class={{\"content\": true, \"custom-content\": this.customContent}}>\n            <div>\n              <p\n                class=\"authors\"\n                ref={(el) => (this.ellipsisAuthors = el as HTMLElement)}\n              >\n                <span title={this.getTitleAuthors()}>\n                  <span\n                    aria-description=\"Autori\"\n                    class=\"bold\"\n                  >\n                    {this.autori}\n                  </span>\n                </span>\n              </p>\n              <p class=\"year-isbn\">\n                <span class=\"isbn\">\n                  <span>\n                    <span\n                      aria-description=\"ISBN edizione cartacea\"\n                      class=\"bold\"\n                    >\n                      {this.isbn}\n                    </span>{\" \"}\n                    (ed. cartacea)\n                  </span>\n                </span>\n              </p>\n            </div>\n            <div class={`slot-handler ${this.isOpen ? \"visible\" : \"hidden\"}`}>\n              <slot name=\"list\" />\n            </div>\n          </div>\n        </footer>\n        {this.customContent && <slot name=\"content\" />}\n      </div>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAY,IAAM,09F,MCaXC,EAAc,MAL3B,WAAAC,CAAAC,G,UA8BEC,KAAAC,OAAmB,MAInBD,KAAAE,cAAgB,MAGhBF,KAAAG,OAAS,MAGTH,KAAAI,oBAAsB,KAwGvB,CAnGC,YAAAC,GACEL,KAAKG,QAAUH,KAAKG,OACpB,GAAIH,KAAKG,OAAQ,CACf,MAAMG,EAAYN,KAAKO,mBACvB,GAAID,EAAW,CACbE,uBAAsB,KACpBF,EAAUG,OAAO,G,GAMjB,eAAAC,GACN,OAAOV,KAAKI,oBAAsBJ,KAAKW,OAAS,E,CAGlD,iBAAAC,GACE,GAAIZ,KAAKC,OAAQ,CACfD,KAAKG,OAAS,I,EAIV,gBAAAU,GACNb,KAAKI,oBAAsBJ,KAAKc,4BAA8B,KAAO,K,CAG/D,yBAAAA,GACN,OAAOd,KAAKe,gBAAgBC,YAAchB,KAAKe,gBAAgBE,W,CAGzD,aAAAC,GACN,MAAO,CACLC,OAAUnB,KAAKG,OACfiB,KAAQpB,KAAKqB,WAAaC,EAAYC,KACtCC,MAASxB,KAAKqB,WAAaC,EAAYG,MACvCC,KAAQ1B,KAAKqB,WAAaC,EAAYK,KACtC,iBAAkB3B,KAAKE,c,CAInB,uBAAA0B,CAAwBC,GAC9B,GAAI,CAAC,aAAc,UAAUC,SAASD,EAAEE,cAAe,CACrD/B,KAAKa,kB,EAID,gBAAAN,GACN,OAAOP,KAAKgC,KAAKC,cAAc,qB,CAGjC,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAKC,OAAAC,OAAAD,OAAAC,OAAA,GAAOvC,KAAKkB,iBAA2C,CAAEsB,QAAS,QAC1EL,EAAA,UAAAC,IAAA,2CACEC,MAAOrC,KAAKkB,gBACZuB,gBAAkBZ,GAAuB7B,KAAK4B,wBAAwBC,IAEtEM,EAAA,QAAAC,IAAA,2CAAMC,MAAM,UACVF,EAAA,QAAAC,IAAA,2CAAMM,KAAK,YAEZ1C,KAAK2C,QAAUR,EAAA,KAAAC,IAAA,2CAAGC,MAAO,CAAC,iBAAkBrC,KAAKE,gBAAiBF,KAAK2C,QACxER,EAAA,OAAAC,IAAA,2CAAKC,MAAO,CAACO,QAAW,KAAM,iBAAkB5C,KAAKE,gBACnDiC,EAAA,OAAAC,IAAA,4CACED,EAAA,KAAAC,IAAA,2CACEC,MAAM,UACNQ,IAAMC,GAAQ9C,KAAKe,gBAAkB+B,GAErCX,EAAA,QAAAC,IAAA,2CAAMW,MAAO/C,KAAKU,mBAChByB,EAAA,QAAAC,IAAA,8DACmB,SACjBC,MAAM,QAELrC,KAAKW,UAIZwB,EAAA,KAAAC,IAAA,2CAAGC,MAAM,aACPF,EAAA,QAAAC,IAAA,2CAAMC,MAAM,QACVF,EAAA,QAAAC,IAAA,4CACED,EAAA,QAAAC,IAAA,8DACmB,yBACjBC,MAAM,QAELrC,KAAKgD,MACA,IAEH,qBAIbb,EAAA,OAAAC,IAAA,2CAAKC,MAAO,gBAAgBrC,KAAKG,OAAS,UAAY,YACpDgC,EAAA,QAAAC,IAAA,2CAAMM,KAAK,YAIhB1C,KAAKE,eAAiBiC,EAAA,QAAAC,IAAA,2CAAMM,KAAK,Y","ignoreList":[]}

package/dist/web-components-library/p-9b181758.entry.js

@@ -1,2 +0,0 @@
-import{r as e,c as t,h as s,d as i}from"./p-BcDWN4F1.js";import{e as l,g as c,i as r,l as n}from"./p-DdetsoIY.js";import{r as a,e as o,b as h,d,f as z,i as p}from"./p-C_25lDQa.js";import"./p-Q-tWjk7P.js";const u=()=>`.sc-z-select-h{display:inline-block;width:inherit;color:var(--color-form-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg)}[size="small"].sc-z-select-h,[size="x-small"].sc-z-select-h{font-size:var(--font-size-2)}.select-wrapper.sc-z-select>z-input.sc-z-select{width:100%}.select-wrapper.sc-z-select>z-input.sc-z-select .input-icon.sc-z-select{cursor:pointer}.select-wrapper.sc-z-select>div.sc-z-select{position:relative}.select-wrapper.sc-z-select>div.closed.sc-z-select{overflow:hidden;height:0}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select{position:absolute;width:100%;box-sizing:border-box;border-top:none;background:var(--color-form-background);box-shadow:var(--shadow-2);outline:none}.select-wrapper.sc-z-select .closed.sc-z-select .ul-scroll-wrapper.sc-z-select{z-index:10}.select-wrapper.sc-z-select .open.sc-z-select .ul-scroll-wrapper.sc-z-select{z-index:20}.select-wrapper.sc-z-select .ul-scroll-wrapper.fixed.sc-z-select{position:static}.select-wrapper.sc-z-select z-list.sc-z-select{--background-color-list-element:var(--color-form-background);--background-hover-color-list-element:var(--color-surface02);--background-active-color-list-element:var(--color-surface02)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select>z-list.sc-z-select{position:relative;overflow:auto;max-height:240px;padding:var(--space-unit) calc(var(--space-unit) * 1.5);margin:0;outline:none}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element[disabled].sc-z-select{color:var(--color-form-disabled03)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select{display:flex;align-items:center;padding:calc(var(--space-unit) / 2) var(--space-unit);column-gap:var(--space-unit)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.active.sc-z-select{box-shadow:var(--shadow-focus-primary)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select .list-element-content.sc-z-select{margin-right:auto}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select+.list-element-content.sc-z-select{padding:calc(var(--space-unit) * 0.5) var(--space-unit)}[size="x-small"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select .list-element-content.sc-z-select{padding:0}[size="small"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select{--z-icon-width:16px;--z-icon-height:16px}[size="x-small"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select{--z-icon-width:14px;--z-icon-height:14px}[size="x-small"].sc-z-select-h .select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select>z-icon.sc-z-select+.list-element-content.sc-z-select{padding:0 var(--space-unit)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select z-list.sc-z-select z-list-element.sc-z-select .list-element-container.sc-z-select .list-element-content.selected.sc-z-select{font-weight:var(--font-sb)}.select-wrapper.sc-z-select .ul-scroll-wrapper.sc-z-select .no-results.sc-z-select z-icon.sc-z-select{margin-right:var(--space-unit)}.z-list-group-title.sc-z-select{color:var(--color-form-default-text)}.reset-item.sc-z-select{color:var(--color-form-active-primary);fill:var(--color-form-active-primary)}.reset-item-content.sc-z-select{display:flex;align-items:center}.reset-item.sc-z-select .reset-item-content.active.sc-z-select{box-shadow:var(--shadow-focus-primary)}.reset-item.reset-item-margin.sc-z-select .reset-item-content.sc-z-select{margin-left:var(--space-unit)}.reset-item.sc-z-select .reset-item-content.sc-z-select>z-icon.sc-z-select{margin-right:var(--space-unit)}.reset-item.hide.sc-z-select{display:none}.tree-list-reset-item.sc-z-select{padding:var(--space-unit) 0}z-list-element.sc-z-select{position:relative;display:block}z-list.sc-z-select z-list-element.sc-z-select::before{position:absolute;z-index:100;top:3px;left:-8px;width:8px;height:1em;border-bottom:1px solid var(--color-form-disabled01-icon);border-left:1px solid var(--color-form-disabled01-icon);content:"";cursor:pointer}z-list.sc-z-select z-list-element.sc-z-select::after{position:absolute;z-index:100;top:5px;left:-8px;width:8px;height:100%;border-left:1px solid var(--color-form-disabled01-icon);content:"";cursor:pointer}z-list.sc-z-select z-list-element.sc-z-select:last-child::after{display:none}z-list.sc-z-select>z-list-element.sc-z-select::before,z-list.sc-z-select>z-list-element.sc-z-select::after,z-list.sc-z-select>z-list-group.sc-z-select>z-list-element.sc-z-select::before,z-list.sc-z-select>z-list-group.sc-z-select>z-list-element.sc-z-select::after{display:none}z-list.sc-z-select>div.children-node.sc-z-select{padding-left:calc(var(--space-unit) * 2)}z-list-element.sc-z-select>.list-element.sc-z-select{display:flex;justify-content:space-between;padding:calc(var(--space-unit) * 1.5) var(--space-unit);cursor:pointer}z-list-element.sc-z-select>.list-element.active.sc-z-select{box-shadow:var(--shadow-focus-primary)}z-list-element.sc-z-select:not([disabled])>.list-element.sc-z-select:hover,z-list-element.sc-z-select:not([disabled])>.list-element.sc-z-select:hover::after{background-color:var(--background-hover-color-list-element, var(--color-background))}z-list-element.sc-z-select>.list-element.sc-z-select .item.ellipsis.sc-z-select{overflow:hidden}z-list-element.sc-z-select .list-element.sc-z-select::after{position:absolute;top:0;right:-1px;display:block;width:100%;height:45px;content:"";transform:translateX(-100%)}z-list-element.tree-search-item.sc-z-select{padding-top:0}z-list-element.tree-search-item.sc-z-select .list-element.sc-z-select::after{position:absolute;right:-25px;display:block;width:100%;height:45px;content:"";transform:translateX(-100%)}z-list-element.grouped-tree-parent-node.sc-z-select .list-element.sc-z-select::after{position:absolute;right:-25px;display:block;width:100%;height:45px;content:"";transform:translateX(-100%)}.item-label.selected.sc-z-select{font-weight:bold}.item.ellipsis.sc-z-select{display:inline-block;overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap}z-list.sc-z-select>z-list-element.grouped-tree-parent-node.sc-z-select>.list-element.sc-z-select:hover::after,z-list-element.tree-search-item.sc-z-select .list-element.sc-z-select:hover::after,z-list.sc-z-select>z-list-group.sc-z-select>z-list-element.grouped-tree-parent-node.sc-z-select>.list-element.sc-z-select:hover::after{position:absolute;z-index:-1;right:-18px;display:block;width:100%;height:45px;content:"";transform:translateX(-100%)}z-list-element.sc-z-select>.list-element.sc-z-select:hover::after{position:absolute;z-index:-1;top:0;right:0;display:block;width:100%;height:45px;content:"";transform:translateX(-100%)}.children-node.sc-z-select z-list-element.sc-z-select::before,.children-node.sc-z-select z-list-element.sc-z-select::after{left:-8px}.children-node.sc-z-select .children-node.sc-z-select z-list-element.sc-z-select::before,.children-node.sc-z-select .children-node.sc-z-select z-list-element.sc-z-select::after{left:-8px}.children-node.sc-z-select>z-list-element.sc-z-select{padding:0}`;const m=class{constructor(s){e(this,s);this.optionSelect=t(this,"optionSelect",7);this.resetSelect=t(this,"resetSelect",7);this.htmlid=`id-${a()}`;this.items=[];this.ariaLabel="";this.disabled=false;this.readonly=false;this.required=false;this.message=true;this.autocomplete=false;this.noresultslabel="Nessun risultato";this.isfixed=false;this.size=l.BIG;this.isOpen=false;this.selectedItem=null;this.itemsList=[];this.toggleSelectUl=this.toggleSelectUl.bind(this);this.handleSelectFocus=this.handleSelectFocus.bind(this)}watchItems(){this.itemsList=this.getInitialItemsArray();this.selectedItem=this.findSelectedItem(this.itemsList)}async getSelectedItem(){return this.selectedItem}async getValue(){return this.getSelectedValue()}async setValue(e){let t=[];if(typeof e==="string"){t.push(e)}else{t=e}this.itemsList=this.getInitialItemsArray();if(t.length){this.updateSelection(this.itemsList,t[0])}this.selectedItem=this.findSelectedItem(this.itemsList)}emitOptionSelect(){this.optionSelect.emit({id:this.htmlid,selected:this.getSelectedValue()})}emitResetSelect(){this.resetSelect.emit({id:this.htmlid})}componentWillLoad(){this.watchItems()}componentWillRender(){this.filterItems(this.searchString)}getInitialItemsArray(){return typeof this.items==="string"?JSON.parse(this.items):this.items}mapSelectedItemToItemsArray(){var e;const t=this.getInitialItemsArray();this.updateSelection(t,(e=this.selectedItem)===null||e===void 0?void 0:e.id);return t}getSelectedValue(){var e;return(e=this.selectedItem)===null||e===void 0?void 0:e.id}getOptionId(e){return`${this.htmlid}_key_${e.id?o(`${e.id}`):o(`${e.name}`)}`}getResetOptionId(){return`${this.htmlid}_key_reset`}getGroupedItems(){if(!this.itemsList.length){return[]}return Object.entries(this.itemsList.reduce(((e,t)=>{const s=t.category||"Altra categoria";e[s]=e[s]||[];e[s].push(t);return e}),{}))}filterItems(e){let t=this.mapSelectedItemToItemsArray();if(!(e===null||e===void 0?void 0:e.length)){this.itemsList=t;return}t=t.map((e=>Object.assign(Object.assign({},e),{name:h(e.name)})));if(this.hasTreeItems){this.itemsList=this.filterTree(t,e,false)}else{this.itemsList=t.filter((t=>t.name.toUpperCase().includes(e.toUpperCase()))).map((t=>{t.name=this.getHighlightedText(t.name,e);return t}))}}filterTree(e,t,s){if(!e){return[]}return e.map((e=>{const i=e.name.toUpperCase().includes(t.toUpperCase());const l=Object.assign({},e);if(l.children&&l.children.length>0){l.children=this.filterTree(l.children.map((e=>Object.assign(Object.assign({},e),{name:h(e.name)}))),t,i)}if(i){l.name=this.getHighlightedText(l.name,t)}if(i||l.children&&l.children.length>0||this.showChildrenOfMatchingParent&&s){return l}return null})).filter((e=>e!==null))}getHighlightedText(e,t){const s=e.toUpperCase();const i=t.toUpperCase();const l=s.indexOf(i);if(l===-1){return e}const c=l+t.length;return e.substring(0,l)+`<strong>${e.substring(l,c)}</strong>`+e.substring(c)}hasAutocomplete(){return d(this.autocomplete)===true}handleInputChange(e){this.searchString=e.detail.value;if(!this.isOpen){this.toggleSelectUl()}}updateSelection(e,t){if(e){e.forEach((e=>{e.selected=e.id===t;if(e.children&&e.children.length>0){this.updateSelection(e.children,t)}}))}}findSelectedItem(e){if(e){for(const t of e){if(t.selected){return t}if(t.children&&t.children.length>0){const e=this.findSelectedItem(t.children);if(e){return e}}}}return null}selectItem(e){if(e===null||e===void 0?void 0:e.disabled){return}this.itemsList=this.getInitialItemsArray();if(e){this.updateSelection(this.itemsList,e.id)}this.selectedItem=this.findSelectedItem(this.itemsList);this.emitOptionSelect();this.toggleSelectUl();if(this.searchString){this.searchString=null}}handleResetClick(){this.selectedItem=null;this.searchString=null;this.focusedItemId="";this.emitResetSelect();this.toggleSelectUl()}handleInputKeyDown(e){switch(e.code){case c.ENTER:case c.SPACE:if(this.focusedItemId){if(this.focusedItemId===this.getResetOptionId()){this.handleResetClick()}else{const e=this.itemsList.find((e=>this.getOptionId(e)===this.focusedItemId))||null;if(e){this.selectedItem=e;this.emitOptionSelect();this.toggleSelectUl()}}}break;case c.ARROW_DOWN:case c.ARROW_UP:this.arrowsSelectNav(e);break}}arrowsSelectNav(e){const t=[c.ARROW_DOWN,c.ARROW_UP];if(!t.includes(e.key)){return}e.preventDefault();e.stopPropagation();const s=this.focusedItemId?this.host.querySelector(`#${this.focusedItemId}`):null;const i=Array.from(this.host.querySelectorAll('[role="option"]'));if(!i.length){return}const l=s?i.indexOf(s):null;const r=0;const n=i.length-1;if(!this.isOpen){this.toggleSelectUl();if(this.selectedItem){this.focusSelectItem(this.getOptionId(this.selectedItem));return}}let a=null;if(e.code===c.ARROW_DOWN){a=l===null?i[r]:i[l+1]||i[n]}else if(e.code===c.ARROW_UP){a=l===null?i[n]:i[l-1]||i[r]}this.focusSelectItem(a.id)}focusSelectItem(e){this.focusedItemId=e;const t=this.host.querySelector(`#${e}`);t.scrollIntoView({block:"nearest",container:"nearest"})}toggleSelectUl(e=false){var t;if(this.disabled||this.readonly){return}if(!this.isOpen){document.addEventListener("click",this.handleSelectFocus);document.addEventListener("keyup",this.handleSelectFocus)}else{document.removeEventListener("click",this.handleSelectFocus);document.removeEventListener("keyup",this.handleSelectFocus);if(e){(t=this.host.querySelector(`#${this.htmlid}_select_input`))===null||t===void 0?void 0:t.focus()}if(this.selectedItem&&this.searchString){this.searchString=null;this.filterItems(this.searchString)}}this.focusedItemId="";this.isOpen=!this.isOpen}handleInputClick(e){if(e.target.closest(".reset-icon")){e.stopPropagation();return}this.toggleSelectUl()}handleSelectFocus(e){if(e instanceof KeyboardEvent&&e.key===c.ESC){e.stopPropagation();return this.toggleSelectUl(true)}if(e instanceof KeyboardEvent&&e.key!==c.TAB){return}const t=z();if(t===null||t===void 0?void 0:t.hasAttribute("disabled")){return}if(!p(t).find((e=>e.nodeName.toLowerCase()==="z-input"&&e.id===`${this.htmlid}_input`))){const e=p(t).find((e=>e.nodeName==="Z-SELECT"));this.toggleSelectUl(e===this.host)}}scrollToLetter(e){if(!this.itemsList.length){return}const t=this.itemsList.find((t=>t.name.toLowerCase().charAt(0)===e.toLowerCase()));if(t){if(!this.isOpen){this.toggleSelectUl()}this.focusSelectItem(this.getOptionId(t))}}renderInput(){let e=null;if(this.selectedItem){e=h(this.selectedItem.name)}if(this.isOpen&&this.searchString!==undefined){e=this.searchString}return[s("z-input",{class:{"active-select":this.isOpen,"cursor-select":!this.autocomplete},id:`${this.htmlid}_input`,htmlid:`${this.htmlid}_select_input`,placeholder:this.placeholder,value:e,label:this.label,autocomplete:"off","aria-label":this.ariaLabel,icon:this.isOpen?"caret-up":"caret-down",hasclearicon:false,message:false,name:this.name,disabled:this.disabled,readonly:this.readonly||!this.hasAutocomplete()&&this.isOpen,required:this.required,status:this.isOpen?undefined:this.status,size:this.size,role:"combobox","html-aria-expanded":this.isOpen?"true":"false","html-aria-controls":`${this.htmlid}_list`,"html-aria-activedescendant":this.isOpen?this.focusedItemId:"","html-aria-autocomplete":this.hasAutocomplete()?"list":undefined,onClick:e=>this.handleInputClick(e),onKeyDown:e=>this.handleInputKeyDown(e),onInputChange:e=>this.handleInputChange(e),onKeyPress:e=>{if(!this.hasAutocomplete()){e.preventDefault();this.scrollToLetter(e.key)}}})]}renderSelectUl(){return s("div",{class:this.isOpen?"open":"closed"},s("div",{class:{"ul-scroll-wrapper":true,fixed:this.isfixed}},s("z-list",{role:"listbox","aria-label":this.ariaLabel||this.label,tabindex:this.disabled||this.readonly||!this.isOpen?-1:0,id:`${this.htmlid}_list`,"aria-multiselectable":false,size:this.listSizeType(),class:{disabled:this.disabled,readonly:this.readonly,[`input-${this.status}`]:!this.isOpen&&!!this.status,"z-scrollbar":true}},this.resetItem&&this.renderResetItem(),this.renderSelectUlItems())))}renderResetItem(){const e=!this.selectedItem||!this.resetItem;return s("z-list-element",{class:{hide:e,"reset-item":true,"reset-item-margin":!this.hasGroupItems},clickable:true,disabled:false,dividerType:n.ELEMENT,role:e?"presentation":"option",htmlTabindex:this.isOpen?0:null,"aria-selected":"false","aria-label":e?undefined:this.resetItem,id:this.getResetOptionId(),size:this.hasTreeItems?r.MEDIUM:this.listSizeType(),onClickItem:()=>this.handleResetClick()},s("div",{class:{"reset-item-content":true,"tree-list-reset-item":this.hasTreeItems,active:this.focusedItemId===this.getResetOptionId()},"aria-hidden":"true"},s("z-icon",{name:"multiply-circled"}),s("span",null,this.resetItem)))}renderItem(e,t){return s("z-list-element",{clickable:!e.disabled,disabled:e.disabled,dividerType:t?n.HEADER:n.ELEMENT,role:e.disabled?"presentation":"option",htmlTabindex:-1,"aria-selected":e.selected?"true":"false","aria-label":e.disabled?undefined:h(e.name),id:this.getOptionId(e),size:this.listSizeType(),onClickItem:()=>this.selectItem(e)},s("div",{class:{"list-element-container":true,active:this.focusedItemId===this.getOptionId(e)},"aria-hidden":"true"},s("div",{class:{selected:!!e.selected,"list-element-content":true},innerHTML:e.name}),e.icon&&s("z-tag",{icon:e.icon})))}listSizeType(){if(this.hasTreeItems){return r.NONE}if(this.size===l.SMALL||this.size===l.X_SMALL){return r.SMALL}return r.MEDIUM}renderSelectUlItems(){if(!this.itemsList.length){return this.renderNoSearchResults()}if(this.hasGroupItems){if(this.hasTreeItems){return this.renderGroupedTree()}return this.renderSelectGroupItems()}return this.itemsList.map(((e,t,s)=>{const i=t===s.length-1;const l=s.length>1;if(this.hasTreeItems){return this.renderTreeItems(e,i,l,true,e.disabled)}return this.renderItem(e,i)}))}renderTreeItems(e,t,i,l,c){var r,a;const o=e.disabled||c;const d=this.hasGroupItems?undefined:this.hasGroupItems?t&&!i?n.ELEMENT:undefined:l&&i&&!t?n.ELEMENT:undefined;return s("z-list-element",{clickable:!e.disabled,disabled:o,class:{"grouped-tree-parent-node":this.hasGroupItems&&!!((r=e.children)===null||r===void 0?void 0:r.length),"tree-search-item":this.hasGroupItems&&l&&!((a=e.children)===null||a===void 0?void 0:a.length)&&!!this.searchString},size:this.listSizeType(),dividerType:d,hasTreeItems:this.hasTreeItems,htmlTabindex:null,role:"presentation"},s("div",{id:this.getOptionId(e),role:o?"presentation":"option","aria-label":o?undefined:h(e.name),class:{"list-element":true,active:this.focusedItemId===this.getOptionId(e)},onClick:()=>this.selectItem(e)},s("span",{class:"item ellipsis","aria-hidden":"true"},s("span",{class:{"item-label":true,selected:!!e.selected},title:e.name,innerHTML:e.name})),e.icon&&s("z-tag",{icon:e.icon})),e.children&&e.children.length>0?s("z-list",{role:"presentation"},s("div",{class:"children-node"},e.children.map(((e,t,s)=>this.renderTreeItems(e,t===s.length-1,s.length>1,false,o))))):null)}renderGroupedTree(){const e=this.getGroupedItems();return e.map((([t,i],l,c)=>{const r=Object.values(e).some((e=>e.length>1));return s("z-list-group",{"divider-type":l===c.length-1?undefined:n.ELEMENT,hasTreeItems:true,"aria-labelledby":`${this.htmlid}_tree_${l}`},s("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.htmlid}_tree_${l}`,"aria-hidden":"true"},t),s("z-list",{role:"presentation"},i.map(((e,t,i)=>[this.renderTreeItems(e,t===i.length-1,r,true,e.disabled),t<i.length-1?s("z-divider",{key:`divider-${t}`,style:{zIndex:"100",height:"var(--border-size-small)"}}):null]))),l!==c.length-1&&s("z-divider",{style:{zIndex:"100",height:"var(--border-size-small)"}}))}))}renderSelectGroupItems(){const e=this.getGroupedItems();return e.map((([t,i],l)=>{const c=e.length===l+1;return s("z-list-group",{"divider-type":n.ELEMENT,"aria-labelledby":`${this.htmlid}_group_${l}`},s("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.htmlid}_group_${l}`,"aria-hidden":"true"},t),i.map(((e,t)=>{const s=i.length===t+1;return this.renderItem(e,c&&s)})))}))}renderNoSearchResults(){return s("z-list-element",{class:"no-results",size:this.hasTreeItems?r.MEDIUM:this.listSizeType(),htmlTabindex:null,role:"presentation"},this.noresultslabel)}renderMessage(){if(d(this.message)===false){return}return s("z-input-message",{message:d(this.message)===true?undefined:this.message,status:this.status,class:this.size,disabled:this.disabled})}render(){return s("div",{key:"0656bc0ce5a7ba47aae6e467ff5291631abb35e5",class:"select-wrapper"},this.renderInput(),this.renderSelectUl(),this.renderMessage())}get host(){return i(this)}static get watchers(){return{items:[{watchItems:0}]}}};m.style=u();export{m as z_select};
-//# sourceMappingURL=p-9b181758.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZSelect","constructor","hostRef","this","htmlid","randomId","items","ariaLabel","disabled","readonly","required","message","autocomplete","noresultslabel","isfixed","size","ControlSize","BIG","isOpen","selectedItem","itemsList","toggleSelectUl","bind","handleSelectFocus","watchItems","getInitialItemsArray","findSelectedItem","getSelectedItem","getValue","getSelectedValue","setValue","value","values","push","length","updateSelection","emitOptionSelect","optionSelect","emit","id","selected","emitResetSelect","resetSelect","componentWillLoad","componentWillRender","filterItems","searchString","JSON","parse","mapSelectedItemToItemsArray","initialItemsList","_a","getOptionId","item","encodeString","name","getResetOptionId","getGroupedItems","Object","entries","reduce","group","category","prevList","map","assign","getPlainText","hasTreeItems","filterTree","filter","toUpperCase","includes","getHighlightedText","matchingParent","match","newItem","children","showChildrenOfMatchingParent","text","search","upperText","upperSearch","start","indexOf","end","substring","hasAutocomplete","boolean","handleInputChange","e","detail","selectedId","forEach","found","selectItem","handleResetClick","focusedItemId","handleInputKeyDown","code","KeyboardCode","ENTER","SPACE","find","ARROW_DOWN","ARROW_UP","arrowsSelectNav","arrows","key","preventDefault","stopPropagation","currElem","host","querySelector","options","Array","from","querySelectorAll","currElemIndex","firstElemIndex","lastElemIndex","focusSelectItem","nextElem","optionId","elem","scrollIntoView","block","container","selfFocusOnClose","document","addEventListener","removeEventListener","focus","handleInputClick","target","closest","KeyboardEvent","ESC","TAB","clickedElement","getClickedElement","hasAttribute","getElementTree","nodeName","toLowerCase","zSelect","scrollToLetter","letter","foundItem","charAt","renderInput","undefined","h","class","placeholder","label","icon","hasclearicon","status","role","onClick","onKeyDown","onInputChange","onKeyPress","renderSelectUl","fixed","tabindex","listSizeType","resetItem","renderResetItem","renderSelectUlItems","hidden","hide","hasGroupItems","clickable","dividerType","ListDividerType","ELEMENT","htmlTabindex","ListSize","MEDIUM","onClickItem","active","renderItem","lastItem","HEADER","innerHTML","NONE","SMALL","X_SMALL","renderNoSearchResults","renderGroupedTree","renderSelectGroupItems","index","array","isLastItem","parentHasSiblings","renderTreeItems","isLastChild","isTopLevel","disabledAncestor","isDisabled","hasDivider","_b","title","child","arr","groupedItems","some","groupItems","slot","i","style","zIndex","height","isLastGroup","subindex","renderMessage","render"],"sources":["src/components/z-select/styles.css?tag=z-select&encapsulation=scoped","src/components/z-select/index.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  width: inherit;\n  color: var(--color-form-default-text);\n  font-family: var(--font-family-sans);\n  font-size: var(--font-size-3);\n  font-weight: var(--font-rg);\n}\n\n:host([size=\"small\"]),\n:host([size=\"x-small\"]) {\n  font-size: var(--font-size-2);\n}\n\n.select-wrapper > z-input {\n  width: 100%;\n}\n\n.select-wrapper > z-input .input-icon {\n  cursor: pointer;\n}\n\n.select-wrapper > div {\n  position: relative;\n}\n\n.select-wrapper > div.closed {\n  overflow: hidden;\n  height: 0;\n}\n\n.select-wrapper .ul-scroll-wrapper {\n  position: absolute;\n  width: 100%;\n  box-sizing: border-box;\n  border-top: none;\n  background: var(--color-form-background);\n  box-shadow: var(--shadow-2);\n  outline: none;\n}\n\n.select-wrapper .closed .ul-scroll-wrapper {\n  z-index: 10;\n}\n\n.select-wrapper .open .ul-scroll-wrapper {\n  z-index: 20;\n}\n\n.select-wrapper .ul-scroll-wrapper.fixed {\n  position: static;\n}\n\n.select-wrapper z-list {\n  --background-color-list-element: var(--color-form-background);\n  --background-hover-color-list-element: var(--color-surface02);\n  --background-active-color-list-element: var(--color-surface02);\n}\n\n.select-wrapper .ul-scroll-wrapper > z-list {\n  position: relative;\n  overflow: auto;\n  max-height: 240px;\n  padding: var(--space-unit) calc(var(--space-unit) * 1.5);\n  margin: 0;\n  outline: none;\n}\n\n.select-wrapper .ul-scroll-wrapper z-list z-list-element[disabled] {\n  color: var(--color-form-disabled03);\n}\n\n.select-wrapper .ul-scroll-wrapper z-list z-list-element .list-element-container {\n  display: flex;\n  align-items: center;\n  padding: calc(var(--space-unit) / 2) var(--space-unit);\n  column-gap: var(--space-unit);\n}\n\n.select-wrapper .ul-scroll-wrapper z-list z-list-element .list-element-container.active {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n.select-wrapper .ul-scroll-wrapper z-list z-list-element .list-element-container .list-element-content {\n  margin-right: auto;\n}\n\n.select-wrapper .ul-scroll-wrapper z-list z-list-element .list-element-container > z-icon + .list-element-content {\n  padding: calc(var(--space-unit) * 0.5) var(--space-unit);\n}\n\n:host([size=\"x-small\"])\n  .select-wrapper\n  .ul-scroll-wrapper\n  z-list\n  z-list-element\n  .list-element-container\n  .list-element-content {\n  padding: 0;\n}\n\n:host([size=\"small\"]) .select-wrapper .ul-scroll-wrapper z-list z-list-element .list-element-container > z-icon {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n:host([size=\"x-small\"]) .select-wrapper .ul-scroll-wrapper z-list z-list-element .list-element-container > z-icon {\n  --z-icon-width: 14px;\n  --z-icon-height: 14px;\n}\n\n:host([size=\"x-small\"])\n  .select-wrapper\n  .ul-scroll-wrapper\n  z-list\n  z-list-element\n  .list-element-container\n  > z-icon\n  + .list-element-content {\n  padding: 0 var(--space-unit);\n}\n\n.select-wrapper .ul-scroll-wrapper z-list z-list-element .list-element-container .list-element-content.selected {\n  font-weight: var(--font-sb);\n}\n\n.select-wrapper .ul-scroll-wrapper .no-results z-icon {\n  margin-right: var(--space-unit);\n}\n\n.z-list-group-title {\n  color: var(--color-form-default-text);\n}\n\n.reset-item {\n  color: var(--color-form-active-primary);\n  fill: var(--color-form-active-primary);\n}\n\n.reset-item-content {\n  display: flex;\n  align-items: center;\n}\n\n.reset-item .reset-item-content.active {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n.reset-item.reset-item-margin .reset-item-content {\n  margin-left: var(--space-unit);\n}\n\n.reset-item .reset-item-content > z-icon {\n  margin-right: var(--space-unit);\n}\n\n.reset-item.hide {\n  display: none;\n}\n\n.tree-list-reset-item {\n  padding: var(--space-unit) 0;\n}\n\nz-list-element {\n  position: relative;\n  display: block;\n}\n\nz-list z-list-element::before {\n  position: absolute;\n  z-index: 100;\n  top: 3px;\n  left: -8px;\n  width: 8px;\n  height: 1em;\n  border-bottom: 1px solid var(--color-form-disabled01-icon);\n  border-left: 1px solid var(--color-form-disabled01-icon);\n  content: \"\";\n  cursor: pointer;\n}\n\nz-list z-list-element::after {\n  position: absolute;\n  z-index: 100;\n  top: 5px;\n  left: -8px;\n  width: 8px;\n  height: 100%;\n  border-left: 1px solid var(--color-form-disabled01-icon);\n  content: \"\";\n  cursor: pointer;\n}\n\nz-list z-list-element:last-child::after {\n  display: none;\n}\n\nz-list > z-list-element::before,\nz-list > z-list-element::after,\nz-list > z-list-group > z-list-element::before,\nz-list > z-list-group > z-list-element::after {\n  display: none;\n}\n\nz-list > div.children-node {\n  padding-left: calc(var(--space-unit) * 2);\n}\n\nz-list-element > .list-element {\n  display: flex;\n  justify-content: space-between;\n  padding: calc(var(--space-unit) * 1.5) var(--space-unit);\n  cursor: pointer;\n}\n\nz-list-element > .list-element.active {\n  box-shadow: var(--shadow-focus-primary);\n}\n\nz-list-element:not([disabled]) > .list-element:hover,\nz-list-element:not([disabled]) > .list-element:hover::after {\n  background-color: var(--background-hover-color-list-element, var(--color-background));\n}\n\nz-list-element > .list-element .item.ellipsis {\n  overflow: hidden;\n}\n\nz-list-element .list-element::after {\n  position: absolute;\n  top: 0;\n  right: -1px;\n  display: block;\n  width: 100%;\n  height: 45px;\n  content: \"\";\n  transform: translateX(-100%);\n}\n\nz-list-element.tree-search-item {\n  padding-top: 0;\n}\n\nz-list-element.tree-search-item .list-element::after {\n  position: absolute;\n  right: -25px;\n  display: block;\n  width: 100%;\n  height: 45px;\n  content: \"\";\n  transform: translateX(-100%);\n}\n\nz-list-element.grouped-tree-parent-node .list-element::after {\n  position: absolute;\n  right: -25px;\n  display: block;\n  width: 100%;\n  height: 45px;\n  content: \"\";\n  transform: translateX(-100%);\n}\n\n.item-label.selected {\n  font-weight: bold;\n}\n\n.item.ellipsis {\n  display: inline-block;\n  overflow: hidden;\n  max-width: 100%;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\nz-list > z-list-element.grouped-tree-parent-node > .list-element:hover::after,\nz-list-element.tree-search-item .list-element:hover::after,\nz-list > z-list-group > z-list-element.grouped-tree-parent-node > .list-element:hover::after {\n  position: absolute;\n  z-index: -1;\n  right: -18px;\n  display: block;\n  width: 100%;\n  height: 45px;\n  content: \"\";\n  transform: translateX(-100%);\n}\n\nz-list-element > .list-element:hover::after {\n  position: absolute;\n  z-index: -1;\n  top: 0;\n  right: 0;\n  display: block;\n  width: 100%;\n  height: 45px;\n  content: \"\";\n  transform: translateX(-100%);\n}\n\n.children-node z-list-element::before,\n.children-node z-list-element::after {\n  left: -8px;\n}\n\n.children-node .children-node z-list-element::before,\n.children-node .children-node z-list-element::after {\n  left: -8px;\n}\n\n.children-node > z-list-element {\n  padding: 0;\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n  Prop,\n  State,\n  Watch,\n  h,\n} from \"@stencil/core\";\nimport {ControlSize, InputStatus, KeyboardCode, ListDividerType, ListSize, SelectItem} from \"../../beans\";\nimport {boolean, encodeString, getClickedElement, getElementTree, getPlainText, randomId} from \"../../utils/utils\";\n\n@Component({\n  tag: \"z-select\",\n  styleUrl: \"styles.css\",\n  shadow: false,\n  scoped: true,\n})\nexport class ZSelect implements ComponentInterface {\n  @Element() host: HTMLZSelectElement;\n\n  /** the id of the input element */\n  @Prop()\n  htmlid = `id-${randomId()}`;\n\n  /** the input select options */\n  @Prop()\n  items: SelectItem[] | string = [];\n\n  /** the input name */\n  @Prop()\n  name?: string;\n\n  /** the input label */\n  @Prop()\n  label?: string;\n\n  /** the input aria-label */\n  @Prop()\n  ariaLabel = \"\";\n\n  /** the input is disabled */\n  @Prop()\n  disabled?: boolean = false;\n\n  /** the input is readonly */\n  @Prop()\n  readonly?: boolean = false;\n\n  /** the input is required */\n  @Prop()\n  required?: boolean = false;\n\n  /** the input placeholder (optional) */\n  @Prop()\n  placeholder?: string;\n\n  /** the input html title (optional) */\n  @Prop()\n  htmltitle?: string;\n\n  /** the input status (optional) */\n  @Prop()\n  status?: InputStatus;\n\n  /** input helper message (optional) - if set to `false` message won't be displayed */\n  @Prop()\n  message?: string | boolean = true;\n\n  /** the input has autocomplete option */\n  @Prop()\n  autocomplete?: boolean = false;\n\n  /** no result text message */\n  @Prop()\n  noresultslabel?: string = \"Nessun risultato\";\n\n  /** */\n  @Prop()\n  hasGroupItems?: boolean;\n\n  /** */\n  @Prop()\n  hasTreeItems?: boolean;\n\n  /** If true and an item matches the search string, children of matching item are shown even if they don't match the search string  */\n  @Prop()\n  showChildrenOfMatchingParent?: boolean;\n\n  /** When fixed, it occupies space and pushes down next elements. */\n  @Prop()\n  isfixed?: boolean = false;\n\n  /** */\n  @Prop()\n  resetItem?: string;\n\n  /** Available sizes: `big`, `small` and `x-small`. Defaults to `big`. */\n  @Prop()\n  size?: ControlSize = ControlSize.BIG;\n\n  @State()\n  isOpen = false;\n\n  @State()\n  selectedItem: null | SelectItem = null;\n\n  @State()\n  focusedItemId: string;\n\n  @State()\n  searchString: null | string;\n\n  private itemsList: SelectItem[] = [];\n\n  constructor() {\n    this.toggleSelectUl = this.toggleSelectUl.bind(this);\n    this.handleSelectFocus = this.handleSelectFocus.bind(this);\n  }\n\n  @Watch(\"items\")\n  watchItems(): void {\n    this.itemsList = this.getInitialItemsArray();\n\n    this.selectedItem = this.findSelectedItem(this.itemsList);\n  }\n\n  /** get the input selected options */\n  @Method()\n  async getSelectedItem(): Promise<SelectItem> {\n    return this.selectedItem;\n  }\n\n  /** get the input value */\n  @Method()\n  async getValue(): Promise<string> {\n    return this.getSelectedValue();\n  }\n\n  /** set the input value */\n  @Method()\n  async setValue(value: string | string[]): Promise<void> {\n    let values: string[] = [];\n    if (typeof value === \"string\") {\n      values.push(value);\n    } else {\n      values = value;\n    }\n\n    this.itemsList = this.getInitialItemsArray();\n    if (values.length) {\n      this.updateSelection(this.itemsList, values[0]);\n    }\n    this.selectedItem = this.findSelectedItem(this.itemsList);\n  }\n\n  /** Emitted on select option selection, returns select id, selected item id */\n  @Event()\n  optionSelect: EventEmitter;\n\n  private emitOptionSelect(): void {\n    this.optionSelect.emit({\n      id: this.htmlid,\n      selected: this.getSelectedValue(),\n    });\n  }\n\n  /** Emitted on reset selected item, returns select id, selected item id */\n  @Event()\n  resetSelect: EventEmitter;\n\n  private emitResetSelect(): void {\n    this.resetSelect.emit({\n      id: this.htmlid,\n    });\n  }\n\n  componentWillLoad(): void {\n    this.watchItems();\n  }\n\n  componentWillRender(): void {\n    this.filterItems(this.searchString);\n  }\n\n  private getInitialItemsArray(): SelectItem[] {\n    return typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n  }\n\n  private mapSelectedItemToItemsArray(): SelectItem[] {\n    const initialItemsList = this.getInitialItemsArray();\n\n    this.updateSelection(initialItemsList, this.selectedItem?.id);\n\n    return initialItemsList;\n  }\n\n  private getSelectedValue(): string {\n    return this.selectedItem?.id;\n  }\n\n  private getOptionId(item: SelectItem): string {\n    return `${this.htmlid}_key_${item.id ? encodeString(`${item.id}`) : encodeString(`${item.name}`)}`;\n  }\n\n  private getResetOptionId(): string {\n    return `${this.htmlid}_key_reset`;\n  }\n\n  private getGroupedItems(): [string, SelectItem[]][] {\n    if (!this.itemsList.length) {\n      return [];\n    }\n\n    return Object.entries(\n      this.itemsList.reduce(\n        (group, item) => {\n          const category = item.category || \"Altra categoria\";\n          group[category] = group[category] || [];\n          group[category].push(item);\n\n          return group;\n        },\n        {} as Record<string, SelectItem[]>\n      )\n    );\n  }\n\n  private filterItems(searchString: string): void {\n    let prevList = this.mapSelectedItemToItemsArray();\n\n    if (!searchString?.length) {\n      this.itemsList = prevList;\n\n      return;\n    }\n\n    prevList = prevList.map((item) => ({...item, name: getPlainText(item.name)}));\n\n    if (this.hasTreeItems) {\n      this.itemsList = this.filterTree(prevList, searchString, false);\n    } else {\n      this.itemsList = prevList\n        .filter((item: SelectItem) => item.name.toUpperCase().includes(searchString.toUpperCase()))\n        .map((item: SelectItem) => {\n          item.name = this.getHighlightedText(item.name, searchString);\n\n          return item;\n        });\n    }\n  }\n\n  private filterTree(items: SelectItem[], searchString: string, matchingParent: boolean): SelectItem[] {\n    if (!items) {\n      return [];\n    }\n\n    return items\n      .map((item) => {\n        const match = item.name.toUpperCase().includes(searchString.toUpperCase());\n\n        const newItem: SelectItem = {...item};\n        if (newItem.children && newItem.children.length > 0) {\n          newItem.children = this.filterTree(\n            newItem.children.map((item) => ({...item, name: getPlainText(item.name)})),\n            searchString,\n            match\n          );\n        }\n\n        if (match) {\n          newItem.name = this.getHighlightedText(newItem.name, searchString);\n        }\n        if (\n          match ||\n          (newItem.children && newItem.children.length > 0) ||\n          (this.showChildrenOfMatchingParent && matchingParent)\n        ) {\n          return newItem;\n        }\n\n        return null;\n      })\n      .filter((item) => item !== null) as SelectItem[];\n  }\n\n  private getHighlightedText(text: string, search: string): string {\n    const upperText = text.toUpperCase();\n    const upperSearch = search.toUpperCase();\n    const start = upperText.indexOf(upperSearch);\n\n    if (start === -1) {\n      return text;\n    }\n\n    const end = start + search.length;\n\n    return text.substring(0, start) + `<strong>${text.substring(start, end)}</strong>` + text.substring(end);\n  }\n\n  private hasAutocomplete(): boolean {\n    return boolean(this.autocomplete) === true;\n  }\n\n  private handleInputChange(e: CustomEvent): void {\n    this.searchString = e.detail.value;\n    if (!this.isOpen) {\n      this.toggleSelectUl();\n    }\n  }\n\n  private updateSelection(items: SelectItem[], selectedId: string): void {\n    if (items) {\n      items.forEach((item) => {\n        item.selected = item.id === selectedId;\n        if (item.children && item.children.length > 0) {\n          this.updateSelection(item.children, selectedId);\n        }\n      });\n    }\n  }\n\n  private findSelectedItem(items: SelectItem[]): SelectItem | null {\n    if (items) {\n      for (const item of items) {\n        if (item.selected) {\n          return item;\n        }\n        if (item.children && item.children.length > 0) {\n          const found = this.findSelectedItem(item.children);\n          if (found) {\n            return found;\n          }\n        }\n      }\n    }\n\n    return null;\n  }\n\n  private selectItem(selected: null | SelectItem): void {\n    if (selected?.disabled) {\n      return;\n    }\n\n    this.itemsList = this.getInitialItemsArray();\n\n    if (selected) {\n      this.updateSelection(this.itemsList, selected.id);\n    }\n\n    this.selectedItem = this.findSelectedItem(this.itemsList);\n    this.emitOptionSelect();\n    this.toggleSelectUl();\n    if (this.searchString) {\n      this.searchString = null;\n    }\n  }\n\n  private handleResetClick(): void {\n    this.selectedItem = null;\n    this.searchString = null;\n    this.focusedItemId = \"\";\n    this.emitResetSelect();\n    this.toggleSelectUl();\n  }\n\n  private handleInputKeyDown(e: KeyboardEvent): void {\n    switch (e.code as KeyboardCode) {\n      case KeyboardCode.ENTER:\n      case KeyboardCode.SPACE:\n        if (this.focusedItemId) {\n          if (this.focusedItemId === this.getResetOptionId()) {\n            this.handleResetClick();\n          } else {\n            const item = this.itemsList.find((e) => this.getOptionId(e) === this.focusedItemId) || null;\n            if (item) {\n              this.selectedItem = item;\n              this.emitOptionSelect();\n              this.toggleSelectUl();\n            }\n          }\n        }\n        break;\n      case KeyboardCode.ARROW_DOWN:\n      case KeyboardCode.ARROW_UP:\n        this.arrowsSelectNav(e);\n        break;\n    }\n  }\n\n  private arrowsSelectNav(e: KeyboardEvent): void {\n    const arrows = [KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP];\n\n    if (!arrows.includes(e.key as KeyboardCode)) {\n      return;\n    }\n\n    e.preventDefault();\n    e.stopPropagation();\n\n    const currElem = this.focusedItemId ? this.host.querySelector(`#${this.focusedItemId}`) : null;\n    const options = Array.from(this.host.querySelectorAll('[role=\"option\"]'));\n\n    if (!options.length) {\n      return;\n    }\n\n    const currElemIndex = currElem ? options.indexOf(currElem) : null;\n    const firstElemIndex = 0;\n    const lastElemIndex = options.length - 1;\n\n    if (!this.isOpen) {\n      this.toggleSelectUl();\n\n      if (this.selectedItem) {\n        this.focusSelectItem(this.getOptionId(this.selectedItem));\n\n        return;\n      }\n    }\n\n    let nextElem = null;\n    if (e.code === KeyboardCode.ARROW_DOWN) {\n      nextElem =\n        currElemIndex === null ? options[firstElemIndex] : options[currElemIndex + 1] || options[lastElemIndex];\n    } else if (e.code === KeyboardCode.ARROW_UP) {\n      nextElem =\n        currElemIndex === null ? options[lastElemIndex] : options[currElemIndex - 1] || options[firstElemIndex];\n    }\n\n    this.focusSelectItem(nextElem.id);\n  }\n\n  private focusSelectItem(optionId: string): void {\n    this.focusedItemId = optionId;\n    const elem = this.host.querySelector(`#${optionId}`);\n    // @ts-expect-error 'container' does not exist in type 'ScrollIntoViewOptions'\n    elem.scrollIntoView({block: \"nearest\", container: \"nearest\"});\n  }\n\n  private toggleSelectUl(selfFocusOnClose = false): void {\n    if (this.disabled || this.readonly) {\n      return;\n    }\n\n    if (!this.isOpen) {\n      document.addEventListener(\"click\", this.handleSelectFocus);\n      document.addEventListener(\"keyup\", this.handleSelectFocus);\n    } else {\n      document.removeEventListener(\"click\", this.handleSelectFocus);\n      document.removeEventListener(\"keyup\", this.handleSelectFocus);\n      if (selfFocusOnClose) {\n        (this.host.querySelector(`#${this.htmlid}_select_input`) as HTMLInputElement)?.focus();\n      }\n\n      if (this.selectedItem && this.searchString) {\n        this.searchString = null;\n        this.filterItems(this.searchString);\n      }\n    }\n\n    this.focusedItemId = \"\";\n    this.isOpen = !this.isOpen;\n  }\n\n  private handleInputClick(e: MouseEvent | KeyboardEvent): void {\n    if ((e.target as HTMLElement).closest(\".reset-icon\")) {\n      e.stopPropagation();\n\n      return;\n    }\n\n    this.toggleSelectUl();\n  }\n\n  private handleSelectFocus(e: MouseEvent | KeyboardEvent): void {\n    if (e instanceof KeyboardEvent && e.key === KeyboardCode.ESC) {\n      e.stopPropagation();\n\n      return this.toggleSelectUl(true);\n    }\n\n    if (e instanceof KeyboardEvent && e.key !== KeyboardCode.TAB) {\n      return;\n    }\n\n    const clickedElement = getClickedElement();\n    if (clickedElement?.hasAttribute(\"disabled\")) {\n      return;\n    }\n\n    if (\n      !getElementTree(clickedElement).find(\n        (elem: HTMLElement) => elem.nodeName.toLowerCase() === \"z-input\" && elem.id === `${this.htmlid}_input`\n      )\n    ) {\n      const zSelect = getElementTree(clickedElement).find((e) => e.nodeName === \"Z-SELECT\");\n      this.toggleSelectUl(zSelect === this.host);\n    }\n  }\n\n  private scrollToLetter(letter: string): void {\n    if (!this.itemsList.length) {\n      return;\n    }\n\n    const foundItem = this.itemsList.find(\n      (item: SelectItem) => item.name.toLowerCase().charAt(0) === letter.toLowerCase()\n    );\n    if (foundItem) {\n      if (!this.isOpen) {\n        this.toggleSelectUl();\n      }\n      this.focusSelectItem(this.getOptionId(foundItem));\n    }\n  }\n\n  private renderInput(): HTMLElement[] {\n    let value = null;\n    if (this.selectedItem) {\n      value = getPlainText(this.selectedItem.name);\n    }\n    if (this.isOpen && this.searchString !== undefined) {\n      value = this.searchString;\n    }\n\n    return [\n      <z-input\n        class={{\n          \"active-select\": this.isOpen,\n          \"cursor-select\": !this.autocomplete,\n        }}\n        id={`${this.htmlid}_input`}\n        htmlid={`${this.htmlid}_select_input`}\n        placeholder={this.placeholder}\n        value={value}\n        label={this.label}\n        autocomplete=\"off\"\n        aria-label={this.ariaLabel}\n        icon={this.isOpen ? \"caret-up\" : \"caret-down\"}\n        hasclearicon={false}\n        message={false}\n        name={this.name}\n        disabled={this.disabled}\n        readonly={this.readonly || (!this.hasAutocomplete() && this.isOpen)}\n        required={this.required}\n        status={this.isOpen ? undefined : this.status}\n        size={this.size}\n        role=\"combobox\"\n        html-aria-expanded={this.isOpen ? \"true\" : \"false\"}\n        html-aria-controls={`${this.htmlid}_list`}\n        html-aria-activedescendant={this.isOpen ? this.focusedItemId : \"\"}\n        html-aria-autocomplete={this.hasAutocomplete() ? \"list\" : undefined}\n        onClick={(e: MouseEvent) => this.handleInputClick(e)}\n        onKeyDown={(e: KeyboardEvent) => this.handleInputKeyDown(e)}\n        onInputChange={(e: CustomEvent) => this.handleInputChange(e)}\n        onKeyPress={(e: KeyboardEvent) => {\n          if (!this.hasAutocomplete()) {\n            e.preventDefault();\n            this.scrollToLetter(e.key);\n          }\n        }}\n      />,\n    ];\n  }\n\n  private renderSelectUl(): HTMLDivElement {\n    return (\n      <div class={this.isOpen ? \"open\" : \"closed\"}>\n        <div\n          class={{\n            \"ul-scroll-wrapper\": true,\n            \"fixed\": this.isfixed,\n          }}\n        >\n          <z-list\n            role=\"listbox\"\n            aria-label={this.ariaLabel || this.label}\n            tabindex={this.disabled || this.readonly || !this.isOpen ? -1 : 0}\n            id={`${this.htmlid}_list`}\n            aria-multiselectable={false}\n            size={this.listSizeType()}\n            class={{\n              \"disabled\": this.disabled,\n              \"readonly\": this.readonly,\n              [`input-${this.status}`]: !this.isOpen && !!this.status,\n              \"z-scrollbar\": true,\n            }}\n          >\n            {this.resetItem && this.renderResetItem()}\n            {this.renderSelectUlItems()}\n          </z-list>\n        </div>\n      </div>\n    );\n  }\n\n  private renderResetItem(): HTMLZListElementElement {\n    const hidden = !this.selectedItem || !this.resetItem;\n\n    return (\n      <z-list-element\n        class={{\n          \"hide\": hidden,\n          \"reset-item\": true,\n          \"reset-item-margin\": !this.hasGroupItems,\n        }}\n        clickable={true}\n        disabled={false}\n        dividerType={ListDividerType.ELEMENT}\n        role={hidden ? \"presentation\" : \"option\"}\n        htmlTabindex={this.isOpen ? 0 : null}\n        aria-selected=\"false\"\n        aria-label={hidden ? undefined : this.resetItem}\n        id={this.getResetOptionId()}\n        size={this.hasTreeItems ? ListSize.MEDIUM : this.listSizeType()}\n        onClickItem={() => this.handleResetClick()}\n      >\n        <div\n          class={{\n            \"reset-item-content\": true,\n            \"tree-list-reset-item\": this.hasTreeItems,\n            \"active\": this.focusedItemId === this.getResetOptionId(),\n          }}\n          aria-hidden=\"true\"\n        >\n          <z-icon name=\"multiply-circled\" />\n          <span>{this.resetItem}</span>\n        </div>\n      </z-list-element>\n    );\n  }\n\n  private renderItem(item: SelectItem, lastItem: boolean): HTMLZListElementElement {\n    return (\n      <z-list-element\n        clickable={!item.disabled}\n        disabled={item.disabled}\n        dividerType={lastItem ? ListDividerType.HEADER : ListDividerType.ELEMENT}\n        role={item.disabled ? \"presentation\" : \"option\"}\n        htmlTabindex={-1}\n        aria-selected={item.selected ? \"true\" : \"false\"}\n        aria-label={item.disabled ? undefined : getPlainText(item.name)}\n        id={this.getOptionId(item)}\n        size={this.listSizeType()}\n        onClickItem={() => this.selectItem(item)}\n      >\n        <div\n          class={{\n            \"list-element-container\": true,\n            \"active\": this.focusedItemId === this.getOptionId(item),\n          }}\n          aria-hidden=\"true\"\n        >\n          <div\n            class={{\n              \"selected\": !!item.selected,\n              \"list-element-content\": true,\n            }}\n            innerHTML={item.name}\n          />\n          {item.icon && <z-tag icon={item.icon}></z-tag>}\n        </div>\n      </z-list-element>\n    );\n  }\n\n  private listSizeType(): ListSize {\n    if (this.hasTreeItems) {\n      return ListSize.NONE;\n    }\n\n    if (this.size === ControlSize.SMALL || this.size === ControlSize.X_SMALL) {\n      return ListSize.SMALL;\n    }\n\n    return ListSize.MEDIUM;\n  }\n\n  private renderSelectUlItems():\n    | HTMLZListElementElement\n    | (HTMLZListElementElement | HTMLZListElementElement[])[]\n    | HTMLZListGroupElement[] {\n    if (!this.itemsList.length) {\n      return this.renderNoSearchResults();\n    }\n\n    if (this.hasGroupItems) {\n      if (this.hasTreeItems) {\n        return this.renderGroupedTree();\n      }\n\n      return this.renderSelectGroupItems();\n    }\n\n    return this.itemsList.map((item: SelectItem, index, array) => {\n      const isLastItem = index === array.length - 1;\n      const parentHasSiblings = array.length > 1;\n\n      if (this.hasTreeItems) {\n        return this.renderTreeItems(item, isLastItem, parentHasSiblings, true, item.disabled);\n      }\n\n      return this.renderItem(item, isLastItem);\n    });\n  }\n\n  private renderTreeItems(\n    item: SelectItem,\n    isLastChild: boolean,\n    parentHasSiblings: boolean,\n    isTopLevel?: boolean,\n    disabledAncestor?: boolean\n  ): HTMLZListElementElement[] {\n    const isDisabled = item.disabled || disabledAncestor;\n\n    const hasDivider = this.hasGroupItems\n      ? undefined\n      : this.hasGroupItems\n        ? isLastChild && !parentHasSiblings\n          ? ListDividerType.ELEMENT\n          : undefined\n        : isTopLevel && parentHasSiblings && !isLastChild\n          ? ListDividerType.ELEMENT\n          : undefined;\n\n    return (\n      <z-list-element\n        clickable={!item.disabled}\n        disabled={isDisabled}\n        class={{\n          \"grouped-tree-parent-node\": this.hasGroupItems && !!item.children?.length,\n          \"tree-search-item\": this.hasGroupItems && isTopLevel && !item.children?.length && !!this.searchString,\n        }}\n        size={this.listSizeType()}\n        dividerType={hasDivider}\n        hasTreeItems={this.hasTreeItems}\n        htmlTabindex={null}\n        role=\"presentation\"\n      >\n        <div\n          id={this.getOptionId(item)}\n          role={isDisabled ? \"presentation\" : \"option\"}\n          aria-label={isDisabled ? undefined : getPlainText(item.name)}\n          class={{\"list-element\": true, \"active\": this.focusedItemId === this.getOptionId(item)}}\n          onClick={() => this.selectItem(item)}\n        >\n          <span\n            class=\"item ellipsis\"\n            aria-hidden=\"true\"\n          >\n            <span\n              class={{\n                \"item-label\": true,\n                \"selected\": !!item.selected,\n              }}\n              title={item.name}\n              innerHTML={item.name}\n            />\n          </span>\n          {item.icon && <z-tag icon={item.icon}></z-tag>}\n        </div>\n        {item.children && item.children.length > 0 ? (\n          <z-list role=\"presentation\">\n            <div class=\"children-node\">\n              {item.children.map((child, index, arr) =>\n                this.renderTreeItems(\n                  child,\n                  index === arr.length - 1,\n                  arr.length > 1,\n                  false, // isTopLevel = false for children\n                  isDisabled\n                )\n              )}\n            </div>\n          </z-list>\n        ) : null}\n      </z-list-element>\n    );\n  }\n\n  private renderGroupedTree(): HTMLZListGroupElement[] {\n    const groupedItems = this.getGroupedItems();\n\n    return groupedItems.map(([category, items], index, entries) => {\n      const parentHasSiblings = Object.values(groupedItems).some((groupItems) => groupItems.length > 1);\n\n      return (\n        <z-list-group\n          divider-type={index === entries.length - 1 ? undefined : ListDividerType.ELEMENT}\n          hasTreeItems={true}\n          aria-labelledby={`${this.htmlid}_tree_${index}`}\n        >\n          <span\n            class=\"body-3-sb z-list-group-title\"\n            slot=\"header-title\"\n            id={`${this.htmlid}_tree_${index}`}\n            aria-hidden=\"true\"\n          >\n            {category}\n          </span>\n          <z-list role=\"presentation\">\n            {items.map((item, i, arr) => [\n              this.renderTreeItems(item, i === arr.length - 1, parentHasSiblings, true, item.disabled),\n              i < arr.length - 1 ? (\n                <z-divider\n                  key={`divider-${i}`}\n                  style={{zIndex: \"100\", height: \"var(--border-size-small)\"}}\n                />\n              ) : null,\n            ])}\n          </z-list>\n          {index !== entries.length - 1 && <z-divider style={{zIndex: \"100\", height: \"var(--border-size-small)\"}} />}\n        </z-list-group>\n      );\n    });\n  }\n\n  private renderSelectGroupItems(): HTMLZListElementElement[] {\n    const groupedItems = this.getGroupedItems();\n\n    return groupedItems.map(([key, items], index) => {\n      const isLastGroup = groupedItems.length === index + 1;\n\n      return (\n        <z-list-group\n          divider-type={ListDividerType.ELEMENT}\n          aria-labelledby={`${this.htmlid}_group_${index}`}\n        >\n          <span\n            class=\"body-3-sb z-list-group-title\"\n            slot=\"header-title\"\n            id={`${this.htmlid}_group_${index}`}\n            aria-hidden=\"true\"\n          >\n            {key}\n          </span>\n          {items.map((item, subindex) => {\n            const isLastItem = items.length === subindex + 1;\n\n            return this.renderItem(item, isLastGroup && isLastItem);\n          })}\n        </z-list-group>\n      );\n    });\n  }\n\n  private renderNoSearchResults(): HTMLZListElementElement {\n    return (\n      <z-list-element\n        class=\"no-results\"\n        size={this.hasTreeItems ? ListSize.MEDIUM : this.listSizeType()}\n        htmlTabindex={null}\n        role=\"presentation\"\n      >\n        {this.noresultslabel}\n      </z-list-element>\n    );\n  }\n\n  private renderMessage(): HTMLZInputMessageElement {\n    if (boolean(this.message) === false) {\n      return;\n    }\n\n    return (\n      <z-input-message\n        message={boolean(this.message) === true ? undefined : (this.message as string)}\n        status={this.status}\n        class={this.size}\n        disabled={this.disabled}\n      />\n    );\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div class=\"select-wrapper\">\n        {this.renderInput()}\n        {this.renderSelectUl()}\n        {this.renderMessage()}\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}