npm - @zanichelli/albe-web-components - Versions diffs - 19.2.7 → 19.2.8-RC1 - Mend

@zanichelli/albe-web-components 19.2.7 → 19.2.8-RC1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (121) hide show

package/dist/components/index17.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as t,HTMLElement as e,createEvent as o,h as r,Host as i,transformTag as s}from"@stencil/core/internal/client";import{P as n,g as a,p as h}from"./index2.js";import{a as c,j as p,k as f,g as u,l}from"./utils.js";const d=t(class t extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.positionChange=o(this,"positionChange",7),this.openChange=o(this,"openChange",7),this.position=n.TOP,this.open=!1,this.showArrow=!1,this.center=!1,this.closable=!0,this.spaceTolerance=3}closePopoverWithKeyboard(t){this.closable&&t.key===a.ESC&&(t.stopPropagation(),this.open=!1)}handleOutsideClick(t){const e=t.target;this.closable&&this.open&&!c(this.host,e)&&(c(this.boundElement,e)&&t.stopPropagation(),this.open=!1)}validatePosition(t){Object.values(n).includes(t)&&t!==n.AUTO\|\|(this.position=t=n.TOP),this.currentPosition=t,this.open&&this.setPosition()}onOpen(){if(cancelAnimationFrame(this.animationFrameRequestId),this.openChange.emit({open:this.open}),!this.open)return Object.assign(this.host.style,{top:"auto",right:"auto",bottom:"auto",left:"auto",maxWidth:"",maxHeight:"",visibility:"hidden"}),void(this.currentPosition=void 0);const t=()=>{this.open&&(this.setPosition(),this.animationFrameRequestId=requestAnimationFrame(t))};setTimeout((()=>{t()}),0)}onBindingChange(){this.findBoundElement()}get offsetModifier(){return this.center?.5:0}findBoundElement(){"string"==typeof this.bindTo?this.boundElement=this.host.ownerDocument.querySelector(this.bindTo):this.bindTo?this.boundElement=this.bindTo:(this.boundElement=p(this.host),"z-tooltip"===this.boundElement.tagName.toLowerCase()&&(this.boundElement=p(this.boundElement)))}hasCenteredHorizontalSpace(t,e,o,r){const i=(o-r)(1-this.offsetModifier);return this.center?e>=i-this.spaceTolerance&&t>=i-this.spaceTolerance:e>=i-this.spaceTolerance}hasCenteredVerticalSpace(t,e,o,r){const i=(o-r)(1-this.offsetModifier);return this.center?t>=i-this.spaceTolerance&&e>=i-this.spaceTolerance:e>=i-this.spaceTolerance}hasEnoughSideSpace(t,e,o,r){return t>=e-o(1-r)-this.spaceTolerance}getOptimalPopoverPosition(e,o){const r=this.host.offsetWidth,i=this.host.offsetHeight,s=this.boundElement.getBoundingClientRect().width,a=this.boundElement.getBoundingClientRect().height,h=this.offsetModifier,c=t=>{switch(t){case n.TOP:return o.top>=i-this.spaceTolerance&&this.hasCenteredHorizontalSpace(o.left,o.right,r,s);case n.TOP_RIGHT:return o.top>=i&&this.hasEnoughSideSpace(o.right,r,s,h);case n.TOP_LEFT:return o.top>=i&&this.hasEnoughSideSpace(o.left,r,s,h);case n.RIGHT:return o.right>=r&&this.hasCenteredVerticalSpace(o.top,o.bottom,i,a);case n.RIGHT_BOTTOM:return o.right>=r&&this.hasEnoughSideSpace(o.bottom,i,a,h);case n.RIGHT_TOP:return o.right>=r&&this.hasEnoughSideSpace(o.top,i,a,h);case n.BOTTOM:return o.bottom>=i&&this.hasCenteredHorizontalSpace(o.left,o.right,r,s);case n.BOTTOM_LEFT:return o.bottom>=i&&this.hasEnoughSideSpace(o.left,r,s,h);case n.BOTTOM_RIGHT:return o.bottom>=i&&this.hasEnoughSideSpace(o.right,r,s,h);case n.LEFT:return o.left>=r&&this.hasCenteredVerticalSpace(o.top,o.bottom,i,a);case n.LEFT_TOP:return o.left>=r&&this.hasEnoughSideSpace(o.top,i,a,h);case n.LEFT_BOTTOM:return o.left>=r&&this.hasEnoughSideSpace(o.bottom,i,a,h);default:return!1}};if(c(e))return e;const p=t.positionOrder,f=p.indexOf(e);if(-1===f)return e;for(let t=1;t<p.length;t++){const e=p[(f+t)%p.length];if(c(e))return e}return this.findBestFallbackPosition(o)}findBestFallbackPosition(t){const e=t.right>=t.left?n.RIGHT:n.LEFT,o=t.bottom>=t.top?n.BOTTOM:n.TOP,r=Math.max(t.right,t.left),i=Math.max(t.bottom,t.top),s=i>=r?o:e;let a=!1;return a=s===o?r>=2Math.min(t.right,t.left):i>=2Math.min(t.bottom,t.top),a?`${s}_${s===o?e:o}`:s}findScrollableAncestor(t){let e=p(t);for(;e;){if(e===t.ownerDocument.documentElement)return e;const o=getComputedStyle(e),{overflow:r,overflowX:i,overflowY:s}=o;if("hidden"!==r&&"hidden"!==s&&"hidden"!==i&&(e.scrollHeight>e.clientHeight&&"visible"!==r&&"visible"!==s\|\|e.scrollWidth>e.clientWidth&&"visible"!==r&&"visible"!==i))return e;e=p(e)}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 e=this.findScrollableAncestor(this.boundElement),o=e.getBoundingClientRect(),r=e!==this.boundElement.ownerDocument.documentElement,i=this.boundElement.ownerDocument.documentElement.clientWidth,s=this.boundElement.ownerDocument.documentElement.clientHeight;return this.cachedAvailableSpace={top:t.top-(r?o.top:0)-8,right:i-t.right-(r?i-o.right:0)-8,bottom:s-t.bottom-(r?s-o.bottom:0)-8,left:t.left-(r?o.left:0)-8},this.cachedAvailableSpace}getBoundElementOffsets(){const t=this.boundElement.getBoundingClientRect();return{top:t.top,right:this.boundElement.ownerDocument.documentElement.clientWidth-t.right,bottom:this.boundElement.ownerDocument.documentElement.clientHeight-t.bottom,left:t.left}}computePositionOffsets(){const t=this.getBoundElementOffsets(),e=f(this.host);if(e===this.host.ownerDocument.documentElement)return t;const o=e.getBoundingClientRect(),r=getComputedStyle(e),i=o.top+parseFloat(r.borderTopWidth),s=o.right-parseFloat(r.borderRightWidth),n=o.bottom-parseFloat(r.borderBottomWidth),a=o.left+parseFloat(r.borderLeftWidth),h=this.boundElement.getBoundingClientRect();return{top:h.top-i+e.scrollTop,right:s-h.right-e.scrollLeft,bottom:n-h.bottom-e.scrollTop,left:h.left-a+e.scrollLeft}}applyPositionStyles(t,e){const o=this.boundElement.offsetWidth,r=this.boundElement.offsetHeight,i=this.offsetModifier,s=this.showArrow&&this.center?8:0,a=this.host.style,c=parseFloat(getComputedStyle(this.host).marginTop.replace("px",""))\|\|0,p=this.computePositionOffsets(),f=p.left+oi,l=p.right+oi,d=p.top+r,b=p.bottom+r,m=p.top+ri,g=p.bottom+ri;let v,w;switch(t){case n.TOP:case n.TOP_RIGHT:a.bottom=`${b}px`,a.left=f-(t===n.TOP_RIGHT?s:0)+"px",w=e.top-c,t===n.TOP_RIGHT&&(v=e.right+oi);break;case n.TOP_LEFT:a.right=l-s+"px",a.bottom=`${b}px`,v=e.left+oi,w=e.top-c;break;case n.BOTTOM:case n.BOTTOM_RIGHT:a.top=`${d}px`,a.left=f-(t===n.BOTTOM_RIGHT?s:0)+"px",w=e.bottom-c,t===n.BOTTOM_RIGHT&&(v=e.right+oi);break;case n.BOTTOM_LEFT:a.top=`${d}px`,a.right=l-s+"px",v=e.left+oi,w=e.bottom-c;break;case n.RIGHT:case n.RIGHT_BOTTOM:a.top=m-(t===n.RIGHT_BOTTOM?s:0)+"px",a.left=`${p.left+o}px`,v=e.right-c,w=t===n.RIGHT?e.top+e.bottom+r:e.bottom+ri;break;case n.RIGHT_TOP:a.bottom=g-s+"px",a.left=`${p.left+o}px`,v=e.right-c,w=e.top+ri;break;case n.LEFT:case n.LEFT_BOTTOM:a.top=m-(t===n.LEFT_BOTTOM?s:0)+"px",a.right=`${p.right+o}px`,v=e.left-c,t===n.LEFT_BOTTOM&&(w=e.bottom+ri);break;case n.LEFT_TOP:a.right=`${p.right+o}px`,a.bottom=g-s+"px",v=e.left-c,w=e.top+ri}u()!==h.MOBILE&&Object.assign(a,{maxWidth:v?`${v}px`:"",maxHeight:w?`${w}px`:""})}setPosition(){if(!this.boundElement)return;if(!l(this.boundElement,this.findScrollableAncestor(this.boundElement)))return void(this.open=!1);Object.assign(this.host.style,{top:"auto",right:"auto",bottom:"auto",left:"auto",maxWidth:"",maxHeight:"",visibility:"hidden"});const t=this.calculateAvailableSpace(),e=this.getOptimalPopoverPosition(this.position,t);this.applyPositionStyles(e,t),this.currentPosition=e,this.positionChange.emit({position:this.currentPosition}),this.host.style.visibility="visible"}componentWillLoad(){this.validatePosition(this.position)}componentDidLoad(){this.findBoundElement(),this.open&&this.onOpen()}disconnectedCallback(){cancelAnimationFrame(this.animationFrameRequestId)}render(){return r(i,{key:"11ab6b060fdc4a10752881c38d3a369f2ae267a6","current-position":this.currentPosition},r("slot",{key:"40ae4b9e51638e5d92d916937ccfac5f85c0d36f"}))}get host(){return this}static get watchers(){return{position:[{validatePosition:0}],open:[{onOpen:0}],bindTo:[{onBindingChange:0}]}}static get style(){return':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}'}},[257,"z-popover",{position:[1537],open:[1540],bindTo:[1,"bind-to"],showArrow:[516,"show-arrow"],center:[516],closable:[4],currentPosition:[32]},[[10,"keyup","closePopoverWithKeyboard"],[18,"click","handleOutsideClick"]],{position:[{validatePosition:0}],open:[{onOpen:0}],bindTo:[{onBindingChange:0}]}]);function b(){"undefined"!=typeof customElements&&["z-popover"].forEach((t=>{"z-popover"===t&&(customElements.get(s(t))\|\|customElements.define(s(t),d))}))}d.positionOrder=[n.TOP,n.TOP_RIGHT,n.TOP_LEFT,n.RIGHT,n.RIGHT_BOTTOM,n.RIGHT_TOP,n.BOTTOM,n.BOTTOM_LEFT,n.BOTTOM_RIGHT,n.LEFT,n.LEFT_TOP,n.LEFT_BOTTOM];export{d as Z,b as d}
1	+ import{proxyCustomElement as t,HTMLElement as e,createEvent as o,h as r,Host as i,transformTag as s}from"@stencil/core/internal/client";import{P as n,g as a,p as h}from"./index2.js";import{a as c,k as p,l as f,g as u,m as l}from"./utils.js";const d=t(class t extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.positionChange=o(this,"positionChange",7),this.openChange=o(this,"openChange",7),this.position=n.TOP,this.open=!1,this.showArrow=!1,this.center=!1,this.closable=!0,this.spaceTolerance=3}closePopoverWithKeyboard(t){this.closable&&t.key===a.ESC&&(t.stopPropagation(),this.open=!1)}handleOutsideClick(t){const e=t.target;this.closable&&this.open&&!c(this.host,e)&&(c(this.boundElement,e)&&t.stopPropagation(),this.open=!1)}validatePosition(t){Object.values(n).includes(t)&&t!==n.AUTO\|\|(this.position=t=n.TOP),this.currentPosition=t,this.open&&this.setPosition()}onOpen(){if(cancelAnimationFrame(this.animationFrameRequestId),this.openChange.emit({open:this.open}),!this.open)return Object.assign(this.host.style,{top:"auto",right:"auto",bottom:"auto",left:"auto",maxWidth:"",maxHeight:"",visibility:"hidden"}),void(this.currentPosition=void 0);const t=()=>{this.open&&(this.setPosition(),this.animationFrameRequestId=requestAnimationFrame(t))};setTimeout((()=>{t()}),0)}onBindingChange(){this.findBoundElement()}get offsetModifier(){return this.center?.5:0}findBoundElement(){"string"==typeof this.bindTo?this.boundElement=this.host.ownerDocument.querySelector(this.bindTo):this.bindTo?this.boundElement=this.bindTo:(this.boundElement=p(this.host),"z-tooltip"===this.boundElement.tagName.toLowerCase()&&(this.boundElement=p(this.boundElement)))}hasCenteredHorizontalSpace(t,e,o,r){const i=(o-r)(1-this.offsetModifier);return this.center?e>=i-this.spaceTolerance&&t>=i-this.spaceTolerance:e>=i-this.spaceTolerance}hasCenteredVerticalSpace(t,e,o,r){const i=(o-r)(1-this.offsetModifier);return this.center?t>=i-this.spaceTolerance&&e>=i-this.spaceTolerance:e>=i-this.spaceTolerance}hasEnoughSideSpace(t,e,o,r){return t>=e-o(1-r)-this.spaceTolerance}getOptimalPopoverPosition(e,o){const r=this.host.offsetWidth,i=this.host.offsetHeight,s=this.boundElement.getBoundingClientRect().width,a=this.boundElement.getBoundingClientRect().height,h=this.offsetModifier,c=t=>{switch(t){case n.TOP:return o.top>=i-this.spaceTolerance&&this.hasCenteredHorizontalSpace(o.left,o.right,r,s);case n.TOP_RIGHT:return o.top>=i&&this.hasEnoughSideSpace(o.right,r,s,h);case n.TOP_LEFT:return o.top>=i&&this.hasEnoughSideSpace(o.left,r,s,h);case n.RIGHT:return o.right>=r&&this.hasCenteredVerticalSpace(o.top,o.bottom,i,a);case n.RIGHT_BOTTOM:return o.right>=r&&this.hasEnoughSideSpace(o.bottom,i,a,h);case n.RIGHT_TOP:return o.right>=r&&this.hasEnoughSideSpace(o.top,i,a,h);case n.BOTTOM:return o.bottom>=i&&this.hasCenteredHorizontalSpace(o.left,o.right,r,s);case n.BOTTOM_LEFT:return o.bottom>=i&&this.hasEnoughSideSpace(o.left,r,s,h);case n.BOTTOM_RIGHT:return o.bottom>=i&&this.hasEnoughSideSpace(o.right,r,s,h);case n.LEFT:return o.left>=r&&this.hasCenteredVerticalSpace(o.top,o.bottom,i,a);case n.LEFT_TOP:return o.left>=r&&this.hasEnoughSideSpace(o.top,i,a,h);case n.LEFT_BOTTOM:return o.left>=r&&this.hasEnoughSideSpace(o.bottom,i,a,h);default:return!1}};if(c(e))return e;const p=t.positionOrder,f=p.indexOf(e);if(-1===f)return e;for(let t=1;t<p.length;t++){const e=p[(f+t)%p.length];if(c(e))return e}return this.findBestFallbackPosition(o)}findBestFallbackPosition(t){const e=t.right>=t.left?n.RIGHT:n.LEFT,o=t.bottom>=t.top?n.BOTTOM:n.TOP,r=Math.max(t.right,t.left),i=Math.max(t.bottom,t.top),s=i>=r?o:e;let a=!1;return a=s===o?r>=2Math.min(t.right,t.left):i>=2Math.min(t.bottom,t.top),a?`${s}_${s===o?e:o}`:s}findScrollableAncestor(t){let e=p(t);for(;e;){if(e===t.ownerDocument.documentElement)return e;const o=getComputedStyle(e),{overflow:r,overflowX:i,overflowY:s}=o;if("hidden"!==r&&"hidden"!==s&&"hidden"!==i&&(e.scrollHeight>e.clientHeight&&"visible"!==r&&"visible"!==s\|\|e.scrollWidth>e.clientWidth&&"visible"!==r&&"visible"!==i))return e;e=p(e)}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 e=this.findScrollableAncestor(this.boundElement),o=e.getBoundingClientRect(),r=e!==this.boundElement.ownerDocument.documentElement,i=this.boundElement.ownerDocument.documentElement.clientWidth,s=this.boundElement.ownerDocument.documentElement.clientHeight;return this.cachedAvailableSpace={top:t.top-(r?o.top:0)-8,right:i-t.right-(r?i-o.right:0)-8,bottom:s-t.bottom-(r?s-o.bottom:0)-8,left:t.left-(r?o.left:0)-8},this.cachedAvailableSpace}getBoundElementOffsets(){const t=this.boundElement.getBoundingClientRect();return{top:t.top,right:this.boundElement.ownerDocument.documentElement.clientWidth-t.right,bottom:this.boundElement.ownerDocument.documentElement.clientHeight-t.bottom,left:t.left}}computePositionOffsets(){const t=this.getBoundElementOffsets(),e=f(this.host);if(e===this.host.ownerDocument.documentElement)return t;const o=e.getBoundingClientRect(),r=getComputedStyle(e),i=o.top+parseFloat(r.borderTopWidth),s=o.right-parseFloat(r.borderRightWidth),n=o.bottom-parseFloat(r.borderBottomWidth),a=o.left+parseFloat(r.borderLeftWidth),h=this.boundElement.getBoundingClientRect();return{top:h.top-i+e.scrollTop,right:s-h.right-e.scrollLeft,bottom:n-h.bottom-e.scrollTop,left:h.left-a+e.scrollLeft}}applyPositionStyles(t,e){const o=this.boundElement.offsetWidth,r=this.boundElement.offsetHeight,i=this.offsetModifier,s=this.showArrow&&this.center?8:0,a=this.host.style,c=parseFloat(getComputedStyle(this.host).marginTop.replace("px",""))\|\|0,p=this.computePositionOffsets(),f=p.left+oi,l=p.right+oi,d=p.top+r,b=p.bottom+r,m=p.top+ri,g=p.bottom+ri;let v,w;switch(t){case n.TOP:case n.TOP_RIGHT:a.bottom=`${b}px`,a.left=f-(t===n.TOP_RIGHT?s:0)+"px",w=e.top-c,t===n.TOP_RIGHT&&(v=e.right+oi);break;case n.TOP_LEFT:a.right=l-s+"px",a.bottom=`${b}px`,v=e.left+oi,w=e.top-c;break;case n.BOTTOM:case n.BOTTOM_RIGHT:a.top=`${d}px`,a.left=f-(t===n.BOTTOM_RIGHT?s:0)+"px",w=e.bottom-c,t===n.BOTTOM_RIGHT&&(v=e.right+oi);break;case n.BOTTOM_LEFT:a.top=`${d}px`,a.right=l-s+"px",v=e.left+oi,w=e.bottom-c;break;case n.RIGHT:case n.RIGHT_BOTTOM:a.top=m-(t===n.RIGHT_BOTTOM?s:0)+"px",a.left=`${p.left+o}px`,v=e.right-c,w=t===n.RIGHT?e.top+e.bottom+r:e.bottom+ri;break;case n.RIGHT_TOP:a.bottom=g-s+"px",a.left=`${p.left+o}px`,v=e.right-c,w=e.top+ri;break;case n.LEFT:case n.LEFT_BOTTOM:a.top=m-(t===n.LEFT_BOTTOM?s:0)+"px",a.right=`${p.right+o}px`,v=e.left-c,t===n.LEFT_BOTTOM&&(w=e.bottom+ri);break;case n.LEFT_TOP:a.right=`${p.right+o}px`,a.bottom=g-s+"px",v=e.left-c,w=e.top+ri}u()!==h.MOBILE&&Object.assign(a,{maxWidth:v?`${v}px`:"",maxHeight:w?`${w}px`:""})}setPosition(){if(!this.boundElement)return;if(!l(this.boundElement,this.findScrollableAncestor(this.boundElement)))return void(this.open=!1);Object.assign(this.host.style,{top:"auto",right:"auto",bottom:"auto",left:"auto",maxWidth:"",maxHeight:"",visibility:"hidden"});const t=this.calculateAvailableSpace(),e=this.getOptimalPopoverPosition(this.position,t);this.applyPositionStyles(e,t),this.currentPosition=e,this.positionChange.emit({position:this.currentPosition}),this.host.style.visibility="visible"}componentWillLoad(){this.validatePosition(this.position)}componentDidLoad(){this.findBoundElement(),this.open&&this.onOpen()}disconnectedCallback(){cancelAnimationFrame(this.animationFrameRequestId)}render(){return r(i,{key:"11ab6b060fdc4a10752881c38d3a369f2ae267a6","current-position":this.currentPosition},r("slot",{key:"40ae4b9e51638e5d92d916937ccfac5f85c0d36f"}))}get host(){return this}static get watchers(){return{position:[{validatePosition:0}],open:[{onOpen:0}],bindTo:[{onBindingChange:0}]}}static get style(){return':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}'}},[257,"z-popover",{position:[1537],open:[1540],bindTo:[1,"bind-to"],showArrow:[516,"show-arrow"],center:[516],closable:[4],currentPosition:[32]},[[10,"keyup","closePopoverWithKeyboard"],[18,"click","handleOutsideClick"]],{position:[{validatePosition:0}],open:[{onOpen:0}],bindTo:[{onBindingChange:0}]}]);function b(){"undefined"!=typeof customElements&&["z-popover"].forEach((t=>{"z-popover"===t&&(customElements.get(s(t))\|\|customElements.define(s(t),d))}))}d.positionOrder=[n.TOP,n.TOP_RIGHT,n.TOP_LEFT,n.RIGHT,n.RIGHT_BOTTOM,n.RIGHT_TOP,n.BOTTOM,n.BOTTOM_LEFT,n.BOTTOM_RIGHT,n.LEFT,n.LEFT_TOP,n.LEFT_BOTTOM];export{d as Z,b as d}

