@zanichelli/albe-web-components 18.7.4 → 18.7.5-RC2

package/www/build/web-components-library.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["patchBrowser","patchCloneNodeFix","H","prototype","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","appendChild","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.20.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"iIAOA,IAAIA,EAAe,KAIO,CACtBC,EAAkBC,EAAEC,UACxB,CAIE,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EAE7B,IAAIL,EAAqBU,IACvB,MAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAASC,GACxC,GAAIC,KAAKC,WAAa,WAAY,CAChC,OAAOJ,EAAkBK,KAAKF,KAAMD,EAC1C,CACI,MAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,MAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACR,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAC7C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACnCL,EAAWM,YAAYL,EAAcE,GAAGR,UAAU,MAC5D,CACA,CACA,CACI,OAAOK,CACX,CAAG,ECpCHlB,IAAeyB,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,isjBAAuCJ,EAAA","ignoreList":[]}
+{"version":3,"names":["patchBrowser","patchCloneNodeFix","H","prototype","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","HTMLElementPrototype","nativeCloneNodeFn","cloneNode","deep","this","nodeName","call","clonedNode","srcChildNodes","childNodes","i","length","nodeType","appendChild","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.20.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"iIAOA,IAAIA,EAAe,KAIO,CACtBC,EAAkBC,EAAEC,UACxB,CAIE,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EAE7B,IAAIL,EAAqBU,IACvB,MAAMC,EAAoBD,EAAqBE,UAC/CF,EAAqBE,UAAY,SAASC,GACxC,GAAIC,KAAKC,WAAa,WAAY,CAChC,OAAOJ,EAAkBK,KAAKF,KAAMD,EAC1C,CACI,MAAMI,EAAaN,EAAkBK,KAAKF,KAAM,OAChD,MAAMI,EAAgBJ,KAAKK,WAC3B,GAAIN,EAAM,CACR,IAAK,IAAIO,EAAI,EAAGA,EAAIF,EAAcG,OAAQD,IAAK,CAC7C,GAAIF,EAAcE,GAAGE,WAAa,EAAG,CACnCL,EAAWM,YAAYL,EAAcE,GAAGR,UAAU,MAC5D,CACA,CACA,CACI,OAAOK,CACX,CAAG,ECpCHlB,IAAeyB,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,6pjBAAuCJ,EAAA","ignoreList":[]}

package/www/index.html

@@ -1,3 +1,3 @@
-<!doctype html><html dir="ltr" lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"> <title>Albe test application</title> <link rel="stylesheet" type="text/css" href="/build/p-dbdf8ca8.css"> <link rel="modulepreload" href="/build/p-ab9c93f9.js"><link rel="modulepreload" href="/build/p-17af7fb2.js"><link rel="modulepreload" href="/build/p-5145a606.js"><link rel="modulepreload" href="/build/p-625e2cee.js"><link rel="modulepreload" href="/build/p-75c4a726.js"><script type="module" src="/build/p-ab9c93f9.js" data-stencil data-resources-url="/build/" data-stencil-namespace="web-components-library"></script> <script nomodule="" src="/build/web-components-library.js" data-stencil></script> </head> <body> <header> <z-app-header> <h1 slot="title">Albe test app</h1> </z-app-header> </header> <main></main> <style>body {
+<!doctype html><html dir="ltr" lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"> <title>Albe test application</title> <link rel="stylesheet" type="text/css" href="/build/p-3795cd04.css"> <link rel="modulepreload" href="/build/p-fff35038.js"><link rel="modulepreload" href="/build/p-17af7fb2.js"><link rel="modulepreload" href="/build/p-5145a606.js"><link rel="modulepreload" href="/build/p-625e2cee.js"><link rel="modulepreload" href="/build/p-75c4a726.js"><script type="module" src="/build/p-fff35038.js" data-stencil data-resources-url="/build/" data-stencil-namespace="web-components-library"></script> <script nomodule="" src="/build/web-components-library.js" data-stencil></script> </head> <body> <header> <z-app-header> <h1 slot="title">Albe test app</h1> </z-app-header> </header> <main></main> <style>body {
       margin: 0;
     }</style> </body></html>

package/dist/web-components-library/p-22c755d5.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,g as s}from"./p-75c4a726.js";import{I as o,e as a,i as r,g as n,l as h}from"./p-17af7fb2.js";import{r as l,d as c}from"./p-625e2cee.js";import"./p-5145a606.js";const d='.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;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([size="x-small"])>div>.header p.body-3{padding:calc(var(--space-unit) * 0.5) 0}: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>p.body-3{padding:var(--space-unit) 0;margin:0}:host>div>.header>p.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>p.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.open>div.open-combo-data{position:relative;z-index:12;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)}::-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)\n    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)}';const p=d;const u=class{watchItems(){this.itemsList=typeof this.items==="string"?JSON.parse(this.items):this.items;this.selectedCounter=this.itemsList.filter((t=>t.checked)).length;this.updateRenderItemsList()}watchSearchValue(){this.filterItems(this.searchValue)}watchCheckboxes(){this.checkboxes.forEach(((t,e)=>t.setAttribute("tabindex",e===0?"0":"-1")))}emitComboboxChange(){this.comboboxChange.emit({id:this.inputid,items:this.itemsList})}constructor(i){t(this,i);this.comboboxChange=e(this,"comboboxChange",7);this.itemsList=[];this.inputType=o.TEXT;this.inputid=`combo-${l()}`;this.items=undefined;this.label=undefined;this.disabled=false;this.hassearch=false;this.searchlabel=undefined;this.searchplaceholder=undefined;this.searchtitle=undefined;this.noresultslabel="Nessun risultato";this.isopen=false;this.isfixed=false;this.closesearchtext="Chiudi";this.hascheckall=false;this.checkalltext="Seleziona tutti";this.uncheckalltext="Deseleziona tutti";this.maxcheckableitems=0;this.hasgroupitems=undefined;this.size=a.BIG;this.searchValue=undefined;this.selectedCounter=undefined;this.renderItemsList=[];this.focusedItemId=undefined;this.checkboxes=[];this.toggleComboBox=this.toggleComboBox.bind(this);this.closeFilterItems=this.closeFilterItems.bind(this)}componentWillLoad(){this.watchItems()}componentWillRender(){this.selectedCounter=this.itemsList.filter((t=>t.checked)).length}componentDidRender(){const t=this.getAllCheckboxes();if(JSON.stringify(t)!==JSON.stringify(this.checkboxes)){this.checkboxes=t}}getItemId(t){return`combo-checkbox-${this.inputid}-${t.id}`}getCheckboxClass(){return`combo-item-checkbox-input-${this.inputid}`}getAllCheckboxes(){return Array.from(this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`))}getControlToListSize(){switch(this.size){case a.X_SMALL:return r.SMALL;case a.SMALL:return r.MEDIUM;default:return r.LARGE}}handleSelectArrowsNavigation(t,e){if(![n.ARROW_DOWN,n.ARROW_UP].includes(t.key)||!this.isopen){return}t.preventDefault();t.stopPropagation();const i=this.element.shadowRoot.querySelector(`#${e}`);if(!i){return}const s=this.checkboxes;if(!s.length){return}const o=s.indexOf(i);const a=0;const r=s.length-1;let h=null;if(t.key===n.ARROW_DOWN){h=o===r?s[a]:s[o+1]}else if(t.key===n.ARROW_UP){h=o===a?s[r]:s[o-1]}this.focusComboboxItem(h)}handleHeaderKeyboardEvent(t){if(t.key===n.SPACE){t.preventDefault()}if(t.key===n.ARROW_DOWN&&!this.isopen||t.key===n.ARROW_UP&&this.isopen){this.toggleComboBox()}}handleCheckboxFocus(t){this.focusedItemId=t}focusComboboxItem(t){this.checkboxes.forEach((function(t){t.setAttribute("tabindex","-1")}));t.setAttribute("tabindex","0");t.focus()}updateRenderItemsList(){if(this.searchValue){this.filterItems(this.searchValue)}else{this.resetRenderItemsList()}}resetRenderItemsList(){const t=[];this.itemsList.forEach((e=>{t.push(Object.assign({},e))}));this.renderItemsList=t}filterItems(t){if(!t){return this.closeFilterItems()}this.resetRenderItemsList();this.renderItemsList=this.renderItemsList.filter((e=>{const i=e.name.toUpperCase().indexOf(t.toUpperCase());const s=i+t.length;const o=e.name.substring(0,i)+"<strong>"+e.name.substring(i,s)+"</strong>"+e.name.substring(s,e.name.length);e.name=o;return i>=0}))}checkAll(t=true){this.itemsList=this.itemsList.map((e=>Object.assign(Object.assign({},e),{checked:t})));this.resetRenderItemsList();this.emitComboboxChange()}closeFilterItems(){this.searchValue="";this.resetRenderItemsList()}toggleComboBox(){this.isopen=!this.isopen}getComboboxA11yAttributes(){return{role:"combobox","aria-label":this.label,"aria-expanded":this.isopen?"true":"false","aria-activedescendant":this.isopen?this.focusedItemId:"","aria-controls":`${this.inputid}_list`}}renderHeader(){return i("div",{class:"header",onClick:()=>this.toggleComboBox(),onKeyDown:t=>{this.handleHeaderKeyboardEvent(t)},onKeyUp:t=>c(t,this.toggleComboBox),role:"button",tabindex:0,"aria-expanded":this.isopen?"true":"false"},i("p",{class:"body-3"},this.label,i("span",null,this.selectedCounter>0&&` (${this.selectedCounter})`)),i("z-icon",{name:"caret-down",class:this.size}))}renderContent(){if(!this.isopen){return}return i("div",{class:"open-combo-data"},this.hassearch&&this.renderSearchInput(),!this.hassearch?i("span",Object.assign({},this.getComboboxA11yAttributes())):null,i("div",{role:"listbox","aria-label":this.label,"aria-multiselectable":true,id:`${this.inputid}_list`,"aria-owns":`${this.checkboxes.map((t=>t.id)).join(" ")}`},this.hascheckall&&this.renderCheckAll(),this.renderItems()))}renderItems(){return i("div",{class:this.searchValue&&"search"},this.renderList(this.renderItemsList),this.searchValue&&this.renderCloseButton())}renderItem(t,e,s){return i("z-list-element",{id:t.id,htmlTabindex:null,dividerType:e!==s-1?h.ELEMENT:h.NONE,size:this.getControlToListSize()},i("z-input",{type:o.CHECKBOX,checked:t.checked,htmlid:this.getItemId(t),label:t.name,class:this.getCheckboxClass(),disabled:!t.checked&&this.maxcheckableitems&&this.selectedCounter>=this.maxcheckableitems,size:this.size===a.X_SMALL?a.SMALL:this.size,role:"option","aria-selected":t.checked?"true":"false",onKeyDown:e=>this.handleSelectArrowsNavigation(e,this.getItemId(t)),onInputCheck:e=>{this.itemsList=this.itemsList.map((i=>{if(t.id===i.id){i.checked=e.detail.checked}return i}));this.updateRenderItemsList();this.emitComboboxChange()},onInputFocus:t=>this.handleCheckboxFocus(t.detail.id)}))}renderList(t){if(!t){return}if(!t.length&&this.searchValue){return this.renderNoSearchResults()}if(this.hasgroupitems){return this.renderGroups(t)}return i("ul",{role:"none"},t.map(((e,i)=>this.renderItem(e,i,t.length))))}renderGroups(t){const e=t.reduce(((e,i,s)=>{var o;const{category:a}=i;const r=this.renderItem(i,s,t.length);e[a]=(o=e[a])!==null&&o!==void 0?o:[];e[a].push(r);return e}),{});const s=Object.entries(e).map((([t,e])=>i("z-list-group",{"divider-type":h.ELEMENT},i("span",{class:"body-3-sb z-list-group-title",slot:"header-title"},t),e.map((t=>t)))));return i("ul",{role:"none"},s)}renderNoSearchResults(){return i("div",{class:"no-results"},i("span",null,this.noresultslabel))}renderCloseButton(){return i("div",{class:"close-search"},i("a",{onClick:()=>this.closeFilterItems(),onKeyUp:t=>c(t,this.closeFilterItems),role:"button",tabindex:0},this.closesearchtext))}renderSearchInput(){return i("z-input",Object.assign({htmlid:`${this.inputid}_search`,label:this.searchlabel,placeholder:this.searchplaceholder,htmltitle:this.searchtitle,type:this.inputType,value:this.searchValue,message:false,size:this.size,"aria-autocomplete":"list"},this.getComboboxA11yAttributes(),{onKeyUp:t=>{if(t.key===n.ESC){this.closeFilterItems()}},onInputChange:t=>{this.searchValue=t.detail.value}}))}renderCheckAll(){if(this.searchValue){return}const t=`combo-checkbox-${this.inputid}-check-all`;const e=this.selectedCounter===this.itemsList.length;return i("div",{class:"check-all-wrapper"},i("z-input",{type:o.CHECKBOX,checked:e,htmlid:t,class:this.getCheckboxClass(),label:e?this.uncheckalltext:this.checkalltext,disabled:this.maxcheckableitems&&this.maxcheckableitems<this.itemsList.length,size:this.size===a.X_SMALL?a.SMALL:this.size,role:"option","aria-selected":e?"true":"false",onKeyDown:e=>this.handleSelectArrowsNavigation(e,t),onInputCheck:t=>this.checkAll(t.detail.checked),onInputFocus:t=>this.handleCheckboxFocus(t.detail.id)}))}render(){return i("div",{key:"2bcce71a364e370b7c6aaca5a90320b8600e684a","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 s(this)}static get watchers(){return{items:["watchItems"],searchValue:["watchSearchValue"],checkboxes:["watchCheckboxes"]}}};u.style=p;export{u as z_combobox};
-//# sourceMappingURL=p-22c755d5.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZComboboxStyle0","ZCombobox","watchItems","this","itemsList","items","JSON","parse","selectedCounter","filter","item","checked","length","updateRenderItemsList","watchSearchValue","filterItems","searchValue","watchCheckboxes","checkboxes","forEach","index","setAttribute","emitComboboxChange","comboboxChange","emit","id","inputid","constructor","hostRef","inputType","InputType","TEXT","randomId","ControlSize","BIG","toggleComboBox","bind","closeFilterItems","componentWillLoad","componentWillRender","componentDidRender","getAllCheckboxes","stringify","getItemId","getCheckboxClass","Array","from","element","shadowRoot","querySelectorAll","getControlToListSize","size","X_SMALL","ListSize","SMALL","MEDIUM","LARGE","handleSelectArrowsNavigation","e","currId","KeyboardCode","ARROW_DOWN","ARROW_UP","includes","key","isopen","preventDefault","stopPropagation","currElem","querySelector","currElemIndex","indexOf","firstElemIndex","lastElemIndex","nextElem","focusComboboxItem","handleHeaderKeyboardEvent","ev","SPACE","handleCheckboxFocus","focusedItemId","elem","focus","resetRenderItemsList","renderItemsList","push","Object","assign","value","start","name","toUpperCase","end","newName","substring","checkAll","map","getComboboxA11yAttributes","role","label","renderHeader","h","class","onClick","onKeyDown","onKeyUp","handleKeyboardSubmit","tabindex","renderContent","hassearch","renderSearchInput","join","hascheckall","renderCheckAll","renderItems","renderList","renderCloseButton","renderItem","htmlTabindex","dividerType","ListDividerType","ELEMENT","NONE","type","CHECKBOX","htmlid","disabled","maxcheckableitems","onInputCheck","i","detail","onInputFocus","renderNoSearchResults","hasgroupitems","renderGroups","newData","reduce","group","category","zListItem","_a","listGroups","entries","slot","noresultslabel","closesearchtext","searchlabel","placeholder","searchplaceholder","htmltitle","searchtitle","message","ESC","onInputChange","checkAllId","allChecked","uncheckalltext","checkalltext","render","open","fixed","isfixed"],"sources":["src/components/z-combobox/styles.css?tag=z-combobox&encapsulation=shadow","src/components/z-combobox/index.tsx"],"sourcesContent":["@import \"../css-components/z-label/styles.css\";\n\n:host {\n  display: block;\n  color: var(--color-form-default-text);\n  fill: var(--color-form-default-icon);\n  font-family: var(--font-family-sans);\n}\n\n:host > div.fixed {\n  position: relative;\n}\n\n:host > div > .header {\n  position: relative;\n  z-index: 10;\n  display: flex;\n  min-height: 42px;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 calc(var(--space-unit) * 1.5);\n  border: var(--border-size-small) solid var(--color-form-surface04);\n  margin: 0;\n  background-color: var(--color-form-background);\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n}\n\n:host([size=\"small\"]) > div > .header {\n  min-height: 34px;\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) > div > .header {\n  min-height: 30px;\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) > div > .header p.body-3 {\n  padding: calc(var(--space-unit) * 0.5) 0;\n}\n\n:host > div > .header:hover {\n  outline: var(--border-size-medium) solid var(--color-form-surface04);\n  outline-offset: -2px;\n}\n\n:host > div > div.header:focus:focus-visible {\n  z-index: 16;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host > div > .header > p.body-3 {\n  padding: var(--space-unit) 0;\n  margin: 0;\n}\n\n:host > div > .header > p.body-3 > span {\n  font-weight: var(--font-sb);\n}\n\n:host > div > .header > z-icon {\n  fill: var(--color-form-default-icon);\n  transform: rotate(360deg);\n  transition: all 200ms linear;\n}\n\n:host > div > .header > z-icon.small,\n:host > div > .header > z-icon.x-small {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n:host > div.open > .header {\n  border: var(--border-size-small) solid var(--color-form-active-primary);\n  border-radius: var(--border-radius-small) var(--border-radius-small) 0 0;\n}\n\n:host > div.disabled {\n  pointer-events: none;\n}\n\n:host > div.disabled .header {\n  border-color: var(--color-form-disabled03);\n  fill: var(--color-form-disabled01-icon);\n}\n\n:host > div.disabled .header > p.body-3 {\n  color: var(--color-form-disabled03);\n}\n\n:host > div.disabled .header > z-icon:last-child {\n  fill: var(--color-form-disabled01-icon);\n}\n\n:host > div.open > .header > z-icon {\n  fill: var(--color-form-default-icon);\n  transform: rotate(180deg);\n  transition: all 200ms linear;\n}\n\n:host > div.open > div.open-combo-data {\n  position: relative;\n  z-index: 12;\n  padding: var(--space-unit) calc(var(--space-unit) * 2);\n  border: var(--border-size-small) solid var(--color-form-surface03);\n  border-top: 0;\n  background-color: var(--color-form-background);\n  border-radius: 0;\n  box-shadow: var(--shadow-2);\n}\n\n:host .open .open-combo-data z-input .z-label {\n  color: var(--color-form-default-text);\n}\n\n:host > div.open > div.open-combo-data > div > div {\n  overflow: auto;\n  max-height: 235px;\n  padding: 0;\n  padding-left: var(--space-unit); /* padding left and negative margin in order to enable focus */\n  margin-left: calc(var(--space-unit) * -1); /* padding left and negative margin in order to enable focus */\n}\n\n:host > div.open > div.open-combo-data > z-input {\n  width: 100%;\n  margin-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > div.open > div.open-combo-data > div > div > ul {\n  max-height: 235px;\n  padding: 0 calc(var(--space-unit) * 0.5); /* needed for checkbox focus shadow */\n  margin: 0;\n}\n\n:host .open-combo-data z-list-element {\n  --background-color-list-element: var(--color-form-background);\n  --background-hover-color-list-element: var(--color-form-surface03);\n  --background-active-color-list-element: var(--color-form-surface03);\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  background: linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px);\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: var(--color-primary01);\n}\n\n::-webkit-scrollbar-thumb:hover {\n  background-color: var(--color-hover-primary);\n}\n\n/* Firefox scrollbar */\n@supports not selector(::-webkit-scrollbar-track) {\n  :host {\n    scrollbar-color: var(--color-primary01) transparent;\n  }\n}\n\n:host > div.open > z-input {\n  position: relative;\n  z-index: 1;\n  width: 238px;\n  margin: 0 calc(var(--space-unit) * 2);\n  color: var(--color-form-active-primary);\n}\n\n:host > div.open > div.open-combo-data > div > div.search {\n  overflow: hidden;\n  max-height: none;\n  margin-top: 0;\n}\n\n:host > div.open > div.open-combo-data > div > div.search > ul {\n  overflow: auto;\n  max-height: 180px;\n  padding: var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host .open .open-combo-data .search .no-results {\n  display: flex;\n  align-items: center;\n  column-gap: var(--space-unit);\n}\n\n:host > .open > .open-combo-data .search .close-search {\n  display: flex;\n  justify-content: center;\n}\n\n:host > div.open > div.open-combo-data > div > div.search .close-search > a {\n  display: inline-block;\n  height: 44px;\n  color: var(--color-form-active-primary);\n  cursor: pointer;\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  line-height: 44px;\n  text-align: center;\n  text-transform: uppercase;\n}\n\n:host > div.open > div.open-combo-data > div > div.search .close-search > a:focus:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host > div.open > div.open-combo-data > div > div.check-all-wrapper {\n  /* padding left and negative margin in order to enable focus */\n  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 2)\n    calc(var(--space-unit) * 1.5);\n  border-bottom: var(--border-size-small) solid var(--gray800);\n  margin-bottom: var(--space-unit);\n  margin-left: calc(var(--space-unit) * -1);\n  text-align: left;\n}\n\n:host([size=\"small\"]) > div.open > div.open-combo-data > div > div.check-all-wrapper {\n  padding: calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 0.5);\n}\n\n:host([size=\"x-small\"]) > div.open > div.open-combo-data > div > div.check-all-wrapper {\n  padding: var(--space-unit) calc(var(--space-unit) * 0.5);\n}\n","import {Component, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ComboItem, ControlSize, InputType, KeyboardCode, ListDividerType, ListSize} from \"../../beans\";\nimport {handleKeyboardSubmit, randomId} from \"../../utils/utils\";\nimport {ZInput} from \"../z-input\";\n\n@Component({\n  tag: \"z-combobox\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZCombobox {\n  @Element() element: HTMLZComboboxElement;\n\n  /** input unique id */\n  @Prop()\n  inputid = `combo-${randomId()}`;\n\n  /** list items array */\n  @Prop()\n  items: ComboItem[] | string;\n\n  /** label text */\n  @Prop()\n  label: string;\n\n  /** the combobox is disabled */\n  @Prop({reflect: true})\n  disabled?: boolean = false;\n\n  /** show search input flag (optional) */\n  @Prop()\n  hassearch?: boolean = false;\n\n  /** search input label text (optional) */\n  @Prop()\n  searchlabel?: string;\n\n  /** search input placeholder text (optional) */\n  @Prop()\n  searchplaceholder?: string;\n\n  /** search input title text (optional) */\n  @Prop()\n  searchtitle?: string;\n\n  /** no result text message */\n  @Prop()\n  noresultslabel?: string = \"Nessun risultato\";\n\n  /** toggle combo list opening flag */\n  @Prop({mutable: true})\n  isopen = false;\n\n  /** fixed style flag */\n  @Prop()\n  isfixed = false;\n\n  /** close combobox list text */\n  @Prop()\n  closesearchtext?: string = \"Chiudi\";\n\n  /** show \"check all\" checkbox (optional) */\n  @Prop()\n  hascheckall?: boolean = false;\n\n  /** check all label (optional) */\n  @Prop()\n  checkalltext?: string = \"Seleziona tutti\";\n\n  /** uncheck all label (optional) */\n  @Prop()\n  uncheckalltext?: string = \"Deseleziona tutti\";\n\n  /** max number of checkable items (0 = unlimited) */\n  @Prop()\n  maxcheckableitems = 0;\n\n  /** group items by category */\n  @Prop()\n  hasgroupitems?: boolean;\n\n  /** Available sizes: `big`, `small` and `x-small`. Defaults to `big`. */\n  @Prop()\n  size?: ControlSize = ControlSize.BIG;\n\n  @State()\n  searchValue: string;\n\n  @State()\n  selectedCounter: number;\n\n  @State()\n  renderItemsList: ComboItem[] = []; // used for render only\n\n  @State()\n  focusedItemId: string;\n\n  @State()\n  checkboxes: HTMLInputElement[] = [];\n\n  private itemsList: ComboItem[] = [];\n\n  private inputType: InputType = InputType.TEXT;\n\n  @Watch(\"items\")\n  watchItems(): void {\n    this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n    this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n    this.updateRenderItemsList();\n  }\n\n  @Watch(\"searchValue\")\n  watchSearchValue(): void {\n    this.filterItems(this.searchValue);\n  }\n\n  @Watch(\"checkboxes\")\n  watchCheckboxes(): void {\n    this.checkboxes.forEach((item, index) => item.setAttribute(\"tabindex\", index === 0 ? \"0\" : \"-1\"));\n  }\n\n  /** Emitted when value is checked/unchecked. Returns id, items. */\n  @Event()\n  comboboxChange: EventEmitter;\n\n  private emitComboboxChange(): void {\n    this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n  }\n\n  constructor() {\n    this.toggleComboBox = this.toggleComboBox.bind(this);\n    this.closeFilterItems = this.closeFilterItems.bind(this);\n  }\n\n  componentWillLoad(): void {\n    this.watchItems();\n  }\n\n  componentWillRender(): void {\n    this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n  }\n\n  componentDidRender(): void {\n    const checkboxes = this.getAllCheckboxes();\n    if (JSON.stringify(checkboxes) !== JSON.stringify(this.checkboxes)) {\n      this.checkboxes = checkboxes;\n    }\n  }\n\n  private getItemId(item: ComboItem): string {\n    return `combo-checkbox-${this.inputid}-${item.id}`;\n  }\n\n  private getCheckboxClass(): string {\n    return `combo-item-checkbox-input-${this.inputid}`;\n  }\n\n  private getAllCheckboxes(): HTMLInputElement[] {\n    return Array.from(\n      this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`)\n    ) as HTMLInputElement[];\n  }\n\n  private getControlToListSize(): ListSize {\n    switch (this.size) {\n      case ControlSize.X_SMALL:\n        return ListSize.SMALL;\n      case ControlSize.SMALL:\n        return ListSize.MEDIUM;\n      default:\n        return ListSize.LARGE;\n    }\n  }\n\n  private handleSelectArrowsNavigation(e: KeyboardEvent, currId: string): void {\n    if (![KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP].includes(e.key as KeyboardCode) || !this.isopen) {\n      return;\n    }\n\n    e.preventDefault();\n    e.stopPropagation();\n\n    const currElem = this.element.shadowRoot.querySelector(`#${currId}`) as HTMLInputElement;\n    if (!currElem) {\n      return;\n    }\n\n    const checkboxes = this.checkboxes;\n    if (!checkboxes.length) {\n      return;\n    }\n\n    const currElemIndex = checkboxes.indexOf(currElem);\n    const firstElemIndex = 0;\n    const lastElemIndex = checkboxes.length - 1;\n\n    let nextElem = null;\n    if (e.key === KeyboardCode.ARROW_DOWN) {\n      nextElem = currElemIndex === lastElemIndex ? checkboxes[firstElemIndex] : checkboxes[currElemIndex + 1];\n    } else if (e.key === KeyboardCode.ARROW_UP) {\n      nextElem = currElemIndex === firstElemIndex ? checkboxes[lastElemIndex] : checkboxes[currElemIndex - 1];\n    }\n\n    this.focusComboboxItem(nextElem);\n  }\n\n  private handleHeaderKeyboardEvent(ev: KeyboardEvent): void {\n    if (ev.key === KeyboardCode.SPACE) {\n      ev.preventDefault();\n    }\n    if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) || (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {\n      this.toggleComboBox();\n    }\n  }\n\n  private handleCheckboxFocus(id: string): void {\n    this.focusedItemId = id;\n  }\n\n  private focusComboboxItem(elem): void {\n    this.checkboxes.forEach(function (item) {\n      item.setAttribute(\"tabindex\", \"-1\");\n    });\n\n    elem.setAttribute(\"tabindex\", \"0\");\n    elem.focus();\n  }\n\n  private updateRenderItemsList(): void {\n    if (this.searchValue) {\n      this.filterItems(this.searchValue);\n    } else {\n      this.resetRenderItemsList();\n    }\n  }\n\n  private resetRenderItemsList(): void {\n    const renderItemsList = [];\n    this.itemsList.forEach((item: ComboItem) => {\n      renderItemsList.push({...item});\n    });\n    this.renderItemsList = renderItemsList;\n  }\n\n  private filterItems(value: string): void {\n    if (!value) {\n      return this.closeFilterItems();\n    }\n\n    this.resetRenderItemsList();\n    this.renderItemsList = this.renderItemsList.filter((item) => {\n      const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n      const end = start + value.length;\n      const newName =\n        item.name.substring(0, start) +\n        \"<strong>\" +\n        item.name.substring(start, end) +\n        \"</strong>\" +\n        item.name.substring(end, item.name.length);\n\n      item.name = newName;\n\n      return start >= 0;\n    });\n  }\n\n  private checkAll(checked = true): void {\n    this.itemsList = this.itemsList.map((item: ComboItem) => ({\n      ...item,\n      checked: checked,\n    }));\n    this.resetRenderItemsList();\n    this.emitComboboxChange();\n  }\n\n  private closeFilterItems(): void {\n    this.searchValue = \"\";\n    this.resetRenderItemsList();\n  }\n\n  private toggleComboBox(): void {\n    this.isopen = !this.isopen;\n  }\n\n  private getComboboxA11yAttributes(): Record<string, string> {\n    return {\n      \"role\": \"combobox\",\n      \"aria-label\": this.label,\n      \"aria-expanded\": this.isopen ? \"true\" : \"false\",\n      \"aria-activedescendant\": this.isopen ? this.focusedItemId : \"\",\n      \"aria-controls\": `${this.inputid}_list`,\n    };\n  }\n\n  private renderHeader(): HTMLDivElement {\n    return (\n      <div\n        class=\"header\"\n        onClick={() => this.toggleComboBox()}\n        onKeyDown={(ev: KeyboardEvent) => {\n          this.handleHeaderKeyboardEvent(ev);\n        }}\n        onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n        role=\"button\"\n        tabindex={0}\n        aria-expanded={this.isopen ? \"true\" : \"false\"}\n      >\n        <p class=\"body-3\">\n          {this.label}\n          <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n        </p>\n        <z-icon\n          name=\"caret-down\"\n          class={this.size}\n        />\n      </div>\n    );\n  }\n\n  private renderContent(): HTMLDivElement {\n    if (!this.isopen) {\n      return;\n    }\n\n    return (\n      <div class=\"open-combo-data\">\n        {this.hassearch && this.renderSearchInput()}\n        {!this.hassearch ? <span {...this.getComboboxA11yAttributes()} /> : null}\n        <div\n          role=\"listbox\"\n          aria-label={this.label}\n          aria-multiselectable={true}\n          id={`${this.inputid}_list`}\n          aria-owns={`${this.checkboxes.map((item) => item.id).join(\" \")}`}\n        >\n          {this.hascheckall && this.renderCheckAll()}\n          {this.renderItems()}\n        </div>\n      </div>\n    );\n  }\n\n  private renderItems(): HTMLDivElement {\n    return (\n      <div class={this.searchValue && \"search\"}>\n        {this.renderList(this.renderItemsList)}\n        {this.searchValue && this.renderCloseButton()}\n      </div>\n    );\n  }\n\n  private renderItem(item: ComboItem, index: number, length: number): HTMLZListElement {\n    return (\n      <z-list-element\n        id={item.id}\n        htmlTabindex={null}\n        dividerType={index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE}\n        size={this.getControlToListSize()}\n      >\n        <z-input\n          type={InputType.CHECKBOX}\n          checked={item.checked}\n          htmlid={this.getItemId(item)}\n          label={item.name}\n          class={this.getCheckboxClass()}\n          disabled={!item.checked && this.maxcheckableitems && this.selectedCounter >= this.maxcheckableitems}\n          size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n          role=\"option\"\n          aria-selected={item.checked ? \"true\" : \"false\"}\n          onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, this.getItemId(item))}\n          onInputCheck={(e: CustomEvent) => {\n            this.itemsList = this.itemsList.map((i: ComboItem) => {\n              if (item.id === i.id) {\n                i.checked = e.detail.checked;\n              }\n\n              return i;\n            });\n            this.updateRenderItemsList();\n            this.emitComboboxChange();\n          }}\n          onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n        />\n      </z-list-element>\n    );\n  }\n\n  private renderList(items: ComboItem[]): HTMLUListElement {\n    if (!items) {\n      return;\n    }\n    if (!items.length && this.searchValue) {\n      return this.renderNoSearchResults();\n    }\n\n    if (this.hasgroupitems) {\n      return this.renderGroups(items);\n    }\n\n    return (\n      <ul role=\"none\">\n        {items.map((item, i) => {\n          return this.renderItem(item, i, items.length);\n        })}\n      </ul>\n    );\n  }\n\n  private renderGroups(items: ComboItem[]): HTMLUListElement {\n    const newData = items.reduce((group, item, index) => {\n      const {category} = item;\n      const zListItem = this.renderItem(item, index, items.length);\n\n      group[category] = group[category] ?? [];\n      group[category].push(zListItem);\n\n      return group;\n    }, {});\n\n    const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n      return (\n        <z-list-group divider-type={ListDividerType.ELEMENT}>\n          <span\n            class=\"body-3-sb z-list-group-title\"\n            slot=\"header-title\"\n          >\n            {key}\n          </span>\n          {value.map((item) => item)}\n        </z-list-group>\n      );\n    });\n\n    return <ul role=\"none\">{listGroups}</ul>;\n  }\n\n  private renderNoSearchResults(): HTMLUListElement {\n    return (\n      <div class=\"no-results\">\n        <span>{this.noresultslabel}</span>\n      </div>\n    );\n  }\n\n  private renderCloseButton(): HTMLDivElement {\n    return (\n      <div class=\"close-search\">\n        <a\n          onClick={() => this.closeFilterItems()}\n          onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n          role=\"button\"\n          tabindex={0}\n        >\n          {this.closesearchtext}\n        </a>\n      </div>\n    );\n  }\n\n  private renderSearchInput(): ZInput {\n    return (\n      <z-input\n        htmlid={`${this.inputid}_search`}\n        label={this.searchlabel}\n        placeholder={this.searchplaceholder}\n        htmltitle={this.searchtitle}\n        type={this.inputType}\n        value={this.searchValue}\n        message={false}\n        size={this.size}\n        aria-autocomplete=\"list\"\n        {...this.getComboboxA11yAttributes()}\n        onKeyUp={(e: KeyboardEvent) => {\n          if (e.key === KeyboardCode.ESC) {\n            this.closeFilterItems();\n          }\n        }}\n        onInputChange={(e: CustomEvent) => {\n          this.searchValue = e.detail.value;\n        }}\n      />\n    );\n  }\n\n  private renderCheckAll(): HTMLDivElement {\n    if (this.searchValue) {\n      return;\n    }\n\n    const checkAllId = `combo-checkbox-${this.inputid}-check-all`;\n    const allChecked = this.selectedCounter === this.itemsList.length;\n\n    return (\n      <div class=\"check-all-wrapper\">\n        <z-input\n          type={InputType.CHECKBOX}\n          checked={allChecked}\n          htmlid={checkAllId}\n          class={this.getCheckboxClass()}\n          label={allChecked ? this.uncheckalltext : this.checkalltext}\n          disabled={this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length}\n          size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n          role=\"option\"\n          aria-selected={allChecked ? \"true\" : \"false\"}\n          onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, checkAllId)}\n          onInputCheck={(e: CustomEvent) => this.checkAll(e.detail.checked)}\n          onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n        />\n      </div>\n    );\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div\n        data-action={`combo-${this.inputid}`}\n        class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n        id={this.inputid}\n      >\n        {this.renderHeader()}\n        {!this.disabled && this.renderContent()}\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

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

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

@@ -1,2 +0,0 @@
-import{r as i,h as e,a as t,g as o}from"./p-75c4a726.js";import{i as s}from"./p-8d923a1d.js";const a=":host{display:flex;overflow:hidden;min-width:0;height:calc(174px - var(--space-unit) * 2);max-height:calc(174px - var(--space-unit) * 2);padding:var(--space-unit);border:var(--border-size-medium) solid var(--color-surface02);border-radius:var(--border-size-large);cursor:pointer;font-family:var(--font-family-sans)}:host(:focus:focus-visible){z-index:1;box-shadow:var(--shadow-focus-primary);outline:none}.z-cover-container{position:relative;display:flex;width:119px;height:158px;align-items:center;justify-items:center}.z-cover-stack{width:100%;height:100%}.z-cover-shadow,.z-cover-img{width:117px;height:156px}.z-cover-container.has-multiple .z-cover-shadow,.z-cover-container.has-multiple .z-cover-img{width:105px;height:140px}.z-cover-shadow{position:absolute;z-index:1;background-color:var(--color-white)}.z-shadow-1{z-index:0;top:var(--space-unit);right:6px;border:var(--border-size-small) solid black}.z-shadow-2{z-index:0;top:calc(var(--space-unit) * 2);right:12px;border:var(--border-size-small) solid black}.z-cover-img{position:absolute;z-index:0;top:0;right:0;display:flex;align-items:start;justify-content:center;border:var(--border-size-small) solid black;background-color:var(--color-white);object-fit:cover;object-position:left}.z-cover-img>img{max-width:100%;max-height:100%}.z-cover-container.has-multiple .z-cover-img{left:12px}:host(.info-card:focus:focus-visible){z-index:1;box-shadow:var(--shadow-focus-primary);outline:none}.info-container{display:flex;overflow:hidden;min-width:0;flex:1;flex-direction:column;padding-left:calc(var(--space-unit) * 2)}.authors-label{overflow:hidden;color:var(--color-default-text);font-size:var(--font-size-2);font-weight:var(--font-rg);text-overflow:ellipsis;white-space:nowrap}.card-title{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font-size:var(--font-size-3);font-weight:var(--font-bd);-webkit-line-clamp:2;line-clamp:2;line-height:1.5;word-break:break-word}.card-title>*{all:unset}.card-subtitle{overflow:hidden;color:var(--color-default-text);text-overflow:ellipsis;white-space:nowrap}.card-subtitle.info-subtitle{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;line-height:1.2;white-space:normal;word-break:break-word}.tags-container{display:flex;max-width:100%;flex-wrap:wrap;margin-top:calc(var(--space-unit) * 2);gap:var(--space-unit)}.volumes-label{display:flex;height:auto;flex-direction:column;margin-top:auto;color:var(--color-default-text);font-size:var(--font-size-1)}:host(.info-card){display:flex;height:calc(76px - var(--space-unit) * 2);max-height:calc(76px - var(--space-unit) * 2)}.info-icon-column{display:flex;width:50px;height:100%;align-items:center;justify-content:center}.info-icon-container{display:flex;width:34px;height:34px;align-items:center;justify-content:center;margin-bottom:calc(var(--space-unit) * 3);background-color:var(--gray50);border-radius:var(--border-size-large)}.card-title.info-title{display:-webkit-box;overflow:hidden;min-width:0;max-width:100%;max-height:2.4em;margin-top:0;margin-bottom:4px;-webkit-box-orient:vertical;font-size:var(--font-size-3);font-weight:var(--font-bd);-webkit-line-clamp:1;line-clamp:1;line-height:1.2;word-break:break-word}.info-icon{width:18px;height:18px;color:var(--color-default-text)}@media (max-width: 768px){.card-title{display:block;overflow:hidden;line-height:normal;text-overflow:ellipsis;white-space:nowrap}}";const r=a;const n=class{constructor(o){i(this,o);this.resizeHandler=()=>{this.setTooltipTitle(this.authorsRef);this.setTooltipTitle(this.titleRef);this.setTooltipTitle(this.subtitleRef)};this.renderOperaCard=()=>{const i=this.titleHtmlTag?`<${this.titleHtmlTag}>${this.cardTitle}</${this.titleHtmlTag}>`:this.cardTitle;return e(t,{tabIndex:0},e("div",{class:`z-cover-container ${this.hasMultipleCovers?"has-multiple":""}`},e("div",{class:"z-cover-stack"},this.hasMultipleCovers&&e("div",null,e("div",{class:"z-cover-shadow z-shadow-2"}),e("div",{class:"z-cover-shadow z-shadow-1"})),e("div",{class:"z-cover-img"},e("img",{src:this.cover||this.fallbackCover||s,alt:"",onError:()=>{if(this.fallbackCover){this.cover=this.fallbackCover}else{this.cover=s}}})))),e("div",{class:"info-container"},this.authors&&e("span",{class:"authors-label",ref:i=>this.authorsRef=i},this.authors),e("div",{class:"card-title",ref:i=>this.titleRef=i,innerHTML:i}),e("span",{class:"card-subtitle",ref:i=>this.subtitleRef=i},this.cardSubtitle),e("div",{class:"tags-container"},e("slot",{name:"tags"})),e("div",{class:"volumes-label"},e("slot",{name:"volumes"}))))};this.renderInfoCard=()=>e(t,{tabIndex:0,class:"info-card"},e("div",{class:"info-icon-column"},e("div",{class:"info-icon-container"},e("z-icon",{class:"info-icon",name:"link",width:18,height:18}))),e("div",{class:"info-container"},e("span",{class:"card-title info-title",ref:i=>this.titleRef=i},this.cardTitle),e("span",{class:"card-subtitle info-subtitle",ref:i=>this.subtitleRef=i},this.cardSubtitle)));this.cardTitle=undefined;this.cardSubtitle=undefined;this.authors=undefined;this.cover=undefined;this.fallbackCover=undefined;this.hasMultipleCovers=false;this.isInfoCard=false;this.titleHtmlTag=undefined}setTooltipTitle(i){if(!i){return}const e=window.getComputedStyle(i);const t=e.getPropertyValue("-webkit-line-clamp")!=="none";let o;if(t){const t=parseInt(e.lineHeight);const s=parseInt(e.getPropertyValue("-webkit-line-clamp"));const a=t*s;o=i.scrollHeight>a}else{o=i.scrollWidth>i.clientWidth||i.scrollHeight>i.clientHeight}if(o){i.setAttribute("title",i.textContent.trim())}else{i.removeAttribute("title")}}componentDidRender(){this.setTooltipTitle(this.authorsRef);this.setTooltipTitle(this.titleRef);this.setTooltipTitle(this.subtitleRef)}componentDidLoad(){window.addEventListener("resize",this.resizeHandler)}disconnectedCallback(){window.removeEventListener("resize",this.resizeHandler)}render(){return this.isInfoCard?this.renderInfoCard():this.renderOperaCard()}get hostElement(){return o(this)}};n.style=r;export{n as z_result_card};
-//# sourceMappingURL=p-ae6604b8.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZResultCardStyle0","ZResultCard","this","resizeHandler","setTooltipTitle","authorsRef","titleRef","subtitleRef","renderOperaCard","title","titleHtmlTag","cardTitle","h","Host","tabIndex","class","hasMultipleCovers","src","cover","fallbackCover","defaultFallbackCover","alt","onError","authors","ref","el","innerHTML","cardSubtitle","name","renderInfoCard","width","height","style","window","getComputedStyle","hasLineClamp","getPropertyValue","isTruncated","lineHeight","parseInt","maxLines","maxHeight","scrollHeight","scrollWidth","clientWidth","clientHeight","setAttribute","textContent","trim","removeAttribute","componentDidRender","componentDidLoad","addEventListener","disconnectedCallback","removeEventListener","render","isInfoCard"],"sources":["src/components/result-card/z-result-card/styles.css?tag=z-result-card&encapsulation=shadow","src/components/result-card/z-result-card/index.tsx"],"sourcesContent":[":host {\n  display: flex;\n  overflow: hidden;\n  min-width: 0;\n  height: calc(174px - var(--space-unit) * 2);\n  max-height: calc(174px - var(--space-unit) * 2);\n  padding: var(--space-unit);\n  border: var(--border-size-medium) solid var(--color-surface02);\n  border-radius: var(--border-size-large);\n  cursor: pointer;\n  font-family: var(--font-family-sans);\n}\n\n:host(:focus:focus-visible) {\n  z-index: 1;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.z-cover-container {\n  position: relative;\n  display: flex;\n  width: 119px;\n  height: 158px;\n  align-items: center;\n  justify-items: center;\n}\n\n.z-cover-stack {\n  width: 100%;\n  height: 100%;\n}\n\n/* Base sizes for single cover */\n.z-cover-shadow,\n.z-cover-img {\n  width: 117px;\n  height: 156px;\n}\n\n/* Scaled sizes for multiple covers */\n.z-cover-container.has-multiple .z-cover-shadow,\n.z-cover-container.has-multiple .z-cover-img {\n  width: 105px;\n  height: 140px;\n}\n\n.z-cover-shadow {\n  position: absolute;\n  z-index: 1;\n  background-color: var(--color-white);\n}\n\n.z-shadow-1 {\n  z-index: 0;\n  top: var(--space-unit);\n  right: 6px;\n  border: var(--border-size-small) solid black;\n}\n\n.z-shadow-2 {\n  z-index: 0;\n  top: calc(var(--space-unit) * 2);\n  right: 12px;\n  border: var(--border-size-small) solid black;\n}\n\n.z-cover-img {\n  position: absolute;\n  z-index: 0;\n  top: 0;\n  right: 0;\n  display: flex;\n  align-items: start;\n  justify-content: center;\n  border: var(--border-size-small) solid black;\n  background-color: var(--color-white);\n  object-fit: cover;\n  object-position: left;\n}\n\n.z-cover-img > img {\n  max-width: 100%;\n  max-height: 100%;\n}\n\n.z-cover-container.has-multiple .z-cover-img {\n  left: 12px;\n}\n\n:host(.info-card:focus:focus-visible) {\n  z-index: 1;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.info-container {\n  display: flex;\n  overflow: hidden;\n  min-width: 0;\n  flex: 1;\n  flex-direction: column;\n  padding-left: calc(var(--space-unit) * 2);\n}\n\n.authors-label {\n  overflow: hidden;\n  color: var(--color-default-text);\n  font-size: var(--font-size-2);\n  font-weight: var(--font-rg);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.card-title {\n  display: -webkit-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n  font-size: var(--font-size-3);\n  font-weight: var(--font-bd);\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n  line-height: 1.5;\n  word-break: break-word;\n}\n\n.card-title > * {\n  all: unset;\n}\n\n.card-subtitle {\n  overflow: hidden;\n  color: var(--color-default-text);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.card-subtitle.info-subtitle {\n  display: -webkit-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n  line-height: 1.2;\n  white-space: normal;\n  word-break: break-word;\n}\n\n.tags-container {\n  display: flex;\n  max-width: 100%;\n  flex-wrap: wrap;\n  margin-top: calc(var(--space-unit) * 2);\n  gap: var(--space-unit);\n}\n\n.volumes-label {\n  display: flex;\n  height: auto;\n  flex-direction: column;\n  margin-top: auto;\n  color: var(--color-default-text);\n  font-size: var(--font-size-1);\n}\n\n:host(.info-card) {\n  display: flex;\n  height: calc(76px - var(--space-unit) * 2);\n  max-height: calc(76px - var(--space-unit) * 2);\n}\n\n.info-icon-column {\n  display: flex;\n  width: 50px;\n  height: 100%;\n  align-items: center;\n  justify-content: center;\n}\n\n.info-icon-container {\n  display: flex;\n  width: 34px;\n  height: 34px;\n  align-items: center;\n  justify-content: center;\n  margin-bottom: calc(var(--space-unit) * 3);\n  background-color: var(--gray50);\n  border-radius: var(--border-size-large);\n}\n\n.card-title.info-title {\n  display: -webkit-box;\n  overflow: hidden;\n  min-width: 0;\n  max-width: 100%;\n  max-height: 2.4em;\n  margin-top: 0;\n  margin-bottom: 4px;\n  -webkit-box-orient: vertical;\n  font-size: var(--font-size-3);\n  font-weight: var(--font-bd);\n  -webkit-line-clamp: 1;\n  line-clamp: 1;\n  line-height: 1.2;\n  word-break: break-word;\n}\n\n.info-icon {\n  width: 18px;\n  height: 18px;\n  color: var(--color-default-text);\n}\n\n@media (max-width: 768px) {\n  .card-title {\n    display: block;\n    overflow: hidden;\n    line-height: normal;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n}\n","import {Component, Element, Host, Prop, h} from \"@stencil/core\";\nimport defaultFallbackCover from \"../../../assets/images/png/placeholder-cover.png\";\n\n@Component({\n  tag: \"z-result-card\",\n  styleUrls: [\"styles.css\"],\n  shadow: true,\n})\nexport class ZResultCard {\n  @Element() hostElement: HTMLZResultCardElement;\n\n  /**\n   * The title of the card.\n   */\n  @Prop()\n  cardTitle: string;\n\n  /**\n   * The subtitle of the card.\n   */\n  @Prop()\n  cardSubtitle: string;\n\n  /**\n   * The authors of the opera.\n   */\n  @Prop()\n  authors?: string;\n\n  /**\n   * The URL of the cover image.\n   * This is used to display the cover image of the opera.\n   */\n  @Prop()\n  cover?: string;\n\n  /** [optional] Fallback cover URL */\n  @Prop()\n  fallbackCover?: string;\n\n  /**\n   * Indicates whether the card has multiple covers.\n   * This is used to apply specific styles when there are multiple covers.\n   */\n  @Prop()\n  hasMultipleCovers = false;\n\n  /**\n   * Indicates whether the card is an info page.\n   * This can be used to apply specific styles or behaviors for info pages.\n   */\n  @Prop()\n  isInfoCard = false;\n\n  /**\n   * [optional]\n   * Use for insert heading when needed.\n   */\n  @Prop()\n  titleHtmlTag?: string;\n\n  private authorsRef: HTMLElement;\n\n  private titleRef: HTMLElement;\n\n  private subtitleRef: HTMLElement;\n\n  private setTooltipTitle(el: HTMLElement): void {\n    if (!el) {\n      return;\n    }\n\n    // Check if element uses line-clamp\n    const style = window.getComputedStyle(el);\n    const hasLineClamp = style.getPropertyValue(\"-webkit-line-clamp\") !== \"none\";\n\n    let isTruncated;\n    if (hasLineClamp) {\n      // For elements with line-clamp, check if content height exceeds line-clamp height\n      const lineHeight = parseInt(style.lineHeight);\n      const maxLines = parseInt(style.getPropertyValue(\"-webkit-line-clamp\"));\n      const maxHeight = lineHeight * maxLines;\n\n      isTruncated = el.scrollHeight > maxHeight;\n    } else {\n      // Original check for elements without line-clamp\n      isTruncated = el.scrollWidth > el.clientWidth || el.scrollHeight > el.clientHeight;\n    }\n\n    if (isTruncated) {\n      el.setAttribute(\"title\", el.textContent.trim());\n    } else {\n      el.removeAttribute(\"title\");\n    }\n  }\n\n  componentDidRender(): void {\n    this.setTooltipTitle(this.authorsRef);\n    this.setTooltipTitle(this.titleRef);\n    this.setTooltipTitle(this.subtitleRef);\n  }\n\n  private resizeHandler = (): void => {\n    this.setTooltipTitle(this.authorsRef);\n    this.setTooltipTitle(this.titleRef);\n    this.setTooltipTitle(this.subtitleRef);\n  };\n\n  componentDidLoad(): void {\n    window.addEventListener(\"resize\", this.resizeHandler);\n  }\n\n  disconnectedCallback(): void {\n    window.removeEventListener(\"resize\", this.resizeHandler);\n  }\n\n  private renderOperaCard = (): HTMLZResultCardElement => {\n    const title = this.titleHtmlTag ? `<${this.titleHtmlTag}>${this.cardTitle}</${this.titleHtmlTag}>` : this.cardTitle;\n\n    return (\n      <Host tabIndex={0}>\n        <div class={`z-cover-container ${this.hasMultipleCovers ? \"has-multiple\" : \"\"}`}>\n          <div class=\"z-cover-stack\">\n            {this.hasMultipleCovers && (\n              <div>\n                <div class=\"z-cover-shadow z-shadow-2\" />\n                <div class=\"z-cover-shadow z-shadow-1\" />\n              </div>\n            )}\n            <div class=\"z-cover-img\">\n              <img\n                src={this.cover || this.fallbackCover || defaultFallbackCover}\n                alt=\"\"\n                onError={() => {\n                  if (this.fallbackCover) {\n                    this.cover = this.fallbackCover;\n                  } else {\n                    this.cover = defaultFallbackCover;\n                  }\n                }}\n              />\n            </div>\n          </div>\n        </div>\n        <div class=\"info-container\">\n          {this.authors && (\n            <span\n              class=\"authors-label\"\n              ref={(el) => (this.authorsRef = el as HTMLElement)}\n            >\n              {this.authors}\n            </span>\n          )}\n          <div\n            class=\"card-title\"\n            ref={(el) => (this.titleRef = el as HTMLElement)}\n            innerHTML={title}\n          ></div>\n          <span\n            class=\"card-subtitle\"\n            ref={(el) => (this.subtitleRef = el as HTMLElement)}\n          >\n            {this.cardSubtitle}\n          </span>\n          <div class=\"tags-container\">\n            <slot name=\"tags\"></slot>\n          </div>\n          <div class=\"volumes-label\">\n            <slot name=\"volumes\"></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  };\n\n  private renderInfoCard = (): HTMLZResultCardElement => {\n    return (\n      <Host\n        tabIndex={0}\n        class=\"info-card\"\n      >\n        <div class=\"info-icon-column\">\n          <div class=\"info-icon-container\">\n            <z-icon\n              class=\"info-icon\"\n              name=\"link\"\n              width={18}\n              height={18}\n            />\n          </div>\n        </div>\n        <div class=\"info-container\">\n          <span\n            class=\"card-title info-title\"\n            ref={(el) => (this.titleRef = el as HTMLElement)}\n          >\n            {this.cardTitle}\n          </span>\n          <span\n            class=\"card-subtitle info-subtitle\"\n            ref={(el) => (this.subtitleRef = el as HTMLElement)}\n          >\n            {this.cardSubtitle}\n          </span>\n        </div>\n      </Host>\n    );\n  };\n\n  render(): HTMLZResultCardElement {\n    return this.isInfoCard ? this.renderInfoCard() : this.renderOperaCard();\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAY,k2GAClB,MAAAC,EAAeD,E,MCOFE,EAAW,M,yBA8FdC,KAAAC,cAAgB,KACtBD,KAAKE,gBAAgBF,KAAKG,YAC1BH,KAAKE,gBAAgBF,KAAKI,UAC1BJ,KAAKE,gBAAgBF,KAAKK,YAAY,EAWhCL,KAAAM,gBAAkB,KACxB,MAAMC,EAAQP,KAAKQ,aAAe,IAAIR,KAAKQ,gBAAgBR,KAAKS,cAAcT,KAAKQ,gBAAkBR,KAAKS,UAE1G,OACEC,EAACC,EAAI,CAACC,SAAU,GACdF,EAAA,OAAKG,MAAO,qBAAqBb,KAAKc,kBAAoB,eAAiB,MACzEJ,EAAA,OAAKG,MAAM,iBACRb,KAAKc,mBACJJ,EAAA,WACEA,EAAA,OAAKG,MAAM,8BACXH,EAAA,OAAKG,MAAM,+BAGfH,EAAA,OAAKG,MAAM,eACTH,EAAA,OACEK,IAAKf,KAAKgB,OAAShB,KAAKiB,eAAiBC,EACzCC,IAAI,GACJC,QAAS,KACP,GAAIpB,KAAKiB,cAAe,CACtBjB,KAAKgB,MAAQhB,KAAKiB,a,KACb,CACLjB,KAAKgB,MAAQE,C,QAOzBR,EAAA,OAAKG,MAAM,kBACRb,KAAKqB,SACJX,EAAA,QACEG,MAAM,gBACNS,IAAMC,GAAQvB,KAAKG,WAAaoB,GAE/BvB,KAAKqB,SAGVX,EAAA,OACEG,MAAM,aACNS,IAAMC,GAAQvB,KAAKI,SAAWmB,EAC9BC,UAAWjB,IAEbG,EAAA,QACEG,MAAM,gBACNS,IAAMC,GAAQvB,KAAKK,YAAckB,GAEhCvB,KAAKyB,cAERf,EAAA,OAAKG,MAAM,kBACTH,EAAA,QAAMgB,KAAK,UAEbhB,EAAA,OAAKG,MAAM,iBACTH,EAAA,QAAMgB,KAAK,cAGV,EAIH1B,KAAA2B,eAAiB,IAErBjB,EAACC,EAAI,CACHC,SAAU,EACVC,MAAM,aAENH,EAAA,OAAKG,MAAM,oBACTH,EAAA,OAAKG,MAAM,uBACTH,EAAA,UACEG,MAAM,YACNa,KAAK,OACLE,MAAO,GACPC,OAAQ,OAIdnB,EAAA,OAAKG,MAAM,kBACTH,EAAA,QACEG,MAAM,wBACNS,IAAMC,GAAQvB,KAAKI,SAAWmB,GAE7BvB,KAAKS,WAERC,EAAA,QACEG,MAAM,8BACNS,IAAMC,GAAQvB,KAAKK,YAAckB,GAEhCvB,KAAKyB,gB,qJA7JI,M,gBAOP,M,4BAeL,eAAAvB,CAAgBqB,GACtB,IAAKA,EAAI,CACP,M,CAIF,MAAMO,EAAQC,OAAOC,iBAAiBT,GACtC,MAAMU,EAAeH,EAAMI,iBAAiB,wBAA0B,OAEtE,IAAIC,EACJ,GAAIF,EAAc,CAEhB,MAAMG,EAAaC,SAASP,EAAMM,YAClC,MAAME,EAAWD,SAASP,EAAMI,iBAAiB,uBACjD,MAAMK,EAAYH,EAAaE,EAE/BH,EAAcZ,EAAGiB,aAAeD,C,KAC3B,CAELJ,EAAcZ,EAAGkB,YAAclB,EAAGmB,aAAenB,EAAGiB,aAAejB,EAAGoB,Y,CAGxE,GAAIR,EAAa,CACfZ,EAAGqB,aAAa,QAASrB,EAAGsB,YAAYC,O,KACnC,CACLvB,EAAGwB,gBAAgB,Q,EAIvB,kBAAAC,GACEhD,KAAKE,gBAAgBF,KAAKG,YAC1BH,KAAKE,gBAAgBF,KAAKI,UAC1BJ,KAAKE,gBAAgBF,KAAKK,Y,CAS5B,gBAAA4C,GACElB,OAAOmB,iBAAiB,SAAUlD,KAAKC,c,CAGzC,oBAAAkD,GACEpB,OAAOqB,oBAAoB,SAAUpD,KAAKC,c,CAgG5C,MAAAoD,GACE,OAAOrD,KAAKsD,WAAatD,KAAK2B,iBAAmB3B,KAAKM,iB","ignoreList":[]}

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

@@ -1,2 +0,0 @@
-import{r as t,h as o,a,g as e}from"./p-75c4a726.js";import{C as r}from"./p-17af7fb2.js";const s=':host{--aspect-ratio:1.62;--z-card--border-color:var(--gray200);--z-card--color-cover-background:var(--color-surface01);--z-card--text-background:var(--color-surface01);--z-card--text-border-radius:none;--z-card--text-border:none;--z-card--text-padding:calc(var(--space-unit) * 2) var(--space-unit);position:relative;display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}*,::slotted(*){box-sizing:border-box}*:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host(:not([variant="overlay"])) .cover-container{position:relative;width:100%}.cover-container{padding-bottom:calc(100% / var(--aspect-ratio))}::slotted([slot="cover"]),.color-cover{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center}.cover-container>z-icon{--z-icon-width:calc(var(--space-unit) * 11);--z-icon-height:var(--z-icon-width);position:absolute;top:calc(50% - calc(var(--z-icon-height) / 2));left:calc(50% - calc(var(--z-icon-width) / 2));fill:var(--color-primary01)}.color-cover{background-color:var(--z-card--color-cover-background)}.content{display:flex;flex-direction:column;padding-top:var(--space-unit)}.color-cover .cover-content{display:flex;height:100%;flex-direction:column;justify-content:flex-end;padding:var(--space-unit)}::slotted([slot="metadata"]),::slotted([slot="title"]),::slotted([slot="text"]){display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical}::slotted([slot="title"]:not(:last-child)),::slotted([slot="text"]:not(:last-child)){margin-bottom:var(--space-unit)}::slotted([slot="title"])::before{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;content:""}::slotted([slot="metadata"]){width:100%;-webkit-line-clamp:1;line-clamp:1;text-transform:uppercase}::slotted([slot="metadata"]:not(:last-child)){margin:0 0 calc(var(--space-unit) * 0.25)}::slotted([slot="title"]){margin:0;font-size:var(--font-size-3);font-weight:var(--font-sb);-webkit-line-clamp:2;line-clamp:2;text-decoration:none}::slotted([slot="title"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);outline:none}::slotted([slot="text"]){width:100%;margin:0;-webkit-line-clamp:3;line-clamp:3}.actions{display:flex;align-items:center}:host(:not([variant="overlay"])) .actions{margin-top:auto}::slotted([slot="action"]){position:relative;z-index:2}::slotted([slot="action"]:not(:last-child)){margin-right:calc(var(--space-unit) * 2)}::slotted([slot="action"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);outline:none !important}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible){box-shadow:none !important;outline:none !important}:host([clickable]) ::slotted([slot="title"]:focus:focus-visible)::before{box-shadow:var(--shadow-focus-primary)}:host([variant="text"]){border:var(--z-card--text-border);background-color:var(--z-card--text-background);border-radius:var(--z-card--text-border-radius)}:host([variant="text"]) [slot="text"]::before{border-radius:var(--z-card--text-border-radius)}:host([show-shadow])>.content,:host([variant="border"])>.content,:host([variant="shadow"])>.content{height:100%;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2)}:host([variant="text"])>.content{padding:var(--z-card--text-padding)}:host([variant="border"]){border:var(--border-size-small) solid var(--z-card--border-color)}:host([variant="border"][clickable]:hover)>.content{background:var(--color-background)}:host([variant="border"][clickable]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}:host([variant="border"][clickable]:active){border-color:transparent}:host([variant="shadow"]),:host([show-shadow]){box-shadow:var(--shadow-2)}:host([variant="shadow"][clickable]:hover),:host([clickable][show-shadow]:hover){box-shadow:var(--shadow-4)}:host([variant="shadow"][clickable]:focus:focus-visible),:host([clickable][show-shadow]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}:host([variant="shadow"][clickable]:active),:host([clickable][show-shadow]:active){box-shadow:none}:host([variant="overlay"]) .content{position:absolute;top:0;right:0;bottom:0;left:0;justify-content:flex-end;padding:var(--space-unit);background-image:linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));color:var(--color-text-inverse);fill:var(--color-text-inverse)}';const i=s;const n=class{constructor(o){t(this,o);this.variant=undefined;this.coverIcon=undefined;this.showShadow=false;this.clickable=false;this.hasCoverImage=undefined}componentWillLoad(){this.hasCoverImage=this.host.querySelector('[slot="cover"]')!==null}renderColorCoverCard(){return[o("div",{class:"cover-container"},o("div",{class:"color-cover"},o("div",{class:"cover-content"},o("slot",{name:"metadata"}),o("slot",{name:"title"})))),o("div",{class:"content"},o("slot",{name:"text"}),o("div",{class:"actions"},o("slot",{name:"action"})))]}renderContent(){return o("div",{class:"content"},o("slot",{name:"metadata"}),o("slot",{name:"title"}),o("slot",{name:"text"}),o("div",{class:"actions"},o("slot",{name:"action"})))}render(){if(this.variant===r.TEXT){return o(a,null,this.renderContent())}if(this.variant===r.OVERLAY||this.hasCoverImage){return o(a,null,o("div",{class:"cover-container"},this.hasCoverImage&&[o("slot",{name:"cover"}),this.variant!==r.OVERLAY&&this.coverIcon&&o("z-icon",{name:this.coverIcon})],!this.hasCoverImage&&o("div",{class:"color-cover"})),this.renderContent())}return o(a,null,this.renderColorCoverCard())}get host(){return e(this)}};n.style=i;export{n as z_card};
-//# sourceMappingURL=p-ee695830.entry.js.map

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

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZCardStyle0","ZCard","componentWillLoad","this","hasCoverImage","host","querySelector","renderColorCoverCard","h","class","name","renderContent","render","variant","CardVariant","TEXT","Host","OVERLAY","coverIcon"],"sources":["src/components/z-card/styles.css?tag=z-card&encapsulation=shadow","src/components/z-card/index.tsx"],"sourcesContent":[":host {\n  --aspect-ratio: 1.62;\n  --z-card--border-color: var(--gray200);\n  --z-card--color-cover-background: var(--color-surface01);\n  --z-card--text-background: var(--color-surface01);\n  --z-card--text-border-radius: none;\n  --z-card--text-border: none;\n  --z-card--text-padding: calc(var(--space-unit) * 2) var(--space-unit);\n\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n*,\n::slotted(*) {\n  box-sizing: border-box;\n}\n\n*:focus:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host(:not([variant=\"overlay\"])) .cover-container {\n  position: relative;\n  width: 100%;\n}\n\n/* Old good trick with percentage padding to keep the aspect ratio.\nUnfortunately the `aspect-ratio` property is still experimental */\n.cover-container {\n  padding-bottom: calc(100% / var(--aspect-ratio));\n}\n\n::slotted([slot=\"cover\"]),\n.color-cover {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  object-position: center;\n}\n\n.cover-container > z-icon {\n  --z-icon-width: calc(var(--space-unit) * 11);\n  --z-icon-height: var(--z-icon-width);\n\n  position: absolute;\n  top: calc(50% - calc(var(--z-icon-height) / 2));\n  left: calc(50% - calc(var(--z-icon-width) / 2));\n  fill: var(--color-primary01);\n}\n\n.color-cover {\n  background-color: var(--z-card--color-cover-background);\n}\n\n.content {\n  display: flex;\n  flex-direction: column;\n  padding-top: var(--space-unit);\n}\n\n.color-cover .cover-content {\n  display: flex;\n  height: 100%;\n  flex-direction: column;\n  justify-content: flex-end;\n  padding: var(--space-unit);\n}\n\n/* Truncates overflowing text */\n::slotted([slot=\"metadata\"]),\n::slotted([slot=\"title\"]),\n::slotted([slot=\"text\"]) {\n  display: -webkit-box;\n  overflow: hidden;\n  -webkit-box-orient: vertical;\n}\n\n::slotted([slot=\"title\"]:not(:last-child)),\n::slotted([slot=\"text\"]:not(:last-child)) {\n  margin-bottom: var(--space-unit);\n}\n\n::slotted([slot=\"title\"])::before {\n  position: absolute;\n  z-index: 1;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  content: \"\";\n}\n\n::slotted([slot=\"metadata\"]) {\n  width: 100%;\n  -webkit-line-clamp: 1;\n  line-clamp: 1;\n  text-transform: uppercase;\n}\n\n::slotted([slot=\"metadata\"]:not(:last-child)) {\n  margin: 0 0 calc(var(--space-unit) * 0.25);\n}\n\n::slotted([slot=\"title\"]) {\n  margin: 0;\n  font-size: var(--font-size-3);\n  font-weight: var(--font-sb);\n  -webkit-line-clamp: 2;\n  line-clamp: 2;\n  text-decoration: none;\n}\n\n::slotted([slot=\"title\"]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n::slotted([slot=\"text\"]) {\n  width: 100%;\n  margin: 0;\n  -webkit-line-clamp: 3;\n  line-clamp: 3;\n}\n\n.actions {\n  display: flex;\n  align-items: center;\n}\n\n:host(:not([variant=\"overlay\"])) .actions {\n  margin-top: auto;\n}\n\n::slotted([slot=\"action\"]) {\n  position: relative;\n  z-index: 2;\n}\n\n::slotted([slot=\"action\"]:not(:last-child)) {\n  margin-right: calc(var(--space-unit) * 2);\n}\n\n::slotted([slot=\"action\"]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible) {\n  box-shadow: none !important;\n  outline: none !important;\n}\n\n:host([clickable]) ::slotted([slot=\"title\"]:focus:focus-visible)::before {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"text\"]) {\n  border: var(--z-card--text-border);\n  background-color: var(--z-card--text-background);\n  border-radius: var(--z-card--text-border-radius);\n}\n\n:host([variant=\"text\"]) [slot=\"text\"]::before {\n  border-radius: var(--z-card--text-border-radius);\n}\n\n:host([show-shadow]) > .content,\n:host([variant=\"border\"]) > .content,\n:host([variant=\"shadow\"]) > .content {\n  height: 100%;\n  padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host([variant=\"text\"]) > .content {\n  padding: var(--z-card--text-padding);\n}\n\n/* Border */\n:host([variant=\"border\"]) {\n  border: var(--border-size-small) solid var(--z-card--border-color);\n}\n\n:host([variant=\"border\"][clickable]:hover) > .content {\n  background: var(--color-background);\n}\n\n:host([variant=\"border\"][clickable]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"border\"][clickable]:active) {\n  border-color: transparent;\n}\n\n/* Shadow */\n:host([variant=\"shadow\"]),\n:host([show-shadow]) {\n  box-shadow: var(--shadow-2);\n}\n\n:host([variant=\"shadow\"][clickable]:hover),\n:host([clickable][show-shadow]:hover) {\n  box-shadow: var(--shadow-4);\n}\n\n:host([variant=\"shadow\"][clickable]:focus:focus-visible),\n:host([clickable][show-shadow]:focus:focus-visible) {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host([variant=\"shadow\"][clickable]:active),\n:host([clickable][show-shadow]:active) {\n  box-shadow: none;\n}\n\n/* Overlay */\n:host([variant=\"overlay\"]) .content {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  justify-content: flex-end;\n  padding: var(--space-unit);\n  background-image: linear-gradient(to top, rgb(0 0 0 / 100%), rgb(0 0 0 / 0%));\n  color: var(--color-text-inverse);\n  fill: var(--color-text-inverse);\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport {CardVariant} from \"../../beans\";\n\n/**\n * ZCard component.\n * The width of the card must be set by its container, following the grid indications of the design.\n *\n * @cssprop --aspect-ratio - Cover aspect ratio. Default: `1.62`\n * @cssprop --z-card--border-color - Default: `var(--gray200)`\n * @cssprop --z-card--color-cover-background - Cover color. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-background - Background color for the `text` variant. Default: `var(--color-surface01)`\n * @cssprop --z-card--text-border-radius - Default: `none`\n * @cssprop --z-card--text-border - Configure CSS `border`. Default: `none`\n * @cssprop --z-card--text-padding - Configure CSS `padding`. Default: `none`\n * @slot cover - Image cover\n * @slot metadata - Metadata\n * @slot title - Using an `<a>` tag here will make the whole card clickable as if the link was wrapping it.\n * @slot text\n * @slot action - Interactive elements to place at the bottom of the card. To put non-interactive elements here when using an `<a>` tag in the `title` slot, and use this as a sort of \"footer\", set `z-index: 0` on each of those elements.\n */\n@Component({\n  tag: \"z-card\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZCard {\n  /**\n   * Card variant.\n   * Can be one of \"text\", \"border\", \"shadow\", \"overlay\".\n   * Leave it undefined for the default card.\n   */\n  @Prop({reflect: true})\n  variant: CardVariant;\n\n  /** Name of the icon to place over the image cover */\n  @Prop()\n  coverIcon: string;\n\n  /** Enable shadow. Default: false. */\n  @Prop({reflect: true})\n  showShadow = false;\n\n  /**\n   * Enable \"clickable\" styles like hover background and cursor, focus shadow on the whole card, etc.\n   * Always set this to `true` when putting an `<a>` tag in the `title` slot.\n   */\n  @Prop({reflect: true})\n  clickable = false;\n\n  @Element() host: HTMLZCardElement;\n\n  @State()\n  hasCoverImage: boolean;\n\n  componentWillLoad(): void {\n    this.hasCoverImage = this.host.querySelector('[slot=\"cover\"]') !== null;\n  }\n\n  /**\n   * Template for a card without image cover.\n   * A colored background replaces the image and some data is moved over it.\n   */\n  private renderColorCoverCard(): HTMLDivElement[] {\n    return [\n      <div class=\"cover-container\">\n        <div class=\"color-cover\">\n          <div class=\"cover-content\">\n            <slot name=\"metadata\"></slot>\n            <slot name=\"title\"></slot>\n          </div>\n        </div>\n      </div>,\n      <div class=\"content\">\n        <slot name=\"text\"></slot>\n        <div class=\"actions\">\n          <slot name=\"action\"></slot>\n        </div>\n      </div>,\n    ];\n  }\n\n  /**\n   * Template for the content.\n   */\n  private renderContent(): HTMLDivElement {\n    return (\n      <div class=\"content\">\n        <slot name=\"metadata\"></slot>\n        <slot name=\"title\"></slot>\n        <slot name=\"text\"></slot>\n        <div class=\"actions\">\n          <slot name=\"action\"></slot>\n        </div>\n      </div>\n    );\n  }\n\n  render(): HTMLZCardElement {\n    if (this.variant === CardVariant.TEXT) {\n      return <Host>{this.renderContent()}</Host>;\n    }\n\n    if (this.variant === CardVariant.OVERLAY || this.hasCoverImage) {\n      return (\n        <Host>\n          <div class=\"cover-container\">\n            {this.hasCoverImage && [\n              <slot name=\"cover\"></slot>,\n              this.variant !== CardVariant.OVERLAY && this.coverIcon && <z-icon name={this.coverIcon}></z-icon>,\n            ]}\n            {!this.hasCoverImage && <div class=\"color-cover\"></div>}\n          </div>\n          {this.renderContent()}\n        </Host>\n      );\n    }\n\n    return <Host>{this.renderColorCoverCard()}</Host>;\n  }\n}\n"],"mappings":"wFAAA,MAAMA,EAAY,8tIAClB,MAAAC,EAAeD,E,MCwBFE,EAAK,M,yFAeH,M,eAOD,M,6BAOZ,iBAAAC,GACEC,KAAKC,cAAgBD,KAAKE,KAAKC,cAAc,oBAAsB,I,CAO7D,oBAAAC,GACN,MAAO,CACLC,EAAA,OAAKC,MAAM,mBACTD,EAAA,OAAKC,MAAM,eACTD,EAAA,OAAKC,MAAM,iBACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,aAIjBF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,a,CASX,aAAAC,GACN,OACEH,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,aACXF,EAAA,QAAME,KAAK,UACXF,EAAA,QAAME,KAAK,SACXF,EAAA,OAAKC,MAAM,WACTD,EAAA,QAAME,KAAK,Y,CAMnB,MAAAE,GACE,GAAIT,KAAKU,UAAYC,EAAYC,KAAM,CACrC,OAAOP,EAACQ,EAAI,KAAEb,KAAKQ,gB,CAGrB,GAAIR,KAAKU,UAAYC,EAAYG,SAAWd,KAAKC,cAAe,CAC9D,OACEI,EAACQ,EAAI,KACHR,EAAA,OAAKC,MAAM,mBACRN,KAAKC,eAAiB,CACrBI,EAAA,QAAME,KAAK,UACXP,KAAKU,UAAYC,EAAYG,SAAWd,KAAKe,WAAaV,EAAA,UAAQE,KAAMP,KAAKe,cAE7Ef,KAAKC,eAAiBI,EAAA,OAAKC,MAAM,iBAEpCN,KAAKQ,gB,CAKZ,OAAOH,EAACQ,EAAI,KAAEb,KAAKI,uB","ignoreList":[]}

package/src-react/index.ts

@@ -1 +0,0 @@
-export * from "./components";

package/www/build/p-22c755d5.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as i,g as s}from"./p-75c4a726.js";import{I as o,e as a,i as r,g as n,l as h}from"./p-17af7fb2.js";import{r as l,d as c}from"./p-625e2cee.js";import"./p-5145a606.js";const d='.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;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([size="x-small"])>div>.header p.body-3{padding:calc(var(--space-unit) * 0.5) 0}: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>p.body-3{padding:var(--space-unit) 0;margin:0}:host>div>.header>p.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>p.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.open>div.open-combo-data{position:relative;z-index:12;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)}::-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)\n    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)}';const p=d;const u=class{watchItems(){this.itemsList=typeof this.items==="string"?JSON.parse(this.items):this.items;this.selectedCounter=this.itemsList.filter((t=>t.checked)).length;this.updateRenderItemsList()}watchSearchValue(){this.filterItems(this.searchValue)}watchCheckboxes(){this.checkboxes.forEach(((t,e)=>t.setAttribute("tabindex",e===0?"0":"-1")))}emitComboboxChange(){this.comboboxChange.emit({id:this.inputid,items:this.itemsList})}constructor(i){t(this,i);this.comboboxChange=e(this,"comboboxChange",7);this.itemsList=[];this.inputType=o.TEXT;this.inputid=`combo-${l()}`;this.items=undefined;this.label=undefined;this.disabled=false;this.hassearch=false;this.searchlabel=undefined;this.searchplaceholder=undefined;this.searchtitle=undefined;this.noresultslabel="Nessun risultato";this.isopen=false;this.isfixed=false;this.closesearchtext="Chiudi";this.hascheckall=false;this.checkalltext="Seleziona tutti";this.uncheckalltext="Deseleziona tutti";this.maxcheckableitems=0;this.hasgroupitems=undefined;this.size=a.BIG;this.searchValue=undefined;this.selectedCounter=undefined;this.renderItemsList=[];this.focusedItemId=undefined;this.checkboxes=[];this.toggleComboBox=this.toggleComboBox.bind(this);this.closeFilterItems=this.closeFilterItems.bind(this)}componentWillLoad(){this.watchItems()}componentWillRender(){this.selectedCounter=this.itemsList.filter((t=>t.checked)).length}componentDidRender(){const t=this.getAllCheckboxes();if(JSON.stringify(t)!==JSON.stringify(this.checkboxes)){this.checkboxes=t}}getItemId(t){return`combo-checkbox-${this.inputid}-${t.id}`}getCheckboxClass(){return`combo-item-checkbox-input-${this.inputid}`}getAllCheckboxes(){return Array.from(this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`))}getControlToListSize(){switch(this.size){case a.X_SMALL:return r.SMALL;case a.SMALL:return r.MEDIUM;default:return r.LARGE}}handleSelectArrowsNavigation(t,e){if(![n.ARROW_DOWN,n.ARROW_UP].includes(t.key)||!this.isopen){return}t.preventDefault();t.stopPropagation();const i=this.element.shadowRoot.querySelector(`#${e}`);if(!i){return}const s=this.checkboxes;if(!s.length){return}const o=s.indexOf(i);const a=0;const r=s.length-1;let h=null;if(t.key===n.ARROW_DOWN){h=o===r?s[a]:s[o+1]}else if(t.key===n.ARROW_UP){h=o===a?s[r]:s[o-1]}this.focusComboboxItem(h)}handleHeaderKeyboardEvent(t){if(t.key===n.SPACE){t.preventDefault()}if(t.key===n.ARROW_DOWN&&!this.isopen||t.key===n.ARROW_UP&&this.isopen){this.toggleComboBox()}}handleCheckboxFocus(t){this.focusedItemId=t}focusComboboxItem(t){this.checkboxes.forEach((function(t){t.setAttribute("tabindex","-1")}));t.setAttribute("tabindex","0");t.focus()}updateRenderItemsList(){if(this.searchValue){this.filterItems(this.searchValue)}else{this.resetRenderItemsList()}}resetRenderItemsList(){const t=[];this.itemsList.forEach((e=>{t.push(Object.assign({},e))}));this.renderItemsList=t}filterItems(t){if(!t){return this.closeFilterItems()}this.resetRenderItemsList();this.renderItemsList=this.renderItemsList.filter((e=>{const i=e.name.toUpperCase().indexOf(t.toUpperCase());const s=i+t.length;const o=e.name.substring(0,i)+"<strong>"+e.name.substring(i,s)+"</strong>"+e.name.substring(s,e.name.length);e.name=o;return i>=0}))}checkAll(t=true){this.itemsList=this.itemsList.map((e=>Object.assign(Object.assign({},e),{checked:t})));this.resetRenderItemsList();this.emitComboboxChange()}closeFilterItems(){this.searchValue="";this.resetRenderItemsList()}toggleComboBox(){this.isopen=!this.isopen}getComboboxA11yAttributes(){return{role:"combobox","aria-label":this.label,"aria-expanded":this.isopen?"true":"false","aria-activedescendant":this.isopen?this.focusedItemId:"","aria-controls":`${this.inputid}_list`}}renderHeader(){return i("div",{class:"header",onClick:()=>this.toggleComboBox(),onKeyDown:t=>{this.handleHeaderKeyboardEvent(t)},onKeyUp:t=>c(t,this.toggleComboBox),role:"button",tabindex:0,"aria-expanded":this.isopen?"true":"false"},i("p",{class:"body-3"},this.label,i("span",null,this.selectedCounter>0&&` (${this.selectedCounter})`)),i("z-icon",{name:"caret-down",class:this.size}))}renderContent(){if(!this.isopen){return}return i("div",{class:"open-combo-data"},this.hassearch&&this.renderSearchInput(),!this.hassearch?i("span",Object.assign({},this.getComboboxA11yAttributes())):null,i("div",{role:"listbox","aria-label":this.label,"aria-multiselectable":true,id:`${this.inputid}_list`,"aria-owns":`${this.checkboxes.map((t=>t.id)).join(" ")}`},this.hascheckall&&this.renderCheckAll(),this.renderItems()))}renderItems(){return i("div",{class:this.searchValue&&"search"},this.renderList(this.renderItemsList),this.searchValue&&this.renderCloseButton())}renderItem(t,e,s){return i("z-list-element",{id:t.id,htmlTabindex:null,dividerType:e!==s-1?h.ELEMENT:h.NONE,size:this.getControlToListSize()},i("z-input",{type:o.CHECKBOX,checked:t.checked,htmlid:this.getItemId(t),label:t.name,class:this.getCheckboxClass(),disabled:!t.checked&&this.maxcheckableitems&&this.selectedCounter>=this.maxcheckableitems,size:this.size===a.X_SMALL?a.SMALL:this.size,role:"option","aria-selected":t.checked?"true":"false",onKeyDown:e=>this.handleSelectArrowsNavigation(e,this.getItemId(t)),onInputCheck:e=>{this.itemsList=this.itemsList.map((i=>{if(t.id===i.id){i.checked=e.detail.checked}return i}));this.updateRenderItemsList();this.emitComboboxChange()},onInputFocus:t=>this.handleCheckboxFocus(t.detail.id)}))}renderList(t){if(!t){return}if(!t.length&&this.searchValue){return this.renderNoSearchResults()}if(this.hasgroupitems){return this.renderGroups(t)}return i("ul",{role:"none"},t.map(((e,i)=>this.renderItem(e,i,t.length))))}renderGroups(t){const e=t.reduce(((e,i,s)=>{var o;const{category:a}=i;const r=this.renderItem(i,s,t.length);e[a]=(o=e[a])!==null&&o!==void 0?o:[];e[a].push(r);return e}),{});const s=Object.entries(e).map((([t,e])=>i("z-list-group",{"divider-type":h.ELEMENT},i("span",{class:"body-3-sb z-list-group-title",slot:"header-title"},t),e.map((t=>t)))));return i("ul",{role:"none"},s)}renderNoSearchResults(){return i("div",{class:"no-results"},i("span",null,this.noresultslabel))}renderCloseButton(){return i("div",{class:"close-search"},i("a",{onClick:()=>this.closeFilterItems(),onKeyUp:t=>c(t,this.closeFilterItems),role:"button",tabindex:0},this.closesearchtext))}renderSearchInput(){return i("z-input",Object.assign({htmlid:`${this.inputid}_search`,label:this.searchlabel,placeholder:this.searchplaceholder,htmltitle:this.searchtitle,type:this.inputType,value:this.searchValue,message:false,size:this.size,"aria-autocomplete":"list"},this.getComboboxA11yAttributes(),{onKeyUp:t=>{if(t.key===n.ESC){this.closeFilterItems()}},onInputChange:t=>{this.searchValue=t.detail.value}}))}renderCheckAll(){if(this.searchValue){return}const t=`combo-checkbox-${this.inputid}-check-all`;const e=this.selectedCounter===this.itemsList.length;return i("div",{class:"check-all-wrapper"},i("z-input",{type:o.CHECKBOX,checked:e,htmlid:t,class:this.getCheckboxClass(),label:e?this.uncheckalltext:this.checkalltext,disabled:this.maxcheckableitems&&this.maxcheckableitems<this.itemsList.length,size:this.size===a.X_SMALL?a.SMALL:this.size,role:"option","aria-selected":e?"true":"false",onKeyDown:e=>this.handleSelectArrowsNavigation(e,t),onInputCheck:t=>this.checkAll(t.detail.checked),onInputFocus:t=>this.handleCheckboxFocus(t.detail.id)}))}render(){return i("div",{key:"2bcce71a364e370b7c6aaca5a90320b8600e684a","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 s(this)}static get watchers(){return{items:["watchItems"],searchValue:["watchSearchValue"],checkboxes:["watchCheckboxes"]}}};u.style=p;export{u as z_combobox};
-//# sourceMappingURL=p-22c755d5.entry.js.map

package/www/build/p-22c755d5.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["stylesCss","ZComboboxStyle0","ZCombobox","watchItems","this","itemsList","items","JSON","parse","selectedCounter","filter","item","checked","length","updateRenderItemsList","watchSearchValue","filterItems","searchValue","watchCheckboxes","checkboxes","forEach","index","setAttribute","emitComboboxChange","comboboxChange","emit","id","inputid","constructor","hostRef","inputType","InputType","TEXT","randomId","ControlSize","BIG","toggleComboBox","bind","closeFilterItems","componentWillLoad","componentWillRender","componentDidRender","getAllCheckboxes","stringify","getItemId","getCheckboxClass","Array","from","element","shadowRoot","querySelectorAll","getControlToListSize","size","X_SMALL","ListSize","SMALL","MEDIUM","LARGE","handleSelectArrowsNavigation","e","currId","KeyboardCode","ARROW_DOWN","ARROW_UP","includes","key","isopen","preventDefault","stopPropagation","currElem","querySelector","currElemIndex","indexOf","firstElemIndex","lastElemIndex","nextElem","focusComboboxItem","handleHeaderKeyboardEvent","ev","SPACE","handleCheckboxFocus","focusedItemId","elem","focus","resetRenderItemsList","renderItemsList","push","Object","assign","value","start","name","toUpperCase","end","newName","substring","checkAll","map","getComboboxA11yAttributes","role","label","renderHeader","h","class","onClick","onKeyDown","onKeyUp","handleKeyboardSubmit","tabindex","renderContent","hassearch","renderSearchInput","join","hascheckall","renderCheckAll","renderItems","renderList","renderCloseButton","renderItem","htmlTabindex","dividerType","ListDividerType","ELEMENT","NONE","type","CHECKBOX","htmlid","disabled","maxcheckableitems","onInputCheck","i","detail","onInputFocus","renderNoSearchResults","hasgroupitems","renderGroups","newData","reduce","group","category","zListItem","_a","listGroups","entries","slot","noresultslabel","closesearchtext","searchlabel","placeholder","searchplaceholder","htmltitle","searchtitle","message","ESC","onInputChange","checkAllId","allChecked","uncheckalltext","checkalltext","render","open","fixed","isfixed"],"sources":["src/components/z-combobox/styles.css?tag=z-combobox&encapsulation=shadow","src/components/z-combobox/index.tsx"],"sourcesContent":["@import \"../css-components/z-label/styles.css\";\n\n:host {\n  display: block;\n  color: var(--color-form-default-text);\n  fill: var(--color-form-default-icon);\n  font-family: var(--font-family-sans);\n}\n\n:host > div.fixed {\n  position: relative;\n}\n\n:host > div > .header {\n  position: relative;\n  z-index: 10;\n  display: flex;\n  min-height: 42px;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 calc(var(--space-unit) * 1.5);\n  border: var(--border-size-small) solid var(--color-form-surface04);\n  margin: 0;\n  background-color: var(--color-form-background);\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n}\n\n:host([size=\"small\"]) > div > .header {\n  min-height: 34px;\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) > div > .header {\n  min-height: 30px;\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) > div > .header p.body-3 {\n  padding: calc(var(--space-unit) * 0.5) 0;\n}\n\n:host > div > .header:hover {\n  outline: var(--border-size-medium) solid var(--color-form-surface04);\n  outline-offset: -2px;\n}\n\n:host > div > div.header:focus:focus-visible {\n  z-index: 16;\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host > div > .header > p.body-3 {\n  padding: var(--space-unit) 0;\n  margin: 0;\n}\n\n:host > div > .header > p.body-3 > span {\n  font-weight: var(--font-sb);\n}\n\n:host > div > .header > z-icon {\n  fill: var(--color-form-default-icon);\n  transform: rotate(360deg);\n  transition: all 200ms linear;\n}\n\n:host > div > .header > z-icon.small,\n:host > div > .header > z-icon.x-small {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n:host > div.open > .header {\n  border: var(--border-size-small) solid var(--color-form-active-primary);\n  border-radius: var(--border-radius-small) var(--border-radius-small) 0 0;\n}\n\n:host > div.disabled {\n  pointer-events: none;\n}\n\n:host > div.disabled .header {\n  border-color: var(--color-form-disabled03);\n  fill: var(--color-form-disabled01-icon);\n}\n\n:host > div.disabled .header > p.body-3 {\n  color: var(--color-form-disabled03);\n}\n\n:host > div.disabled .header > z-icon:last-child {\n  fill: var(--color-form-disabled01-icon);\n}\n\n:host > div.open > .header > z-icon {\n  fill: var(--color-form-default-icon);\n  transform: rotate(180deg);\n  transition: all 200ms linear;\n}\n\n:host > div.open > div.open-combo-data {\n  position: relative;\n  z-index: 12;\n  padding: var(--space-unit) calc(var(--space-unit) * 2);\n  border: var(--border-size-small) solid var(--color-form-surface03);\n  border-top: 0;\n  background-color: var(--color-form-background);\n  border-radius: 0;\n  box-shadow: var(--shadow-2);\n}\n\n:host .open .open-combo-data z-input .z-label {\n  color: var(--color-form-default-text);\n}\n\n:host > div.open > div.open-combo-data > div > div {\n  overflow: auto;\n  max-height: 235px;\n  padding: 0;\n  padding-left: var(--space-unit); /* padding left and negative margin in order to enable focus */\n  margin-left: calc(var(--space-unit) * -1); /* padding left and negative margin in order to enable focus */\n}\n\n:host > div.open > div.open-combo-data > z-input {\n  width: 100%;\n  margin-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > div.open > div.open-combo-data > div > div > ul {\n  max-height: 235px;\n  padding: 0 calc(var(--space-unit) * 0.5); /* needed for checkbox focus shadow */\n  margin: 0;\n}\n\n:host .open-combo-data z-list-element {\n  --background-color-list-element: var(--color-form-background);\n  --background-hover-color-list-element: var(--color-form-surface03);\n  --background-active-color-list-element: var(--color-form-surface03);\n}\n\n::-webkit-scrollbar {\n  width: 6px;\n  background: linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px);\n}\n\n::-webkit-scrollbar-thumb {\n  background-color: var(--color-primary01);\n}\n\n::-webkit-scrollbar-thumb:hover {\n  background-color: var(--color-hover-primary);\n}\n\n/* Firefox scrollbar */\n@supports not selector(::-webkit-scrollbar-track) {\n  :host {\n    scrollbar-color: var(--color-primary01) transparent;\n  }\n}\n\n:host > div.open > z-input {\n  position: relative;\n  z-index: 1;\n  width: 238px;\n  margin: 0 calc(var(--space-unit) * 2);\n  color: var(--color-form-active-primary);\n}\n\n:host > div.open > div.open-combo-data > div > div.search {\n  overflow: hidden;\n  max-height: none;\n  margin-top: 0;\n}\n\n:host > div.open > div.open-combo-data > div > div.search > ul {\n  overflow: auto;\n  max-height: 180px;\n  padding: var(--space-unit) calc(var(--space-unit) * 2);\n}\n\n:host .open .open-combo-data .search .no-results {\n  display: flex;\n  align-items: center;\n  column-gap: var(--space-unit);\n}\n\n:host > .open > .open-combo-data .search .close-search {\n  display: flex;\n  justify-content: center;\n}\n\n:host > div.open > div.open-combo-data > div > div.search .close-search > a {\n  display: inline-block;\n  height: 44px;\n  color: var(--color-form-active-primary);\n  cursor: pointer;\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  line-height: 44px;\n  text-align: center;\n  text-transform: uppercase;\n}\n\n:host > div.open > div.open-combo-data > div > div.search .close-search > a:focus:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host > div.open > div.open-combo-data > div > div.check-all-wrapper {\n  /* padding left and negative margin in order to enable focus */\n  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5) calc(var(--space-unit) * 2)\n    calc(var(--space-unit) * 1.5);\n  border-bottom: var(--border-size-small) solid var(--gray800);\n  margin-bottom: var(--space-unit);\n  margin-left: calc(var(--space-unit) * -1);\n  text-align: left;\n}\n\n:host([size=\"small\"]) > div.open > div.open-combo-data > div > div.check-all-wrapper {\n  padding: calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 0.5);\n}\n\n:host([size=\"x-small\"]) > div.open > div.open-combo-data > div > div.check-all-wrapper {\n  padding: var(--space-unit) calc(var(--space-unit) * 0.5);\n}\n","import {Component, Element, Event, EventEmitter, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ComboItem, ControlSize, InputType, KeyboardCode, ListDividerType, ListSize} from \"../../beans\";\nimport {handleKeyboardSubmit, randomId} from \"../../utils/utils\";\nimport {ZInput} from \"../z-input\";\n\n@Component({\n  tag: \"z-combobox\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZCombobox {\n  @Element() element: HTMLZComboboxElement;\n\n  /** input unique id */\n  @Prop()\n  inputid = `combo-${randomId()}`;\n\n  /** list items array */\n  @Prop()\n  items: ComboItem[] | string;\n\n  /** label text */\n  @Prop()\n  label: string;\n\n  /** the combobox is disabled */\n  @Prop({reflect: true})\n  disabled?: boolean = false;\n\n  /** show search input flag (optional) */\n  @Prop()\n  hassearch?: boolean = false;\n\n  /** search input label text (optional) */\n  @Prop()\n  searchlabel?: string;\n\n  /** search input placeholder text (optional) */\n  @Prop()\n  searchplaceholder?: string;\n\n  /** search input title text (optional) */\n  @Prop()\n  searchtitle?: string;\n\n  /** no result text message */\n  @Prop()\n  noresultslabel?: string = \"Nessun risultato\";\n\n  /** toggle combo list opening flag */\n  @Prop({mutable: true})\n  isopen = false;\n\n  /** fixed style flag */\n  @Prop()\n  isfixed = false;\n\n  /** close combobox list text */\n  @Prop()\n  closesearchtext?: string = \"Chiudi\";\n\n  /** show \"check all\" checkbox (optional) */\n  @Prop()\n  hascheckall?: boolean = false;\n\n  /** check all label (optional) */\n  @Prop()\n  checkalltext?: string = \"Seleziona tutti\";\n\n  /** uncheck all label (optional) */\n  @Prop()\n  uncheckalltext?: string = \"Deseleziona tutti\";\n\n  /** max number of checkable items (0 = unlimited) */\n  @Prop()\n  maxcheckableitems = 0;\n\n  /** group items by category */\n  @Prop()\n  hasgroupitems?: boolean;\n\n  /** Available sizes: `big`, `small` and `x-small`. Defaults to `big`. */\n  @Prop()\n  size?: ControlSize = ControlSize.BIG;\n\n  @State()\n  searchValue: string;\n\n  @State()\n  selectedCounter: number;\n\n  @State()\n  renderItemsList: ComboItem[] = []; // used for render only\n\n  @State()\n  focusedItemId: string;\n\n  @State()\n  checkboxes: HTMLInputElement[] = [];\n\n  private itemsList: ComboItem[] = [];\n\n  private inputType: InputType = InputType.TEXT;\n\n  @Watch(\"items\")\n  watchItems(): void {\n    this.itemsList = typeof this.items === \"string\" ? JSON.parse(this.items) : this.items;\n    this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n    this.updateRenderItemsList();\n  }\n\n  @Watch(\"searchValue\")\n  watchSearchValue(): void {\n    this.filterItems(this.searchValue);\n  }\n\n  @Watch(\"checkboxes\")\n  watchCheckboxes(): void {\n    this.checkboxes.forEach((item, index) => item.setAttribute(\"tabindex\", index === 0 ? \"0\" : \"-1\"));\n  }\n\n  /** Emitted when value is checked/unchecked. Returns id, items. */\n  @Event()\n  comboboxChange: EventEmitter;\n\n  private emitComboboxChange(): void {\n    this.comboboxChange.emit({id: this.inputid, items: this.itemsList});\n  }\n\n  constructor() {\n    this.toggleComboBox = this.toggleComboBox.bind(this);\n    this.closeFilterItems = this.closeFilterItems.bind(this);\n  }\n\n  componentWillLoad(): void {\n    this.watchItems();\n  }\n\n  componentWillRender(): void {\n    this.selectedCounter = this.itemsList.filter((item) => item.checked).length;\n  }\n\n  componentDidRender(): void {\n    const checkboxes = this.getAllCheckboxes();\n    if (JSON.stringify(checkboxes) !== JSON.stringify(this.checkboxes)) {\n      this.checkboxes = checkboxes;\n    }\n  }\n\n  private getItemId(item: ComboItem): string {\n    return `combo-checkbox-${this.inputid}-${item.id}`;\n  }\n\n  private getCheckboxClass(): string {\n    return `combo-item-checkbox-input-${this.inputid}`;\n  }\n\n  private getAllCheckboxes(): HTMLInputElement[] {\n    return Array.from(\n      this.element.shadowRoot.querySelectorAll(`.${this.getCheckboxClass()} input:not([disabled])`)\n    ) as HTMLInputElement[];\n  }\n\n  private getControlToListSize(): ListSize {\n    switch (this.size) {\n      case ControlSize.X_SMALL:\n        return ListSize.SMALL;\n      case ControlSize.SMALL:\n        return ListSize.MEDIUM;\n      default:\n        return ListSize.LARGE;\n    }\n  }\n\n  private handleSelectArrowsNavigation(e: KeyboardEvent, currId: string): void {\n    if (![KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP].includes(e.key as KeyboardCode) || !this.isopen) {\n      return;\n    }\n\n    e.preventDefault();\n    e.stopPropagation();\n\n    const currElem = this.element.shadowRoot.querySelector(`#${currId}`) as HTMLInputElement;\n    if (!currElem) {\n      return;\n    }\n\n    const checkboxes = this.checkboxes;\n    if (!checkboxes.length) {\n      return;\n    }\n\n    const currElemIndex = checkboxes.indexOf(currElem);\n    const firstElemIndex = 0;\n    const lastElemIndex = checkboxes.length - 1;\n\n    let nextElem = null;\n    if (e.key === KeyboardCode.ARROW_DOWN) {\n      nextElem = currElemIndex === lastElemIndex ? checkboxes[firstElemIndex] : checkboxes[currElemIndex + 1];\n    } else if (e.key === KeyboardCode.ARROW_UP) {\n      nextElem = currElemIndex === firstElemIndex ? checkboxes[lastElemIndex] : checkboxes[currElemIndex - 1];\n    }\n\n    this.focusComboboxItem(nextElem);\n  }\n\n  private handleHeaderKeyboardEvent(ev: KeyboardEvent): void {\n    if (ev.key === KeyboardCode.SPACE) {\n      ev.preventDefault();\n    }\n    if ((ev.key === KeyboardCode.ARROW_DOWN && !this.isopen) || (ev.key === KeyboardCode.ARROW_UP && this.isopen)) {\n      this.toggleComboBox();\n    }\n  }\n\n  private handleCheckboxFocus(id: string): void {\n    this.focusedItemId = id;\n  }\n\n  private focusComboboxItem(elem): void {\n    this.checkboxes.forEach(function (item) {\n      item.setAttribute(\"tabindex\", \"-1\");\n    });\n\n    elem.setAttribute(\"tabindex\", \"0\");\n    elem.focus();\n  }\n\n  private updateRenderItemsList(): void {\n    if (this.searchValue) {\n      this.filterItems(this.searchValue);\n    } else {\n      this.resetRenderItemsList();\n    }\n  }\n\n  private resetRenderItemsList(): void {\n    const renderItemsList = [];\n    this.itemsList.forEach((item: ComboItem) => {\n      renderItemsList.push({...item});\n    });\n    this.renderItemsList = renderItemsList;\n  }\n\n  private filterItems(value: string): void {\n    if (!value) {\n      return this.closeFilterItems();\n    }\n\n    this.resetRenderItemsList();\n    this.renderItemsList = this.renderItemsList.filter((item) => {\n      const start = item.name.toUpperCase().indexOf(value.toUpperCase());\n      const end = start + value.length;\n      const newName =\n        item.name.substring(0, start) +\n        \"<strong>\" +\n        item.name.substring(start, end) +\n        \"</strong>\" +\n        item.name.substring(end, item.name.length);\n\n      item.name = newName;\n\n      return start >= 0;\n    });\n  }\n\n  private checkAll(checked = true): void {\n    this.itemsList = this.itemsList.map((item: ComboItem) => ({\n      ...item,\n      checked: checked,\n    }));\n    this.resetRenderItemsList();\n    this.emitComboboxChange();\n  }\n\n  private closeFilterItems(): void {\n    this.searchValue = \"\";\n    this.resetRenderItemsList();\n  }\n\n  private toggleComboBox(): void {\n    this.isopen = !this.isopen;\n  }\n\n  private getComboboxA11yAttributes(): Record<string, string> {\n    return {\n      \"role\": \"combobox\",\n      \"aria-label\": this.label,\n      \"aria-expanded\": this.isopen ? \"true\" : \"false\",\n      \"aria-activedescendant\": this.isopen ? this.focusedItemId : \"\",\n      \"aria-controls\": `${this.inputid}_list`,\n    };\n  }\n\n  private renderHeader(): HTMLDivElement {\n    return (\n      <div\n        class=\"header\"\n        onClick={() => this.toggleComboBox()}\n        onKeyDown={(ev: KeyboardEvent) => {\n          this.handleHeaderKeyboardEvent(ev);\n        }}\n        onKeyUp={(ev: KeyboardEvent) => handleKeyboardSubmit(ev, this.toggleComboBox)}\n        role=\"button\"\n        tabindex={0}\n        aria-expanded={this.isopen ? \"true\" : \"false\"}\n      >\n        <p class=\"body-3\">\n          {this.label}\n          <span>{this.selectedCounter > 0 && ` (${this.selectedCounter})`}</span>\n        </p>\n        <z-icon\n          name=\"caret-down\"\n          class={this.size}\n        />\n      </div>\n    );\n  }\n\n  private renderContent(): HTMLDivElement {\n    if (!this.isopen) {\n      return;\n    }\n\n    return (\n      <div class=\"open-combo-data\">\n        {this.hassearch && this.renderSearchInput()}\n        {!this.hassearch ? <span {...this.getComboboxA11yAttributes()} /> : null}\n        <div\n          role=\"listbox\"\n          aria-label={this.label}\n          aria-multiselectable={true}\n          id={`${this.inputid}_list`}\n          aria-owns={`${this.checkboxes.map((item) => item.id).join(\" \")}`}\n        >\n          {this.hascheckall && this.renderCheckAll()}\n          {this.renderItems()}\n        </div>\n      </div>\n    );\n  }\n\n  private renderItems(): HTMLDivElement {\n    return (\n      <div class={this.searchValue && \"search\"}>\n        {this.renderList(this.renderItemsList)}\n        {this.searchValue && this.renderCloseButton()}\n      </div>\n    );\n  }\n\n  private renderItem(item: ComboItem, index: number, length: number): HTMLZListElement {\n    return (\n      <z-list-element\n        id={item.id}\n        htmlTabindex={null}\n        dividerType={index !== length - 1 ? ListDividerType.ELEMENT : ListDividerType.NONE}\n        size={this.getControlToListSize()}\n      >\n        <z-input\n          type={InputType.CHECKBOX}\n          checked={item.checked}\n          htmlid={this.getItemId(item)}\n          label={item.name}\n          class={this.getCheckboxClass()}\n          disabled={!item.checked && this.maxcheckableitems && this.selectedCounter >= this.maxcheckableitems}\n          size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n          role=\"option\"\n          aria-selected={item.checked ? \"true\" : \"false\"}\n          onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, this.getItemId(item))}\n          onInputCheck={(e: CustomEvent) => {\n            this.itemsList = this.itemsList.map((i: ComboItem) => {\n              if (item.id === i.id) {\n                i.checked = e.detail.checked;\n              }\n\n              return i;\n            });\n            this.updateRenderItemsList();\n            this.emitComboboxChange();\n          }}\n          onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n        />\n      </z-list-element>\n    );\n  }\n\n  private renderList(items: ComboItem[]): HTMLUListElement {\n    if (!items) {\n      return;\n    }\n    if (!items.length && this.searchValue) {\n      return this.renderNoSearchResults();\n    }\n\n    if (this.hasgroupitems) {\n      return this.renderGroups(items);\n    }\n\n    return (\n      <ul role=\"none\">\n        {items.map((item, i) => {\n          return this.renderItem(item, i, items.length);\n        })}\n      </ul>\n    );\n  }\n\n  private renderGroups(items: ComboItem[]): HTMLUListElement {\n    const newData = items.reduce((group, item, index) => {\n      const {category} = item;\n      const zListItem = this.renderItem(item, index, items.length);\n\n      group[category] = group[category] ?? [];\n      group[category].push(zListItem);\n\n      return group;\n    }, {});\n\n    const listGroups = Object.entries(newData as {[key: string]: HTMLZListElementElement[]}).map(([key, value]) => {\n      return (\n        <z-list-group divider-type={ListDividerType.ELEMENT}>\n          <span\n            class=\"body-3-sb z-list-group-title\"\n            slot=\"header-title\"\n          >\n            {key}\n          </span>\n          {value.map((item) => item)}\n        </z-list-group>\n      );\n    });\n\n    return <ul role=\"none\">{listGroups}</ul>;\n  }\n\n  private renderNoSearchResults(): HTMLUListElement {\n    return (\n      <div class=\"no-results\">\n        <span>{this.noresultslabel}</span>\n      </div>\n    );\n  }\n\n  private renderCloseButton(): HTMLDivElement {\n    return (\n      <div class=\"close-search\">\n        <a\n          onClick={() => this.closeFilterItems()}\n          onKeyUp={(e: KeyboardEvent) => handleKeyboardSubmit(e, this.closeFilterItems)}\n          role=\"button\"\n          tabindex={0}\n        >\n          {this.closesearchtext}\n        </a>\n      </div>\n    );\n  }\n\n  private renderSearchInput(): ZInput {\n    return (\n      <z-input\n        htmlid={`${this.inputid}_search`}\n        label={this.searchlabel}\n        placeholder={this.searchplaceholder}\n        htmltitle={this.searchtitle}\n        type={this.inputType}\n        value={this.searchValue}\n        message={false}\n        size={this.size}\n        aria-autocomplete=\"list\"\n        {...this.getComboboxA11yAttributes()}\n        onKeyUp={(e: KeyboardEvent) => {\n          if (e.key === KeyboardCode.ESC) {\n            this.closeFilterItems();\n          }\n        }}\n        onInputChange={(e: CustomEvent) => {\n          this.searchValue = e.detail.value;\n        }}\n      />\n    );\n  }\n\n  private renderCheckAll(): HTMLDivElement {\n    if (this.searchValue) {\n      return;\n    }\n\n    const checkAllId = `combo-checkbox-${this.inputid}-check-all`;\n    const allChecked = this.selectedCounter === this.itemsList.length;\n\n    return (\n      <div class=\"check-all-wrapper\">\n        <z-input\n          type={InputType.CHECKBOX}\n          checked={allChecked}\n          htmlid={checkAllId}\n          class={this.getCheckboxClass()}\n          label={allChecked ? this.uncheckalltext : this.checkalltext}\n          disabled={this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length}\n          size={this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size}\n          role=\"option\"\n          aria-selected={allChecked ? \"true\" : \"false\"}\n          onKeyDown={(e: KeyboardEvent) => this.handleSelectArrowsNavigation(e, checkAllId)}\n          onInputCheck={(e: CustomEvent) => this.checkAll(e.detail.checked)}\n          onInputFocus={(e: CustomEvent) => this.handleCheckboxFocus(e.detail.id)}\n        />\n      </div>\n    );\n  }\n\n  render(): HTMLDivElement {\n    return (\n      <div\n        data-action={`combo-${this.inputid}`}\n        class={{open: this.isopen, fixed: this.isfixed, disabled: this.disabled}}\n        id={this.inputid}\n      >\n        {this.renderHeader()}\n        {!this.disabled && this.renderContent()}\n      </div>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}