package/dist/components/index7.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as i,HTMLElement as t,createEvent as e,h as s,Fragment as r,Host as n,transformTag as c}from"@stencil/core/internal/client";import{k as a,e as p,I as o,f as u}from"./index2.js";import{r as l,d as h}from"./utils.js";import{d as z}from"./index3.js";import{d}from"./index8.js";const b=i(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.inputChange=e(this,"inputChange",7),this.startTyping=e(this,"startTyping",7),this.stopTyping=e(this,"stopTyping",7),this.inputCheck=e(this,"inputCheck",7),this.inputFocus=e(this,"inputFocus",7),this.inputBlur=e(this,"inputBlur",7),this.htmlid=`id-${l()}`,this.ariaLabel="",this.htmlAriaExpanded="",this.disabled=!1,this.readonly=!1,this.required=!1,this.checked=!1,this.message=!0,this.labelPosition=a.RIGHT,this.role="",this.hasclearicon=!0,this.size=p.BIG,this.isTyping=!1,this.passwordHidden=!0,this.typingtimeout=300}inputCheckListener(i){const t=i.detail;this.type===o.RADIO&&t.type===o.RADIO&&t.name===this.name&&t.id!==this.htmlid&&(this.checked=!1)}async isChecked(){switch(this.type){case o.CHECKBOX:case o.RADIO:return this.checked;default:return console.warn("`isChecked` method is only available for type `checkbox` and `radio`"),!1}}emitInputChange(i){let t;this.isTyping\|\|this.emitStartTyping(),t=this.getValidity(this.type===o.TEXTAREA?"textarea":"input"),this.value=i,this.inputChange.emit({value:i,validity:t}),clearTimeout(this.timer),this.timer=setTimeout((()=>{this.emitStopTyping(this.value,t)}),this.typingtimeout)}emitStartTyping(){this.isTyping=!0,this.startTyping.emit()}emitStopTyping(i,t){this.isTyping=!1,this.stopTyping.emit({value:i,validity:t})}emitInputCheck(i){this.inputCheck.emit({id:this.htmlid,checked:i,type:this.type,name:this.name,value:this.value,validity:this.getValidity("input")})}emitInputFocus(){this.inputFocus.emit({id:this.htmlid})}emitInputBlur(){this.inputBlur.emit({id:this.htmlid})}getValidity(i){return this.hostElement.querySelector(i).validity}getTextAttributes(){return{id:this.htmlid,name:this.name,placeholder:this.placeholder,value:this.value,disabled:this.disabled,readonly:this.readonly,required:this.required,title:this.htmltitle,minlength:this.minlength,maxlength:this.maxlength,class:{[`input-${this.status}`]:!!this.status},autocomplete:this.autocomplete,onInput:i=>this.emitInputChange(i.target.value)}}getNumberAttributes(i){if(i==o.NUMBER)return{min:this.min,max:this.max,step:this.step}}getPatternAttribute(i){if(i==o.PASSWORD\|\|i==o.TEXT\|\|i==o.TEL\|\|i==o.SEARCH\|\|i==o.URL\|\|i==o.EMAIL)return{pattern:this.pattern}}getRoleAttribute(){return this.role?{role:this.role}:{}}inputHasMessage(){return!1!==h(this.message)&&!0!==h(this.message)}getAriaAttrubutes(){const i=this.htmlAriaExpanded?{"aria-expanded":this.htmlAriaExpanded}:{},t=this.htmlAriaControls?{"aria-controls":this.htmlAriaControls}:{},e=this.htmlAriaAutocomplete?{"aria-autocomplete":this.htmlAriaAutocomplete}:{},s=this.htmlAriaActivedescendant?{"aria-activedescendant":this.htmlAriaActivedescendant}:{},r=this.htmlAriaDescribedBy\|\|this.inputHasMessage()?{"aria-describedby":this.htmlAriaDescribedBy\|\|`${this.htmlid}-message`}:{},n=this.status===u.ERROR?{"aria-invalid":"true"}:{};return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},i),t),e),s),r),n)}getFocusBlurAttributes(){return{onFocus:()=>this.emitInputFocus(),onBlur:()=>this.emitInputBlur()}}renderInputText(i=o.TEXT){const t=this.ariaLabel?{"aria-label":this.ariaLabel}:{},e=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},this.getTextAttributes()),this.getNumberAttributes(i)),this.getPatternAttribute(i)),t),this.getRoleAttribute()),this.getAriaAttrubutes()),this.getFocusBlurAttributes());return(this.icon\|\|i===o.PASSWORD)&&Object.assign(e.class,{"has-icon":!0}),this.hasclearicon&&i!=o.NUMBER&&Object.assign(e.class,{"has-clear-icon":!0}),s("div",{class:"text-wrapper"},this.renderLabel(),s("div",null,s("input",Object.assign({type:i!==o.PASSWORD\|\|this.passwordHidden?i:o.TEXT},e,{ref:i=>this.inputRef=i})),this.renderIcons()),this.renderMessage())}renderLabel(){if(this.label)return s("label",{class:"z-label body-5-sb",id:`${this.htmlid}_label`,htmlFor:this.htmlid},this.label)}renderIcons(){return s("span",{class:"icons-wrapper"},this.renderResetIcon(),this.renderIcon())}renderIcon(){return this.type===o.PASSWORD?this.renderShowHidePassword():this.icon?s("z-icon",{name:this.icon,class:{[this.size]:!0,"input-icon":!0}}):void 0}renderResetIcon(){let i=!1;return this.hasclearicon&&this.value&&!this.disabled&&!this.readonly&&this.type!=o.NUMBER\|\|(i=!0),s("button",{type:"button",class:{"reset-icon":!0,"input-icon":!0,hidden:i},"aria-label":"cancella il contenuto dell'input",onClick:()=>{this.inputRef.value="",this.emitInputChange("")}},s("z-icon",{name:"multiply",class:this.size}))}renderShowHidePassword(){return s("button",{type:"button",class:"input-icon toggle-password-icon",disabled:this.disabled,"aria-label":this.passwordHidden?"mostra password":"nascondi password",onClick:()=>this.passwordHidden=!this.passwordHidden},s("z-icon",{name:this.passwordHidden?"view-filled":"view-off-filled",class:this.size}))}renderMessage(){if(!1!==h(this.message))return s("z-input-message",{"html-id":`${this.htmlid}-message`,message:!0===h(this.message)?void 0:this.message,status:this.status,class:this.size,disabled:this.disabled})}renderTextarea(){const i=this.getTextAttributes(),t=this.getAriaAttrubutes();return s(r,null,this.renderLabel(),s("div",{class:Object.assign(Object.assign({},i.class),{"textarea-wrapper":!0,readonly:!!i.readonly})},s("textarea",Object.assign({},i,t,{class:Object.assign(Object.assign({},i.class),{"z-scrollbar":!0}),"aria-label":this.ariaLabel\|\|void 0},this.getRoleAttribute()))),this.renderMessage())}handleCheck(i){this.checked=i.target.checked,this.emitInputCheck(this.checked)}renderCheckbox(){return s("div",{class:"checkbox-wrapper"},s("input",Object.assign({id:this.htmlid,type:"checkbox",name:this.name,checked:this.checked,disabled:this.disabled,readonly:this.readonly,required:this.required,onChange:this.handleCheck.bind(this),value:this.value},this.getRoleAttribute(),this.getFocusBlurAttributes())),s("label",{htmlFor:this.htmlid,class:{"checkbox-label":!0,after:this.labelPosition===a.RIGHT,before:this.labelPosition===a.LEFT}},s("z-icon",{name:this.checked?"checkbox-checked":"checkbox",class:this.size}),this.label&&s("span",{innerHTML:this.label})))}renderRadio(){return s("div",{class:"radio-wrapper"},s("input",Object.assign({id:this.htmlid,type:"radio",name:this.name,checked:this.checked,disabled:this.disabled,readonly:this.readonly,onChange:this.handleCheck.bind(this),value:this.value},this.getRoleAttribute(),this.getFocusBlurAttributes())),s("label",{htmlFor:this.htmlid,class:{"radio-label":!0,after:this.labelPosition===a.RIGHT,before:this.labelPosition===a.LEFT}},s("z-icon",{name:this.checked?"radio-button-checked":"radio-button",class:this.size}),this.label&&s("span",{innerHTML:this.label})))}render(){let i;switch(this.type){case o.TEXTAREA:i=this.renderTextarea();break;case o.CHECKBOX:i=this.renderCheckbox();break;case o.RADIO:i=this.renderRadio();break;default:i=this.renderInputText(this.type)}return s(n,{key:"0b363c20732600ca303b84a78e36bdc710c411e2"},i)}get hostElement(){return this}static get style(){return'.sc-z-input-h{display:inline-block;width:inherit}.sc-z-input-h .sc-z-input{box-sizing:border-box}input.sc-z-input::-ms-clear,input.sc-z-input::-ms-reveal{display:none}input[type="search"].sc-z-input::-webkit-search-decoration,input[type="search"].sc-z-input::-webkit-search-cancel-button,input[type="search"].sc-z-input::-webkit-search-results-button,input[type="search"].sc-z-input::-webkit-search-results-decoration{display:none}input.sc-z-input,textarea.sc-z-input{background:var(--color-form-background);fill:var(--color-form-default-icon);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg);outline:none}input.sc-z-input,.textarea-wrapper.sc-z-input{border:var(--border-size-small) solid var(--color-form-surface04);border-radius:var(--border-radius-small);color:var(--color-form-default-text)}[size="small"].sc-z-input-h input.sc-z-input,[size="small"].sc-z-input-h textarea.sc-z-input,[size="x-small"].sc-z-input-h input.sc-z-input,[size="x-small"].sc-z-input-h textarea.sc-z-input{font-size:var(--font-size-2)}.cursor-select.sc-z-input-h input.sc-z-input{cursor:pointer}input.sc-z-input:not([readonly]):hover,.textarea-wrapper.sc-z-input:not(.readonly):hover{outline:var(--border-size-medium) solid var(--color-surface04);outline-offset:-2px}.sc-z-input-h:not(.active-select) input.sc-z-input:focus:focus-visible,.sc-z-input-h:not([readonly="true"]) .textarea-wrapper.sc-z-input:focus-within{border-color:var(--color-form-active-primary);box-shadow:var(--shadow-focus-primary);color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible:hover,.textarea-wrapper.sc-z-input:not(.readonly):focus-within:hover{outline-color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input{fill:var(--color-form-active-primary)}.active-select.sc-z-input-h input.sc-z-input{border:var(--border-size-small) solid var(--color-form-active-primary)}.cursor-select.sc-z-input-h input.sc-z-input:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}.sc-z-input-h input[readonly].sc-z-input:focus:focus-visible{border-color:var(--color-form-surface03);box-shadow:none}.input-success.sc-z-input{border-color:var(--color-form-success01);background:var(--color-form-inverse-success)}.input-success.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-success.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-success01)}.input-error.sc-z-input{border-color:var(--color-form-hover-error);background:var(--color-form-inverse-error)}.input-error.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-error.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-error)}.input-warning.sc-z-input{border-color:var(--color-form-hover-warning);background:var(--color-form-inverse-warning)}.input-warning.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-warning.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-warning)}.sc-z-input:is(.input-success,.input-error.sc-z-input,.input-warning).sc-z-input:focus:focus-visible{color:var(--color-form-default-text)}.sc-z-input-h:not(.active-select) input[readonly].sc-z-input,.textarea-wrapper.readonly.sc-z-input{border-color:var(--color-form-surface03);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled="false"]) input.sc-z-input,[disabled].sc-z-input-h:not([disabled="false"]) .textarea-wrapper.sc-z-input,[disabled].sc-z-input-h:not([disabled="false"]) z-icon.sc-z-input{border-color:var(--color-form-disabled03);box-shadow:none;color:var(--color-form-disabled-text);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled="false"]) input.sc-z-input:hover{border-width:var(--border-size-small)}input.sc-z-input::placeholder,textarea.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::-webkit-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input:-ms-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}[disabled].sc-z-input-h:not([disabled="false"]) label.z-label.sc-z-input{color:var(--color-disabled03)}.text-wrapper.sc-z-input>div.sc-z-input{position:relative;z-index:1;fill:var(--color-form-default-icon)}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{width:100%;height:calc(var(--space-unit) 5.5);box-sizing:border-box;padding:0 calc(var(--space-unit) * 1.5);margin:0}[size="small"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4.5)}[size="x-small"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.sc-z-input,.text-wrapper.sc-z-input>div.sc-z-input>input.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 5.25)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 8)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input{position:absolute;z-index:2;top:50%;right:calc(var(--space-unit) * 1.5);display:flex;pointer-events:none;transform:translateY(-50%)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input{display:flex;padding:0;border:0;background:none;color:inherit;font:inherit;pointer-events:initial}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input+.input-icon.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.hidden.sc-z-input{display:none}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.reset-icon.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.toggle-password-icon.sc-z-input{cursor:pointer}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input{--z-icon-width:18px;--z-icon-height:18px;display:block}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.small.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.x-small.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:currentcolor}.textarea-wrapper.sc-z-input{width:100%;height:100%;padding:calc(var(--space-unit) * 1.5)}.textarea-wrapper.sc-z-input:not(.input-error,.input-success.sc-z-input,.input-warning).sc-z-input{background-color:var(--color-form-background)}textarea.sc-z-input{width:100%;min-height:132px;padding:0;border:none;margin:0;color:currentcolor;resize:none}.radio-wrapper.sc-z-input,.checkbox-wrapper.sc-z-input{position:relative;display:inline-flex;flex-direction:row;align-items:center;color:var(--color-default-text);fill:var(--color-primary01);font-family:var(--font-family-sans)}.radio-wrapper.sc-z-input:hover,.checkbox-wrapper.sc-z-input:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary-icon)}.radio-wrapper.sc-z-input>input.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input{position:absolute;z-index:-1;opacity:0;pointer-events:none}.radio-wrapper.sc-z-input .radio-label.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{display:inline-flex;align-items:center;margin:0;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1;text-transform:inherit}.radio-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.checkbox-label.sc-z-input{cursor:pointer}.radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{cursor:pointer;fill:inherit}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-2)}[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:14px;--z-icon-height:14px}[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-1)}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input{flex-direction:row}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input{flex-direction:row-reverse}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:var(--space-unit)}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:var(--space-unit)}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:calc(var(--space-unit) * 0.5)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input{border-radius:50%}.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{border-radius:var(--border-radius-small)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{box-shadow:var(--shadow-focus-primary)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input{color:var(--color-disabled03)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input>z-icon.sc-z-input{cursor:default;fill:var(--color-disabled01)}'}},[2,"z-input",{htmlid:[1],type:[1],name:[1],label:[1],ariaLabel:[1,"aria-label"],htmlAriaExpanded:[1,"html-aria-expanded"],htmlAriaControls:[1,"html-aria-controls"],htmlAriaAutocomplete:[1,"html-aria-autocomplete"],htmlAriaActivedescendant:[1,"html-aria-activedescendant"],value:[1025],disabled:[516],readonly:[4],required:[4],checked:[1028],placeholder:[1],htmltitle:[1],status:[1],message:[8],htmlAriaDescribedBy:[1,"html-aria-described-by"],labelPosition:[1,"label-position"],autocomplete:[1],role:[1],hasclearicon:[4],icon:[1],min:[2],minlength:[2],max:[2],maxlength:[2],step:[2],pattern:[1],size:[513],isTyping:[32],passwordHidden:[32],isChecked:[64]},[[4,"inputCheck","inputCheckListener"]]]);function m(){"undefined"!=typeof customElements&&["z-input","z-icon","z-input-message"].forEach((i=>{switch(i){case"z-input":customElements.get(c(i))\|\|customElements.define(c(i),b);break;case"z-icon":customElements.get(c(i))\|\|z();break;case"z-input-message":customElements.get(c(i))\|\|d()}}))}export{b as Z,m as d}
1	+ import{proxyCustomElement as i,HTMLElement as t,createEvent as e,h as s,Fragment as r,Host as n,transformTag as c}from"@stencil/core/internal/client";import{k as a,e as p,I as o,f as u}from"./index2.js";import{r as l,d as h}from"./utils.js";import{d as z}from"./index3.js";import{d}from"./index8.js";const b=i(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.inputChange=e(this,"inputChange",7),this.startTyping=e(this,"startTyping",7),this.stopTyping=e(this,"stopTyping",7),this.inputCheck=e(this,"inputCheck",7),this.inputFocus=e(this,"inputFocus",7),this.inputBlur=e(this,"inputBlur",7),this.htmlid=`id-${l()}`,this.ariaLabel="",this.htmlAriaExpanded="",this.disabled=!1,this.readonly=!1,this.required=!1,this.checked=!1,this.message=!0,this.labelPosition=a.RIGHT,this.role="",this.hasclearicon=!0,this.size=p.BIG,this.isTyping=!1,this.passwordHidden=!0,this.typingtimeout=300}inputCheckListener(i){const t=i.detail;this.type===o.RADIO&&t.type===o.RADIO&&t.name===this.name&&t.id!==this.htmlid&&(this.checked=!1)}async isChecked(){switch(this.type){case o.CHECKBOX:case o.RADIO:return this.checked;default:return console.warn("`isChecked` method is only available for type `checkbox` and `radio`"),!1}}emitInputChange(i){let t;this.isTyping\|\|this.emitStartTyping(),t=this.getValidity(this.type===o.TEXTAREA?"textarea":"input"),this.value=i,this.inputChange.emit({value:i,validity:t}),clearTimeout(this.timer),this.timer=setTimeout((()=>{this.emitStopTyping(this.value,t)}),this.typingtimeout)}emitStartTyping(){this.isTyping=!0,this.startTyping.emit()}emitStopTyping(i,t){this.isTyping=!1,this.stopTyping.emit({value:i,validity:t})}emitInputCheck(i){this.inputCheck.emit({id:this.htmlid,checked:i,type:this.type,name:this.name,value:this.value,validity:this.getValidity("input")})}emitInputFocus(){this.inputFocus.emit({id:this.htmlid})}emitInputBlur(){this.inputBlur.emit({id:this.htmlid})}getValidity(i){return this.hostElement.querySelector(i).validity}getTextAttributes(){return{id:this.htmlid,name:this.name,placeholder:this.placeholder,value:this.value,disabled:this.disabled,readonly:this.readonly,required:this.required,title:this.htmltitle,minlength:this.minlength,maxlength:this.maxlength,class:{[`input-${this.status}`]:!!this.status},autocomplete:this.autocomplete,onInput:i=>this.emitInputChange(i.target.value)}}getNumberAttributes(i){if(i==o.NUMBER)return{min:this.min,max:this.max,step:this.step}}getPatternAttribute(i){if(i==o.PASSWORD\|\|i==o.TEXT\|\|i==o.TEL\|\|i==o.SEARCH\|\|i==o.URL\|\|i==o.EMAIL)return{pattern:this.pattern}}inputHasMessage(){return!1!==h(this.message)&&!0!==h(this.message)}getAriaAttributes(){return Object.assign(Object.assign(Object.assign({},this.role?{role:this.role}:{}),this.htmlAriaDescribedBy?{"aria-describedby":this.htmlAriaDescribedBy}:{}),this.htmlAriaLabelledby?{"aria-labelledby":this.htmlAriaLabelledby}:{})}getTextAriaAttributes(){const i=this.htmlAriaExpanded?{"aria-expanded":this.htmlAriaExpanded}:{},t=this.htmlAriaControls?{"aria-controls":this.htmlAriaControls}:{},e=this.htmlAriaAutocomplete?{"aria-autocomplete":this.htmlAriaAutocomplete}:{},s=this.htmlAriaActivedescendant?{"aria-activedescendant":this.htmlAriaActivedescendant}:{},r=this.htmlAriaDescribedBy\|\|this.inputHasMessage()?{"aria-describedby":this.htmlAriaDescribedBy\|\|`${this.htmlid}-message`}:{},n=this.status===u.ERROR?{"aria-invalid":"true"}:{};return Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},this.getAriaAttributes()),i),t),e),s),r),n)}getFocusBlurAttributes(){return{onFocus:()=>this.emitInputFocus(),onBlur:()=>this.emitInputBlur()}}renderInputText(i=o.TEXT){const t=this.ariaLabel?{"aria-label":this.ariaLabel}:{},e=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},this.getTextAttributes()),this.getNumberAttributes(i)),this.getPatternAttribute(i)),t),this.getTextAriaAttributes()),this.getFocusBlurAttributes());return(this.icon\|\|i===o.PASSWORD)&&Object.assign(e.class,{"has-icon":!0}),this.hasclearicon&&i!=o.NUMBER&&Object.assign(e.class,{"has-clear-icon":!0}),s("div",{class:"text-wrapper"},this.renderLabel(),s("div",null,s("input",Object.assign({type:i!==o.PASSWORD\|\|this.passwordHidden?i:o.TEXT},e,{ref:i=>this.inputRef=i})),this.renderIcons()),this.renderMessage())}renderLabel(){if(this.label)return s("label",{class:"z-label body-5-sb",id:`${this.htmlid}_label`,htmlFor:this.htmlid},this.label)}renderIcons(){return s("span",{class:"icons-wrapper"},this.renderResetIcon(),this.renderIcon())}renderIcon(){return this.type===o.PASSWORD?this.renderShowHidePassword():this.icon?s("z-icon",{name:this.icon,class:{[this.size]:!0,"input-icon":!0}}):void 0}renderResetIcon(){let i=!1;return this.hasclearicon&&this.value&&!this.disabled&&!this.readonly&&this.type!=o.NUMBER\|\|(i=!0),s("button",{type:"button",class:{"reset-icon":!0,"input-icon":!0,hidden:i},"aria-label":"cancella il contenuto dell'input",onClick:()=>{this.inputRef.value="",this.emitInputChange("")}},s("z-icon",{name:"multiply",class:this.size}))}renderShowHidePassword(){return s("button",{type:"button",class:"input-icon toggle-password-icon",disabled:this.disabled,"aria-label":this.passwordHidden?"mostra password":"nascondi password",onClick:()=>this.passwordHidden=!this.passwordHidden},s("z-icon",{name:this.passwordHidden?"view-filled":"view-off-filled",class:this.size}))}renderMessage(){if(!1!==h(this.message))return s("z-input-message",{"html-id":`${this.htmlid}-message`,message:!0===h(this.message)?void 0:this.message,status:this.status,class:this.size,disabled:this.disabled})}renderTextarea(){const i=this.getTextAttributes(),t=this.getTextAriaAttributes();return s(r,null,this.renderLabel(),s("div",{class:Object.assign(Object.assign({},i.class),{"textarea-wrapper":!0,readonly:!!i.readonly})},s("textarea",Object.assign({},i,t,{class:Object.assign(Object.assign({},i.class),{"z-scrollbar":!0}),"aria-label":this.ariaLabel\|\|void 0}))),this.renderMessage())}handleCheck(i){this.checked=i.target.checked,this.emitInputCheck(this.checked)}renderCheckbox(){return s("div",{class:"checkbox-wrapper"},s("input",Object.assign({id:this.htmlid,type:"checkbox",name:this.name,checked:this.checked,disabled:this.disabled,readonly:this.readonly,required:this.required,onChange:this.handleCheck.bind(this),value:this.value},this.getAriaAttributes(),this.getFocusBlurAttributes())),s("label",{htmlFor:this.htmlid,class:{"checkbox-label":!0,after:this.labelPosition===a.RIGHT,before:this.labelPosition===a.LEFT}},s("z-icon",{name:this.checked?"checkbox-checked":"checkbox",class:this.size}),this.label&&s("span",{innerHTML:this.label})))}renderRadio(){return s("div",{class:"radio-wrapper"},s("input",Object.assign({id:this.htmlid,type:"radio",name:this.name,checked:this.checked,disabled:this.disabled,readonly:this.readonly,onChange:this.handleCheck.bind(this),value:this.value},this.getAriaAttributes(),this.getFocusBlurAttributes())),s("label",{htmlFor:this.htmlid,class:{"radio-label":!0,after:this.labelPosition===a.RIGHT,before:this.labelPosition===a.LEFT}},s("z-icon",{name:this.checked?"radio-button-checked":"radio-button",class:this.size}),this.label&&s("span",{innerHTML:this.label})))}render(){let i;switch(this.type){case o.TEXTAREA:i=this.renderTextarea();break;case o.CHECKBOX:i=this.renderCheckbox();break;case o.RADIO:i=this.renderRadio();break;default:i=this.renderInputText(this.type)}return s(n,{key:"dfc768f25706d7b3abd219948f378ca9b733eafa"},i)}get hostElement(){return this}static get style(){return'.sc-z-input-h{display:inline-block;width:inherit}.sc-z-input-h .sc-z-input{box-sizing:border-box}input.sc-z-input::-ms-clear,input.sc-z-input::-ms-reveal{display:none}input[type="search"].sc-z-input::-webkit-search-decoration,input[type="search"].sc-z-input::-webkit-search-cancel-button,input[type="search"].sc-z-input::-webkit-search-results-button,input[type="search"].sc-z-input::-webkit-search-results-decoration{display:none}input.sc-z-input,textarea.sc-z-input{background:var(--color-form-background);fill:var(--color-form-default-icon);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg);outline:none}input.sc-z-input,.textarea-wrapper.sc-z-input{border:var(--border-size-small) solid var(--color-form-surface04);border-radius:var(--border-radius-small);color:var(--color-form-default-text)}[size="small"].sc-z-input-h input.sc-z-input,[size="small"].sc-z-input-h textarea.sc-z-input,[size="x-small"].sc-z-input-h input.sc-z-input,[size="x-small"].sc-z-input-h textarea.sc-z-input{font-size:var(--font-size-2)}.cursor-select.sc-z-input-h input.sc-z-input{cursor:pointer}input.sc-z-input:not([readonly]):hover,.textarea-wrapper.sc-z-input:not(.readonly):hover{outline:var(--border-size-medium) solid var(--color-surface04);outline-offset:-2px}.sc-z-input-h:not(.active-select) input.sc-z-input:focus:focus-visible,.sc-z-input-h:not([readonly="true"]) .textarea-wrapper.sc-z-input:focus-within{border-color:var(--color-form-active-primary);box-shadow:var(--shadow-focus-primary);color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible:hover,.textarea-wrapper.sc-z-input:not(.readonly):focus-within:hover{outline-color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input{fill:var(--color-form-active-primary)}.active-select.sc-z-input-h input.sc-z-input{border:var(--border-size-small) solid var(--color-form-active-primary)}.cursor-select.sc-z-input-h input.sc-z-input:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}.sc-z-input-h input[readonly].sc-z-input:focus:focus-visible{border-color:var(--color-form-surface03);box-shadow:none}.input-success.sc-z-input{border-color:var(--color-form-success01);background:var(--color-form-inverse-success)}.input-success.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-success.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-success01)}.input-error.sc-z-input{border-color:var(--color-form-hover-error);background:var(--color-form-inverse-error)}.input-error.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-error.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-error)}.input-warning.sc-z-input{border-color:var(--color-form-hover-warning);background:var(--color-form-inverse-warning)}.input-warning.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-warning.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-warning)}.sc-z-input:is(.input-success,.input-error.sc-z-input,.input-warning).sc-z-input:focus:focus-visible{color:var(--color-form-default-text)}.sc-z-input-h:not(.active-select) input[readonly].sc-z-input,.textarea-wrapper.readonly.sc-z-input{border-color:var(--color-form-surface03);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled="false"]) input.sc-z-input,[disabled].sc-z-input-h:not([disabled="false"]) .textarea-wrapper.sc-z-input,[disabled].sc-z-input-h:not([disabled="false"]) z-icon.sc-z-input{border-color:var(--color-form-disabled03);box-shadow:none;color:var(--color-form-disabled-text);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled="false"]) input.sc-z-input:hover{border-width:var(--border-size-small)}input.sc-z-input::placeholder,textarea.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::-webkit-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input:-ms-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}[disabled].sc-z-input-h:not([disabled="false"]) label.z-label.sc-z-input{color:var(--color-disabled03)}.text-wrapper.sc-z-input>div.sc-z-input{position:relative;z-index:1;fill:var(--color-form-default-icon)}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{width:100%;height:calc(var(--space-unit) 5.5);box-sizing:border-box;padding:0 calc(var(--space-unit) * 1.5);margin:0}[size="small"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4.5)}[size="x-small"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.sc-z-input,.text-wrapper.sc-z-input>div.sc-z-input>input.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 5.25)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 8)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input{position:absolute;z-index:2;top:50%;right:calc(var(--space-unit) * 1.5);display:flex;pointer-events:none;transform:translateY(-50%)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input{display:flex;padding:0;border:0;background:none;color:inherit;font:inherit;pointer-events:initial}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input+.input-icon.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.hidden.sc-z-input{display:none}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.reset-icon.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.toggle-password-icon.sc-z-input{cursor:pointer}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input{--z-icon-width:18px;--z-icon-height:18px;display:block}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.small.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.x-small.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:currentcolor}.textarea-wrapper.sc-z-input{width:100%;height:100%;padding:calc(var(--space-unit) * 1.5)}.textarea-wrapper.sc-z-input:not(.input-error,.input-success.sc-z-input,.input-warning).sc-z-input{background-color:var(--color-form-background)}textarea.sc-z-input{width:100%;min-height:132px;padding:0;border:none;margin:0;color:currentcolor;resize:none}.radio-wrapper.sc-z-input,.checkbox-wrapper.sc-z-input{position:relative;display:inline-flex;flex-direction:row;align-items:center;color:var(--color-default-text);fill:var(--color-primary01);font-family:var(--font-family-sans)}.radio-wrapper.sc-z-input:hover,.checkbox-wrapper.sc-z-input:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary-icon)}.radio-wrapper.sc-z-input>input.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input{position:absolute;z-index:-1;opacity:0;pointer-events:none}.radio-wrapper.sc-z-input .radio-label.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{display:inline-flex;align-items:center;margin:0;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1;text-transform:inherit}.radio-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.checkbox-label.sc-z-input{cursor:pointer}.radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{cursor:pointer;fill:inherit}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-2)}[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:14px;--z-icon-height:14px}[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-1)}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input{flex-direction:row}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input{flex-direction:row-reverse}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:var(--space-unit)}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:var(--space-unit)}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:calc(var(--space-unit) * 0.5)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input{border-radius:50%}.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{border-radius:var(--border-radius-small)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{box-shadow:var(--shadow-focus-primary)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input{color:var(--color-disabled03)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input>z-icon.sc-z-input{cursor:default;fill:var(--color-disabled01)}'}},[2,"z-input",{htmlid:[1],type:[1],name:[1],label:[1],ariaLabel:[1,"aria-label"],htmlAriaExpanded:[1,"html-aria-expanded"],htmlAriaControls:[1,"html-aria-controls"],htmlAriaAutocomplete:[1,"html-aria-autocomplete"],htmlAriaActivedescendant:[1,"html-aria-activedescendant"],htmlAriaDescribedBy:[1,"html-aria-described-by"],htmlAriaLabelledby:[1,"html-aria-labelledby"],value:[1025],disabled:[516],readonly:[4],required:[4],checked:[1028],placeholder:[1],htmltitle:[1],status:[1],message:[8],labelPosition:[1,"label-position"],autocomplete:[1],role:[1],hasclearicon:[4],icon:[1],min:[2],minlength:[2],max:[2],maxlength:[2],step:[2],pattern:[1],size:[513],isTyping:[32],passwordHidden:[32],isChecked:[64]},[[4,"inputCheck","inputCheckListener"]]]);function f(){"undefined"!=typeof customElements&&["z-input","z-icon","z-input-message"].forEach((i=>{switch(i){case"z-input":customElements.get(c(i))\|\|customElements.define(c(i),b);break;case"z-icon":customElements.get(c(i))\|\|z();break;case"z-input-message":customElements.get(c(i))\|\|d()}}))}export{b as Z,f as d}

package/dist/components/utils.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{p as t,g as n}from"./index2.js";import{B as r}from"./breakpoints.js";function e(t){switch(t){case!0:case"true":case 1:case"1":case"on":case"yes":return!0;case!1:case"false":case 0:case"0":case"off":case"no":return!1;default:return t}}function a(){return Math.random().toString(36).replace("0.","")}function s(t,r,...e){t.code!==n.ENTER&&t.code!==n.SPACE\|\|(t.preventDefault(),r(...e))}function c(t,r,...e){t.code===n.ENTER&&(t.preventDefault(),r(...e))}function o(t=null){return t\|\|(t=document.activeElement),t&&t.shadowRoot&&t.shadowRoot.activeElement?o(t=t.shadowRoot.activeElement):t}function i(t,n=[]){return n.push(t),t.parentElement?i(t=t.parentElement,n):t.parentNode&&t.parentNode.host?i(t=t.parentNode.host,n):n}function u(){switch(!0){case window.innerWidth<=r.MOBILE:return t.MOBILE;case window.innerWidth<=r.TABLET:return t.TABLET;case window.innerWidth<=r.DESKTOP:return t.DESKTOP;default:return t.DESKTOP_WIDE}}function f(t){try{return JSON.parse(t)}catch(t){return!1}}function l(t){const n=Math.ceil(2*31-1)parseFloat(`0.${t}`);let r=Math.ceil(n%1*19);return 0===r&&(r=1),`avatar-C${r.toString().padStart(2,"0")}`}function d(t,n){var r;if(t.contains(n)\|\|(null===(r=t.shadowRoot)\|\|void 0===r?void 0:r.contains(n)))return!0;const e=t=>{if(t===n)return!0;const r=t.shadowRoot;if(!r)return Array.from(t.childNodes).some(e);if(r.contains(n))return!0;const a=Array.from(r.querySelectorAll("slot")).some((t=>t.assignedNodes({flatten:!0}).some((t=>{var r,a;return(null===(a=(r=t).contains)\|\|void 0===a?void 0:a.call(r,n))\|\|e(t)}))));return!!a\|\|Array.from(r.children).some(e)\|\|Array.from(t.childNodes).some(e)};return e(t)}function w(t){return t.assignedSlot?t.assignedSlot:t.parentNode instanceof ShadowRoot?t.parentNode.host:t.parentElement}function h(t,n){const r=t.getBoundingClientRect(),e=r.bottom>0&&r.top<t.ownerDocument.documentElement.clientHeight&&r.right>0&&r.left<t.ownerDocument.documentElement.clientWidth;if(n===t.ownerDocument.documentElement\|\|n===t.ownerDocument.body)return e;const a=n.getBoundingClientRect();return r.bottom>a.top&&r.top<a.bottom&&r.right>a.left&&r.left<a.right&&e}function b(t){let n=w(t);const r=window.getComputedStyle(t).position;for(;n&&n!==t.ownerDocument.documentElement;){const t=window.getComputedStyle(n);switch(r){case"fixed":{const r=["filter","transform","translate","perspective","scale","rotate","backdrop-filter"];if(r.some((n=>"none"!==t.getPropertyValue(n)))\|\|r.some((n=>t.getPropertyValue("will-change").includes(n))))return n;break}case"absolute":if("static"!==t.position)return n;break;case"relative":case"sticky":case"static":{const t=window.getComputedStyle(n).display;if("block"===t\|\|"flex"===t\|\|"grid"===t\|\|"table"===t\|\|"flow-root"===t\|\|"inline-block"===t\|\|"inline-flex"===t\|\|"inline-grid"===t)return n;break}}n=w(n)}return t.ownerDocument.documentElement}const k=t=>(new DOMParser).parseFromString(t,"text/html").body.textContent\|\|"";export{d as a,k as b,l as c,e as d,o as e,i as f,u as g,s as h,f as i,w as j,b as k,h as l,c as m,a as r}
1	+ import{p as t,g as n}from"./index2.js";import{B as r}from"./breakpoints.js";function e(t){switch(t){case!0:case"true":case 1:case"1":case"on":case"yes":return!0;case!1:case"false":case 0:case"0":case"off":case"no":return!1;default:return t}}function a(){return Math.random().toString(36).replace("0.","")}function s(t,r,...e){t.code!==n.ENTER&&t.code!==n.SPACE\|\|(t.preventDefault(),r(...e))}function c(t,r,...e){t.code===n.ENTER&&(t.preventDefault(),r(...e))}function o(t=null){return t\|\|(t=document.activeElement),t&&t.shadowRoot&&t.shadowRoot.activeElement?o(t=t.shadowRoot.activeElement):t}function i(t,n=[]){return n.push(t),t.parentElement?i(t=t.parentElement,n):t.parentNode&&t.parentNode.host?i(t=t.parentNode.host,n):n}function u(){switch(!0){case window.innerWidth<=r.MOBILE:return t.MOBILE;case window.innerWidth<=r.TABLET:return t.TABLET;case window.innerWidth<=r.DESKTOP:return t.DESKTOP;default:return t.DESKTOP_WIDE}}function f(t){try{return JSON.parse(t)}catch(t){return!1}}function l(t){const n=Math.ceil(2*31-1)parseFloat(`0.${t}`);let r=Math.ceil(n%1*19);return 0===r&&(r=1),`avatar-C${r.toString().padStart(2,"0")}`}function d(t,n){var r;if(t.contains(n)\|\|(null===(r=t.shadowRoot)\|\|void 0===r?void 0:r.contains(n)))return!0;const e=t=>{if(t===n)return!0;const r=t.shadowRoot;if(!r)return Array.from(t.childNodes).some(e);if(r.contains(n))return!0;const a=Array.from(r.querySelectorAll("slot")).some((t=>t.assignedNodes({flatten:!0}).some((t=>{var r,a;return(null===(a=(r=t).contains)\|\|void 0===a?void 0:a.call(r,n))\|\|e(t)}))));return!!a\|\|Array.from(r.children).some(e)\|\|Array.from(t.childNodes).some(e)};return e(t)}function w(t){return t.assignedSlot?t.assignedSlot:t.parentNode instanceof ShadowRoot?t.parentNode.host:t.parentElement}function h(t,n){const r=t.getBoundingClientRect(),e=r.bottom>0&&r.top<t.ownerDocument.documentElement.clientHeight&&r.right>0&&r.left<t.ownerDocument.documentElement.clientWidth;if(n===t.ownerDocument.documentElement\|\|n===t.ownerDocument.body)return e;const a=n.getBoundingClientRect();return r.bottom>a.top&&r.top<a.bottom&&r.right>a.left&&r.left<a.right&&e}function b(t){let n=w(t);const r=window.getComputedStyle(t).position;for(;n&&n!==t.ownerDocument.documentElement;){const t=window.getComputedStyle(n);switch(r){case"fixed":{const r=["filter","transform","translate","perspective","scale","rotate","backdrop-filter"];if(r.some((n=>"none"!==t.getPropertyValue(n)))\|\|r.some((n=>t.getPropertyValue("will-change").includes(n))))return n;break}case"absolute":if("static"!==t.position)return n;break;case"relative":case"sticky":case"static":{const t=window.getComputedStyle(n).display;if("block"===t\|\|"flex"===t\|\|"grid"===t\|\|"table"===t\|\|"flow-root"===t\|\|"inline-block"===t\|\|"inline-flex"===t\|\|"inline-grid"===t)return n;break}}n=w(n)}return t.ownerDocument.documentElement}const k=t=>(new DOMParser).parseFromString(t,"text/html").body.textContent\|\|"",p=t=>t.split("").map((t=>t.charCodeAt(0).toString(16))).join("");export{d as a,k as b,l as c,e as d,p as e,o as f,u as g,s as h,i,f as j,w as k,b as l,h as m,c as n,a as r}

package/dist/components/z-app-header.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as t,HTMLElement as e,h as i,Fragment as a,createEvent as s,Host as n,transformTag as o}from"@stencil/core/internal/client";import{g as r,e as l,B as c,u as h,O as d}from"./index2.js";import{B as u}from"./breakpoints.js";import{a as p}from"./utils.js";import{d as g}from"./index5.js";import{d as m}from"./index6.js";import{d as f}from"./index3.js";import{d as v}from"./index7.js";import{d as b}from"./index8.js";import{d as w}from"./index9.js";import{d as x}from"./index10.js";import{d as z}from"./index11.js";import{d as k}from"./index12.js";import{d as y}from"./index13.js";import{d as C}from"./index14.js";const M="undefined"!=typeof IntersectionObserver,E=t(class extends e{onStuck(){this.scrollParent&&this.sticking.emit(this._stuck)}setMenuFloatingMode(){0!==this.menuElements.length&&this.menuElements.forEach((t=>{t.open=!1,t.verticalContext=this.drawerOpen}))}onStuckChange(){var t,e;this.container&&(this.stuck?null===(t=this.stuckIntersecObserver)\|\|void 0===t\|\|t.observe(this.container):(this._stuck=!1,null===(e=this.stuckIntersecObserver)\|\|void 0===e\|\|e.unobserve(this.container)))}get title(){var t;return null===(t=this.hostElement.querySelector('[slot="title"]'))\|\|void 0===t?void 0:t.textContent.trim()}get scrollParent(){const t=this.hostElement.offsetParent;return t===document.body\|\|t===document.documentElement?window:t}get canShowMenu(){return!this.enableOffcanvas&&this.menuElements.length>0&&!this.isMobile&&!this.drawerOpen}get focusableMenu(){return this.menuElements.find((t=>0===t.htmlTabindex))}openDrawer(){this.drawerOpen=!0,this.menuElements.forEach(((t,e)=>t.htmlTabindex=0===e?0:-1)),setTimeout((()=>this.menuElements[0].setFocus()),400)}closeDrawer(){this.drawerOpen=!1,setTimeout((()=>this.burgerButton.focus()),100)}collectMenuElements(){this.menuElements=Array.from(this.hostElement.querySelectorAll('[slot="menu"]')),this.menuElements.forEach(((t,e)=>t.htmlTabindex=0===e?0:-1)),this.menuLength=this.menuElements.length,this.enableOffcanvas\|\|(this.menuWidth=this.menuElements.reduce(((t,e)=>t+e.getBoundingClientRect().width),0)+32(this.menuLength-1)),this.setMenuFloatingMode()}setupMenuResizeObserver(){this.enableOffcanvas\|\|(this.menuResizeObserver=new ResizeObserver((t=>{if(this.isMobile)return void(this.enableOffcanvas=!0);const e=t[0].contentBoxSize[0].inlineSize;0!==this.menuWidth&&(this.menuWidth>e&&!this.enableOffcanvas?this.enableOffcanvas=!0:this.menuWidth<=e&&this.enableOffcanvas&&(this.enableOffcanvas=!1))})),this.menuResizeObserver.observe(this.container))}hasSlot(t){return null!==this.hostElement.querySelector(`[slot="${t}"]`)}moveFocus(t,e){t.htmlTabindex=-1,e.setFocus()}onOffcanvasKeydown(t){var e,i;if(t.key!==r.TAB\|\|!this.drawerOpen)return;const a=t.target.closest("z-menu");a?(t.preventDefault(),t.stopPropagation(),a.htmlTabindex=0,this.closeDrawerButton.focus()):t.target===this.closeDrawerButton&&(t.preventDefault(),t.stopPropagation(),t.shiftKey?(null!==(e=this.menuElements.filter((t=>t.open)).pop())&&void 0!==e?e:this.menuElements[this.menuLength-1]).setFocus():(null!==(i=this.menuElements.find((t=>t.open)))&&void 0!==i?i:this.menuElements[0]).setFocus())}manageMenus(t){const e=this.menuElements.find((e=>p(e,t.target)));e?this.menuElements.forEach((t=>{t!==e&&(t.htmlTabindex=-1,this.drawerOpen\|\|(t.open=!1))})):this.drawerOpen\|\|this.menuElements.forEach((t=>{t.open=!1}))}handleKeydown(t){var e,i;if(t.key===r.ESC&&this.drawerOpen)return void this.closeDrawer();if(!this.menuElements.some((e=>e.contains(t.target))))return;const a=this.focusableMenu,s=this.menuElements.indexOf(a);let n;return t.key===r.ARROW_RIGHT&&!a.verticalContext\|\|t.key===r.ARROW_DOWN&&a.verticalContext?n=null!==(e=this.menuElements[s+1])&&void 0!==e?e:this.menuElements[0]:(t.key===r.ARROW_LEFT&&!a.verticalContext\|\|t.key===r.ARROW_UP&&a.verticalContext)&&(n=null!==(i=this.menuElements[s-1])&&void 0!==i?i:this.menuElements[this.menuLength-1]),n?t.key===r.ARROW_UP&&a.verticalContext&&n.open?(a.htmlTabindex=-1,void n.focusLastItem()):void this.moveFocus(a,n):void 0}renderSeachbar(){if(!this.isMobile\|\|this.searchPageUrl\|\|!this._stuck)return this.searchPageUrl&&(this.isMobile\|\|this.isTablet)?i("z-button",{class:"search-page-button",variant:c.SECONDARY,href:this.searchPageUrl,icon:"search",size:l.X_SMALL}):i("z-searchbar",{value:this.searchString,placeholder:this.searchPlaceholder,showSearchButton:!0,searchButtonIconOnly:this.isMobile\|\|this.isTablet,size:l.X_SMALL,variant:c.SECONDARY,preventSubmit:this.searchString.length<3,onSearchTyping:t=>this.searchString=t.detail})}renderProductLogos(){return i(a,null,this.enableZLogo&&i("span",{class:"z-logo"},i("img",{alt:"Logo Zanichelli"})),this.hostElement.querySelector("[slot='product-logo']")&&i("span",{class:"product-logo"},i("slot",{name:"product-logo"})))}renderMenuButton(){return this.menuLength>0&&(this.enableOffcanvas\|\|this._stuck\|\|this.isMobile)&&i("button",{ref:t=>this.burgerButton=t,class:"drawer-trigger","aria-label":"Apri menu","aria-haspopup":"menu","aria-expanded":""+this.drawerOpen,"aria-controls":"offcanvas-menu",onClick:this.openDrawer},i("z-icon",{name:"burger-menu"}))}renderOffcanvas(){return i("z-offcanvas",{id:"offcanvas-menu",variant:d.OVERLAY,transitiondirection:h.RIGHT,open:this.drawerOpen,onCanvasOpenStatusChanged:t=>this.drawerOpen=t.detail,onKeyDown:this.onOffcanvasKeydown},i("div",{slot:"canvasContent"},i("button",{ref:t=>this.closeDrawerButton=t,class:"drawer-close","aria-label":"Chiudi menu",onClick:this.closeDrawer,"aria-hidden":""+!this.drawerOpen,disabled:!this.drawerOpen},i("z-icon",{name:"close"})),i("div",{class:"drawer-content","aria-hidden":""+!this.drawerOpen},i("slot",{name:"menu",onSlotchange:this.collectMenuElements}))))}renderStuck(){return i("div",{class:"heading-stuck"},i("div",{class:"heading-stuck-content"},this.renderMenuButton(),i("div",{class:"heading-title"},this.renderProductLogos(),i("div",{class:"stucked-title"},i("slot",{name:"stucked-title"},this.title))),this.enableSearch&&this.renderSeachbar()))}constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.sticking=s(this,"sticking",7),this.stuck=!1,this.enableOffcanvas=!1,this.enableSearch=!1,this.searchPlaceholder="Cerca",this.searchString="",this.enableZLogo=!0,this.drawerOpen=!1,this._stuck=!1,this.isMobile=!0,this.isTablet=!1,this.menuElements=[],this.stuckIntersecObserver=M?new IntersectionObserver((([t])=>{this._stuck=!t.isIntersecting}),{threshold:.5}):void 0,this.openDrawer=this.openDrawer.bind(this),this.closeDrawer=this.closeDrawer.bind(this),this.collectMenuElements=this.collectMenuElements.bind(this),this.onOffcanvasKeydown=this.onOffcanvasKeydown.bind(this)}componentWillLoad(){this.collectMenuElements();const t=window.matchMedia(`(max-width: ${u.MOBILE}px)`);this.isMobile=t.matches,t.addEventListener("change",(t=>this.isMobile=t.matches));const e=window.matchMedia(`(min-width: ${u.MOBILE+1}px) and (max-width: ${u.TABLET}px)`);this.isTablet=e.matches,e.addEventListener("change",(t=>this.isTablet=t.matches))}componentDidLoad(){this.onStuckChange(),this.setupMenuResizeObserver()}disconnectedCallback(){var t;null===(t=this.menuResizeObserver)\|\|void 0===t\|\|t.disconnect()}render(){const t=this.hasSlot("top-subtitle");return i(n,{key:"dc030db81c271ed36850fb287d29ace79851d4a1","menu-length":this.menuLength},i("div",{key:"49d34b66c216a92c80eb9216fa52e48add4cee0a",class:{"heading-panel":!0,"has-menubar":this.menuLength>0&&!this.enableOffcanvas},ref:t=>this.container=t},i("div",{key:"29639ab6d0620491c69651139ddf8311e2177122",class:{"heading-container":!0,"has-top-subtitle":t}},(!this.enableSearch&&this.isMobile\|\|!this.isMobile)&&i("div",{key:"bc685fb828a89777bec6dcc5bc754534f83361cd",class:{"top-subtitle":!0,"has-product-logo":t&&this.hasSlot("product-logo")}},i("slot",{key:"cb2b1468f4b34d11dbf444f2cde0c7cce86cbd1e",name:"top-subtitle"})),i("div",{key:"80036c45fcbd3d490b85f653efb35010b1639b6f",class:"heading-title"},i("slot",{key:"bc4a0397893534c0dac99e081ef0ba5d6db2ecd3",name:"menu-button"},this.renderMenuButton()),!this._stuck&&this.renderProductLogos(),i("slot",{key:"a72c2c657ae430e0cc6b134e843fec1c983e7777",name:"title"}),this.enableSearch&&!this.isMobile&&this.renderSeachbar()),this.enableSearch&&this.isMobile&&this.renderSeachbar()),i("nav",{key:"b620b02b62b99b13e6b4c0c1be0997d3af448aeb",class:"menu-container","aria-label":this.title\|\|void 0},this.canShowMenu&&i("div",{key:"6c1887c703734a0e1ab4b77b821dad2e9bc0c3df",role:"menubar","aria-label":this.title\|\|void 0},i("slot",{key:"2daaf3501852cab84cf2b3a85a770553dc70a101",name:"menu",onSlotchange:this.collectMenuElements})))),this.renderOffcanvas(),this._stuck&&this.renderStuck())}get hostElement(){return this}static get watchers(){return{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}}static get style(){return':host{position:relative;display:block;box-shadow:var(--shadow-2)}:host,{box-sizing:border-box}.heading-panel{--title-line-height:1.333;--title-font-size:var(--font-size-6);position:relative;display:flex;width:100%;max-width:var(--app-header-content-max-width, 100%);flex-direction:column;flex-grow:0;flex-shrink:0;align-items:baseline;padding:calc(var(--space-unit) * 2);margin:0 auto;background:var(--app-header-bg, var(--color-surface01))}: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-panel.has-menubar{padding-bottom:0}.heading-panel .heading-container{flex-direction:column-reverse}:host([enable-search]) .heading-panel .heading-container{flex-direction:column}:host([enable-search][search-page-url]) .heading-panel .heading-container{flex-direction:row}.heading-title{display:flex;width:100%;flex-direction:row;align-items:flex-start}.heading-title:not(:last-child){margin-right:var(--space-unit)}.z-logo,.search-page-button{display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center}.z-logo img{height:24px;margin:0 var(--space-unit) 0 0;content:url(\'data:image/svg+xml,<svg width="61" height="32" viewBox="0 0 61 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.9874 32C7.1595 32 0 24.8349 0 16C0 7.16513 7.1595 0 15.9874 0H45.0126C53.8405 0 61 7.16513 61 16C61 24.8349 53.8405 32 45.0126 32H15.9874Z" fill="%23E2011A"/><path d="M58.5435 15.9992C58.5435 23.4743 52.4892 29.5403 45.0129 29.5403C37.5367 29.5403 31.4824 23.4813 31.4824 15.9992C31.4824 8.51701 37.5367 2.45801 45.0129 2.45801C52.4892 2.45801 58.5435 8.51701 58.5435 15.9992Z" fill="white"/><path d="M40.7107 8.01862H49.8976V11.3158L44.139 21.7077H50.0384V24.6457H39.9785V21.4048L45.7371 10.9636H40.7107V8.01862Z" fill="%23E2011A"/><path d="M12.2914 24.6449C10.982 24.6449 10.271 23.8136 10.271 22.6722V7.04565H12.1718V22.9822H13.981V24.6449H12.2914Z" fill="white"/><path d="M25.6461 24.6448C24.2452 24.6448 23.675 23.7853 23.5342 22.6439H23.4145C22.8935 24.1446 21.5841 24.9266 19.8735 24.9266C17.2828 24.9266 15.7622 23.4964 15.7622 21.2137C15.7622 18.931 17.4236 17.6206 20.9928 17.6206H23.4145V16.4088C23.4145 14.6756 22.4641 13.7245 20.5141 13.7245C19.0428 13.7245 18.0642 14.4361 17.4025 15.5563L16.262 14.4854C16.9308 13.175 18.4021 12.0829 20.6126 12.0829C23.5623 12.0829 25.3152 13.6259 25.3152 16.2186V22.9751H26.7162V24.6378H25.6461V24.6448ZM23.4145 21.0799V19.0578H20.8942C18.733 19.0578 17.7545 19.7272 17.7545 20.9108V21.411C17.7545 22.6228 18.7049 23.3132 20.1762 23.3132C22.0558 23.3132 23.4074 22.341 23.4074 21.0799H23.4145Z" fill="white"/></svg>\')}.product-logo{display:none}.product-logo ::slotted([slot="product-logo"]){width:32px;height:32px;margin-right:var(--space-unit)}.product-logo ::slotted([slot="product-logo"]) img{width:100%;height:100%;object-fit:cover}::slotted([slot="title"]),::slotted([slot="stucked-title"]),.stucked-title{margin:0;color:var(--app-header-text-color, var(--color-default-text));font-family:var(--font-family-serif);font-weight:var(--font-sb)}::slotted([slot="title"]){display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font-size:var(--title-font-size);-webkit-line-clamp:2;line-clamp:2;line-height:var(--title-line-height);text-overflow:ellipsis}::slotted(a:is([slot="title"],[slot="stucked-title"])){text-decoration:none}:host([enable-search]) ::slotted([slot="title"])+{margin-left:calc(var(--space-unit) 2)}:host([enable-offcanvas]:not([menu-length="0"])) .top-subtitle{padding-left:calc(var(--space-unit) * 4 + var(--space-unit))}::slotted([slot="top-subtitle"]){display:-webkit-box;overflow:hidden;max-width:80%;margin:0;-webkit-box-orient:vertical;color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-style:italic;font-weight:var(--font-rg);-webkit-line-clamp:2;line-clamp:2}.search-page-button{margin-left:auto}.menu-container{display:flex;flex:1 auto;column-gap:calc(var(--space-unit) * 4)}.menu-container:focus:focus-visible{outline:none}:host([menu-length="0"]) .menu-container,.menu-container:empty{display:none}.menu-container ::slotted([open]){position:relative;z-index:3}.menu-container ::slotted([slot="menu"]:not(:last-child))::after{position:absolute;top:calc(1.5em / 2);right:calc(var(--space-unit) * -2);width:var(--border-size-small);height:1em;background-color:var(--color-default-icon);content:"";font-size:var(--font-size-3);transform:translateY(-50%)}z-searchbar{z-index:0;display:flex;width:100%;align-items:center}.heading-stuck{position:fixed;z-index:20;top:var(--app-header-top-offset, 48px);left:0;width:100%;max-width:100%;animation:slide-stuck-heading-in 250ms ease-out;background:var(--app-header-stucked-bg, var(--color-surface01));box-shadow:var(--shadow-2);color:var(--app-header-stucked-text-color, var(--color-default-text))}.heading-stuck-content{display:flex;max-width:var(--app-header-content-max-width, 100%);align-items:center;padding:var(--space-unit) var(--grid-margin);margin:0 auto}.heading-stuck .heading-title{--title-font-size:var(--font-size-5);--title-line-height:1.4;overflow:hidden;align-items:center}.heading-stuck .stucked-title{overflow:hidden;font-size:var(--title-font-size);line-height:var(--title-line-height);text-overflow:ellipsis;white-space:nowrap}.drawer-trigger,::slotted([slot="menu-button"]){display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center;padding:0;border:0;margin-right:var(--space-unit);appearance:none;background:none;border-radius:0;color:inherit;cursor:pointer;outline:none}.drawer-trigger:focus:focus-visible z-icon{box-shadow:var(--shadow-focus-primary)}.drawer-trigger z-icon{--z-icon-width:calc(var(--space-unit) * 4);--z-icon-height:calc(var(--space-unit) * 4);fill:var(--color-default-icon)}.drawer-content{display:none}z-offcanvas{--z-offcanvas--top-space:var(--app-header-top-offset)}z-offcanvas[open] .drawer-content{display:flex;width:100%;flex:1 auto;flex-direction:column}z-offcanvas[open] .drawer-content ::slotted(z-menu){width:100%}.drawer-close{--z-icon-width:calc(var(--space-unit) * 4);--z-icon-height:calc(var(--space-unit) * 4);padding:0;border:0;margin:var(--space-unit) 0 calc(var(--space-unit) * 2.5);appearance:none;background:transparent;border-radius:0;cursor:pointer;outline:none}.drawer-close z-icon{fill:var(--color-default-icon)}.drawer-close:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}@media (max-width: 767px){:host([enable-search]) .heading-panel .heading-container{row-gap:calc(var(--space-unit) * 1.5)}}@media (min-width: 768px){.heading-panel{--title-font-size:var(--font-size-9);padding:calc(var(--space-unit) * 1.5) var(--grid-margin) calc(var(--space-unit) * 1.25)}:host([enable-search][search-page-url]) .heading-panel .heading-container{flex-direction:column}.heading-panel .heading-container{flex-direction:column;margin-right:auto}.z-logo img{height:32px}.product-logo{display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center}.has-top-subtitle .z-logo{display:none}.top-subtitle.has-product-logo{padding-left:calc(32px + var(--space-unit))}z-searchbar{width:30%;height:calc(var(--title-font-size) * var(--title-line-height));margin-left:auto}.menu-container{flex:initial}.menu-container>[role="menubar"]{display:contents}:host(:not([enable-offcanvas])) .menu-container{margin-top:calc((var(--space-unit) * 1.75))}:host(:not([enable-offcanvas])) .heading-container .drawer-trigger{display:none}.heading-stuck .heading-title{--title-font-size:var(--font-size-8);--title-line-height:1.5}.heading-stuck-content{padding:6px var(--grid-margin)}:host(:not([enable-offcanvas],[menu-length="0"])){padding-left:0}}@media (min-width: 1152px){z-searchbar{min-width:calc(var(--space-unit) * 45)}}@keyframes slide-stuck-heading-in{0%{transform:translate3d(0, -100%, 0)}100%{transform:none}}'}},[257,"z-app-header",{stuck:[516],enableOffcanvas:[1540,"enable-offcanvas"],enableSearch:[516,"enable-search"],searchPlaceholder:[1,"search-placeholder"],searchString:[1025,"search-string"],searchPageUrl:[1,"search-page-url"],enableZLogo:[516,"enable-z-logo"],drawerOpen:[1028,"drawer-open"],_stuck:[32],menuLength:[32],isMobile:[32],isTablet:[32]},[[5,"focusin","manageMenus"],[5,"click","manageMenus"],[1,"keydown","handleKeydown"]],{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}]),S=E,j=function(){"undefined"!=typeof customElements&&["z-app-header","z-button","z-divider","z-icon","z-input","z-input-message","z-list","z-list-element","z-list-group","z-offcanvas","z-searchbar","z-tag"].forEach((t=>{switch(t){case"z-app-header":customElements.get(o(t))\|\|customElements.define(o(t),E);break;case"z-button":customElements.get(o(t))\|\|g();break;case"z-divider":customElements.get(o(t))\|\|m();break;case"z-icon":customElements.get(o(t))\|\|f();break;case"z-input":customElements.get(o(t))\|\|v();break;case"z-input-message":customElements.get(o(t))\|\|b();break;case"z-list":customElements.get(o(t))\|\|w();break;case"z-list-element":customElements.get(o(t))\|\|x();break;case"z-list-group":customElements.get(o(t))\|\|z();break;case"z-offcanvas":customElements.get(o(t))\|\|k();break;case"z-searchbar":customElements.get(o(t))\|\|y();break;case"z-tag":customElements.get(o(t))\|\|C()}}))};export{S as ZAppHeader,j as defineCustomElement}
1	+ import{proxyCustomElement as t,HTMLElement as e,h as i,Fragment as a,createEvent as s,Host as n,transformTag as o}from"@stencil/core/internal/client";import{g as r,e as l,B as c,u as h,O as d}from"./index2.js";import{B as u}from"./breakpoints.js";import{a as p}from"./utils.js";import{d as g}from"./index5.js";import{d as m}from"./index6.js";import{d as f}from"./index3.js";import{d as v}from"./index7.js";import{d as b}from"./index8.js";import{d as w}from"./index9.js";import{d as x}from"./index10.js";import{d as z}from"./index11.js";import{d as k}from"./index12.js";import{d as y}from"./index13.js";import{d as C}from"./index14.js";const M="undefined"!=typeof IntersectionObserver,E=t(class extends e{onStuck(){this.scrollParent&&this.sticking.emit(this._stuck)}setMenuFloatingMode(){0!==this.menuElements.length&&this.menuElements.forEach((t=>{t.open=!1,t.verticalContext=this.drawerOpen}))}onStuckChange(){var t,e;this.container&&(this.stuck?null===(t=this.stuckIntersecObserver)\|\|void 0===t\|\|t.observe(this.container):(this._stuck=!1,null===(e=this.stuckIntersecObserver)\|\|void 0===e\|\|e.unobserve(this.container)))}get title(){var t;return null===(t=this.hostElement.querySelector('[slot="title"]'))\|\|void 0===t?void 0:t.textContent.trim()}get scrollParent(){const t=this.hostElement.offsetParent;return t===document.body\|\|t===document.documentElement?window:t}get canShowMenu(){return!this.enableOffcanvas&&this.menuElements.length>0&&!this.isMobile&&!this.drawerOpen}get focusableMenu(){return this.menuElements.find((t=>0===t.htmlTabindex))}openDrawer(){this.drawerOpen=!0,this.menuElements.forEach(((t,e)=>t.htmlTabindex=0===e?0:-1)),setTimeout((()=>this.menuElements[0].setFocus()),400)}closeDrawer(){this.drawerOpen=!1,setTimeout((()=>this.burgerButton.focus()),100)}collectMenuElements(){this.menuElements=Array.from(this.hostElement.querySelectorAll('[slot="menu"]')),this.menuElements.forEach(((t,e)=>t.htmlTabindex=0===e?0:-1)),this.menuLength=this.menuElements.length,this.enableOffcanvas\|\|(this.menuWidth=this.menuElements.reduce(((t,e)=>t+e.getBoundingClientRect().width),0)+32(this.menuLength-1)),this.setMenuFloatingMode()}setupMenuResizeObserver(){this.enableOffcanvas\|\|(this.menuResizeObserver=new ResizeObserver((t=>{if(this.isMobile)return void(this.enableOffcanvas=!0);const e=t[0].contentBoxSize[0].inlineSize;0!==this.menuWidth&&(this.menuWidth>e&&!this.enableOffcanvas?this.enableOffcanvas=!0:this.menuWidth<=e&&this.enableOffcanvas&&(this.enableOffcanvas=!1))})),this.menuResizeObserver.observe(this.container))}hasSlot(t){return null!==this.hostElement.querySelector(`[slot="${t}"]`)}moveFocus(t,e){t.htmlTabindex=-1,e.setFocus()}onOffcanvasKeydown(t){var e,i;if(t.key!==r.TAB\|\|!this.drawerOpen)return;const a=t.target.closest("z-menu");a?(t.preventDefault(),t.stopPropagation(),a.htmlTabindex=0,this.closeDrawerButton.focus()):t.target===this.closeDrawerButton&&(t.preventDefault(),t.stopPropagation(),t.shiftKey?(null!==(e=this.menuElements.filter((t=>t.open)).pop())&&void 0!==e?e:this.menuElements[this.menuLength-1]).setFocus():(null!==(i=this.menuElements.find((t=>t.open)))&&void 0!==i?i:this.menuElements[0]).setFocus())}manageMenus(t){const e=this.menuElements.find((e=>p(e,t.target)));e?this.menuElements.forEach((t=>{t!==e&&(t.htmlTabindex=-1,this.drawerOpen\|\|(t.open=!1))})):this.drawerOpen\|\|this.menuElements.forEach((t=>{t.open=!1}))}handleKeydown(t){var e,i;if(t.key===r.ESC&&this.drawerOpen)return void this.closeDrawer();if(!this.menuElements.some((e=>e.contains(t.target))))return;const a=this.focusableMenu,s=this.menuElements.indexOf(a);let n;return t.key===r.ARROW_RIGHT&&!a.verticalContext\|\|t.key===r.ARROW_DOWN&&a.verticalContext?n=null!==(e=this.menuElements[s+1])&&void 0!==e?e:this.menuElements[0]:(t.key===r.ARROW_LEFT&&!a.verticalContext\|\|t.key===r.ARROW_UP&&a.verticalContext)&&(n=null!==(i=this.menuElements[s-1])&&void 0!==i?i:this.menuElements[this.menuLength-1]),n?t.key===r.ARROW_UP&&a.verticalContext&&n.open?(a.htmlTabindex=-1,void n.focusLastItem()):void this.moveFocus(a,n):void 0}renderSeachbar(){if(!this.isMobile\|\|this.searchPageUrl\|\|!this._stuck)return this.searchPageUrl&&(this.isMobile\|\|this.isTablet)?i("z-button",{class:"search-page-button",variant:c.SECONDARY,href:this.searchPageUrl,icon:"search",size:l.X_SMALL}):i("z-searchbar",{value:this.searchString,placeholder:this.searchPlaceholder,showSearchButton:!0,searchButtonIconOnly:this.isMobile\|\|this.isTablet,searchButtonLabel:this.isMobile\|\|this.isTablet?void 0:this.searchButtonLabel,size:l.X_SMALL,variant:c.SECONDARY,preventSubmit:this.searchString.length<3,onSearchTyping:t=>this.searchString=t.detail})}renderProductLogos(){return i(a,null,this.enableZLogo&&i("span",{class:"z-logo"},i("img",{alt:"Logo Zanichelli"})),this.hostElement.querySelector("[slot='product-logo']")&&i("span",{class:"product-logo"},i("slot",{name:"product-logo"})))}renderMenuButton(){return this.menuLength>0&&(this.enableOffcanvas\|\|this._stuck\|\|this.isMobile)&&i("button",{ref:t=>this.burgerButton=t,class:"drawer-trigger","aria-label":"Apri menu","aria-haspopup":"menu","aria-expanded":""+this.drawerOpen,"aria-controls":"offcanvas-menu",onClick:this.openDrawer},i("z-icon",{name:"burger-menu"}))}renderOffcanvas(){return i("z-offcanvas",{id:"offcanvas-menu",variant:d.OVERLAY,transitiondirection:h.RIGHT,open:this.drawerOpen,onCanvasOpenStatusChanged:t=>this.drawerOpen=t.detail,onKeyDown:this.onOffcanvasKeydown},i("div",{slot:"canvasContent"},i("button",{ref:t=>this.closeDrawerButton=t,class:"drawer-close","aria-label":"Chiudi menu",onClick:this.closeDrawer,"aria-hidden":""+!this.drawerOpen,disabled:!this.drawerOpen},i("z-icon",{name:"close"})),i("div",{class:"drawer-content","aria-hidden":""+!this.drawerOpen},i("slot",{name:"menu",onSlotchange:this.collectMenuElements}))))}renderStuck(){return i("div",{class:"heading-stuck"},i("div",{class:"heading-stuck-content"},this.renderMenuButton(),i("div",{class:"heading-title"},this.renderProductLogos(),i("div",{class:"stucked-title"},i("slot",{name:"stucked-title"},this.title))),this.enableSearch&&this.renderSeachbar()))}constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.sticking=s(this,"sticking",7),this.stuck=!1,this.enableOffcanvas=!1,this.enableSearch=!1,this.searchPlaceholder="Cerca",this.searchString="",this.enableZLogo=!0,this.drawerOpen=!1,this._stuck=!1,this.isMobile=!0,this.isTablet=!1,this.menuElements=[],this.stuckIntersecObserver=M?new IntersectionObserver((([t])=>{this._stuck=!t.isIntersecting}),{threshold:.5}):void 0,this.openDrawer=this.openDrawer.bind(this),this.closeDrawer=this.closeDrawer.bind(this),this.collectMenuElements=this.collectMenuElements.bind(this),this.onOffcanvasKeydown=this.onOffcanvasKeydown.bind(this)}componentWillLoad(){this.collectMenuElements();const t=window.matchMedia(`(max-width: ${u.MOBILE}px)`);this.isMobile=t.matches,t.addEventListener("change",(t=>this.isMobile=t.matches));const e=window.matchMedia(`(min-width: ${u.MOBILE+1}px) and (max-width: ${u.TABLET}px)`);this.isTablet=e.matches,e.addEventListener("change",(t=>this.isTablet=t.matches))}componentDidLoad(){this.onStuckChange(),this.setupMenuResizeObserver()}disconnectedCallback(){var t;null===(t=this.menuResizeObserver)\|\|void 0===t\|\|t.disconnect()}render(){const t=this.hasSlot("top-subtitle");return i(n,{key:"dba00e6ba8614f38c6382a42420430ee44d61757","menu-length":this.menuLength},i("div",{key:"14462adce8a9cb03fe571a4eea4c1356d77d49d5",class:{"heading-panel":!0,"has-menubar":this.menuLength>0&&!this.enableOffcanvas},ref:t=>this.container=t},i("div",{key:"18f406f950a9f2946d5c1c74e5c3a52c9f139069",class:{"heading-container":!0,"has-top-subtitle":t}},(!this.enableSearch&&this.isMobile\|\|!this.isMobile)&&i("div",{key:"1e74736f45625644289425d0e5cc6c825c6ac2b9",class:{"top-subtitle":!0,"has-product-logo":t&&this.hasSlot("product-logo")}},i("slot",{key:"747325238cde4fb40d8448c58e4b6483ca049f28",name:"top-subtitle"})),i("div",{key:"8d5159eabc8cddbb3fdc2227be62b5b1f318b1d4",class:"heading-title"},i("slot",{key:"64c48e48e13c50d367fb52ed509d25cacbbc85da",name:"menu-button"},this.renderMenuButton()),!this._stuck&&this.renderProductLogos(),i("slot",{key:"990a282a81bd96d2524d3fbfff1dabce807824d9",name:"title"}),this.enableSearch&&!this.isMobile&&this.renderSeachbar()),this.enableSearch&&this.isMobile&&this.renderSeachbar()),i("nav",{key:"0048e85cccd48f1a9e587dc40bfc54ebf6c603bc",class:"menu-container","aria-label":this.title\|\|void 0},this.canShowMenu&&i("div",{key:"41423d5aa2004b61c6d9ef0342013598e4e59d55",role:"menubar","aria-label":this.title\|\|void 0},i("slot",{key:"4e12bbc0d9a8b54ecec94b1b12ad456ebcdb5bec",name:"menu",onSlotchange:this.collectMenuElements})))),this.renderOffcanvas(),this._stuck&&this.renderStuck())}get hostElement(){return this}static get watchers(){return{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}}static get style(){return':host{position:relative;display:block;box-shadow:var(--shadow-2)}:host,{box-sizing:border-box}.heading-panel{--title-line-height:1.333;--title-font-size:var(--font-size-6);position:relative;display:flex;width:100%;max-width:var(--app-header-content-max-width, 100%);flex-direction:column;flex-grow:0;flex-shrink:0;align-items:baseline;padding:calc(var(--space-unit) * 2);margin:0 auto;background:var(--app-header-bg, var(--color-surface01))}: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-panel.has-menubar{padding-bottom:0}.heading-panel .heading-container{flex-direction:column-reverse}:host([enable-search]) .heading-panel .heading-container{flex-direction:column}:host([enable-search][search-page-url]) .heading-panel .heading-container{flex-direction:row}.heading-title{display:flex;width:100%;flex-direction:row;align-items:flex-start}.heading-title:not(:last-child){margin-right:var(--space-unit)}.z-logo,.search-page-button{display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center}.z-logo img{height:24px;margin:0 var(--space-unit) 0 0;content:url(\'data:image/svg+xml,<svg width="61" height="32" viewBox="0 0 61 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.9874 32C7.1595 32 0 24.8349 0 16C0 7.16513 7.1595 0 15.9874 0H45.0126C53.8405 0 61 7.16513 61 16C61 24.8349 53.8405 32 45.0126 32H15.9874Z" fill="%23E2011A"/><path d="M58.5435 15.9992C58.5435 23.4743 52.4892 29.5403 45.0129 29.5403C37.5367 29.5403 31.4824 23.4813 31.4824 15.9992C31.4824 8.51701 37.5367 2.45801 45.0129 2.45801C52.4892 2.45801 58.5435 8.51701 58.5435 15.9992Z" fill="white"/><path d="M40.7107 8.01862H49.8976V11.3158L44.139 21.7077H50.0384V24.6457H39.9785V21.4048L45.7371 10.9636H40.7107V8.01862Z" fill="%23E2011A"/><path d="M12.2914 24.6449C10.982 24.6449 10.271 23.8136 10.271 22.6722V7.04565H12.1718V22.9822H13.981V24.6449H12.2914Z" fill="white"/><path d="M25.6461 24.6448C24.2452 24.6448 23.675 23.7853 23.5342 22.6439H23.4145C22.8935 24.1446 21.5841 24.9266 19.8735 24.9266C17.2828 24.9266 15.7622 23.4964 15.7622 21.2137C15.7622 18.931 17.4236 17.6206 20.9928 17.6206H23.4145V16.4088C23.4145 14.6756 22.4641 13.7245 20.5141 13.7245C19.0428 13.7245 18.0642 14.4361 17.4025 15.5563L16.262 14.4854C16.9308 13.175 18.4021 12.0829 20.6126 12.0829C23.5623 12.0829 25.3152 13.6259 25.3152 16.2186V22.9751H26.7162V24.6378H25.6461V24.6448ZM23.4145 21.0799V19.0578H20.8942C18.733 19.0578 17.7545 19.7272 17.7545 20.9108V21.411C17.7545 22.6228 18.7049 23.3132 20.1762 23.3132C22.0558 23.3132 23.4074 22.341 23.4074 21.0799H23.4145Z" fill="white"/></svg>\')}.product-logo{display:none}.product-logo ::slotted([slot="product-logo"]){width:32px;height:32px;margin-right:var(--space-unit)}.product-logo ::slotted([slot="product-logo"]) img{width:100%;height:100%;object-fit:cover}::slotted([slot="title"]),::slotted([slot="stucked-title"]),.stucked-title{margin:0;color:var(--app-header-text-color, var(--color-default-text));font-family:var(--font-family-serif);font-weight:var(--font-sb)}::slotted([slot="title"]){display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font-size:var(--title-font-size);-webkit-line-clamp:2;line-clamp:2;line-height:var(--title-line-height);text-overflow:ellipsis}::slotted(a:is([slot="title"],[slot="stucked-title"])){text-decoration:none}:host([enable-search]) ::slotted([slot="title"])+{margin-left:calc(var(--space-unit) 2)}:host([enable-offcanvas]:not([menu-length="0"])) .top-subtitle{padding-left:calc(var(--space-unit) * 4 + var(--space-unit))}::slotted([slot="top-subtitle"]){display:-webkit-box;overflow:hidden;max-width:80%;margin:0;-webkit-box-orient:vertical;color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-style:italic;font-weight:var(--font-rg);-webkit-line-clamp:2;line-clamp:2}.search-page-button{margin-left:auto}.menu-container{display:flex;flex:1 auto;column-gap:calc(var(--space-unit) * 4)}.menu-container:focus:focus-visible{outline:none}:host([menu-length="0"]) .menu-container,.menu-container:empty{display:none}.menu-container ::slotted([open]){position:relative;z-index:3}.menu-container ::slotted([slot="menu"]:not(:last-child))::after{position:absolute;top:calc(1.5em / 2);right:calc(var(--space-unit) * -2);width:var(--border-size-small);height:1em;background-color:var(--color-default-icon);content:"";font-size:var(--font-size-3);transform:translateY(-50%)}z-searchbar{z-index:0;display:flex;width:100%;align-items:center}.heading-stuck{position:fixed;z-index:20;top:var(--app-header-top-offset, 48px);left:0;width:100%;max-width:100%;animation:slide-stuck-heading-in 250ms ease-out;background:var(--app-header-stucked-bg, var(--color-surface01));box-shadow:var(--shadow-2);color:var(--app-header-stucked-text-color, var(--color-default-text))}.heading-stuck-content{display:flex;max-width:var(--app-header-content-max-width, 100%);align-items:center;padding:var(--space-unit) var(--grid-margin);margin:0 auto}.heading-stuck .heading-title{--title-font-size:var(--font-size-5);--title-line-height:1.4;overflow:hidden;align-items:center}.heading-stuck .stucked-title{overflow:hidden;font-size:var(--title-font-size);line-height:var(--title-line-height);text-overflow:ellipsis;white-space:nowrap}.drawer-trigger,::slotted([slot="menu-button"]){display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center;padding:0;border:0;margin-right:var(--space-unit);appearance:none;background:none;border-radius:0;color:inherit;cursor:pointer;outline:none}.drawer-trigger:focus:focus-visible z-icon{box-shadow:var(--shadow-focus-primary)}.drawer-trigger z-icon{--z-icon-width:calc(var(--space-unit) * 4);--z-icon-height:calc(var(--space-unit) * 4);fill:var(--color-default-icon)}.drawer-content{display:none}z-offcanvas{--z-offcanvas--top-space:var(--app-header-top-offset)}z-offcanvas[open] .drawer-content{display:flex;width:100%;flex:1 auto;flex-direction:column}z-offcanvas[open] .drawer-content ::slotted(z-menu){width:100%}.drawer-close{--z-icon-width:calc(var(--space-unit) * 4);--z-icon-height:calc(var(--space-unit) * 4);padding:0;border:0;margin:var(--space-unit) 0 calc(var(--space-unit) * 2.5);appearance:none;background:transparent;border-radius:0;cursor:pointer;outline:none}.drawer-close z-icon{fill:var(--color-default-icon)}.drawer-close:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}@media (max-width: 767px){:host([enable-search]) .heading-panel .heading-container{row-gap:calc(var(--space-unit) * 1.5)}}@media (min-width: 768px){.heading-panel{--title-font-size:var(--font-size-9);padding:calc(var(--space-unit) * 1.5) var(--grid-margin) calc(var(--space-unit) * 1.25)}:host([enable-search][search-page-url]) .heading-panel .heading-container{flex-direction:column}.heading-panel .heading-container{flex-direction:column;margin-right:auto}.z-logo img{height:32px}.product-logo{display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center}.has-top-subtitle .z-logo{display:none}.top-subtitle.has-product-logo{padding-left:calc(32px + var(--space-unit))}z-searchbar{width:30%;height:calc(var(--title-font-size) * var(--title-line-height));margin-left:auto}.menu-container{flex:initial}.menu-container>[role="menubar"]{display:contents}:host(:not([enable-offcanvas])) .menu-container{margin-top:calc((var(--space-unit) * 1.75))}:host(:not([enable-offcanvas])) .heading-container .drawer-trigger{display:none}.heading-stuck .heading-title{--title-font-size:var(--font-size-8);--title-line-height:1.5}.heading-stuck-content{padding:6px var(--grid-margin)}:host(:not([enable-offcanvas],[menu-length="0"])){padding-left:0}}@media (min-width: 1152px){z-searchbar{min-width:calc(var(--space-unit) * 45)}}@keyframes slide-stuck-heading-in{0%{transform:translate3d(0, -100%, 0)}100%{transform:none}}'}},[257,"z-app-header",{stuck:[516],enableOffcanvas:[1540,"enable-offcanvas"],enableSearch:[516,"enable-search"],searchPlaceholder:[1,"search-placeholder"],searchButtonLabel:[1,"search-button-label"],searchString:[1025,"search-string"],searchPageUrl:[1,"search-page-url"],enableZLogo:[516,"enable-z-logo"],drawerOpen:[1028,"drawer-open"],_stuck:[32],menuLength:[32],isMobile:[32],isTablet:[32]},[[5,"focusin","manageMenus"],[5,"click","manageMenus"],[1,"keydown","handleKeydown"]],{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}]),S=E,j=function(){"undefined"!=typeof customElements&&["z-app-header","z-button","z-divider","z-icon","z-input","z-input-message","z-list","z-list-element","z-list-group","z-offcanvas","z-searchbar","z-tag"].forEach((t=>{switch(t){case"z-app-header":customElements.get(o(t))\|\|customElements.define(o(t),E);break;case"z-button":customElements.get(o(t))\|\|g();break;case"z-divider":customElements.get(o(t))\|\|m();break;case"z-icon":customElements.get(o(t))\|\|f();break;case"z-input":customElements.get(o(t))\|\|v();break;case"z-input-message":customElements.get(o(t))\|\|b();break;case"z-list":customElements.get(o(t))\|\|w();break;case"z-list-element":customElements.get(o(t))\|\|x();break;case"z-list-group":customElements.get(o(t))\|\|z();break;case"z-offcanvas":customElements.get(o(t))\|\|k();break;case"z-searchbar":customElements.get(o(t))\|\|y();break;case"z-tag":customElements.get(o(t))\|\|C()}}))};export{S as ZAppHeader,j as defineCustomElement}

package/dist/components/z-combobox.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as s,transformTag as o}from"@stencil/core/internal/client";import{e as a,I as r,i as n,g as l,l as c}from"./index2.js";import{r as h,b as d}from"./utils.js";import{d as p}from"./index6.js";import{d as m}from"./index3.js";import{d as u}from"./index7.js";import{d as v}from"./index8.js";import{d as b}from"./index10.js";import{d as f}from"./index11.js";const g=e(class extends t{watchItems(){this.itemsList="string"==typeof this.items?JSON.parse(this.items):this.items,this.selectedCounter=this.itemsList.filter((e=>e.checked)).length,this.updateRenderItemsList()}watchSearchValue(){this.filterItems(this.searchValue)}emitComboboxChange(){this.comboboxChange.emit({id:this.inputid,items:this.itemsList})}constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.comboboxChange=i(this,"comboboxChange",7),this.inputid="combo-"+h(),this.disabled=!1,this.hassearch=!1,this.noresultslabel="Nessun risultato",this.isopen=!1,this.isfixed=!1,this.hascheckall=!1,this.checkalltext="Seleziona tutti",this.uncheckalltext="Deseleziona tutti",this.maxcheckableitems=0,this.size=a.BIG,this.renderItemsList=[],this.focusedItemId="",this.itemsList=[],this.inputType=r.TEXT,this.toggleComboBox=this.toggleComboBox.bind(this),this.closeFilterItems=this.closeFilterItems.bind(this)}componentWillLoad(){this.watchItems()}componentWillRender(){this.selectedCounter=this.itemsList.filter((e=>e.checked)).length}getControlToListSize(){switch(this.size){case a.X_SMALL:return n.SMALL;case a.SMALL:return n.MEDIUM;default:return n.LARGE}}getOptionId(e){return`${this.inputid}-option-${e}`}getCheckAllOptionId(){return this.inputid+"-check-all"}allOptionsSelected(){return this.selectedCounter===this.itemsList.length}hasReachedMaxSelections(){return!!(this.maxcheckableitems&&this.selectedCounter>=this.maxcheckableitems)}handleHeaderKeyDown(e){if(e.code!==l.ENTER\|\|this.focusedItemId\|\|this.toggleComboBox(),this.isopen&&!this.hassearch)switch(e.code){case l.SPACE:case l.ENTER:this.focusedItemId&&(e.preventDefault(),this.checkOption(this.focusedItemId));break;case l.ESC:this.focusedItemId&&(this.focusedItemId="");break;case l.ARROW_DOWN:case l.ARROW_UP:this.handleArrowsNavigation(e)}}handleInputKeyDown(e){switch(e.code){case l.ENTER:case l.SPACE:if(this.focusedItemId){e.preventDefault(),this.checkOption(this.focusedItemId);break}break;case l.ARROW_DOWN:case l.ARROW_UP:this.handleArrowsNavigation(e);break;case l.ESC:if(this.focusedItemId){this.focusedItemId="";break}this.closeFilterItems();break;case l.TAB:this.focusedItemId=""}}checkOption(e){e===this.getCheckAllOptionId()?(this.itemsList=this.itemsList.map((e=>Object.assign(Object.assign({},e),{checked:!this.allOptionsSelected()}))),this.focusedItemId=this.getCheckAllOptionId()):this.itemsList=this.itemsList.map((t=>(e===this.getOptionId(t.id)&&(t.checked=!t.checked),t))),this.updateRenderItemsList(),this.emitComboboxChange()}handleArrowsNavigation(e){if(![l.ARROW_DOWN,l.ARROW_UP].includes(e.code)\|\|!this.isopen)return;e.preventDefault(),e.stopPropagation();const t=this.focusedItemId?this.element.shadowRoot.querySelector("#"+this.focusedItemId):null,i=Array.from(this.element.shadowRoot.querySelectorAll('[role="option"]'));if(!i.length)return;const s=t?i.indexOf(t):null,o=i.length-1;let a=null;e.code===l.ARROW_DOWN?a=null===s?i[0]:i[s+1]\|\|i[o]:e.code===l.ARROW_UP&&(a=null===s?i[o]:i[s-1]\|\|i[0]),this.focusedItemId=a.id,a.scrollIntoView({block:"nearest",container:"nearest"})}updateRenderItemsList(){this.searchValue?this.filterItems(this.searchValue):this.resetRenderItemsList()}resetRenderItemsList(){const e=[];this.itemsList.forEach((t=>{e.push(Object.assign({},t))})),this.renderItemsList=e}filterItems(e){if(!e)return this.closeFilterItems();this.resetRenderItemsList(),this.renderItemsList=this.renderItemsList.filter((t=>{const i=t.name.toUpperCase().indexOf(e.toUpperCase()),s=i+e.length,o=t.name.substring(0,i)+"<strong>"+t.name.substring(i,s)+"</strong>"+t.name.substring(s,t.name.length);return t.name=o,i>=0}))}closeFilterItems(){this.searchValue="",this.resetRenderItemsList()}toggleComboBox(){this.isopen=!this.isopen}getComboboxA11yAttributes(e){const t="combobox",i=this.htmlAriaLabel,s=this.isopen?"true":"false",o=this.isopen?this.focusedItemId:"",a=this.inputid+"_list";return e?{role:t,"aria-label":i,"html-aria-expanded":s,"html-aria-activedescendant":o,"html-aria-controls":a}:{role:t,"aria-label":i,"aria-expanded":s,"aria-activedescendant":o,"aria-controls":a}}renderHeader(){const e=this.hassearch?{}:this.getComboboxA11yAttributes(!1);return s("div",Object.assign({class:"header",onClick:()=>this.toggleComboBox(),onKeyDown:e=>this.handleHeaderKeyDown(e),role:"button",tabindex:0,"aria-controls":"open-combo-data","aria-expanded":this.isopen?"true":"false"},e),s("span",{class:"body-3","aria-label":this.label?`${this.label}${this.selectedCounter>0?` - ${this.selectedCounter} selezionati`:""}`:void 0},this.label,s("span",null,this.selectedCounter>0&&` (${this.selectedCounter})`)),s("z-icon",{name:"caret-down",class:this.size}))}renderContent(){return s("div",{id:"open-combo-data",class:"open-combo-data"},this.hassearch&&this.renderSearchInput(),s("div",{role:"listbox","aria-label":this.label,"aria-multiselectable":"true",id:this.inputid+"_list","aria-owns":`${this.hascheckall?this.getCheckAllOptionId()+" ":""}${this.itemsList.map((e=>this.getOptionId(e.id))).join(" ")}`},this.renderItems()))}renderItems(){return s("div",{class:this.searchValue&&"search",tabIndex:-1,role:"presentation"},this.renderList(this.renderItemsList))}renderItem(e,t,i){const o=this.getOptionId(e.id),a=!e.checked&&this.hasReachedMaxSelections();return s("z-list-element",{htmlTabindex:-1,dividerType:t!==i-1?c.ELEMENT:c.NONE,size:this.getControlToListSize(),role:"presentation",disabled:!!a},s("span",{class:"option-wrap",role:"presentation",onClick:()=>{this.focusedItemId="",this.checkOption(o)}},s("z-icon",{name:e.checked?"checkbox-checked":"checkbox",class:this.focusedItemId===o?"focused":""}),s("span",{id:o,role:a?"presentation":"option","aria-selected":e.checked?"true":"false","aria-label":a?void 0:d(e.name)},s("span",{"aria-hidden":"true",innerHTML:e.name}))))}renderList(e){if(e)return!e.length&&this.searchValue?this.renderNoSearchResults():this.hasgroupitems?this.renderGroups(e):s("ul",{role:"presentation"},this.renderCheckAll(),e.map(((t,i)=>this.renderItem(t,i,e.length))))}renderGroups(e){const t=e.reduce(((t,i,s)=>{var o;const a=i.category\|\|"Altra categoria",r=this.renderItem(i,s,e.length);return t[a]=null!==(o=t[a])&&void 0!==o?o:[],t[a].push(r),t}),{}),i=Object.entries(t).map((([e,t],i)=>s("z-list-group",{size:this.getControlToListSize(),"divider-type":c.ELEMENT,"aria-labelledby":`${this.inputid}_list_group_${i}`},s("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.inputid}_list_group_${i}`,"aria-hidden":"true"},e),t.map((e=>e)))));return s("ul",{role:"presentation"},this.renderCheckAll(),i)}renderNoSearchResults(){return s("div",{class:"no-results"},s("span",null,this.noresultslabel))}renderSearchInput(){return s("z-input",Object.assign({htmlid:this.inputid+"_search",label:this.searchlabel,placeholder:this.searchplaceholder,htmltitle:this.searchtitle,type:this.inputType,value:this.searchValue,message:!1,size:this.size,"html-aria-autocomplete":"list"},this.getComboboxA11yAttributes(!0),{onKeyDown:e=>this.handleInputKeyDown(e),onInputChange:e=>{this.searchValue=e.detail.value,this.focusedItemId=""}}))}renderCheckAll(){if(!this.hascheckall\|\|this.searchValue)return;const e=this.getCheckAllOptionId(),t=this.allOptionsSelected(),i=this.hasReachedMaxSelections()\|\|this.maxcheckableitems&&this.maxcheckableitems<this.itemsList.length;return s("z-list-element",{class:"check-all-wrapper",role:"presentation",htmlTabindex:-1,dividerType:c.ELEMENT,dividerColor:"gray800",size:this.getControlToListSize(),disabled:!!i},s("span",{class:"option-wrap",role:"presentation",onClick:()=>this.checkOption(e)},s("z-icon",{name:t?"checkbox-checked":"checkbox",class:this.focusedItemId===e?"focused":""}),s("span",{id:e,role:i?"presentation":"option","aria-selected":t?"true":"false"},t?this.uncheckalltext:this.checkalltext)))}render(){return s("div",{key:"23cd031ec2894308960df94374713e9395521a56","data-action":"combo-"+this.inputid,class:{open:this.isopen,fixed:this.isfixed,disabled:this.disabled},id:this.inputid},this.renderHeader(),!this.disabled&&this.renderContent())}get element(){return this}static get watchers(){return{items:[{watchItems:0}],searchValue:[{watchSearchValue:0}]}}static get style(){return'.z-label{display:block;padding-bottom:var(--space-unit);color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);text-align:left;text-transform:uppercase}:host{display:block;min-width:290px;color:var(--color-form-default-text);fill:var(--color-form-default-icon);font-family:var(--font-family-sans)}:host>div.fixed{position:relative}:host>div>.header{position:relative;z-index:10;display:flex;min-height:42px;align-items:center;justify-content:space-between;padding:0 calc(var(--space-unit) * 1.5);border:var(--border-size-small) solid var(--color-form-surface04);margin:0;background-color:var(--color-form-background);border-radius:var(--border-radius-small);cursor:pointer}:host([size="small"])>div>.header{min-height:34px;font-size:var(--font-size-2)}:host([size="x-small"])>div>.header{min-height:30px;font-size:var(--font-size-2)}:host>div>.header:hover{outline:var(--border-size-medium) solid var(--color-form-surface04);outline-offset:-2px}:host>div>div.header:focus:focus-visible{z-index:16;box-shadow:var(--shadow-focus-primary);outline:none}:host>div>.header>span.body-3>span{font-weight:var(--font-sb)}:host>div>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(360deg);transition:all 200ms linear}:host>div>.header>z-icon.small,:host>div>.header>z-icon.x-small{--z-icon-width:16px;--z-icon-height:16px}:host>div.open>.header{border:var(--border-size-small) solid var(--color-form-active-primary);border-radius:var(--border-radius-small) var(--border-radius-small) 0 0}:host>div.disabled{pointer-events:none}:host>div.disabled .header{border-color:var(--color-form-disabled03);fill:var(--color-form-disabled01-icon)}:host>div.disabled .header>span.body-3{color:var(--color-form-disabled03)}:host>div.disabled .header>z-icon:last-child{fill:var(--color-form-disabled01-icon)}:host>div.open>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(180deg);transition:all 200ms linear}:host>div>div.open-combo-data{display:none}:host>div.open>div.open-combo-data{position:relative;z-index:12;display:block;padding:var(--space-unit) calc(var(--space-unit) * 2);border:var(--border-size-small) solid var(--color-form-surface03);border-top:0;background-color:var(--color-form-background);border-radius:0;box-shadow:var(--shadow-2)}:host .open .open-combo-data z-input .z-label{color:var(--color-form-default-text)}:host>div.open>div.open-combo-data>div>div{overflow:auto;max-height:235px;padding:0;padding-left:var(--space-unit);margin-left:calc(var(--space-unit) * -1);}:host>div.open>div.open-combo-data>z-input{width:100%;margin-bottom:calc(var(--space-unit) * 2)}:host>div.open>div.open-combo-data>div>div>ul{max-height:235px;padding:0 calc(var(--space-unit) * 0.5);margin:0}:host .open-combo-data z-list-element{--background-color-list-element:var(--color-form-background);--background-hover-color-list-element:var(--color-form-surface03);--background-active-color-list-element:var(--color-form-surface03)}:host .open-combo-data z-list-element[disabled]{pointer-events:none}:host .open-combo-data z-list-element .option-wrap{display:flex;flex-direction:row;align-items:center;cursor:pointer;gap:var(--space-unit)}:host .open-combo-data z-list-element[size="medium"] .option-wrap,:host .open-combo-data z-list-element[size="small"] .option-wrap{--z-icon-width:16px;--z-icon-height:16px;font-size:var(--font-size-2);gap:calc(var(--space-unit) / 2)}:host .open-combo-data z-list-element .option-wrap>z-icon{fill:var(--color-primary01)}:host .open-combo-data z-list-element[disabled] .option-wrap>z-icon{fill:var(--color-disabled01)}:host .open-combo-data z-list-element .option-wrap>z-icon.focused{border-radius:var(--border-radius-small);box-shadow:var(--shadow-focus-primary);outline:none}:host .open-combo-data z-list-element .option-wrap>[role="option"]:focus,:host .open-combo-data z-list-element .option-wrap>[role="option"]:focus-visible{outline:none}::-webkit-scrollbar{width:6px;background:linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px)}::-webkit-scrollbar-thumb{background-color:var(--color-primary01)}::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}@supports not selector(::-webkit-scrollbar-track){:host{scrollbar-color:var(--color-primary01) transparent}}:host>div.open>z-input{position:relative;z-index:1;width:238px;margin:0 calc(var(--space-unit) * 2);color:var(--color-form-active-primary)}:host>div.open>div.open-combo-data>div>div.search{overflow:hidden;max-height:none;margin-top:0}:host>div.open>div.open-combo-data>div>div.search>ul{overflow:auto;max-height:180px;padding:var(--space-unit) calc(var(--space-unit) * 2)}:host .open .open-combo-data .search .no-results{display:flex;align-items:center;column-gap:var(--space-unit)}:host>.open>.open-combo-data .search .close-search{display:flex;justify-content:center}:host>div.open>div.open-combo-data>div>div.search .close-search>a{display:inline-block;height:44px;color:var(--color-form-active-primary);cursor:pointer;font-size:14px;font-weight:var(--font-sb);line-height:44px;text-align:center;text-transform:uppercase}:host>div.open>div.open-combo-data>div>div.search .close-search>a:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.5);border-bottom:var(--border-size-small) solid var(--gray800);margin-bottom:var(--space-unit);margin-left:calc(var(--space-unit) * -1);text-align:left}:host([size="small"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 0.5)}:host([size="x-small"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:var(--space-unit) calc(var(--space-unit) * 0.5)}'}},[1,"z-combobox",{inputid:[1],items:[1],label:[1],disabled:[516],hassearch:[4],searchlabel:[1],searchplaceholder:[1],searchtitle:[1],noresultslabel:[1],isopen:[1028],isfixed:[4],hascheckall:[4],checkalltext:[1],uncheckalltext:[1],maxcheckableitems:[2],hasgroupitems:[4],size:[1],htmlAriaLabel:[1,"html-aria-label"],searchValue:[32],selectedCounter:[32],renderItemsList:[32],focusedItemId:[32]},void 0,{items:[{watchItems:0}],searchValue:[{watchSearchValue:0}]}]),x=g,z=function(){"undefined"!=typeof customElements&&["z-combobox","z-divider","z-icon","z-input","z-input-message","z-list-element","z-list-group"].forEach((e=>{switch(e){case"z-combobox":customElements.get(o(e))\|\|customElements.define(o(e),g);break;case"z-divider":customElements.get(o(e))\|\|p();break;case"z-icon":customElements.get(o(e))\|\|m();break;case"z-input":customElements.get(o(e))\|\|u();break;case"z-input-message":customElements.get(o(e))\|\|v();break;case"z-list-element":customElements.get(o(e))\|\|b();break;case"z-list-group":customElements.get(o(e))\|\|f()}}))};export{x as ZCombobox,z as defineCustomElement}
1	+ import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as s,transformTag as o}from"@stencil/core/internal/client";import{e as a,I as r,i as n,g as l,l as c}from"./index2.js";import{r as h,e as d,b as p}from"./utils.js";import{d as m}from"./index6.js";import{d as u}from"./index3.js";import{d as b}from"./index7.js";import{d as v}from"./index8.js";import{d as f}from"./index10.js";import{d as g}from"./index11.js";const x=e(class extends t{watchItems(){this.itemsList="string"==typeof this.items?JSON.parse(this.items):this.items,this.selectedCounter=this.itemsList.filter((e=>e.checked)).length,this.updateRenderItemsList()}watchSearchValue(){this.filterItems(this.searchValue)}emitComboboxChange(){this.comboboxChange.emit({id:this.inputid,items:this.itemsList})}constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.comboboxChange=i(this,"comboboxChange",7),this.inputid="combo-"+h(),this.disabled=!1,this.hassearch=!1,this.noresultslabel="Nessun risultato",this.isopen=!1,this.isfixed=!1,this.hascheckall=!1,this.checkalltext="Seleziona tutti",this.uncheckalltext="Deseleziona tutti",this.maxcheckableitems=0,this.size=a.BIG,this.renderItemsList=[],this.focusedItemId="",this.itemsList=[],this.inputType=r.TEXT,this.toggleComboBox=this.toggleComboBox.bind(this),this.closeFilterItems=this.closeFilterItems.bind(this)}componentWillLoad(){this.watchItems()}componentWillRender(){this.selectedCounter=this.itemsList.filter((e=>e.checked)).length}getControlToListSize(){switch(this.size){case a.X_SMALL:return n.SMALL;case a.SMALL:return n.MEDIUM;default:return n.LARGE}}getOptionId(e){return`${this.inputid}-option-${d(e)}`}getCheckAllOptionId(){return this.inputid+"-check-all"}allOptionsSelected(){return this.selectedCounter===this.itemsList.length}hasReachedMaxSelections(){return!!(this.maxcheckableitems&&this.selectedCounter>=this.maxcheckableitems)}handleHeaderKeyDown(e){if(e.code!==l.ENTER\|\|this.focusedItemId\|\|this.toggleComboBox(),this.isopen&&!this.hassearch)switch(e.code){case l.SPACE:case l.ENTER:this.focusedItemId&&(e.preventDefault(),this.checkOption(this.focusedItemId));break;case l.ESC:this.focusedItemId&&(this.focusedItemId="");break;case l.ARROW_DOWN:case l.ARROW_UP:this.handleArrowsNavigation(e)}}handleInputKeyDown(e){switch(e.code){case l.ENTER:case l.SPACE:if(this.focusedItemId){e.preventDefault(),this.checkOption(this.focusedItemId);break}break;case l.ARROW_DOWN:case l.ARROW_UP:this.handleArrowsNavigation(e);break;case l.ESC:if(this.focusedItemId){this.focusedItemId="";break}this.closeFilterItems();break;case l.TAB:this.focusedItemId=""}}checkOption(e){e===this.getCheckAllOptionId()?(this.itemsList=this.itemsList.map((e=>Object.assign(Object.assign({},e),{checked:!this.allOptionsSelected()}))),this.focusedItemId=this.getCheckAllOptionId()):this.itemsList=this.itemsList.map((t=>(e===this.getOptionId(t.id)&&(t.checked=!t.checked),t))),this.updateRenderItemsList(),this.emitComboboxChange()}handleArrowsNavigation(e){if(![l.ARROW_DOWN,l.ARROW_UP].includes(e.code)\|\|!this.isopen)return;e.preventDefault(),e.stopPropagation();const t=this.focusedItemId?this.element.shadowRoot.querySelector("#"+this.focusedItemId):null,i=Array.from(this.element.shadowRoot.querySelectorAll('[role="option"]'));if(!i.length)return;const s=t?i.indexOf(t):null,o=i.length-1;let a=null;e.code===l.ARROW_DOWN?a=null===s?i[0]:i[s+1]\|\|i[o]:e.code===l.ARROW_UP&&(a=null===s?i[o]:i[s-1]\|\|i[0]),this.focusedItemId=a.id,a.scrollIntoView({block:"nearest",container:"nearest"})}updateRenderItemsList(){this.searchValue?this.filterItems(this.searchValue):this.resetRenderItemsList()}resetRenderItemsList(){const e=[];this.itemsList.forEach((t=>{e.push(Object.assign({},t))})),this.renderItemsList=e}filterItems(e){if(!e)return this.closeFilterItems();this.resetRenderItemsList(),this.renderItemsList=this.renderItemsList.filter((t=>{const i=t.name.toUpperCase().indexOf(e.toUpperCase()),s=i+e.length,o=t.name.substring(0,i)+"<strong>"+t.name.substring(i,s)+"</strong>"+t.name.substring(s,t.name.length);return t.name=o,i>=0}))}closeFilterItems(){this.searchValue="",this.resetRenderItemsList()}toggleComboBox(){this.isopen=!this.isopen}getComboboxA11yAttributes(e){const t="combobox",i=this.htmlAriaLabel,s=this.isopen?"true":"false",o=this.isopen?this.focusedItemId:"",a=this.inputid+"_list";return e?{role:t,"aria-label":i,"html-aria-expanded":s,"html-aria-activedescendant":o,"html-aria-controls":a}:{role:t,"aria-label":i,"aria-expanded":s,"aria-activedescendant":o,"aria-controls":a}}renderHeader(){const e=this.hassearch?{}:this.getComboboxA11yAttributes(!1);return s("div",Object.assign({class:"header",onClick:()=>this.toggleComboBox(),onKeyDown:e=>this.handleHeaderKeyDown(e),role:"button",tabindex:0,"aria-controls":"open-combo-data","aria-expanded":this.isopen?"true":"false"},e),s("span",{class:"body-3","aria-label":this.label?`${this.label}${this.selectedCounter>0?` - ${this.selectedCounter} selezionati`:""}`:void 0},this.label,s("span",null,this.selectedCounter>0&&` (${this.selectedCounter})`)),s("z-icon",{name:"caret-down",class:this.size}))}renderContent(){return s("div",{id:"open-combo-data",class:"open-combo-data"},this.hassearch&&this.renderSearchInput(),s("div",{role:"listbox","aria-label":this.label,"aria-multiselectable":"true",id:this.inputid+"_list","aria-owns":`${this.hascheckall?this.getCheckAllOptionId()+" ":""}${this.itemsList.map((e=>this.getOptionId(e.id))).join(" ")}`},this.renderItems()))}renderItems(){return s("div",{class:this.searchValue&&"search",tabIndex:-1,role:"presentation"},this.renderList(this.renderItemsList))}renderItem(e,t,i){const o=this.getOptionId(e.id),a=!e.checked&&this.hasReachedMaxSelections();return s("z-list-element",{htmlTabindex:-1,dividerType:t!==i-1?c.ELEMENT:c.NONE,size:this.getControlToListSize(),role:"presentation",disabled:!!a},s("span",{class:"option-wrap",role:"presentation",onClick:()=>{this.focusedItemId="",this.checkOption(o)}},s("z-icon",{name:e.checked?"checkbox-checked":"checkbox",class:this.focusedItemId===o?"focused":""}),s("span",{id:o,role:a?"presentation":"option","aria-selected":e.checked?"true":"false","aria-label":a?void 0:p(e.name)},s("span",{"aria-hidden":"true",innerHTML:e.name}))))}renderList(e){if(e)return!e.length&&this.searchValue?this.renderNoSearchResults():this.hasgroupitems?this.renderGroups(e):s("ul",{role:"presentation"},this.renderCheckAll(),e.map(((t,i)=>this.renderItem(t,i,e.length))))}renderGroups(e){const t=e.reduce(((t,i,s)=>{var o;const a=i.category\|\|"Altra categoria",r=this.renderItem(i,s,e.length);return t[a]=null!==(o=t[a])&&void 0!==o?o:[],t[a].push(r),t}),{}),i=Object.entries(t).map((([e,t],i)=>s("z-list-group",{size:this.getControlToListSize(),"divider-type":c.ELEMENT,"aria-labelledby":`${this.inputid}_list_group_${i}`},s("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.inputid}_list_group_${i}`,"aria-hidden":"true"},e),t.map((e=>e)))));return s("ul",{role:"presentation"},this.renderCheckAll(),i)}renderNoSearchResults(){return s("div",{class:"no-results"},s("span",null,this.noresultslabel))}renderSearchInput(){return s("z-input",Object.assign({htmlid:this.inputid+"_search",label:this.searchlabel,placeholder:this.searchplaceholder,htmltitle:this.searchtitle,type:this.inputType,value:this.searchValue,message:!1,size:this.size,"html-aria-autocomplete":"list"},this.getComboboxA11yAttributes(!0),{onKeyDown:e=>this.handleInputKeyDown(e),onInputChange:e=>{this.searchValue=e.detail.value,this.focusedItemId=""}}))}renderCheckAll(){if(!this.hascheckall\|\|this.searchValue)return;const e=this.getCheckAllOptionId(),t=this.allOptionsSelected(),i=this.hasReachedMaxSelections()\|\|this.maxcheckableitems&&this.maxcheckableitems<this.itemsList.length;return s("z-list-element",{class:"check-all-wrapper",role:"presentation",htmlTabindex:-1,dividerType:c.ELEMENT,dividerColor:"gray800",size:this.getControlToListSize(),disabled:!!i},s("span",{class:"option-wrap",role:"presentation",onClick:()=>this.checkOption(e)},s("z-icon",{name:t?"checkbox-checked":"checkbox",class:this.focusedItemId===e?"focused":""}),s("span",{id:e,role:i?"presentation":"option","aria-selected":t?"true":"false"},t?this.uncheckalltext:this.checkalltext)))}render(){return s("div",{key:"71d248786dcd29eb5bc03bbb1d9997f4bc7d46c2","data-action":"combo-"+this.inputid,class:{open:this.isopen,fixed:this.isfixed,disabled:this.disabled},id:this.inputid},this.renderHeader(),!this.disabled&&this.renderContent())}get element(){return this}static get watchers(){return{items:[{watchItems:0}],searchValue:[{watchSearchValue:0}]}}static get style(){return'.z-label{display:block;padding-bottom:var(--space-unit);color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);text-align:left;text-transform:uppercase}:host{display:block;min-width:290px;color:var(--color-form-default-text);fill:var(--color-form-default-icon);font-family:var(--font-family-sans)}:host>div.fixed{position:relative}:host>div>.header{position:relative;z-index:10;display:flex;min-height:42px;align-items:center;justify-content:space-between;padding:0 calc(var(--space-unit) * 1.5);border:var(--border-size-small) solid var(--color-form-surface04);margin:0;background-color:var(--color-form-background);border-radius:var(--border-radius-small);cursor:pointer}:host([size="small"])>div>.header{min-height:34px;font-size:var(--font-size-2)}:host([size="x-small"])>div>.header{min-height:30px;font-size:var(--font-size-2)}:host>div>.header:hover{outline:var(--border-size-medium) solid var(--color-form-surface04);outline-offset:-2px}:host>div>div.header:focus:focus-visible{z-index:16;box-shadow:var(--shadow-focus-primary);outline:none}:host>div>.header>span.body-3>span{font-weight:var(--font-sb)}:host>div>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(360deg);transition:all 200ms linear}:host>div>.header>z-icon.small,:host>div>.header>z-icon.x-small{--z-icon-width:16px;--z-icon-height:16px}:host>div.open>.header{border:var(--border-size-small) solid var(--color-form-active-primary);border-radius:var(--border-radius-small) var(--border-radius-small) 0 0}:host>div.disabled{pointer-events:none}:host>div.disabled .header{border-color:var(--color-form-disabled03);fill:var(--color-form-disabled01-icon)}:host>div.disabled .header>span.body-3{color:var(--color-form-disabled03)}:host>div.disabled .header>z-icon:last-child{fill:var(--color-form-disabled01-icon)}:host>div.open>.header>z-icon{fill:var(--color-form-default-icon);transform:rotate(180deg);transition:all 200ms linear}:host>div>div.open-combo-data{display:none}:host>div.open>div.open-combo-data{position:relative;z-index:12;display:block;padding:var(--space-unit) calc(var(--space-unit) * 2);border:var(--border-size-small) solid var(--color-form-surface03);border-top:0;background-color:var(--color-form-background);border-radius:0;box-shadow:var(--shadow-2)}:host .open .open-combo-data z-input .z-label{color:var(--color-form-default-text)}:host>div.open>div.open-combo-data>div>div{overflow:auto;max-height:235px;padding:0;padding-left:var(--space-unit);margin-left:calc(var(--space-unit) * -1);}:host>div.open>div.open-combo-data>z-input{width:100%;margin-bottom:calc(var(--space-unit) * 2)}:host>div.open>div.open-combo-data>div>div>ul{max-height:235px;padding:0 calc(var(--space-unit) * 0.5);margin:0}:host .open-combo-data z-list-element{--background-color-list-element:var(--color-form-background);--background-hover-color-list-element:var(--color-form-surface03);--background-active-color-list-element:var(--color-form-surface03)}:host .open-combo-data z-list-element[disabled]{pointer-events:none}:host .open-combo-data z-list-element .option-wrap{display:flex;flex-direction:row;align-items:center;cursor:pointer;gap:var(--space-unit)}:host .open-combo-data z-list-element[size="medium"] .option-wrap,:host .open-combo-data z-list-element[size="small"] .option-wrap{--z-icon-width:16px;--z-icon-height:16px;font-size:var(--font-size-2);gap:calc(var(--space-unit) / 2)}:host .open-combo-data z-list-element .option-wrap>z-icon{fill:var(--color-primary01)}:host .open-combo-data z-list-element[disabled] .option-wrap>z-icon{fill:var(--color-disabled01)}:host .open-combo-data z-list-element .option-wrap>z-icon.focused{border-radius:var(--border-radius-small);box-shadow:var(--shadow-focus-primary);outline:none}:host .open-combo-data z-list-element .option-wrap>[role="option"]:focus,:host .open-combo-data z-list-element .option-wrap>[role="option"]:focus-visible{outline:none}::-webkit-scrollbar{width:6px;background:linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px)}::-webkit-scrollbar-thumb{background-color:var(--color-primary01)}::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}@supports not selector(::-webkit-scrollbar-track){:host{scrollbar-color:var(--color-primary01) transparent}}:host>div.open>z-input{position:relative;z-index:1;width:238px;margin:0 calc(var(--space-unit) * 2);color:var(--color-form-active-primary)}:host>div.open>div.open-combo-data>div>div.search{overflow:hidden;max-height:none;margin-top:0}:host>div.open>div.open-combo-data>div>div.search>ul{overflow:auto;max-height:180px;padding:var(--space-unit) calc(var(--space-unit) * 2)}:host .open .open-combo-data .search .no-results{display:flex;align-items:center;column-gap:var(--space-unit)}:host>.open>.open-combo-data .search .close-search{display:flex;justify-content:center}:host>div.open>div.open-combo-data>div>div.search .close-search>a{display:inline-block;height:44px;color:var(--color-form-active-primary);cursor:pointer;font-size:14px;font-weight:var(--font-sb);line-height:44px;text-align:center;text-transform:uppercase}:host>div.open>div.open-combo-data>div>div.search .close-search>a:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.5);border-bottom:var(--border-size-small) solid var(--gray800);margin-bottom:var(--space-unit);margin-left:calc(var(--space-unit) * -1);text-align:left}:host([size="small"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 0.5)}:host([size="x-small"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:var(--space-unit) calc(var(--space-unit) * 0.5)}'}},[1,"z-combobox",{inputid:[1],items:[1],label:[1],disabled:[516],hassearch:[4],searchlabel:[1],searchplaceholder:[1],searchtitle:[1],noresultslabel:[1],isopen:[1028],isfixed:[4],hascheckall:[4],checkalltext:[1],uncheckalltext:[1],maxcheckableitems:[2],hasgroupitems:[4],size:[1],htmlAriaLabel:[1,"html-aria-label"],searchValue:[32],selectedCounter:[32],renderItemsList:[32],focusedItemId:[32]},void 0,{items:[{watchItems:0}],searchValue:[{watchSearchValue:0}]}]),z=x,w=function(){"undefined"!=typeof customElements&&["z-combobox","z-divider","z-icon","z-input","z-input-message","z-list-element","z-list-group"].forEach((e=>{switch(e){case"z-combobox":customElements.get(o(e))\|\|customElements.define(o(e),x);break;case"z-divider":customElements.get(o(e))\|\|m();break;case"z-icon":customElements.get(o(e))\|\|u();break;case"z-input":customElements.get(o(e))\|\|b();break;case"z-input-message":customElements.get(o(e))\|\|v();break;case"z-list-element":customElements.get(o(e))\|\|f();break;case"z-list-group":customElements.get(o(e))\|\|g()}}))};export{z as ZCombobox,w as defineCustomElement}

package/dist/components/z-select.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as e,HTMLElement as t,createEvent as s,h as i,transformTag as l}from"@stencil/core/internal/client";import{e as c,g as r,i as n,l as o}from"./index2.js";import{r as a,b as h,d,e as z,f as p}from"./utils.js";import{d as m}from"./index6.js";import{d as u}from"./index3.js";import{d as f}from"./index7.js";import{d as v}from"./index8.js";import{d as b}from"./index9.js";import{d as g}from"./index10.js";import{d as w}from"./index11.js";import{d as x}from"./index14.js";const y=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.optionSelect=s(this,"optionSelect",7),this.resetSelect=s(this,"resetSelect",7),this.htmlid="id-"+a(),this.items=[],this.ariaLabel="",this.disabled=!1,this.readonly=!1,this.message=!0,this.autocomplete=!1,this.noresultslabel="Nessun risultato",this.isfixed=!1,this.size=c.BIG,this.isOpen=!1,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=[];"string"==typeof e?t.push(e):t=e,this.itemsList=this.getInitialItemsArray(),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"string"==typeof this.items?JSON.parse(this.items):this.items}mapSelectedItemToItemsArray(){var e;const t=this.getInitialItemsArray();return this.updateSelection(t,null===(e=this.selectedItem)\|\|void 0===e?void 0:e.id),t}getSelectedValue(){var e;return null===(e=this.selectedItem)\|\|void 0===e?void 0:e.id}getOptionId(e){return`${this.htmlid}_key_${e.id}`}getResetOptionId(){return this.htmlid+"_key_reset"}getItemIdFromOptionId(e){return e.replace(this.htmlid+"_key_","")}getGroupedItems(){return this.itemsList.length?Object.entries(this.itemsList.reduce(((e,t)=>{const s=t.category\|\|"Altra categoria";return e[s]=e[s]\|\|[],e[s].push(t),e}),{})):[]}filterItems(e){let t=this.mapSelectedItemToItemsArray();(null==e?void 0:e.length)?(t=t.map((e=>Object.assign(Object.assign({},e),{name:h(e.name)}))),this.itemsList=this.hasTreeItems?this.filterTree(t,e,!1):t.filter((t=>t.name.toUpperCase().includes(e.toUpperCase()))).map((t=>(t.name=this.getHighlightedText(t.name,e),t)))):this.itemsList=t}filterTree(e,t,s){return e?e.map((e=>{const i=e.name.toUpperCase().includes(t.toUpperCase()),l=Object.assign({},e);return 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)),i&&(l.name=this.getHighlightedText(l.name,t)),i\|\|l.children&&l.children.length>0\|\|this.showChildrenOfMatchingParent&&s?l:null})).filter((e=>null!==e)):[]}getHighlightedText(e,t){const s=e.toUpperCase(),i=t.toUpperCase(),l=s.indexOf(i);if(-1===l)return e;const c=l+t.length;return e.substring(0,l)+`<strong>${e.substring(l,c)}</strong>`+e.substring(c)}hasAutocomplete(){return!0===d(this.autocomplete)}handleInputChange(e){this.searchString=e.detail.value,this.isOpen\|\|this.toggleSelectUl()}updateSelection(e,t){e&&e.forEach((e=>{e.selected=e.id===t,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){(null==e?void 0:e.disabled)\|\|(this.itemsList=this.getInitialItemsArray(),e&&this.updateSelection(this.itemsList,e.id),this.selectedItem=this.findSelectedItem(this.itemsList),this.emitOptionSelect(),this.toggleSelectUl(),this.searchString&&(this.searchString=null))}handleResetClick(){this.selectedItem=null,this.searchString=null,this.focusedItemId="",this.emitResetSelect(),this.toggleSelectUl()}handleInputKeyDown(e){switch(e.code){case r.ENTER:case r.SPACE:if(this.focusedItemId)if(this.focusedItemId===this.getResetOptionId())this.handleResetClick();else{const e=this.getItemIdFromOptionId(this.focusedItemId),t=this.itemsList.find((t=>t.id===e))\|\|null;t&&(this.selectedItem=t,this.emitOptionSelect(),this.toggleSelectUl())}break;case r.ARROW_DOWN:case r.ARROW_UP:this.arrowsSelectNav(e)}}arrowsSelectNav(e){if(![r.ARROW_DOWN,r.ARROW_UP].includes(e.key))return;e.preventDefault(),e.stopPropagation();const t=this.focusedItemId?this.host.querySelector("#"+this.focusedItemId):null,s=Array.from(this.host.querySelectorAll('[role="option"]'));if(!s.length)return;const i=t?s.indexOf(t):null,l=s.length-1;if(!this.isOpen&&(this.toggleSelectUl(),this.selectedItem))return void this.focusSelectItem(this.getOptionId(this.selectedItem));let c=null;e.code===r.ARROW_DOWN?c=null===i?s[0]:s[i+1]\|\|s[l]:e.code===r.ARROW_UP&&(c=null===i?s[l]:s[i-1]\|\|s[0]),this.focusSelectItem(c.id)}focusSelectItem(e){this.focusedItemId=e,this.host.querySelector("#"+e).scrollIntoView({block:"nearest",container:"nearest"})}toggleSelectUl(e=!1){var t;this.disabled\|\|this.readonly\|\|(this.isOpen?(document.removeEventListener("click",this.handleSelectFocus),document.removeEventListener("keyup",this.handleSelectFocus),e&&(null===(t=this.host.querySelector(`#${this.htmlid}_select_input`))\|\|void 0===t\|\|t.focus()),this.selectedItem&&this.searchString&&(this.searchString=null,this.filterItems(this.searchString))):(document.addEventListener("click",this.handleSelectFocus),document.addEventListener("keyup",this.handleSelectFocus)),this.focusedItemId="",this.isOpen=!this.isOpen)}handleInputClick(e){e.target.closest(".reset-icon")?e.stopPropagation():this.toggleSelectUl()}handleSelectFocus(e){if(e instanceof KeyboardEvent&&e.key===r.ESC)return e.stopPropagation(),this.toggleSelectUl(!0);if(e instanceof KeyboardEvent&&e.key!==r.TAB)return;const t=z();if(!(null==t?void 0:t.hasAttribute("disabled"))&&!p(t).find((e=>"z-input"===e.nodeName.toLowerCase()&&e.id===this.htmlid+"_input"))){const e=p(t).find((e=>"Z-SELECT"===e.nodeName));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()));t&&(this.isOpen\|\|this.toggleSelectUl(),this.focusSelectItem(this.getOptionId(t)))}renderInput(){let e=null;return this.selectedItem&&(e=h(this.selectedItem.name)),this.isOpen&&void 0!==this.searchString&&(e=this.searchString),[i("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:!1,message:!1,name:this.name,disabled:this.disabled,readonly:this.readonly\|\|!this.hasAutocomplete()&&this.isOpen,status:this.isOpen?void 0: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":void 0,onClick:e=>this.handleInputClick(e),onKeyDown:e=>this.handleInputKeyDown(e),onInputChange:e=>this.handleInputChange(e),onKeyPress:e=>{this.hasAutocomplete()\|\|(e.preventDefault(),this.scrollToLetter(e.key))}})]}renderSelectUl(){return i("div",{class:this.isOpen?"open":"closed"},i("div",{class:{"ul-scroll-wrapper":!0,fixed:this.isfixed}},i("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":!1,size:this.listSizeType(),class:{disabled:this.disabled,readonly:this.readonly,["input-"+this.status]:!this.isOpen&&!!this.status,"z-scrollbar":!0}},this.resetItem&&this.renderResetItem(),this.renderSelectUlItems())))}renderResetItem(){const e=!this.selectedItem\|\|!this.resetItem;return i("z-list-element",{class:{hide:e,"reset-item":!0,"reset-item-margin":!this.hasGroupItems},clickable:!0,disabled:!1,dividerType:o.ELEMENT,role:e?"presentation":"option","html-tabindex":0,"aria-selected":"false","aria-label":e?void 0:this.resetItem,id:this.getResetOptionId(),size:this.hasTreeItems?n.MEDIUM:this.listSizeType(),onClickItem:()=>this.handleResetClick()},i("div",{class:{"reset-item-content":!0,"tree-list-reset-item":this.hasTreeItems,active:this.focusedItemId===this.getResetOptionId()},"aria-hidden":"true"},i("z-icon",{name:"multiply-circled"}),i("span",null,this.resetItem)))}renderItem(e,t){return i("z-list-element",{clickable:!e.disabled,disabled:e.disabled,dividerType:t?o.HEADER:o.ELEMENT,role:e.disabled?"presentation":"option","html-tabindex":-1,"aria-selected":e.selected?"true":"false","aria-label":e.disabled?void 0:h(e.name),id:this.getOptionId(e),size:this.listSizeType(),onClickItem:()=>this.selectItem(e)},i("div",{class:{"list-element-container":!0,active:this.focusedItemId===this.getOptionId(e)},"aria-hidden":"true"},i("div",{class:{selected:!!e.selected,"list-element-content":!0},innerHTML:e.name}),e.icon&&i("z-tag",{icon:e.icon})))}listSizeType(){return this.hasTreeItems?n.NONE:this.size===c.SMALL\|\|this.size===c.X_SMALL?n.SMALL:n.MEDIUM}renderSelectUlItems(){return this.itemsList.length?this.hasGroupItems?this.hasTreeItems?this.renderGroupedTree():this.renderSelectGroupItems():this.itemsList.map(((e,t,s)=>{const i=t===s.length-1;return this.hasTreeItems?this.renderTreeItems(e,i,s.length>1,!0,e.disabled):this.renderItem(e,i)})):this.renderNoSearchResults()}renderTreeItems(e,t,s,l,c){var r,n;const a=e.disabled\|\|c,d=this.hasGroupItems?void 0:this.hasGroupItems?t&&!s?o.ELEMENT:void 0:l&&s&&!t?o.ELEMENT:void 0;return i("z-list-element",{clickable:!e.disabled,disabled:a,class:{"grouped-tree-parent-node":this.hasGroupItems&&!!(null===(r=e.children)\|\|void 0===r?void 0:r.length),"tree-search-item":this.hasGroupItems&&l&&!(null===(n=e.children)\|\|void 0===n?void 0:n.length)&&!!this.searchString},size:this.listSizeType(),dividerType:d,hasTreeItems:this.hasTreeItems,"html-tabindex":null,role:"presentation"},i("div",{id:this.getOptionId(e),role:a?"presentation":"option","aria-label":a?void 0:h(e.name),class:{"list-element":!0,active:this.focusedItemId===this.getOptionId(e)},onClick:()=>this.selectItem(e)},i("span",{class:"item ellipsis","aria-hidden":"true"},i("span",{class:{"item-label":!0,selected:!!e.selected},title:e.name,innerHTML:e.name})),e.icon&&i("z-tag",{icon:e.icon})),e.children&&e.children.length>0?i("z-list",{role:"presentation"},i("div",{class:"children-node"},e.children.map(((e,t,s)=>this.renderTreeItems(e,t===s.length-1,s.length>1,!1,a))))):null)}renderGroupedTree(){const e=this.getGroupedItems();return e.map((([t,s],l,c)=>{const r=Object.values(e).some((e=>e.length>1));return i("z-list-group",{"divider-type":l===c.length-1?void 0:o.ELEMENT,hasTreeItems:!0,"aria-labelledby":`${this.htmlid}_tree_${l}`},i("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.htmlid}_tree_${l}`,"aria-hidden":"true"},t),i("z-list",{role:"presentation"},s.map(((e,t,s)=>[this.renderTreeItems(e,t===s.length-1,r,!0,e.disabled),t<s.length-1?i("z-divider",{key:"divider-"+t,style:{zIndex:"100",height:"var(--border-size-small)"}}):null]))),l!==c.length-1&&i("z-divider",{style:{zIndex:"100",height:"var(--border-size-small)"}}))}))}renderSelectGroupItems(){const e=this.getGroupedItems();return e.map((([t,s],l)=>{const c=e.length===l+1;return i("z-list-group",{"divider-type":o.ELEMENT,"aria-labelledby":`${this.htmlid}_group_${l}`},i("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.htmlid}_group_${l}`,"aria-hidden":"true"},t),s.map(((e,t)=>this.renderItem(e,c&&s.length===t+1))))}))}renderNoSearchResults(){return i("z-list-element",{class:"no-results",size:this.hasTreeItems?n.MEDIUM:this.listSizeType(),"html-tabindex":null,role:"presentation"},this.noresultslabel)}renderMessage(){if(!1!==d(this.message))return i("z-input-message",{message:!0===d(this.message)?void 0:this.message,status:this.status,class:this.size,disabled:this.disabled})}render(){return i("div",{key:"375b2aba49331cc572cb884f41f2d37c94c7f920",class:"select-wrapper"},this.renderInput(),this.renderSelectUl(),this.renderMessage())}get host(){return this}static get watchers(){return{items:[{watchItems:0}]}}static get style(){return'.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}'}},[2,"z-select",{htmlid:[1],items:[1],name:[1],label:[1],ariaLabel:[1,"aria-label"],disabled:[4],readonly:[4],placeholder:[1],htmltitle:[1],status:[1],message:[8],autocomplete:[4],noresultslabel:[1],hasGroupItems:[4,"has-group-items"],hasTreeItems:[4,"has-tree-items"],showChildrenOfMatchingParent:[4,"show-children-of-matching-parent"],isfixed:[4],resetItem:[1,"reset-item"],size:[1],isOpen:[32],selectedItem:[32],focusedItemId:[32],searchString:[32],getSelectedItem:[64],getValue:[64],setValue:[64]},void 0,{items:[{watchItems:0}]}]),k=y,I=function(){"undefined"!=typeof customElements&&["z-select","z-divider","z-icon","z-input","z-input-message","z-list","z-list-element","z-list-group","z-tag"].forEach((e=>{switch(e){case"z-select":customElements.get(l(e))\|\|customElements.define(l(e),y);break;case"z-divider":customElements.get(l(e))\|\|m();break;case"z-icon":customElements.get(l(e))\|\|u();break;case"z-input":customElements.get(l(e))\|\|f();break;case"z-input-message":customElements.get(l(e))\|\|v();break;case"z-list":customElements.get(l(e))\|\|b();break;case"z-list-element":customElements.get(l(e))\|\|g();break;case"z-list-group":customElements.get(l(e))\|\|w();break;case"z-tag":customElements.get(l(e))\|\|x()}}))};export{k as ZSelect,I as defineCustomElement}
1	+ import{proxyCustomElement as e,HTMLElement as t,createEvent as s,h as i,transformTag as l}from"@stencil/core/internal/client";import{e as c,g as r,i as n,l as a}from"./index2.js";import{r as o,e as h,b as d,d as z,f as p,i as m}from"./utils.js";import{d as u}from"./index6.js";import{d as f}from"./index3.js";import{d as v}from"./index7.js";import{d as b}from"./index8.js";import{d as g}from"./index9.js";import{d as w}from"./index10.js";import{d as x}from"./index11.js";import{d as y}from"./index14.js";const k=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.optionSelect=s(this,"optionSelect",7),this.resetSelect=s(this,"resetSelect",7),this.htmlid="id-"+o(),this.items=[],this.ariaLabel="",this.disabled=!1,this.readonly=!1,this.message=!0,this.autocomplete=!1,this.noresultslabel="Nessun risultato",this.isfixed=!1,this.size=c.BIG,this.isOpen=!1,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=[];"string"==typeof e?t.push(e):t=e,this.itemsList=this.getInitialItemsArray(),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"string"==typeof this.items?JSON.parse(this.items):this.items}mapSelectedItemToItemsArray(){var e;const t=this.getInitialItemsArray();return this.updateSelection(t,null===(e=this.selectedItem)\|\|void 0===e?void 0:e.id),t}getSelectedValue(){var e;return null===(e=this.selectedItem)\|\|void 0===e?void 0:e.id}getOptionId(e){return`${this.htmlid}_key_${h(e.id)}`}getResetOptionId(){return this.htmlid+"_key_reset"}getGroupedItems(){return this.itemsList.length?Object.entries(this.itemsList.reduce(((e,t)=>{const s=t.category\|\|"Altra categoria";return e[s]=e[s]\|\|[],e[s].push(t),e}),{})):[]}filterItems(e){let t=this.mapSelectedItemToItemsArray();(null==e?void 0:e.length)?(t=t.map((e=>Object.assign(Object.assign({},e),{name:d(e.name)}))),this.itemsList=this.hasTreeItems?this.filterTree(t,e,!1):t.filter((t=>t.name.toUpperCase().includes(e.toUpperCase()))).map((t=>(t.name=this.getHighlightedText(t.name,e),t)))):this.itemsList=t}filterTree(e,t,s){return e?e.map((e=>{const i=e.name.toUpperCase().includes(t.toUpperCase()),l=Object.assign({},e);return l.children&&l.children.length>0&&(l.children=this.filterTree(l.children.map((e=>Object.assign(Object.assign({},e),{name:d(e.name)}))),t,i)),i&&(l.name=this.getHighlightedText(l.name,t)),i\|\|l.children&&l.children.length>0\|\|this.showChildrenOfMatchingParent&&s?l:null})).filter((e=>null!==e)):[]}getHighlightedText(e,t){const s=e.toUpperCase(),i=t.toUpperCase(),l=s.indexOf(i);if(-1===l)return e;const c=l+t.length;return e.substring(0,l)+`<strong>${e.substring(l,c)}</strong>`+e.substring(c)}hasAutocomplete(){return!0===z(this.autocomplete)}handleInputChange(e){this.searchString=e.detail.value,this.isOpen\|\|this.toggleSelectUl()}updateSelection(e,t){e&&e.forEach((e=>{e.selected=e.id===t,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){(null==e?void 0:e.disabled)\|\|(this.itemsList=this.getInitialItemsArray(),e&&this.updateSelection(this.itemsList,e.id),this.selectedItem=this.findSelectedItem(this.itemsList),this.emitOptionSelect(),this.toggleSelectUl(),this.searchString&&(this.searchString=null))}handleResetClick(){this.selectedItem=null,this.searchString=null,this.focusedItemId="",this.emitResetSelect(),this.toggleSelectUl()}handleInputKeyDown(e){switch(e.code){case r.ENTER:case r.SPACE:if(this.focusedItemId)if(this.focusedItemId===this.getResetOptionId())this.handleResetClick();else{const e=this.itemsList.find((e=>this.getOptionId(e)===this.focusedItemId))\|\|null;e&&(this.selectedItem=e,this.emitOptionSelect(),this.toggleSelectUl())}break;case r.ARROW_DOWN:case r.ARROW_UP:this.arrowsSelectNav(e)}}arrowsSelectNav(e){if(![r.ARROW_DOWN,r.ARROW_UP].includes(e.key))return;e.preventDefault(),e.stopPropagation();const t=this.focusedItemId?this.host.querySelector("#"+this.focusedItemId):null,s=Array.from(this.host.querySelectorAll('[role="option"]'));if(!s.length)return;const i=t?s.indexOf(t):null,l=s.length-1;if(!this.isOpen&&(this.toggleSelectUl(),this.selectedItem))return void this.focusSelectItem(this.getOptionId(this.selectedItem));let c=null;e.code===r.ARROW_DOWN?c=null===i?s[0]:s[i+1]\|\|s[l]:e.code===r.ARROW_UP&&(c=null===i?s[l]:s[i-1]\|\|s[0]),this.focusSelectItem(c.id)}focusSelectItem(e){this.focusedItemId=e,this.host.querySelector("#"+e).scrollIntoView({block:"nearest",container:"nearest"})}toggleSelectUl(e=!1){var t;this.disabled\|\|this.readonly\|\|(this.isOpen?(document.removeEventListener("click",this.handleSelectFocus),document.removeEventListener("keyup",this.handleSelectFocus),e&&(null===(t=this.host.querySelector(`#${this.htmlid}_select_input`))\|\|void 0===t\|\|t.focus()),this.selectedItem&&this.searchString&&(this.searchString=null,this.filterItems(this.searchString))):(document.addEventListener("click",this.handleSelectFocus),document.addEventListener("keyup",this.handleSelectFocus)),this.focusedItemId="",this.isOpen=!this.isOpen)}handleInputClick(e){e.target.closest(".reset-icon")?e.stopPropagation():this.toggleSelectUl()}handleSelectFocus(e){if(e instanceof KeyboardEvent&&e.key===r.ESC)return e.stopPropagation(),this.toggleSelectUl(!0);if(e instanceof KeyboardEvent&&e.key!==r.TAB)return;const t=p();if(!(null==t?void 0:t.hasAttribute("disabled"))&&!m(t).find((e=>"z-input"===e.nodeName.toLowerCase()&&e.id===this.htmlid+"_input"))){const e=m(t).find((e=>"Z-SELECT"===e.nodeName));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()));t&&(this.isOpen\|\|this.toggleSelectUl(),this.focusSelectItem(this.getOptionId(t)))}renderInput(){let e=null;return this.selectedItem&&(e=d(this.selectedItem.name)),this.isOpen&&void 0!==this.searchString&&(e=this.searchString),[i("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:!1,message:!1,name:this.name,disabled:this.disabled,readonly:this.readonly\|\|!this.hasAutocomplete()&&this.isOpen,status:this.isOpen?void 0: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":void 0,onClick:e=>this.handleInputClick(e),onKeyDown:e=>this.handleInputKeyDown(e),onInputChange:e=>this.handleInputChange(e),onKeyPress:e=>{this.hasAutocomplete()\|\|(e.preventDefault(),this.scrollToLetter(e.key))}})]}renderSelectUl(){return i("div",{class:this.isOpen?"open":"closed"},i("div",{class:{"ul-scroll-wrapper":!0,fixed:this.isfixed}},i("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":!1,size:this.listSizeType(),class:{disabled:this.disabled,readonly:this.readonly,["input-"+this.status]:!this.isOpen&&!!this.status,"z-scrollbar":!0}},this.resetItem&&this.renderResetItem(),this.renderSelectUlItems())))}renderResetItem(){const e=!this.selectedItem\|\|!this.resetItem;return i("z-list-element",{class:{hide:e,"reset-item":!0,"reset-item-margin":!this.hasGroupItems},clickable:!0,disabled:!1,dividerType:a.ELEMENT,role:e?"presentation":"option","html-tabindex":0,"aria-selected":"false","aria-label":e?void 0:this.resetItem,id:this.getResetOptionId(),size:this.hasTreeItems?n.MEDIUM:this.listSizeType(),onClickItem:()=>this.handleResetClick()},i("div",{class:{"reset-item-content":!0,"tree-list-reset-item":this.hasTreeItems,active:this.focusedItemId===this.getResetOptionId()},"aria-hidden":"true"},i("z-icon",{name:"multiply-circled"}),i("span",null,this.resetItem)))}renderItem(e,t){return i("z-list-element",{clickable:!e.disabled,disabled:e.disabled,dividerType:t?a.HEADER:a.ELEMENT,role:e.disabled?"presentation":"option","html-tabindex":-1,"aria-selected":e.selected?"true":"false","aria-label":e.disabled?void 0:d(e.name),id:this.getOptionId(e),size:this.listSizeType(),onClickItem:()=>this.selectItem(e)},i("div",{class:{"list-element-container":!0,active:this.focusedItemId===this.getOptionId(e)},"aria-hidden":"true"},i("div",{class:{selected:!!e.selected,"list-element-content":!0},innerHTML:e.name}),e.icon&&i("z-tag",{icon:e.icon})))}listSizeType(){return this.hasTreeItems?n.NONE:this.size===c.SMALL\|\|this.size===c.X_SMALL?n.SMALL:n.MEDIUM}renderSelectUlItems(){return this.itemsList.length?this.hasGroupItems?this.hasTreeItems?this.renderGroupedTree():this.renderSelectGroupItems():this.itemsList.map(((e,t,s)=>{const i=t===s.length-1;return this.hasTreeItems?this.renderTreeItems(e,i,s.length>1,!0,e.disabled):this.renderItem(e,i)})):this.renderNoSearchResults()}renderTreeItems(e,t,s,l,c){var r,n;const o=e.disabled\|\|c,h=this.hasGroupItems?void 0:this.hasGroupItems?t&&!s?a.ELEMENT:void 0:l&&s&&!t?a.ELEMENT:void 0;return i("z-list-element",{clickable:!e.disabled,disabled:o,class:{"grouped-tree-parent-node":this.hasGroupItems&&!!(null===(r=e.children)\|\|void 0===r?void 0:r.length),"tree-search-item":this.hasGroupItems&&l&&!(null===(n=e.children)\|\|void 0===n?void 0:n.length)&&!!this.searchString},size:this.listSizeType(),dividerType:h,hasTreeItems:this.hasTreeItems,"html-tabindex":null,role:"presentation"},i("div",{id:this.getOptionId(e),role:o?"presentation":"option","aria-label":o?void 0:d(e.name),class:{"list-element":!0,active:this.focusedItemId===this.getOptionId(e)},onClick:()=>this.selectItem(e)},i("span",{class:"item ellipsis","aria-hidden":"true"},i("span",{class:{"item-label":!0,selected:!!e.selected},title:e.name,innerHTML:e.name})),e.icon&&i("z-tag",{icon:e.icon})),e.children&&e.children.length>0?i("z-list",{role:"presentation"},i("div",{class:"children-node"},e.children.map(((e,t,s)=>this.renderTreeItems(e,t===s.length-1,s.length>1,!1,o))))):null)}renderGroupedTree(){const e=this.getGroupedItems();return e.map((([t,s],l,c)=>{const r=Object.values(e).some((e=>e.length>1));return i("z-list-group",{"divider-type":l===c.length-1?void 0:a.ELEMENT,hasTreeItems:!0,"aria-labelledby":`${this.htmlid}_tree_${l}`},i("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.htmlid}_tree_${l}`,"aria-hidden":"true"},t),i("z-list",{role:"presentation"},s.map(((e,t,s)=>[this.renderTreeItems(e,t===s.length-1,r,!0,e.disabled),t<s.length-1?i("z-divider",{key:"divider-"+t,style:{zIndex:"100",height:"var(--border-size-small)"}}):null]))),l!==c.length-1&&i("z-divider",{style:{zIndex:"100",height:"var(--border-size-small)"}}))}))}renderSelectGroupItems(){const e=this.getGroupedItems();return e.map((([t,s],l)=>{const c=e.length===l+1;return i("z-list-group",{"divider-type":a.ELEMENT,"aria-labelledby":`${this.htmlid}_group_${l}`},i("span",{class:"body-3-sb z-list-group-title",slot:"header-title",id:`${this.htmlid}_group_${l}`,"aria-hidden":"true"},t),s.map(((e,t)=>this.renderItem(e,c&&s.length===t+1))))}))}renderNoSearchResults(){return i("z-list-element",{class:"no-results",size:this.hasTreeItems?n.MEDIUM:this.listSizeType(),"html-tabindex":null,role:"presentation"},this.noresultslabel)}renderMessage(){if(!1!==z(this.message))return i("z-input-message",{message:!0===z(this.message)?void 0:this.message,status:this.status,class:this.size,disabled:this.disabled})}render(){return i("div",{key:"d185176ecce45cde5970a2dceb27065ef27512cb",class:"select-wrapper"},this.renderInput(),this.renderSelectUl(),this.renderMessage())}get host(){return this}static get watchers(){return{items:[{watchItems:0}]}}static get style(){return'.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}'}},[2,"z-select",{htmlid:[1],items:[1],name:[1],label:[1],ariaLabel:[1,"aria-label"],disabled:[4],readonly:[4],placeholder:[1],htmltitle:[1],status:[1],message:[8],autocomplete:[4],noresultslabel:[1],hasGroupItems:[4,"has-group-items"],hasTreeItems:[4,"has-tree-items"],showChildrenOfMatchingParent:[4,"show-children-of-matching-parent"],isfixed:[4],resetItem:[1,"reset-item"],size:[1],isOpen:[32],selectedItem:[32],focusedItemId:[32],searchString:[32],getSelectedItem:[64],getValue:[64],setValue:[64]},void 0,{items:[{watchItems:0}]}]),I=k,S=function(){"undefined"!=typeof customElements&&["z-select","z-divider","z-icon","z-input","z-input-message","z-list","z-list-element","z-list-group","z-tag"].forEach((e=>{switch(e){case"z-select":customElements.get(l(e))\|\|customElements.define(l(e),k);break;case"z-divider":customElements.get(l(e))\|\|u();break;case"z-icon":customElements.get(l(e))\|\|f();break;case"z-input":customElements.get(l(e))\|\|v();break;case"z-input-message":customElements.get(l(e))\|\|b();break;case"z-list":customElements.get(l(e))\|\|g();break;case"z-list-element":customElements.get(l(e))\|\|w();break;case"z-list-group":customElements.get(l(e))\|\|x();break;case"z-tag":customElements.get(l(e))\|\|y()}}))};export{I as ZSelect,S as defineCustomElement}

package/dist/components/z-skip-to-content.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as t,HTMLElement as i,h as n,Host as o,transformTag as s}from"@stencil/core/internal/client";import{T as e}from"./index2.js";import{f as c,h as l}from"./utils.js";const r=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.links=[],this.visible=!1,this.visibleLink=""}handleFocusOutSkipToContent(t){this.isInSkipToContent(t.target)&&(this.visible=!1)}handleFocusSkipToContent(t){this.isInSkipToContent(t.target)&&(this.visible=!0)}componentDidLoad(){this.showFirstChild()}componentWillRender(){this.links&&(this.links="string"==typeof this.links?JSON.parse(this.links):this.links)}isInSkipToContent(t){const i=c(t).find((t=>"z-skip-to-content"===t.nodeName.toLowerCase()));return!!i}showFirstChild(){var t;const i=null===(t=this.hostElement.children)\|\|void 0===t?void 0:t[0];i&&(this.visibleLink=i.id)}handleLinkClick(){this.visible=!1}render(){return n(o,{key:"b0c2efcd257373ca8473d2f8135dc5c5d69e6d8f",class:{[this.variant]:!0,"skip-to-content-visible":this.visible}},this.links.map(((t,i)=>{const o="skip-to-content-"+i;return n("div",{class:"link-container"},n("a",{id:o,class:{"body-1-sb":!0,"z-link":!0,"z-link-underline":!0,"z-link-inverse":this.variant===e.DARK,"link-visible":o==this.visibleLink,"link-invisible":o!=this.visibleLink},"aria-label":t.ariaLabel\|\|t.label,href:t.href,onFocus:()=>this.visibleLink=o,onClick:()=>this.handleLinkClick(),onKeyUp:t=>l(t,this.handleLinkClick.bind(this))},t.label))})))}get hostElement(){return this}static get style(){return".sc-z-skip-to-content-h{position:absolute;left:-100%;height:60px;box-sizing:border-box;padding:calc(var(--space-unit) * 1.25) calc(var(--space-unit) * 3);background-color:#24f4ff;font-family:var(--font-family-sans);font-weight:var(--font-rg);text-align:center}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{display:inline-flex;height:100%;align-items:center}.skip-to-content-visible.sc-z-skip-to-content-h,.sc-z-skip-to-content-h:focus{position:static;display:block}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-invisible.sc-z-skip-to-content{overflow:hidden;width:0;height:0}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-visible.sc-z-skip-to-content{width:initial;height:initial}.dark.sc-z-skip-to-content-h{background-color:var(--color-surface05);color:var(--color-surface01)}.light.sc-z-skip-to-content-h{border:var(--border-size-medium) solid var(--color-surface05);background-color:var(--color-surface01);color:var(--color-default-text)}@media (min-width: 768px){.sc-z-skip-to-content-h{text-align:start}}@media (min-width: 1152px){.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{padding:0 calc(var(--space-unit) * 3);border-right:var(--border-size-small) solid var(--color-surface05)}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-invisible.sc-z-skip-to-content{overflow:initial;width:initial;height:initial}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:first-child{padding-left:0}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child,.dark.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child,.light.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child{padding-right:0;border-right:none}.dark.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{border-right:var(--border-size-small) solid var(--color-surface01)}}"}},[2,"z-skip-to-content",{variant:[513],links:[1025],visible:[32],visibleLink:[32]},[[4,"focusout","handleFocusOutSkipToContent"],[4,"focusin","handleFocusSkipToContent"]]]),a=r,h=function(){"undefined"!=typeof customElements&&["z-skip-to-content"].forEach((t=>{"z-skip-to-content"===t&&(customElements.get(s(t))\|\|customElements.define(s(t),r))}))};export{a as ZSkipToContent,h as defineCustomElement}
1	+ import{proxyCustomElement as t,HTMLElement as i,h as n,Host as o,transformTag as s}from"@stencil/core/internal/client";import{T as e}from"./index2.js";import{i as c,h as l}from"./utils.js";const r=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.links=[],this.visible=!1,this.visibleLink=""}handleFocusOutSkipToContent(t){this.isInSkipToContent(t.target)&&(this.visible=!1)}handleFocusSkipToContent(t){this.isInSkipToContent(t.target)&&(this.visible=!0)}componentDidLoad(){this.showFirstChild()}componentWillRender(){this.links&&(this.links="string"==typeof this.links?JSON.parse(this.links):this.links)}isInSkipToContent(t){const i=c(t).find((t=>"z-skip-to-content"===t.nodeName.toLowerCase()));return!!i}showFirstChild(){var t;const i=null===(t=this.hostElement.children)\|\|void 0===t?void 0:t[0];i&&(this.visibleLink=i.id)}handleLinkClick(){this.visible=!1}render(){return n(o,{key:"b0c2efcd257373ca8473d2f8135dc5c5d69e6d8f",class:{[this.variant]:!0,"skip-to-content-visible":this.visible}},this.links.map(((t,i)=>{const o="skip-to-content-"+i;return n("div",{class:"link-container"},n("a",{id:o,class:{"body-1-sb":!0,"z-link":!0,"z-link-underline":!0,"z-link-inverse":this.variant===e.DARK,"link-visible":o==this.visibleLink,"link-invisible":o!=this.visibleLink},"aria-label":t.ariaLabel\|\|t.label,href:t.href,onFocus:()=>this.visibleLink=o,onClick:()=>this.handleLinkClick(),onKeyUp:t=>l(t,this.handleLinkClick.bind(this))},t.label))})))}get hostElement(){return this}static get style(){return".sc-z-skip-to-content-h{position:absolute;left:-100%;height:60px;box-sizing:border-box;padding:calc(var(--space-unit) * 1.25) calc(var(--space-unit) * 3);background-color:#24f4ff;font-family:var(--font-family-sans);font-weight:var(--font-rg);text-align:center}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{display:inline-flex;height:100%;align-items:center}.skip-to-content-visible.sc-z-skip-to-content-h,.sc-z-skip-to-content-h:focus{position:static;display:block}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-invisible.sc-z-skip-to-content{overflow:hidden;width:0;height:0}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-visible.sc-z-skip-to-content{width:initial;height:initial}.dark.sc-z-skip-to-content-h{background-color:var(--color-surface05);color:var(--color-surface01)}.light.sc-z-skip-to-content-h{border:var(--border-size-medium) solid var(--color-surface05);background-color:var(--color-surface01);color:var(--color-default-text)}@media (min-width: 768px){.sc-z-skip-to-content-h{text-align:start}}@media (min-width: 1152px){.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{padding:0 calc(var(--space-unit) * 3);border-right:var(--border-size-small) solid var(--color-surface05)}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-invisible.sc-z-skip-to-content{overflow:initial;width:initial;height:initial}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:first-child{padding-left:0}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child,.dark.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child,.light.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child{padding-right:0;border-right:none}.dark.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{border-right:var(--border-size-small) solid var(--color-surface01)}}"}},[2,"z-skip-to-content",{variant:[513],links:[1025],visible:[32],visibleLink:[32]},[[4,"focusout","handleFocusOutSkipToContent"],[4,"focusin","handleFocusSkipToContent"]]]),a=r,h=function(){"undefined"!=typeof customElements&&["z-skip-to-content"].forEach((t=>{"z-skip-to-content"===t&&(customElements.get(s(t))\|\|customElements.define(s(t),r))}))};export{a as ZSkipToContent,h as defineCustomElement}

package/dist/components/z-slideshow.js CHANGED Viewed

	@@ -1 +1 @@
1	- import{proxyCustomElement as t,HTMLElement as e,h as i,transformTag as r}from"@stencil/core/internal/client";import{p as s}from"./index2.js";import{i as o,g as n,h as a}from"./utils.js";import{d as l}from"./index3.js";const d=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.currentSlide=0}watchData(){this.parseLinks()}componentWillLoad(){this.parseLinks(),this.setDevice(),window.addEventListener("resize",this.handleResize.bind(this))}componentDidRender(){this.setStyle()}handleResize(){this.setDevice(),this.setStyle()}parseLinks(){var t;switch(typeof this.data){case"string":{const e=null!==(t=o(this.data))&&void 0!==t?t:[];if(!function(t){return Array.isArray(t)&&t.every((t=>"string"==typeof t))}(e))throw Error("Passed data is invalid");this.links=e;break}default:this.links=this.data}}setStyle(){const t=this.el.shadowRoot.querySelector("#slides");if(!t)return;const e=this.el.shadowRoot.querySelectorAll(".slide"),i=this.el.offsetWidth;t.style.width=ithis.links.length+"px",t.style.transform=`translate(-${ithis.currentSlide}px)`,e.forEach((t=>{t.querySelector("img").style.width=i+"px"}))}setDevice(){this.device=n()}setCurrentSlide(t){this.currentSlide=t}getBulletDimension(){switch(this.device){case s.MOBILE:return 24;case s.TABLET:return 32;default:return 40}}renderSlides(t){return i("div",{id:"slides"},t.map(((t,e)=>i("div",{id:"slide"+e,class:"slide "+(this.currentSlide!==e&&"hide")},i("img",{src:t})))))}renderScroll(t){let e=!1,r=this.currentSlide;return"left"===t?(e=0===this.currentSlide,r--):"right"===t&&(e=this.currentSlide===this.links.length-1,r++),i("z-icon",{class:`scroll ${t} ${e&&"disabled"}`,width:this.getBulletDimension(),height:this.getBulletDimension(),name:`chevron-${t}-circle`,onClick:()=>{e\|\|this.setCurrentSlide(r)},onKeyUp:t=>!e&&a(t,(()=>{this.setCurrentSlide(r)})),tabindex:0,role:"button"})}renderSlideshowMain(){return i("main",null,this.renderScroll("left"),this.renderSlides(this.links),this.renderScroll("right"))}renderBullet(t){return i("a",{class:"bullet "+(this.currentSlide===t&&"selected"),onClick:()=>this.setCurrentSlide(t),onKeyUp:e=>a(e,(()=>this.setCurrentSlide(t))),tabindex:0,role:"button"})}renderSlideshowFooter(){return i("footer",null,i("div",{class:"footer-left"},i("slot",{name:"footer-left"})),i("div",{class:"footer-center"},i("div",{class:"bullet-container"},Object.keys(this.links).map((t=>this.renderBullet(parseInt(t)))))),i("div",{class:"footer-right"},i("slot",{name:"footer-right"})))}render(){return this.links&&this.links.length?i("div",{id:this.slideshowid},this.renderSlideshowMain(),this.renderSlideshowFooter()):i("div",null)}get el(){return this}static get watchers(){return{data:[{watchData:0}]}}static get style(){return':host{display:block;width:inherit;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{display:flex;width:inherit;flex-direction:column}main{position:relative;overflow:hidden;width:100%}main z-icon.scroll{position:absolute;z-index:10;top:50%;width:auto;margin:0 var(--space-unit);cursor:pointer;fill:var(--color-primary01);transition:0.6s ease}main .scroll.disabled{opacity:0.5;pointer-events:none}main .scroll.right{right:0}#slides{display:flex;flex-wrap:wrap;line-height:0px;overflow-y:hidden;transition:all 300ms}footer{display:grid;width:100%;height:56px;align-items:center;border-top:var(--border-size-medium) solid var(--color-background);grid-template:2 / 2;grid-template-areas:"center center" "left right"}footer>div{width:100%;align-items:center}footer .footer-center{grid-area:center}footer .footer-left{grid-area:left}footer .footer-right{grid-area:right}footer .bullet-container{display:flex;min-height:60px;align-items:center;justify-content:center;margin:0 auto}footer .bullet-container .bullet{width:8px;height:8px;margin:var(--space-unit) 2px;background-color:var(--gray200);border-radius:50%;pointer-events:none}footer .bullet-container .bullet.selected{background-color:var(--gray400)}main z-icon:focus,footer .bullet-container .bullet:focus{border-radius:50%;box-shadow:var(--shadow-focus-primary);outline:none !important}@media only screen and (min-width: 768px){footer{height:76px;border-top:var(--border-size-medium) solid var(--color-background);grid-template:1 / 1fr 2fr 1fr;grid-template-areas:"left center right"}footer .bullet-container .bullet{width:10px;height:10px;margin:var(--space-unit) 3px}}@media only screen and (min-width: 1025px){main z-icon.scroll{margin:0 10px}footer .bullet-container .bullet{width:16px;height:16px;margin:var(--space-unit) calc(var(--space-unit) * 0.5);cursor:pointer;pointer-events:auto}}'}},[257,"z-slideshow",{slideshowid:[1],data:[1],device:[32],currentSlide:[32]},void 0,{data:[{watchData:0}]}]),h=d,c=function(){"undefined"!=typeof customElements&&["z-slideshow","z-icon"].forEach((t=>{switch(t){case"z-slideshow":customElements.get(r(t))\|\|customElements.define(r(t),d);break;case"z-icon":customElements.get(r(t))\|\|l()}}))};export{h as ZSlideshow,c as defineCustomElement}
1	+ import{proxyCustomElement as t,HTMLElement as e,h as i,transformTag as r}from"@stencil/core/internal/client";import{p as s}from"./index2.js";import{j as o,g as n,h as a}from"./utils.js";import{d as l}from"./index3.js";const d=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.currentSlide=0}watchData(){this.parseLinks()}componentWillLoad(){this.parseLinks(),this.setDevice(),window.addEventListener("resize",this.handleResize.bind(this))}componentDidRender(){this.setStyle()}handleResize(){this.setDevice(),this.setStyle()}parseLinks(){var t;switch(typeof this.data){case"string":{const e=null!==(t=o(this.data))&&void 0!==t?t:[];if(!function(t){return Array.isArray(t)&&t.every((t=>"string"==typeof t))}(e))throw Error("Passed data is invalid");this.links=e;break}default:this.links=this.data}}setStyle(){const t=this.el.shadowRoot.querySelector("#slides");if(!t)return;const e=this.el.shadowRoot.querySelectorAll(".slide"),i=this.el.offsetWidth;t.style.width=ithis.links.length+"px",t.style.transform=`translate(-${ithis.currentSlide}px)`,e.forEach((t=>{t.querySelector("img").style.width=i+"px"}))}setDevice(){this.device=n()}setCurrentSlide(t){this.currentSlide=t}getBulletDimension(){switch(this.device){case s.MOBILE:return 24;case s.TABLET:return 32;default:return 40}}renderSlides(t){return i("div",{id:"slides"},t.map(((t,e)=>i("div",{id:"slide"+e,class:"slide "+(this.currentSlide!==e&&"hide")},i("img",{src:t})))))}renderScroll(t){let e=!1,r=this.currentSlide;return"left"===t?(e=0===this.currentSlide,r--):"right"===t&&(e=this.currentSlide===this.links.length-1,r++),i("z-icon",{class:`scroll ${t} ${e&&"disabled"}`,width:this.getBulletDimension(),height:this.getBulletDimension(),name:`chevron-${t}-circle`,onClick:()=>{e\|\|this.setCurrentSlide(r)},onKeyUp:t=>!e&&a(t,(()=>{this.setCurrentSlide(r)})),tabindex:0,role:"button"})}renderSlideshowMain(){return i("main",null,this.renderScroll("left"),this.renderSlides(this.links),this.renderScroll("right"))}renderBullet(t){return i("a",{class:"bullet "+(this.currentSlide===t&&"selected"),onClick:()=>this.setCurrentSlide(t),onKeyUp:e=>a(e,(()=>this.setCurrentSlide(t))),tabindex:0,role:"button"})}renderSlideshowFooter(){return i("footer",null,i("div",{class:"footer-left"},i("slot",{name:"footer-left"})),i("div",{class:"footer-center"},i("div",{class:"bullet-container"},Object.keys(this.links).map((t=>this.renderBullet(parseInt(t)))))),i("div",{class:"footer-right"},i("slot",{name:"footer-right"})))}render(){return this.links&&this.links.length?i("div",{id:this.slideshowid},this.renderSlideshowMain(),this.renderSlideshowFooter()):i("div",null)}get el(){return this}static get watchers(){return{data:[{watchData:0}]}}static get style(){return':host{display:block;width:inherit;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{display:flex;width:inherit;flex-direction:column}main{position:relative;overflow:hidden;width:100%}main z-icon.scroll{position:absolute;z-index:10;top:50%;width:auto;margin:0 var(--space-unit);cursor:pointer;fill:var(--color-primary01);transition:0.6s ease}main .scroll.disabled{opacity:0.5;pointer-events:none}main .scroll.right{right:0}#slides{display:flex;flex-wrap:wrap;line-height:0px;overflow-y:hidden;transition:all 300ms}footer{display:grid;width:100%;height:56px;align-items:center;border-top:var(--border-size-medium) solid var(--color-background);grid-template:2 / 2;grid-template-areas:"center center" "left right"}footer>div{width:100%;align-items:center}footer .footer-center{grid-area:center}footer .footer-left{grid-area:left}footer .footer-right{grid-area:right}footer .bullet-container{display:flex;min-height:60px;align-items:center;justify-content:center;margin:0 auto}footer .bullet-container .bullet{width:8px;height:8px;margin:var(--space-unit) 2px;background-color:var(--gray200);border-radius:50%;pointer-events:none}footer .bullet-container .bullet.selected{background-color:var(--gray400)}main z-icon:focus,footer .bullet-container .bullet:focus{border-radius:50%;box-shadow:var(--shadow-focus-primary);outline:none !important}@media only screen and (min-width: 768px){footer{height:76px;border-top:var(--border-size-medium) solid var(--color-background);grid-template:1 / 1fr 2fr 1fr;grid-template-areas:"left center right"}footer .bullet-container .bullet{width:10px;height:10px;margin:var(--space-unit) 3px}}@media only screen and (min-width: 1025px){main z-icon.scroll{margin:0 10px}footer .bullet-container .bullet{width:16px;height:16px;margin:var(--space-unit) calc(var(--space-unit) * 0.5);cursor:pointer;pointer-events:auto}}'}},[257,"z-slideshow",{slideshowid:[1],data:[1],device:[32],currentSlide:[32]},void 0,{data:[{watchData:0}]}]),h=d,c=function(){"undefined"!=typeof customElements&&["z-slideshow","z-icon"].forEach((t=>{switch(t){case"z-slideshow":customElements.get(r(t))\|\|customElements.define(r(t),d);break;case"z-icon":customElements.get(r(t))\|\|l()}}))};export{h as ZSlideshow,c as defineCustomElement}