npm - @zanichelli/albe-web-components - Versions diffs - 19.3.0-RC4 → 19.3.0-RC5 - Mend

@zanichelli/albe-web-components 19.3.0-RC4 → 19.3.0-RC5

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

Files changed (1558) hide show

package/dist/web-components-library/p-47b7bc63.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["stylesCss","ZBookCardDeprecatedStyle0","ZBookCardDeprecated","emitRibbonClick","this","ribbonClick","emit","componentWillLoad","id","randomId","mobileMediaQuery","window","matchMedia","Breakpoints","MOBILE","isMobile","matches","onchange","mql","componentDidLoad","handleResources","variant","BookCardDeprecatedVariant","EXPANDED","hasResources","_a","hostElement","querySelectorAll","length","toggleResources","showResources","renderCard","renderMobileExpandedCard","renderExpandedCard","COMPACT","renderCompactCard","SEARCH","renderSearchCard","h","class","renderCover","renderAuthors","renderOperaTitle","renderVolumeTitle","renderIsbn","renderHeaderCtaSlot","renderTagsSlot","renderResourcesSlot","footer","open","close","renderShowResources","renderFooterCtaSlot","ribbon","renderRibbon","src","cover","onError","fallbackCover","content","ribbonIcon","name","width","height","fill","ribbonInteractive","onClick","title","operaTitleTag","operaTitle","innerHTML","volumeTitle","authors","isbn","isbnLabel","toString","onSlotchange","render","key","borderless"],"sources":["src/components/deprecated/z-book-card-deprecated/styles.css?tag=z-book-card-deprecated&encapsulation=shadow","src/components/deprecated/z-book-card-deprecated/index.tsx"],"sourcesContent":["/* COMMON STYLES */\n\n:host {\n --z-book-card-ribbon-background-color: var(--avatar-C08);\n --z-book-card-ribbon-shadow-color: var(--green950);\n --z-book-card-compact-width: 262px;\n --z-book-card-compact-height: 568px;\n}\n\n:host > article {\n display: block;\n width: 100%;\n max-width: 360px;\n box-sizing: border-box;\n border: var(--border-size-medium) solid var(--color-surface03);\n background-color: var(--color-surface01);\n border-radius: var(--border-radius);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > article div.cover {\n position: relative;\n}\n\n:host > article div.cover div.img-wrapper {\n display: flex;\n overflow: hidden;\n border: var(--border-size-small) solid var(--color-surface03);\n line-height: 0;\n}\n\n:host > article div.cover div.img-wrapper img {\n width: auto;\n max-width: 100%;\n height: auto;\n max-height: 100%;\n align-self: flex-end;\n}\n\n:host > article div.cover .ribbon {\n position: absolute;\n z-index: 10;\n top: calc(var(--space-unit) * 2);\n left: calc(var(--space-unit) * -2);\n display: flex;\n max-width: 100%;\n height: calc(var(--space-unit) * 4);\n box-sizing: border-box;\n align-items: center;\n padding: 0 calc(var(--space-unit) * 2);\n border: var(--border-size-medium) solid var(--color-surface01);\n background: var(--z-book-card-ribbon-background-color);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n box-shadow: var(--shadow-2);\n color: var(--color-text-inverse);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n line-height: initial;\n}\n\n:host > article div.cover .ribbon.interactive:hover {\n cursor: pointer;\n}\n\n:host > article div.cover .ribbon.interactive:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n:host > article div.cover .ribbon span {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.cover .ribbon::before {\n position: absolute;\n bottom: -12px;\n left: -2px;\n width: 0;\n height: 0;\n border-top: 10px solid var(--z-book-card-ribbon-shadow-color);\n border-left: 16px solid transparent;\n content: \"\";\n}\n\n:host > article div.cover .ribbon z-icon {\n margin-right: var(--space-unit);\n}\n\n:host > article div.content {\n margin: var(--space-unit) 0;\n border-radius: var(--border-radius);\n}\n\n:host > article .title {\n display: flex;\n height: 100%;\n align-self: center;\n color: var(--color-default-text);\n font-size: var(--font-size-4);\n font-weight: var(--font-sb);\n line-height: 1.5;\n}\n\n:host > article .title * {\n all: unset;\n}\n\n:host > article div.subtitle {\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n font-weight: var(--font-rg);\n line-height: 1.4;\n}\n\n:host > article div.authors {\n color: var(--color-default-text);\n font-size: var(--font-size-1);\n font-weight: var(--font-rg);\n line-height: 1.33;\n}\n\n:host > article div.isbn {\n overflow: hidden;\n color: var(--color-default-text);\n font-size: var(--font-size-2);\n line-height: 1.33;\n text-overflow: ellipsis;\n white-space: nowrap;\n word-wrap: nowrap;\n}\n\n:host > article div.isbn > .code {\n font-weight: var(--font-sb);\n}\n\n:host > article div.tags {\n display: flex;\n overflow: hidden;\n max-height: 32px;\n flex-flow: row wrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n gap: calc(var(--space-unit) / 2);\n}\n\n:host > article ::slotted([slot=\"tags\"]) {\n margin-bottom: var(--space-unit);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]) {\n --z-icon-width: 20px;\n --z-icon-height: 20px;\n\n padding: var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01-icon);\n}\n\n:host > article ::slotted([slot=\"header-cta\"]:focus) {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n/* EXPANDED STYLES */\n\n:host > article.expanded {\n width: 100%;\n min-width: 328px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.expanded div.header {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: top;\n justify-content: space-between;\n margin-bottom: var(--space-unit);\n white-space: nowrap;\n}\n\n:host > article.expanded div.cover div.img-wrapper {\n border-radius: var(--border-radius);\n}\n\n:host > article.expanded div.cover div.img-wrapper img {\n width: 100%;\n}\n\n:host > article.expanded .title,\n:host > article.expanded .subtitle,\n:host > article.expanded .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n:host > article.expanded div.footer {\n border-top: var(--border-size-small) solid var(--color-surface03);\n margin-bottom: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open {\n padding-top: calc(var(--space-unit) * 1.5);\n}\n\n:host > article.expanded div.footer.open div.resources {\n display: initial;\n}\n\n:host > article.expanded div.footer.close div.resources {\n display: none;\n}\n\n:host > article.expanded button.show-resources {\n --z-icon-height: 16px;\n --z-icon-width: 16px;\n\n all: unset;\n display: flex;\n width: 100%;\n flex-flow: row nowrap;\n align-content: center;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 1) 0;\n color: var(--color-text-link-blue);\n cursor: pointer;\n fill: var(--color-text-link-blue);\n font-size: var(--font-size-2);\n font-weight: var(--font-sb);\n gap: var(--space-unit);\n}\n\n:host > article.expanded button.show-resources:focus {\n box-shadow: var(--shadow-focus-primary);\n}\n\n/* SEARCH STYLES */\n\n:host > article.search {\n width: 262px;\n height: 616px;\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n}\n\n:host > article.search .wrapper-container {\n display: flex;\n height: 100%;\n flex-direction: column;\n justify-content: space-between;\n}\n\n:host > article.search .wrapper-container .wrapper {\n height: 451px;\n}\n\n:host > article.search .wrapper-container .action-container {\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.search div.header {\n display: flex;\n height: 24px;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: center;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) * 1.5);\n white-space: nowrap;\n}\n\n:host > article.search div.cover div.img-wrapper {\n height: 314px;\n border-radius: var(--border-radius);\n}\n\n:host > article.search .title {\n display: block;\n height: initial;\n align-self: unset;\n font-size: var(--font-size-3);\n}\n\n:host > article.search .title,\n:host > article.search .subtitle,\n:host > article.search .authors {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n/* COMPACT STYLES */\n\n:host > article.compact {\n width: var(--z-book-card-compact-width);\n height: var(--z-book-card-compact-height);\n}\n\n:host > article.compact.borderless {\n border: none;\n}\n\n:host > article.compact div.cover div.img-wrapper {\n width: 100%;\n height: calc(var(--z-book-card-compact-width) * 1.36);\n box-sizing: border-box;\n border: none;\n background: var(--color-white);\n border-radius: var(--border-radius) var(--border-radius) 0 0;\n box-shadow: var(--shadow-2);\n}\n\n:host > article.compact div.wrapper {\n display: flex;\n height: 100%;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n}\n\n:host > article.compact div.content {\n display: flex;\n box-sizing: border-box;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n padding: calc(var(--space-unit) * 2);\n padding-top: var(--space-unit);\n margin: 0;\n}\n\n:host > article.compact div.action-container {\n padding: calc(var(--space-unit) * 2);\n padding-top: 0;\n margin-top: auto;\n}\n\n:host > article.compact.borderless div.cover div.img-wrapper {\n width: var(--z-book-card-compact-width);\n}\n\n:host > article.compact.borderless div.content {\n padding: 0;\n padding-top: var(--space-unit);\n}\n\n:host > article.compact.borderless div.action-container {\n padding: 0;\n padding-bottom: calc(var(--space-unit) * 2);\n}\n\n:host > article.compact .title {\n display: block;\n height: initial;\n align-self: unset;\n}\n\n:host > article.compact .title,\n:host > article.compact .subtitle,\n:host > article.compact .authors {\n display: -webkit-box;\n overflow: hidden;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n white-space: initial;\n}\n\n/* Tablet breakpoint */\n@media (min-width: 768px) {\n :host > article {\n width: 100%;\n max-width: initial;\n }\n\n :host > article .title {\n display: block;\n height: initial;\n align-self: unset;\n }\n\n /* EXPANDED STYLES */\n\n :host > article.expanded {\n width: 100%;\n min-width: initial;\n max-width: initial;\n height: 360px;\n padding: 0;\n border: 0;\n }\n\n :host > article.expanded div.wrapper {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: flex-start;\n }\n\n :host > article.expanded div.cover div.img-wrapper {\n width: 262px;\n height: 356px;\n border: 0;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-right: none;\n background: var(--color-surface01);\n border-radius: var(--border-radius) 0 0 var(--border-radius);\n }\n\n :host > article.expanded div.cover div.img-wrapper img {\n width: auto;\n border-radius: 0;\n }\n\n :host > article.expanded div.content {\n display: flex;\n overflow: hidden;\n width: 100%;\n height: 356px;\n flex-flow: column nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n border: var(--border-size-medium) solid var(--color-surface03);\n border-left: none;\n margin: 0;\n background: var(--color-surface01);\n border-radius: 0 var(--border-radius) var(--border-radius) 0;\n }\n\n :host > article.expanded div.content div.top {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n\n :host > article.expanded div.content div.top div.info {\n display: flex;\n flex-flow: row nowrap;\n align-content: stretch;\n align-items: stretch;\n justify-content: space-between;\n margin-bottom: calc(var(--space-unit) / 2);\n }\n\n :host > article.expanded div.content div.top div.info > div.left {\n width: 100%;\n }\n\n :host > article.expanded div.content div.bottom {\n padding: calc(var(--space-unit) * 2);\n padding-bottom: 0;\n }\n}\n\n/* Desktop breakpoint */\n\n@media (min-width: 1152px) {\n :host > article {\n width: fit-content;\n max-width: initial;\n }\n}\n\n/* Wide breakpoint */\n@media (min-width: 1366px) {\n :host > article.expanded {\n width: 635px;\n }\n\n :host > article.expanded div.content {\n width: 369px;\n }\n}\n","import {Component, Element, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {BookCardDeprecatedVariant} from \"../../../beans\";\nimport {Breakpoints} from \"../../../constants/breakpoints\";\nimport {randomId} from \"../../../utils/utils\";\n\n/**\n * @slot resources - books resources (extended variant only)\n * @slot header-cta - header CTA (e.g. bookmark icon - extended and search variant only)\n * @slot tags - card tags (extended and search variant only)\n * @slot footer-cta - footer cta button (search and compact variant only)\n * @cssprop --z-book-card-ribbon-background-color - ribbon backgrund color\n * @cssprop --z-book-card-ribbon-shadow-color - ribbon shadow color\n * @cssprop --z-book-card-compact-width - compact card custom width\n * @cssprop --z-book-card-compact-height - compact card custom height\n */\n@Component({\n tag: \"z-book-card-deprecated\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZBookCardDeprecated {\n @Element() hostElement: HTMLZBookCardDeprecatedElement;\n\n /**\n * Card variant: expanded, compact, search\n */\n @Prop()\n variant: BookCardDeprecatedVariant;\n\n /**\n * Cover URL\n */\n @Prop()\n cover: string;\n\n /**\n * Card main title\n */\n @Prop()\n operaTitle: string;\n\n /**\n * [optional] Card subtitle\n */\n @Prop()\n volumeTitle?: string;\n\n /**\n * [optional] Authors\n */\n @Prop()\n authors?: string;\n\n /**\n * [optional] Main ISBN\n */\n @Prop()\n isbn?: string;\n\n /**\n * [optional] ISBN label\n */\n @Prop()\n isbnLabel = \"\";\n\n /**\n * [optional] Ribbon label - expanded and search variant only\n */\n @Prop()\n ribbon?: string;\n\n /**\n * [optional] Ribbon icon - expanded and search variant only\n */\n @Prop()\n ribbonIcon?: string;\n\n /**\n * [optional] Ribbon interactive - expanded and search variant only\n */\n @Prop()\n ribbonInteractive?: boolean;\n\n /**\n * [optional] Borderless card - compact variant only\n */\n @Prop()\n borderless?: boolean;\n\n /**\n * [optional] Fallback cover URL\n */\n @Prop()\n fallbackCover?: string;\n\n /**\n * [optional] [accessibility] Card title HTML tag\n */\n @Prop()\n operaTitleTag?: string;\n\n @State()\n isMobile = false;\n\n @State()\n hasResources = false;\n\n @State()\n showResources = false;\n\n /** click on interactive ribbon */\n @Event()\n ribbonClick: EventEmitter;\n\n private emitRibbonClick(): void {\n this.ribbonClick.emit();\n }\n\n private id: string;\n\n componentWillLoad(): void {\n this.id = `id-${randomId()}`;\n\n const mobileMediaQuery = window.matchMedia(`(max-width: ${Breakpoints.MOBILE}px)`);\n this.isMobile = mobileMediaQuery.matches;\n mobileMediaQuery.onchange = (mql) => (this.isMobile = mql.matches);\n }\n\n componentDidLoad(): void {\n this.handleResources();\n }\n\n private handleResources(): void {\n if (this.variant !== BookCardDeprecatedVariant.EXPANDED || !this.isMobile) {\n return;\n }\n this.hasResources = this.hostElement.querySelectorAll(\"[slot=resources]\")?.length > 0;\n }\n\n private toggleResources(): void {\n this.showResources = !this.showResources;\n }\n\n private renderCard(): HTMLDivElement {\n switch (this.variant) {\n case BookCardDeprecatedVariant.EXPANDED:\n return this.isMobile ? this.renderMobileExpandedCard() : this.renderExpandedCard();\n case BookCardDeprecatedVariant.COMPACT:\n return this.renderCompactCard();\n case BookCardDeprecatedVariant.SEARCH:\n return this.renderSearchCard();\n }\n }\n\n private renderExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n <div class=\"top\">\n <div class=\"info\">\n <div class=\"left\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n <div class=\"right\">{this.renderHeaderCtaSlot()}</div>\n </div>\n {this.renderTagsSlot()}\n </div>\n <div class=\"bottom\">{this.renderResourcesSlot()}</div>\n </div>\n </div>\n );\n }\n\n private renderMobileExpandedCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.hasResources && (\n <div\n class={{\n footer: true,\n open: this.showResources,\n close: !this.showResources,\n }}\n >\n {!this.showResources && this.renderShowResources()}\n {this.renderResourcesSlot()}\n {this.showResources && this.renderShowResources()}\n </div>\n )}\n </div>\n );\n }\n\n private renderSearchCard(): HTMLDivElement {\n return (\n <div class=\"wrapper-container\">\n <div class=\"wrapper\">\n <div class=\"header\">\n {this.renderOperaTitle()}\n {this.renderHeaderCtaSlot()}\n </div>\n {this.renderCover()}\n <div class=\"content\">\n {this.renderTagsSlot()}\n {this.renderAuthors()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCompactCard(): HTMLDivElement {\n return (\n <div class=\"wrapper\">\n {this.renderCover()}\n <div class=\"content\">\n {this.renderAuthors()}\n {this.renderOperaTitle()}\n {this.renderVolumeTitle()}\n {this.renderIsbn()}\n </div>\n {this.renderFooterCtaSlot()}\n </div>\n );\n }\n\n private renderCover(): HTMLDivElement {\n return (\n <div class=\"cover\">\n {this.ribbon && this.variant !== BookCardDeprecatedVariant.COMPACT && this.renderRibbon()}\n <div class=\"img-wrapper\">\n <img\n src={this.cover}\n onError={() => {\n if (this.fallbackCover) {\n this.cover = this.fallbackCover;\n }\n }}\n aria-hidden=\"true\"\n />\n </div>\n </div>\n );\n }\n\n private renderRibbon(): HTMLElement {\n const content = [\n this.ribbonIcon && (\n <z-icon\n name={this.ribbonIcon}\n width={16}\n height={16}\n fill={\"color-inverse-icon\"}\n />\n ),\n <span>{this.ribbon}</span>,\n ];\n\n return this.ribbonInteractive ? (\n <button\n class=\"ribbon interactive\"\n onClick={() => this.emitRibbonClick()}\n >\n {content}\n </button>\n ) : (\n <div class=\"ribbon\">{content}</div>\n );\n }\n\n private renderOperaTitle(): HTMLDivElement {\n const title = this.operaTitleTag\n ? `<${this.operaTitleTag}>${this.operaTitle}</${this.operaTitleTag}>`\n : this.operaTitle;\n\n return (\n <div\n class=\"title\"\n innerHTML={title}\n />\n );\n }\n\n private renderVolumeTitle(): null | HTMLDivElement {\n return this.volumeTitle ? <div class=\"subtitle\">{this.volumeTitle}</div> : null;\n }\n\n private renderAuthors(): null | HTMLDivElement {\n return this.authors ? (\n <div\n class=\"authors\"\n aria-description=\"Autori\"\n >\n {this.authors}\n </div>\n ) : null;\n }\n\n private renderIsbn(): null | HTMLDivElement {\n return this.isbn ? (\n <div class=\"isbn\">\n <span\n class=\"code\"\n aria-description={`ISBN ${this.isbnLabel}`}\n >\n {this.isbn}\n </span>\n {this.isbnLabel ? <span class=\"label\"> {this.isbnLabel}</span> : null}\n </div>\n ) : null;\n }\n\n private renderShowResources(): HTMLButtonElement {\n return (\n <button\n class=\"show-resources\"\n aria-label={`Risorse del libro ${this.operaTitle}`}\n aria-expanded={this.showResources.toString()}\n aria-controls={`resources-${this.id}`}\n onClick={() => this.toggleResources()}\n >\n {this.showResources ? \"Chiudi\" : \"Vedi tutto\"}\n <z-icon name={this.showResources ? \"chevron-up\" : \"chevron-down\"} />\n </button>\n );\n }\n\n private renderTagsSlot(): HTMLDivElement {\n return (\n <div class=\"tags\">\n <slot name=\"tags\" />\n </div>\n );\n }\n\n private renderHeaderCtaSlot(): HTMLSlotElement {\n return <slot name=\"header-cta\" />;\n }\n\n private renderResourcesSlot(): HTMLDivElement {\n return (\n <div\n id={`resources-${this.id}`}\n class=\"resources\"\n >\n <slot\n name=\"resources\"\n onSlotchange={() => this.handleResources()}\n />\n </div>\n );\n }\n\n private renderFooterCtaSlot(): HTMLDivElement {\n return (\n <div class=\"action-container\">\n <slot name=\"footer-cta\" />\n </div>\n );\n }\n\n render(): HTMLZBookCardDeprecatedElement {\n return (\n <article\n class={{\n [this.variant]: true,\n borderless: !!this.borderless,\n }}\n >\n {this.renderCard()}\n </article>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/web-components-library/p-4df66afe.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as t,c as e,h as s,a as i,g as o}from"./p-75c4a726.js";import{g as a}from"./p-86618221.js";const n=':host{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0;font-family:var(--font-family-sans)}:host,::slotted(),{box-sizing:border-box}::slotted(a){text-decoration:none}::slotted(){color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}.label{display:flex;width:100%;align-items:center;padding:var(--space-unit) 0;border:0;border-bottom:var(--border-size-small) solid var(--color-surface03);margin:0;background:transparent;border-radius:0;cursor:pointer;text-align:left}:host(:last-child:not([open])) .label{border-bottom:none}:host(:is([active],[open])) .label,.label:focus:focus-visible,.label:hover{border-color:var(--color-primary01)}.label:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host(:is([active],[open])) .label ::slotted(),.label:focus:focus-visible ::slotted(),.label:hover ::slotted(){font-weight:var(--font-bd)}::slotted([data-text]){display:inline-flex;flex-direction:column}::slotted([data-text])::after{overflow:hidden;height:0;content:attr(data-text);content:attr(data-text) / "";font-weight:var(--font-bd);pointer-events:none;user-select:none;visibility:hidden}@media speech{::slotted([data-text])::after{display:none}}.label ::slotted(){width:100%;margin:0;font-size:var(--font-size-3);line-height:1.5}.label z-icon{margin-left:calc(var(--space-unit) 4);fill:var(--color-default-icon)}.items{display:flex;width:100%;flex-direction:column;padding:calc(var(--space-unit) / 2);padding-bottom:calc(var(--space-unit) * 1.5)}.items[hidden]{display:none}::slotted([slot="section"]){display:inline-flex;padding:calc(var(--space-unit) / 2);margin:0;font-size:var(--font-size-1);line-height:1.333;outline:none}::slotted([slot="section"]:last-of-type){border:none}::slotted([slot="section"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);color:var(--color-primary01)}::slotted([slot="section"]:hover),::slotted([slot="section"]:focus:focus-visible),::slotted([slot="section"]:active),::slotted([slot="section"][active]),::slotted([slot="section"][data-active]){color:var(--color-primary01);font-weight:var(--font-bd)}';const h=n;const l=class{get focusableItem(){return this.items.find((({tabIndex:t})=>t===0))}toggle(){if(!this.hasItems){return}this.open=!this.open}setItemsA11yAttrs(){if(!this.hasItems){return}this.items.forEach((t=>{t.setAttribute("role","menuitem");t.tabIndex=-1}))}onItemsChange(){this.items=Array.from(this.host.querySelectorAll('[slot="section"]'));this.hasItems=this.items.length>0;this.setItemsA11yAttrs()}onLabelSlotChange(t){const e=t.target.assignedElements()[0];e.dataset.text=e===null\|\|e===void 0?void 0:e.textContent}onLabelClick(){this.toggle();this.setFocus()}onLabelKeydown(t){if(t.key===a.ENTER\|\|t.key===a.SPACE){t.preventDefault();t.stopPropagation();this.toggle();if(this.open){this.focustFirstItem()}}}moveFocus(t,e){t.tabIndex=0;setTimeout((()=>{t.focus()}),100);if(e){e.tabIndex=-1}}focustFirstItem(){this.moveFocus(this.items[0])}async focusLastItem(){this.moveFocus(this.items[this.items.length-1])}async setFocus(){this.htmlTabindex=0;setTimeout((()=>{this.label.focus()}),100)}onOpenChange(){if(!this.open){this.setItemsA11yAttrs();this.closed.emit()}else{this.opened.emit()}}onTabindexChange(){if(!this.label){return}this.label.tabIndex=this.htmlTabindex}onItemsKeydown(t){switch(t.key){case a.ESC:case a.ARROW_LEFT:if(!this.open){break}t.preventDefault();t.stopPropagation();this.moveFocus(this.label,this.focusableItem);this.open=false;break;case a.ARROW_RIGHT:if(this.open){break}t.preventDefault();t.stopPropagation();this.open=true;this.focustFirstItem();break;case a.ARROW_DOWN:{if(!this.open){break}if(document.activeElement===this.host){t.preventDefault();t.stopPropagation();this.focustFirstItem();break}const e=this.items.indexOf(this.focusableItem);const s=this.items[e+1];if(s){t.preventDefault();t.stopPropagation();this.moveFocus(s,this.focusableItem)}else{this.htmlTabindex=0;this.focusableItem.tabIndex=-1}break}case a.ARROW_UP:{if(!this.open\|\|document.activeElement===this.host){break}const e=this.items.indexOf(this.focusableItem);const s=this.items[e-1];t.preventDefault();t.stopPropagation();if(s){this.moveFocus(s,this.focusableItem)}else{this.focusableItem.tabIndex=-1;this.setFocus()}break}}}constructor(s){t(this,s);this.opened=e(this,"opened",7);this.closed=e(this,"closed",7);this.active=undefined;this.htmlTabindex=-1;this.open=undefined;this.hasItems=undefined;this.items=undefined;this.toggle=this.toggle.bind(this);this.onItemsChange=this.onItemsChange.bind(this);this.onLabelSlotChange=this.onLabelSlotChange.bind(this);this.onLabelClick=this.onLabelClick.bind(this);this.onLabelKeydown=this.onLabelKeydown.bind(this);this.onItemsKeydown=this.onItemsKeydown.bind(this)}connectedCallback(){this.onItemsChange()}render(){return s(i,{key:"a859947e3015a104f32db157c715982a1ed29cf5",open:this.open},s("button",{key:"5c130955c62fcce5d88b92312076da69f307eaee",ref:t=>this.label=t,class:"label","aria-haspopup":`${!!this.hasItems}`,"aria-expanded":`${!!this.open}`,role:"menuitem",tabindex:this.htmlTabindex,onClick:this.onLabelClick,onKeyDown:this.onLabelKeydown},s("slot",{key:"28557c741c733149ea51ca68f499374dcf2eb134",onSlotchange:this.onLabelSlotChange}),this.hasItems&&s("z-icon",{key:"bfa97fe61fde93902531e09dcdeb729066d2e66f",name:this.open?"chevron-up":"chevron-down"})),s("div",{key:"d9a7df39c426fecbc3beeefc2f5a08aed3f2ccbf",class:"items",role:"menu",hidden:!this.open},s("slot",{key:"e2f14a7cf055715bbbb8b712a3d112af3b712031",name:"section",onSlotchange:this.onItemsChange})))}get host(){return o(this)}static get watchers(){return{open:["onOpenChange"],htmlTabindex:["onTabindexChange"]}}};l.style=h;export{l as z_menu_section};
2	- //# sourceMappingURL=p-4df66afe.entry.js.map

package/dist/web-components-library/p-4df66afe.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["stylesCss","ZMenuSectionStyle0","ZMenuSection","focusableItem","this","items","find","tabIndex","toggle","hasItems","open","setItemsA11yAttrs","forEach","item","setAttribute","onItemsChange","Array","from","host","querySelectorAll","length","onLabelSlotChange","ev","labelElement","target","assignedElements","dataset","text","textContent","onLabelClick","setFocus","onLabelKeydown","key","KeyboardCode","ENTER","SPACE","preventDefault","stopPropagation","focustFirstItem","moveFocus","receiver","current","setTimeout","focus","focusLastItem","htmlTabindex","label","onOpenChange","closed","emit","opened","onTabindexChange","onItemsKeydown","ESC","ARROW_LEFT","ARROW_RIGHT","ARROW_DOWN","document","activeElement","currentIndex","indexOf","ARROW_UP","constructor","hostRef","bind","connectedCallback","render","h","Host","ref","el","class","role","tabindex","onClick","onKeyDown","onSlotchange","name","hidden"],"sources":["src/components/z-menu-section/styles.css?tag=z-menu-section&encapsulation=shadow","src/components/z-menu-section/index.tsx"],"sourcesContent":[":host {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n padding: 0;\n font-family: var(--font-family-sans);\n}\n\n:host,\n::slotted(*),\n* {\n box-sizing: border-box;\n}\n\n::slotted(a) {\n text-decoration: none;\n}\n\n::slotted(*) {\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n.label {\n display: flex;\n width: 100%;\n align-items: center;\n padding: var(--space-unit) 0;\n border: 0;\n border-bottom: var(--border-size-small) solid var(--color-surface03);\n margin: 0;\n background: transparent;\n border-radius: 0;\n cursor: pointer;\n text-align: left;\n}\n\n:host(:last-child:not([open])) .label {\n border-bottom: none;\n}\n\n:host(:is([active], [open])) .label,\n.label:focus:focus-visible,\n.label:hover {\n border-color: var(--color-primary01);\n}\n\n.label:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n outline: none;\n}\n\n:host(:is([active], [open])) .label ::slotted(*),\n.label:focus:focus-visible ::slotted(*),\n.label:hover ::slotted(*) {\n font-weight: var(--font-bd);\n}\n\n::slotted([data-text]) {\n display: inline-flex;\n flex-direction: column;\n}\n\n/* Trick to prevent layout shifts on font-weight changes.\nThe trick is to put an hidden copy of the text already set to bold,\nso the needed space is correctly calculated before any hover/active state changes the\nfont-weight of the real text.\nThe hidden text has an height of 0px so it can expand the width without changing the height\nwhen placed below the real text using `flex-direction: column`. */\n::slotted([data-text])::after {\n overflow: hidden;\n height: 0;\n content: attr(data-text);\n content: attr(data-text) / \"\";\n font-weight: var(--font-bd);\n pointer-events: none;\n user-select: none;\n visibility: hidden;\n}\n\n@media speech {\n ::slotted([data-text])::after {\n display: none;\n }\n}\n\n.label ::slotted(*) {\n width: 100%;\n margin: 0;\n font-size: var(--font-size-3);\n line-height: 1.5;\n}\n\n.label z-icon {\n margin-left: calc(var(--space-unit) * 4);\n fill: var(--color-default-icon);\n}\n\n.items {\n display: flex;\n width: 100%;\n flex-direction: column;\n padding: calc(var(--space-unit) / 2);\n padding-bottom: calc(var(--space-unit) * 1.5);\n}\n\n.items[hidden] {\n display: none;\n}\n\n::slotted([slot=\"section\"]) {\n display: inline-flex;\n padding: calc(var(--space-unit) / 2);\n margin: 0;\n font-size: var(--font-size-1);\n line-height: 1.333;\n outline: none;\n}\n\n::slotted([slot=\"section\"]:last-of-type) {\n border: none;\n}\n\n::slotted([slot=\"section\"]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n color: var(--color-primary01);\n}\n\n::slotted([slot=\"section\"]:hover),\n::slotted([slot=\"section\"]:focus:focus-visible),\n::slotted([slot=\"section\"]:active),\n::slotted([slot=\"section\"][active]),\n::slotted([slot=\"section\"][data-active]) {\n color: var(--color-primary01);\n font-weight: var(--font-bd);\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h} from \"@stencil/core\";\nimport {KeyboardCode} from \"../../beans\";\n\n/**\n * A component to create submenus inside the ZMenu.\n * @slot - Label of the menu section.\n * @slot section - Single entry of the menu section. Set the same slot name to different elements to put many of them. Add the `data-active` attribute to a slotted element to highlight it (`active` also works but `data-active` is preferable).\n */\n@Component({\n tag: \"z-menu-section\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMenuSection {\n @Element() host: HTMLZMenuSectionElement;\n\n /** Active state */\n @Prop({reflect: true})\n active?: boolean;\n\n /**\n * Tabindex value to set on the label button.\n * Useful to manage keyboard navigation focus with roving tabindex handled by this component's parent (usually ZMenu).\n */\n @Prop()\n htmlTabindex = -1;\n\n /** The opening state of the section. */\n @Prop({mutable: true})\n open: boolean;\n\n @State()\n hasItems: boolean;\n\n @State()\n items: HTMLElement[];\n\n /** The section has been opened. */\n @Event()\n opened: EventEmitter;\n\n /** The section has been closed. */\n @Event()\n closed: EventEmitter;\n\n private label: HTMLButtonElement;\n\n private get focusableItem(): HTMLElement {\n return this.items.find(({tabIndex}) => tabIndex === 0);\n }\n\n private toggle(): void {\n if (!this.hasItems) {\n return;\n }\n\n this.open = !this.open;\n }\n\n private setItemsA11yAttrs(): void {\n if (!this.hasItems) {\n return;\n }\n\n this.items.forEach((item) => {\n item.setAttribute(\"role\", \"menuitem\");\n item.tabIndex = -1;\n });\n }\n\n private onItemsChange(): void {\n this.items = Array.from(this.host.querySelectorAll('[slot=\"section\"]')) as HTMLElement[];\n this.hasItems = this.items.length > 0;\n this.setItemsA11yAttrs();\n }\n\n /**\n * Sets slotted item text as `data-text` attribute value, to let CSS use it through `attr()`.\n * @param ev Slotchange event\n */\n private onLabelSlotChange(ev: Event): void {\n const labelElement = (ev.target as HTMLSlotElement).assignedElements()[0] as HTMLElement;\n labelElement.dataset.text = labelElement?.textContent;\n }\n\n private onLabelClick(): void {\n this.toggle();\n this.setFocus();\n }\n\n private onLabelKeydown(ev: KeyboardEvent): void {\n if (ev.key === KeyboardCode.ENTER || ev.key === KeyboardCode.SPACE) {\n ev.preventDefault();\n ev.stopPropagation();\n this.toggle();\n if (this.open) {\n this.focustFirstItem();\n }\n }\n }\n\n /**\n * Move focus and adjust the tabindex value of `receiver` and `current` elements,\n * setting -1 to the `current` and 0 to the `receiver`, then focus the `receiver` element.\n */\n private moveFocus(receiver: HTMLElement, current?: HTMLElement): void {\n receiver.tabIndex = 0;\n setTimeout(() => {\n receiver.focus();\n }, 100);\n if (current) {\n current.tabIndex = -1;\n }\n }\n\n private focustFirstItem(): void {\n this.moveFocus(this.items[0]);\n }\n\n /** Focus the last item. */\n @Method()\n async focusLastItem(): Promise<void> {\n this.moveFocus(this.items[this.items.length - 1]);\n }\n\n /** Set tabindex of the label to 0, then focus it. */\n @Method()\n async setFocus(): Promise<void> {\n this.htmlTabindex = 0;\n setTimeout(() => {\n this.label.focus();\n }, 100);\n }\n\n @Watch(\"open\")\n onOpenChange(): void {\n if (!this.open) {\n this.setItemsA11yAttrs();\n this.closed.emit();\n } else {\n this.opened.emit();\n }\n }\n\n @Watch(\"htmlTabindex\")\n onTabindexChange(): void {\n if (!this.label) {\n return;\n }\n\n this.label.tabIndex = this.htmlTabindex;\n }\n\n @Listen(\"keydown\")\n private onItemsKeydown(ev: KeyboardEvent): void {\n switch (ev.key) {\n case KeyboardCode.ESC:\n case KeyboardCode.ARROW_LEFT:\n if (!this.open) {\n break;\n }\n ev.preventDefault();\n ev.stopPropagation();\n this.moveFocus(this.label, this.focusableItem);\n this.open = false;\n break;\n case KeyboardCode.ARROW_RIGHT:\n if (this.open) {\n break;\n }\n ev.preventDefault();\n ev.stopPropagation();\n this.open = true;\n this.focustFirstItem();\n break;\n case KeyboardCode.ARROW_DOWN: {\n if (!this.open) {\n break;\n }\n if (document.activeElement === this.host) {\n ev.preventDefault();\n ev.stopPropagation();\n this.focustFirstItem();\n break;\n }\n const currentIndex = this.items.indexOf(this.focusableItem);\n const receiver = this.items[currentIndex + 1];\n if (receiver) {\n ev.preventDefault();\n ev.stopPropagation();\n this.moveFocus(receiver, this.focusableItem);\n } else {\n this.htmlTabindex = 0;\n this.focusableItem.tabIndex = -1;\n }\n break;\n }\n case KeyboardCode.ARROW_UP: {\n if (!this.open || document.activeElement === this.host) {\n break;\n }\n const currentIndex = this.items.indexOf(this.focusableItem);\n const receiver = this.items[currentIndex - 1];\n ev.preventDefault();\n ev.stopPropagation();\n if (receiver) {\n this.moveFocus(receiver, this.focusableItem);\n } else {\n // since there isn't a previous item to focus, give the focus to the label element\n this.focusableItem.tabIndex = -1;\n this.setFocus();\n }\n break;\n }\n }\n }\n\n constructor() {\n this.toggle = this.toggle.bind(this);\n this.onItemsChange = this.onItemsChange.bind(this);\n this.onLabelSlotChange = this.onLabelSlotChange.bind(this);\n this.onLabelClick = this.onLabelClick.bind(this);\n this.onLabelKeydown = this.onLabelKeydown.bind(this);\n this.onItemsKeydown = this.onItemsKeydown.bind(this);\n }\n\n connectedCallback(): void {\n this.onItemsChange();\n }\n\n render(): HTMLZMenuSectionElement {\n return (\n <Host open={this.open}>\n <button\n ref={(el) => (this.label = el)}\n class=\"label\"\n aria-haspopup={`${!!this.hasItems}`}\n aria-expanded={`${!!this.open}`}\n role=\"menuitem\"\n tabindex={this.htmlTabindex}\n onClick={this.onLabelClick}\n onKeyDown={this.onLabelKeydown}\n >\n <slot onSlotchange={this.onLabelSlotChange} />\n {this.hasItems && <z-icon name={this.open ? \"chevron-up\" : \"chevron-down\"} />}\n </button>\n <div\n class=\"items\"\n role=\"menu\"\n hidden={!this.open}\n >\n <slot\n name=\"section\"\n onSlotchange={this.onItemsChange}\n />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/web-components-library/p-5145a606.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- var B;(function(B){B[B["MOBILE"]=767]="MOBILE";B[B["TABLET"]=1151]="TABLET";B[B["DESKTOP"]=1365]="DESKTOP"})(B\|\|(B={}));export{B};
2	- //# sourceMappingURL=p-5145a606.js.map

package/dist/web-components-library/p-5145a606.js.map DELETED Viewed

	@@ -1 +0,0 @@
1	- {"version":3,"names":["Breakpoints"],"sources":["src/constants/breakpoints.ts"],"sourcesContent":["/** Breakpoints for responsive design. The values are the max width of the screen for each breakpoint. */\nexport enum Breakpoints {\n MOBILE = 767,\n TABLET = 1151,\n DESKTOP = 1365,\n}\n"],"mappings":"IACYA,GAAZ,SAAYA,GACVA,IAAA,wBACAA,IAAA,yBACAA,IAAA,0BACD,EAJD,CAAYA,MAAW,Y","ignoreList":[]}

package/dist/web-components-library/p-54cd104c.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as t,c as o,h as e,a as s,g as n}from"./p-75c4a726.js";import{P as a,S as i,B as r,e as c}from"./p-86618221.js";const h=':host{position:relative;display:flex;max-width:100%;align-items:center;padding:calc(var(--z-table--cells-padding, calc(var(--space-unit) * 2)));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}:host{z-index:1;padding:0;background-color:var(--color-background);font-weight:var(--font-sb)}.cell--content{padding:var(--z-table--cells-padding, calc(var(--space-unit) 2))}:host([show-sorting]) .cell--content{column-gap:var(--space-unit)}.z-th--sort-button{position:relative;padding:0;border:none;background-color:transparent;cursor:pointer;outline:none}.z-th--sort-button:focus,.z-th--sort-button:focus-visible{box-shadow:var(--shadow-focus-primary);opacity:1;outline:none;pointer-events:all}@media (min-width: 768px) and (hover: hover){:host([show-sorting="hover"]) .z-th--sort-button{opacity:0;pointer-events:none}:host([show-sorting="hover"]:hover) .z-th--sort-button,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible,:host([show-sorting="always"]) .z-th--sort-button,:host([sorted]) .z-th--sort-button{opacity:1;pointer-events:all}}:host([show-sorting="hover"]:hover) .z-th--sort-button::after,:host([show-sorting="hover"]) .z-th--sort-button:focus:focus-visible::after,:host([show-sorting="always"]) .z-th--sort-button::after,:host([sorted]) .z-th--sort-button::after{position:absolute;top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 10px);background-color:transparent;content:""}';const l=h;const u=class{constructor(e){t(this,e);this.sort=o(this,"sort",7);this.colspan=undefined;this.showMenu=null;this.showSorting=null;this.sticky=false;this.sortDirection=undefined;this.sorted=false;this.popoverPosition=a.AUTO;this.isMenuOpen=false}get ariaSortDirection(){if(!this.sortDirection){return null}return this.sortDirection===i.ASC?"ascending":"descending"}handleSort(){if(!this.sortDirection){this.sorted=false;return}this.sortDirection=this.sortDirection===i.ASC?i.DESC:i.ASC;this.sorted=true;this.sort.emit({sortDirection:this.sortDirection})}updateColspan(){if(this.colspan){this.host.style.gridColumn=`span ${this.colspan}`}else{this.host.style.removeProperty("grid-column")}}componentWillLoad(){this.updateColspan()}render(){return e(s,{key:"411a78aacd4b76ea9180828a7567aaaa92f9a3fa",role:"columnheader","menu-open":this.isMenuOpen,"aria-sort":this.ariaSortDirection,sortable:this.showSorting},e("div",{key:"a4d93cc27f9e8e69cffac93180ac54c9a6f79a21",class:"cell--content"},e("slot",{key:"b205cd6628dbfd09638a23ea6ad4bbe577303a87"}),this.showSorting&&e("button",{key:"e28f86801a946cd89a30c9b8e289a653916299da",class:"z-th--sort-button",type:"button",onClick:this.handleSort.bind(this)},e("z-icon",{key:"fbbb4bb4ff4cfba7958afbf05edad06b5e8c725c",name:this.sortDirection===i.DESC?"arrow-simple-up":"arrow-simple-down",width:14,height:14})),this.showMenu&&e("div",{key:"0d288653fbaef390090c540d4c3ac707d30a05c2",class:"cell--menu-container"},e("z-button",{key:"ff413fe7178f5d072fdee95f42ca37f06b6b7a92",variant:r.TERTIARY,icon:"contextual-menu",size:c.X_SMALL,ref:t=>this.menuTrigger=t,onClick:()=>this.popoverEl.open=!this.popoverEl.open}),e("z-popover",{key:"675231832d5e2adf277f470b476ca7e4d5579272",ref:t=>this.popoverEl=t,bindTo:this.menuTrigger,onOpenChange:t=>this.isMenuOpen=t.detail.open,position:this.popoverPosition},e("slot",{key:"6f3dba38c66701f7bf169a35b6793a09388c6bb2",name:"contextual-menu"})))))}get host(){return n(this)}static get watchers(){return{colspan:["updateColspan"]}}};u.style=l;export{u as Z};
2	- //# sourceMappingURL=p-54cd104c.js.map

package/dist/web-components-library/p-54cd104c.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["stylesCss","ZThStyle0","ZTh","PopoverPosition","AUTO","ariaSortDirection","this","sortDirection","SortDirection","ASC","handleSort","sorted","DESC","sort","emit","updateColspan","colspan","host","style","gridColumn","removeProperty","componentWillLoad","render","h","Host","key","role","isMenuOpen","sortable","showSorting","class","type","onClick","bind","name","width","height","showMenu","variant","ButtonVariant","TERTIARY","icon","size","ControlSize","X_SMALL","ref","el","menuTrigger","popoverEl","open","bindTo","onOpenChange","event","detail","position","popoverPosition"],"sources":["src/components/table/cells/z-th/styles.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/index.tsx"],"sourcesContent":["@import \"../z-table-cells.css\";\n\n:host {\n z-index: 1;\n padding: 0;\n background-color: var(--color-background);\n font-weight: var(--font-sb);\n}\n\n.cell--content {\n padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n}\n\n:host([show-sorting]) .cell--content {\n column-gap: var(--space-unit);\n}\n\n.z-th--sort-button {\n position: relative;\n padding: 0;\n border: none;\n background-color: transparent;\n cursor: pointer;\n outline: none;\n}\n\n.z-th--sort-button:focus,\n.z-th--sort-button:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n opacity: 1;\n outline: none;\n pointer-events: all;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n :host([show-sorting=\"hover\"]) .z-th--sort-button {\n opacity: 0;\n pointer-events: none;\n }\n\n :host([show-sorting=\"hover\"]:hover) .z-th--sort-button,\n :host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,\n :host([show-sorting=\"always\"]) .z-th--sort-button,\n :host([sorted]) .z-th--sort-button {\n opacity: 1;\n pointer-events: all;\n }\n}\n\n:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,\n:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,\n:host([show-sorting=\"always\"]) .z-th--sort-button::after,\n:host([sorted]) .z-th--sort-button::after {\n position: absolute;\n top: 6px;\n left: 6px;\n width: calc(100% - 12px);\n height: calc(100% - 10px);\n background-color: transparent;\n content: \"\";\n}\n","import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, SortDirection, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTh component.\n * @slot - ZTh content.\n * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.\n */\n@Component({\n tag: \"z-th\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZTh {\n @Element() host: HTMLZThElement;\n\n /**\n * Number of columns that the cell should span.\n */\n @Prop()\n colspan: number;\n\n /**\n * Enables the contextual menu.\n * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n * Set a nullish value to hide the menu button.\n */\n @Prop({reflect: true})\n showMenu: VisibilityCondition = null;\n\n /**\n * Enables the sorting button.\n * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n * Set a nullish value to hide the sort button.\n */\n @Prop({reflect: true})\n showSorting: VisibilityCondition = null;\n\n /**\n * Whether the cell should stick.\n */\n @Prop({reflect: true})\n sticky = false;\n\n /**\n * Current sorting direction.\n */\n @Prop({mutable: true})\n sortDirection?: SortDirection;\n\n /**\n * Sorted state of the column.\n */\n @Prop({reflect: true, mutable: true})\n sorted: boolean | null = false;\n\n /**\n * Set popover position.\n */\n @Prop()\n popoverPosition = PopoverPosition.AUTO;\n\n /**\n * Store the open state of the menu.\n */\n @State()\n isMenuOpen = false;\n\n /**\n * Sort event fired when the user clicks on the sort button.\n * The sorting logic must be implemented by the app.\n * You can set an `id` on the `z-th` to easly identify the column in the event listener.\n */\n @Event()\n private sort: EventEmitter;\n\n private menuTrigger: HTMLElement;\n\n private popoverEl: HTMLZPopoverElement;\n\n /**\n * Get the value to set to the `aria-sort` attribute based on the current sort direction.\n */\n private get ariaSortDirection(): string {\n if (!this.sortDirection) {\n return null;\n }\n\n return this.sortDirection === SortDirection.ASC ? \"ascending\" : \"descending\";\n }\n\n /**\n * Handle the click on the sort button.\n * @fires sort\n */\n private handleSort(): void {\n if (!this.sortDirection) {\n this.sorted = false;\n\n return;\n }\n\n this.sortDirection = this.sortDirection === SortDirection.ASC ? SortDirection.DESC : SortDirection.ASC;\n this.sorted = true;\n\n this.sort.emit({sortDirection: this.sortDirection});\n }\n\n @Watch(\"colspan\")\n protected updateColspan(): void {\n if (this.colspan) {\n this.host.style.gridColumn = `span ${this.colspan}`;\n } else {\n this.host.style.removeProperty(\"grid-column\");\n }\n }\n\n componentWillLoad(): void {\n this.updateColspan();\n }\n\n render(): HTMLZThElement {\n return (\n <Host\n role=\"columnheader\"\n menu-open={this.isMenuOpen}\n aria-sort={this.ariaSortDirection}\n sortable={this.showSorting}\n >\n <div class=\"cell--content\">\n <slot></slot>\n {this.showSorting && (\n <button\n class=\"z-th--sort-button\"\n type=\"button\"\n onClick={this.handleSort.bind(this)}\n >\n <z-icon\n name={this.sortDirection === SortDirection.DESC ? \"arrow-simple-up\" : \"arrow-simple-down\"}\n width={14}\n height={14}\n />\n </button>\n )}\n {this.showMenu && (\n <div class=\"cell--menu-container\">\n <z-button\n variant={ButtonVariant.TERTIARY}\n icon=\"contextual-menu\"\n size={ControlSize.X_SMALL}\n ref={(el) => (this.menuTrigger = el as HTMLElement)}\n onClick={() => (this.popoverEl.open = !this.popoverEl.open)}\n />\n <z-popover\n ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n bindTo={this.menuTrigger}\n onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n position={this.popoverPosition}\n >\n <slot name=\"contextual-menu\"></slot>\n </z-popover>\n </div>\n )}\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"yHAAA,MAAMA,EAAY,muEAClB,MAAAC,EAAeD,E,MCYFE,EAAG,M,yFAekB,K,iBAQG,K,YAM1B,M,yCAYgB,M,qBAMPC,EAAgBC,K,gBAMrB,K,CAiBb,qBAAYC,GACV,IAAKC,KAAKC,cAAe,CACvB,OAAO,I,CAGT,OAAOD,KAAKC,gBAAkBC,EAAcC,IAAM,YAAc,Y,CAO1D,UAAAC,GACN,IAAKJ,KAAKC,cAAe,CACvBD,KAAKK,OAAS,MAEd,M,CAGFL,KAAKC,cAAgBD,KAAKC,gBAAkBC,EAAcC,IAAMD,EAAcI,KAAOJ,EAAcC,IACnGH,KAAKK,OAAS,KAEdL,KAAKO,KAAKC,KAAK,CAACP,cAAeD,KAAKC,e,CAI5B,aAAAQ,GACR,GAAIT,KAAKU,QAAS,CAChBV,KAAKW,KAAKC,MAAMC,WAAa,QAAQb,KAAKU,S,KACrC,CACLV,KAAKW,KAAKC,MAAME,eAAe,c,EAInC,iBAAAC,GACEf,KAAKS,e,CAGP,MAAAO,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,eAAc,YACRpB,KAAKqB,WAAU,YACfrB,KAAKD,kBAChBuB,SAAUtB,KAAKuB,aAEfN,EAAA,OAAAE,IAAA,2CAAKK,MAAM,iBACTP,EAAA,QAAAE,IAAA,6CACCnB,KAAKuB,aACJN,EAAA,UAAAE,IAAA,2CACEK,MAAM,oBACNC,KAAK,SACLC,QAAS1B,KAAKI,WAAWuB,KAAK3B,OAE9BiB,EAAA,UAAAE,IAAA,2CACES,KAAM5B,KAAKC,gBAAkBC,EAAcI,KAAO,kBAAoB,oBACtEuB,MAAO,GACPC,OAAQ,MAIb9B,KAAK+B,UACJd,EAAA,OAAAE,IAAA,2CAAKK,MAAM,wBACTP,EAAA,YAAAE,IAAA,2CACEa,QAASC,EAAcC,SACvBC,KAAK,kBACLC,KAAMC,EAAYC,QAClBC,IAAMC,GAAQxC,KAAKyC,YAAcD,EACjCd,QAAS,IAAO1B,KAAK0C,UAAUC,MAAQ3C,KAAK0C,UAAUC,OAExD1B,EAAA,aAAAE,IAAA,2CACEoB,IAAMC,GAAQxC,KAAK0C,UAAYF,EAC/BI,OAAQ5C,KAAKyC,YACbI,aAAeC,GAAW9C,KAAKqB,WAAayB,EAAMC,OAAOJ,KACzDK,SAAUhD,KAAKiD,iBAEfhC,EAAA,QAAAE,IAAA,2CAAMS,KAAK,uB","ignoreList":[]}

package/dist/web-components-library/p-57dcff49.entry.js DELETED Viewed

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

package/dist/web-components-library/p-57dcff49.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

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

package/dist/web-components-library/p-5838b77c.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{r as i,c as t,h as e}from"./p-75c4a726.js";import{P as n}from"./p-86618221.js";import{d as s}from"./p-061e28d6.js";import"./p-5145a606.js";const o=':host{width:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{position:relative;display:grid;width:calc(100% + calc(var(--space-unit) * 2));height:402px;box-sizing:border-box;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);border:var(--border-size-small) solid var(--color-primary01);margin-left:calc(-1 * var(--space-unit));background:var(--color-surface01);border-radius:0;box-shadow:0 2px 4px 0 rgb(66 69 72 / 35%)}:host>div>z-icon{position:absolute;top:var(--space-unit);right:var(--space-unit);cursor:pointer;fill:var(--color-primary01)}:host>div>div.cta-wrapper{display:flex;flex-flow:column nowrap;align-self:end;justify-content:space-between}:host>div>div.content-wrapper{position:relative;overflow:hidden;align-self:stretch}:host>div>div.content-wrapper>section{box-sizing:border-box;padding:var(--space-unit) 0;border-bottom:var(--border-size-small) solid var(--color-surface04);color:var(--color-surface05);font-size:14px;line-height:20px}:host>div>div.content-wrapper>section:last-child{border-bottom:none}:host>div>div.content-wrapper>section.info-wrapper{position:relative;overflow:hidden;box-sizing:border-box}:host>div>div.content-wrapper>section.info-wrapper.hidden::after{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);content:"";pointer-events:none}:host>div>div.content-wrapper>section>span.license-heading{display:flex;justify-content:space-between}:host>div>div.content-wrapper>section>span.license-heading>span.expired{color:var(--color-primary01);font-size:12px;font-weight:600}:host>div>div.content-wrapper>section>span.license-heading>span.expiring{color:var(--color-hover-warning);font-size:12px;font-weight:600}:host>div>div.content-wrapper>z-popover{position:absolute;top:0;left:calc(var(--space-unit) * 4)}';const r=o;const a=class{emitFlipCard(i=false){this.flipCard.emit(i)}constructor(e){i(this,e);this.flipCard=t(this,"flipCard",7);this.data=undefined;this.htmltabindex=0;this.hiddenContent=false;this.tooltip=false;this.emitFlipCard=this.emitFlipCard.bind(this)}componentWillLoad(){this.setStringOrArray()}componentWillUpdate(){this.setStringOrArray()}componentDidRender(){this.handleContentHeight()}handleContentHeight(){if(!this.contentWrapper&&!this.infoWrapper){this.hiddenContent=false;return}if(this.contentWrapper.scrollHeight>this.contentWrapper.offsetHeight\|\|this.infoWrapper.scrollHeight>this.infoWrapper.offsetHeight){const i=this.contentWrapper.offsetHeight-this.onlineLicenseWrapper.offsetHeight-this.offlineLicenseWrapper.offsetHeight;this.infoWrapper.style.height=`${i}px`;this.hiddenContent=true;return}this.hiddenContent=false}setStringOrArray(){if(typeof this.data==="string"){this.cardData=JSON.parse(this.data)}else{this.cardData=this.data}}renderCloseIcon(){return e("z-icon",{name:"multiply-circled-filled",height:18,width:18,onClick:()=>this.emitFlipCard(false),tabindex:this.htmltabindex,onKeyUp:i=>{s(i,this.emitFlipCard,false)}})}renderGeneralSection(){var i,t;const n=(i=this===null\|\|this===void 0?void 0:this.cardData)===null\|\|i===void 0?void 0:i.title;const s=(t=this===null\|\|this===void 0?void 0:this.cardData)===null\|\|t===void 0?void 0:t.description;return e("section",{class:`info-wrapper ${this.hiddenContent?"hidden":""}`,onClick:()=>{if(this.hiddenContent){this.tooltip=!this.tooltip}},ref:i=>this.infoWrapper=i},this.renderAuthor(),this.renderYear(),n,e("br",null),s)}renderAuthor(){var i;const t=(i=this===null\|\|this===void 0?void 0:this.cardData)===null\|\|i===void 0?void 0:i.author;if(!t){return null}return e("span",null,"Autore: ",e("b",null,t),e("br",null))}renderYear(){var i;const t=(i=this===null\|\|this===void 0?void 0:this.cardData)===null\|\|i===void 0?void 0:i.year;if(!t){return null}return e("span",null,"Anno: ",e("b",null,t),e("br",null))}renderTooltip(){if(!this.tooltip){return}if(!this.cardData){return}const{title:i,year:t,author:s,description:o}=this.cardData;return e("z-popover",{position:n.RIGHT,onClick:()=>this.tooltip=false},`${i} ${t} ${s} ${o}`)}setExpirationLicenseMessage(i){if(i==="online"&&this.cardData.onlineLicense.expired\|\|i==="offline"&&this.cardData.offlineLicense.expired){return e("span",{class:"expired"},"SCADUTA")}if(i==="online"&&this.cardData.onlineLicense.expiring\|\|i==="offline"&&this.cardData.offlineLicense.expiring){return e("span",{class:"expiring"},"IN SCADENZA")}}renderOnlineLicenseSection(){var i;if(!((i=this===null\|\|this===void 0?void 0:this.cardData)===null\|\|i===void 0?void 0:i.onlineLicense)){return}return e("section",{ref:i=>this.onlineLicenseWrapper=i},e("span",{class:"license-heading"},e("span",null,"Licenza online"),this.setExpirationLicenseMessage("online")),"Scadenza il ",e("b",null,this.cardData.onlineLicense.expiration),e("br",null))}renderOfflineLicenseSection(){var i;if(!((i=this===null\|\|this===void 0?void 0:this.cardData)===null\|\|i===void 0?void 0:i.offlineLicense)){return}return e("section",{ref:i=>this.offlineLicenseWrapper=i},e("span",{class:"license-heading"},e("span",null,"Licenza offline"),this.setExpirationLicenseMessage("offline")),"Scadenza il ",e("b",null,this.cardData.offlineLicense.expiration),e("br",null),"Installazioni disponibili: ",e("b",null,this.cardData.offlineLicense.installations))}render(){return e("div",{key:"33d2316b245cb7639f3ffaddd9e3af836a893b43"},this.renderCloseIcon(),e("div",{key:"b9b5af413eabc3c3cfbc2c301764e17211d3be64",class:"content-wrapper",ref:i=>this.contentWrapper=i},this.renderGeneralSection(),this.renderTooltip(),this.renderOnlineLicenseSection(),this.renderOfflineLicenseSection()),e("div",{key:"7e0bc24301074fdc5541421fcb9ba0a58f65b306",class:"cta-wrapper"},e("slot",{key:"4e573ed4019c8f24f92ca27d54b67ca4a80d766b"})))}};a.style=r;export{a as z_myz_card_info};
2	- //# sourceMappingURL=p-5838b77c.entry.js.map

package/dist/web-components-library/p-5838b77c.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["stylesCss","ZMyzCardInfoStyle0","ZMyzCardInfo","emitFlipCard","showBack","this","flipCard","emit","constructor","hostRef","bind","componentWillLoad","setStringOrArray","componentWillUpdate","componentDidRender","handleContentHeight","contentWrapper","infoWrapper","hiddenContent","scrollHeight","offsetHeight","height","onlineLicenseWrapper","offlineLicenseWrapper","style","data","cardData","JSON","parse","renderCloseIcon","h","name","width","onClick","tabindex","htmltabindex","onKeyUp","e","handleKeyboardSubmit","renderGeneralSection","title","_a","description","_b","class","tooltip","ref","el","renderAuthor","renderYear","author","year","renderTooltip","position","PopoverPosition","RIGHT","setExpirationLicenseMessage","type","onlineLicense","expired","offlineLicense","expiring","renderOnlineLicenseSection","expiration","renderOfflineLicenseSection","installations","render","key"],"sources":["src/snowflakes/myz/card/z-myz-card-info/styles.css?tag=z-myz-card-info&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-info/index.tsx"],"sourcesContent":[":host {\n width: 100%;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > div {\n position: relative;\n display: grid;\n width: calc(100% + calc(var(--space-unit) * 2));\n height: 402px;\n box-sizing: border-box;\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);\n border: var(--border-size-small) solid var(--color-primary01);\n margin-left: calc(-1 * var(--space-unit));\n background: var(--color-surface01);\n border-radius: 0;\n box-shadow: 0 2px 4px 0 rgb(66 69 72 / 35%);\n}\n\n:host > div > z-icon {\n position: absolute;\n top: var(--space-unit);\n right: var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01);\n}\n\n:host > div > div.cta-wrapper {\n display: flex;\n flex-flow: column nowrap;\n align-self: end;\n justify-content: space-between;\n}\n\n:host > div > div.content-wrapper {\n position: relative;\n overflow: hidden;\n align-self: stretch;\n}\n\n:host > div > div.content-wrapper > section {\n box-sizing: border-box;\n padding: var(--space-unit) 0;\n border-bottom: var(--border-size-small) solid var(--color-surface04);\n color: var(--color-surface05);\n font-size: 14px;\n line-height: 20px;\n}\n\n:host > div > div.content-wrapper > section:last-child {\n border-bottom: none;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper {\n position: relative;\n overflow: hidden;\n box-sizing: border-box;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper.hidden::after {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background: linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);\n content: \"\";\n pointer-events: none;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading {\n display: flex;\n justify-content: space-between;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expired {\n color: var(--color-primary01);\n font-size: 12px;\n font-weight: 600;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expiring {\n color: var(--color-hover-warning);\n font-size: 12px;\n font-weight: 600;\n}\n\n:host > div > div.content-wrapper > z-popover {\n position: absolute;\n top: 0;\n left: calc(var(--space-unit) * 4);\n}\n","import {Component, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {DictionaryData, PopoverPosition} from \"../../../../beans\";\nimport {handleKeyboardSubmit} from \"../../../../utils/utils\";\n\n/**\n * @slot - content\n */\n@Component({\n tag: \"z-myz-card-info\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardInfo {\n /** dictionary info */\n @Prop()\n data: string | DictionaryData;\n\n /** tabindex link attribute (optional) */\n @Prop()\n htmltabindex?: number = 0;\n\n @State()\n hiddenContent = false;\n\n @State()\n tooltip = false;\n\n private cardData: DictionaryData;\n\n private contentWrapper: HTMLElement;\n\n private infoWrapper: HTMLElement;\n\n private onlineLicenseWrapper: HTMLElement;\n\n private offlineLicenseWrapper: HTMLElement;\n\n /** flip card to front */\n @Event()\n flipCard: EventEmitter;\n\n private emitFlipCard(showBack = false): void {\n this.flipCard.emit(showBack);\n }\n\n constructor() {\n this.emitFlipCard = this.emitFlipCard.bind(this);\n }\n\n componentWillLoad(): void {\n this.setStringOrArray();\n }\n\n componentWillUpdate(): void {\n this.setStringOrArray();\n }\n\n componentDidRender(): void {\n this.handleContentHeight();\n }\n\n private handleContentHeight(): void {\n if (!this.contentWrapper && !this.infoWrapper) {\n this.hiddenContent = false;\n\n return;\n }\n\n if (\n this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight ||\n this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight\n ) {\n const height =\n this.contentWrapper.offsetHeight -\n this.onlineLicenseWrapper.offsetHeight -\n this.offlineLicenseWrapper.offsetHeight;\n this.infoWrapper.style.height = `${height}px`;\n this.hiddenContent = true;\n\n return;\n }\n\n this.hiddenContent = false;\n }\n\n private setStringOrArray(): void {\n if (typeof this.data === \"string\") {\n this.cardData = JSON.parse(this.data);\n } else {\n this.cardData = this.data;\n }\n }\n\n private renderCloseIcon(): HTMLZIconElement {\n return (\n <z-icon\n name=\"multiply-circled-filled\"\n height={18}\n width={18}\n onClick={() => this.emitFlipCard(false)}\n tabindex={this.htmltabindex}\n onKeyUp={(e: KeyboardEvent) => {\n handleKeyboardSubmit(e, this.emitFlipCard, false);\n }}\n />\n );\n }\n\n private renderGeneralSection(): HTMLElement {\n const title = this?.cardData?.title;\n const description = this?.cardData?.description;\n\n return (\n <section\n class={`info-wrapper ${this.hiddenContent ? \"hidden\" : \"\"}`}\n onClick={() => {\n if (this.hiddenContent) {\n this.tooltip = !this.tooltip;\n }\n }}\n ref={(el) => (this.infoWrapper = el)}\n >\n {this.renderAuthor()}\n {this.renderYear()}\n {title}\n <br />\n {description}\n </section>\n );\n }\n\n private renderAuthor(): HTMLSpanElement {\n const author = this?.cardData?.author;\n if (!author) {\n return null;\n }\n\n return (\n <span>\n Autore: <b>{author}</b>\n <br />\n </span>\n );\n }\n\n private renderYear(): HTMLSpanElement {\n const year = this?.cardData?.year;\n if (!year) {\n return null;\n }\n\n return (\n <span>\n Anno: <b>{year}</b>\n <br />\n </span>\n );\n }\n\n private renderTooltip(): HTMLZPopoverElement {\n if (!this.tooltip) {\n return;\n }\n\n if (!this.cardData) {\n return;\n }\n const {title, year, author, description} = this.cardData;\n\n return (\n <z-popover\n position={PopoverPosition.RIGHT}\n onClick={() => (this.tooltip = false)}\n >\n {`${title} ${year} ${author} ${description}`}\n </z-popover>\n );\n }\n\n private setExpirationLicenseMessage(type: string): HTMLSpanElement {\n if (\n (type === \"online\" && this.cardData.onlineLicense.expired) ||\n (type === \"offline\" && this.cardData.offlineLicense.expired)\n ) {\n return <span class=\"expired\">SCADUTA</span>;\n }\n\n if (\n (type === \"online\" && this.cardData.onlineLicense.expiring) ||\n (type === \"offline\" && this.cardData.offlineLicense.expiring)\n ) {\n return <span class=\"expiring\">IN SCADENZA</span>;\n }\n }\n\n private renderOnlineLicenseSection(): HTMLElement {\n if (!this?.cardData?.onlineLicense) {\n return;\n }\n\n return (\n <section ref={(el) => (this.onlineLicenseWrapper = el)}>\n <span class=\"license-heading\">\n <span>Licenza online</span>\n {this.setExpirationLicenseMessage(\"online\")}\n </span>\n Scadenza il <b>{this.cardData.onlineLicense.expiration}</b>\n <br />\n </section>\n );\n }\n\n private renderOfflineLicenseSection(): HTMLElement {\n if (!this?.cardData?.offlineLicense) {\n return;\n }\n\n return (\n <section ref={(el) => (this.offlineLicenseWrapper = el)}>\n <span class=\"license-heading\">\n <span>Licenza offline</span>\n {this.setExpirationLicenseMessage(\"offline\")}\n </span>\n Scadenza il <b>{this.cardData.offlineLicense.expiration}</b>\n <br />\n Installazioni disponibili: <b>{this.cardData.offlineLicense.installations}</b>\n </section>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div>\n {this.renderCloseIcon()}\n <div\n class=\"content-wrapper\"\n ref={(el) => (this.contentWrapper = el)}\n >\n {this.renderGeneralSection()}\n {this.renderTooltip()}\n {this.renderOnlineLicenseSection()}\n {this.renderOfflineLicenseSection()}\n </div>\n <div class=\"cta-wrapper\">\n <slot />\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/web-components-library/p-59fac888.entry.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- import{h as t,F as i,r as e,c as s,a as n,g as a}from"./p-75c4a726.js";import{g as r,O as o,u as c,B as l,e as h,c as d,$ as u,D as p,h as f,k as v,I as b,i as z,m,j as g,l as x,E as w,p as y}from"./p-86618221.js";import{B as k}from"./p-5145a606.js";import{a as C,r as O,b as j,g as S,h as I}from"./p-061e28d6.js";import{I as $,C as M}from"./p-eb15536d.js";const L=':host{position:relative;display:block;box-shadow:var(--shadow-2)}:host,{box-sizing:border-box}.heading-panel{--title-line-height:1.333;--title-font-size:var(--font-size-6);position:relative;display:flex;width:100%;max-width:var(--app-header-content-max-width, 100%);flex-direction:column;flex-grow:0;flex-shrink:0;align-items:baseline;padding:calc(var(--space-unit) 2);margin:0 auto;background:var(--app-header-bg, var(--color-surface01))}:host(:empty) .heading-panel{padding:0}.heading-container{position:relative;z-index:1;display:flex;width:100%;max-width:100%;flex:1 auto;flex-direction:column;justify-content:flex-start}.heading-panel.has-menubar{padding-bottom:0}.heading-panel .heading-container{flex-direction:column-reverse}:host([enable-search]) .heading-panel .heading-container{flex-direction:column}:host([enable-search][search-page-url]) .heading-panel .heading-container{flex-direction:row}.heading-title{display:flex;width:100%;flex-direction:row;align-items:flex-start}.heading-title:not(:last-child){margin-right:var(--space-unit)}.z-logo,.search-page-button{display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center}.z-logo img{height:24px;margin:0 var(--space-unit) 0 0;content:url(\'data:image/svg+xml,<svg width="61" height="32" viewBox="0 0 61 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.9874 32C7.1595 32 0 24.8349 0 16C0 7.16513 7.1595 0 15.9874 0H45.0126C53.8405 0 61 7.16513 61 16C61 24.8349 53.8405 32 45.0126 32H15.9874Z" fill="%23E2011A"/><path d="M58.5435 15.9992C58.5435 23.4743 52.4892 29.5403 45.0129 29.5403C37.5367 29.5403 31.4824 23.4813 31.4824 15.9992C31.4824 8.51701 37.5367 2.45801 45.0129 2.45801C52.4892 2.45801 58.5435 8.51701 58.5435 15.9992Z" fill="white"/><path d="M40.7107 8.01862H49.8976V11.3158L44.139 21.7077H50.0384V24.6457H39.9785V21.4048L45.7371 10.9636H40.7107V8.01862Z" fill="%23E2011A"/><path d="M12.2914 24.6449C10.982 24.6449 10.271 23.8136 10.271 22.6722V7.04565H12.1718V22.9822H13.981V24.6449H12.2914Z" fill="white"/><path d="M25.6461 24.6448C24.2452 24.6448 23.675 23.7853 23.5342 22.6439H23.4145C22.8935 24.1446 21.5841 24.9266 19.8735 24.9266C17.2828 24.9266 15.7622 23.4964 15.7622 21.2137C15.7622 18.931 17.4236 17.6206 20.9928 17.6206H23.4145V16.4088C23.4145 14.6756 22.4641 13.7245 20.5141 13.7245C19.0428 13.7245 18.0642 14.4361 17.4025 15.5563L16.262 14.4854C16.9308 13.175 18.4021 12.0829 20.6126 12.0829C23.5623 12.0829 25.3152 13.6259 25.3152 16.2186V22.9751H26.7162V24.6378H25.6461V24.6448ZM23.4145 21.0799V19.0578H20.8942C18.733 19.0578 17.7545 19.7272 17.7545 20.9108V21.411C17.7545 22.6228 18.7049 23.3132 20.1762 23.3132C22.0558 23.3132 23.4074 22.341 23.4074 21.0799H23.4145Z" fill="white"/></svg>\')}.product-logo{display:none}.product-logo ::slotted([slot="product-logo"]){width:32px;height:32px;margin-right:var(--space-unit)}.product-logo ::slotted([slot="product-logo"]) img{width:100%;height:100%;object-fit:cover}::slotted([slot="title"]),::slotted([slot="stucked-title"]),.stucked-title{margin:0;color:var(--app-header-text-color, var(--color-default-text));font-family:var(--font-family-serif);font-weight:var(--font-sb)}::slotted([slot="title"]){display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;font-size:var(--title-font-size);-webkit-line-clamp:2;line-clamp:2;line-height:var(--title-line-height);text-overflow:ellipsis}::slotted(a:is([slot="title"],[slot="stucked-title"])){text-decoration:none}:host([enable-search]) ::slotted([slot="title"])+{margin-left:calc(var(--space-unit) 2)}:host([enable-offcanvas]:not([menu-length="0"])) .top-subtitle{padding-left:calc(var(--space-unit) * 4 + var(--space-unit))}::slotted([slot="top-subtitle"]){display:-webkit-box;overflow:hidden;max-width:80%;margin:0;-webkit-box-orient:vertical;color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-2);font-style:italic;font-weight:var(--font-rg);-webkit-line-clamp:2;line-clamp:2}.search-page-button{margin-left:auto}.menu-container{display:flex;flex:1 auto;column-gap:calc(var(--space-unit) * 4)}.menu-container:focus:focus-visible{outline:none}:host([menu-length="0"]) .menu-container,.menu-container:empty{display:none}.menu-container ::slotted([open]){position:relative;z-index:3}.menu-container ::slotted([slot="menu"]:not(:last-child))::after{position:absolute;top:calc(1.5em / 2);right:calc(var(--space-unit) * -2);width:var(--border-size-small);height:1em;background-color:var(--color-default-icon);content:"";font-size:var(--font-size-3);transform:translateY(-50%)}z-searchbar{z-index:0;display:flex;width:100%;align-items:center}.heading-stuck{position:fixed;z-index:20;top:var(--app-header-top-offset, 48px);left:0;width:100%;max-width:100%;animation:slide-stuck-heading-in 250ms ease-out;background:var(--app-header-stucked-bg, var(--color-surface01));box-shadow:var(--shadow-2);color:var(--app-header-stucked-text-color, var(--color-default-text))}.heading-stuck-content{display:flex;max-width:var(--app-header-content-max-width, 100%);align-items:center;padding:var(--space-unit) var(--grid-margin);margin:0 auto}.heading-stuck .heading-title{--title-font-size:var(--font-size-5);--title-line-height:1.4;overflow:hidden;align-items:center}.heading-stuck .stucked-title{overflow:hidden;font-size:var(--title-font-size);line-height:var(--title-line-height);text-overflow:ellipsis;white-space:nowrap}.drawer-trigger,::slotted([slot="menu-button"]){display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center;padding:0;border:0;margin-right:var(--space-unit);appearance:none;background:none;border-radius:0;color:inherit;cursor:pointer;outline:none}.drawer-trigger:focus:focus-visible z-icon{box-shadow:var(--shadow-focus-primary)}.drawer-trigger z-icon{--z-icon-width:calc(var(--space-unit) * 4);--z-icon-height:calc(var(--space-unit) * 4);fill:var(--color-default-icon)}.drawer-content{display:none}z-offcanvas{--z-offcanvas--top-space:var(--app-header-top-offset)}z-offcanvas[open] .drawer-content{display:flex;width:100%;flex:1 auto;flex-direction:column}z-offcanvas[open] .drawer-content ::slotted(z-menu){width:100%}.drawer-close{--z-icon-width:calc(var(--space-unit) * 4);--z-icon-height:calc(var(--space-unit) * 4);padding:0;border:0;margin:var(--space-unit) 0 calc(var(--space-unit) * 2.5);appearance:none;background:transparent;border-radius:0;cursor:pointer;outline:none}.drawer-close z-icon{fill:var(--color-default-icon)}.drawer-close:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}@media (max-width: 767px){:host([enable-search]) .heading-panel .heading-container{row-gap:calc(var(--space-unit) * 1.5)}}@media (min-width: 768px){.heading-panel{--title-font-size:var(--font-size-9);padding:calc(var(--space-unit) * 1.5) var(--grid-margin) calc(var(--space-unit) * 1.25)}:host([enable-search][search-page-url]) .heading-panel .heading-container{flex-direction:column}.heading-panel .heading-container{flex-direction:column;margin-right:auto}.z-logo img{height:32px}.product-logo{display:flex;height:calc(var(--title-font-size) * var(--title-line-height));align-items:center}.has-top-subtitle .z-logo{display:none}.top-subtitle.has-product-logo{padding-left:calc(32px + var(--space-unit))}z-searchbar{width:30%;height:calc(var(--title-font-size) * var(--title-line-height));margin-left:auto}.menu-container{flex:initial}.menu-container>[role="menubar"]{display:contents}:host(:not([enable-offcanvas])) .menu-container{margin-top:calc((var(--space-unit) * 1.75))}:host(:not([enable-offcanvas])) .heading-container .drawer-trigger{display:none}.heading-stuck .heading-title{--title-font-size:var(--font-size-8);--title-line-height:1.5}.heading-stuck-content{padding:6px var(--grid-margin)}:host(:not([enable-offcanvas],[menu-length="0"])){padding-left:0}}@media (min-width: 1152px){z-searchbar{min-width:calc(var(--space-unit) * 45)}}@keyframes slide-stuck-heading-in{0%{transform:translate3d(0, -100%, 0)}100%{transform:none}}';const T=L;const F=typeof IntersectionObserver!=="undefined";const H=class{onStuck(){const t=this.scrollParent;if(!t){return}this.sticking.emit(this._stuck)}setMenuFloatingMode(){if(this.menuElements.length===0){return}this.menuElements.forEach((t=>{t.open=false;t.verticalContext=this.drawerOpen}))}onStuckChange(){var t,i;if(!this.container){return}if(this.stuck){(t=this.stuckIntersecObserver)===null\|\|t===void 0?void 0:t.observe(this.container)}else{this._stuck=false;(i=this.stuckIntersecObserver)===null\|\|i===void 0?void 0:i.unobserve(this.container)}}get title(){var t;return(t=this.hostElement.querySelector('[slot="title"]'))===null\|\|t===void 0?void 0:t.textContent.trim()}get scrollParent(){const t=this.hostElement.offsetParent;if(t===document.body\|\|t===document.documentElement){return window}return t}get canShowMenu(){return!this.enableOffcanvas&&this.menuElements.length>0&&!this.isMobile&&!this.drawerOpen}get focusableMenu(){return this.menuElements.find((t=>t.htmlTabindex===0))}openDrawer(){this.drawerOpen=true;this.menuElements.forEach(((t,i)=>t.htmlTabindex=i===0?0:-1));setTimeout((()=>this.menuElements[0].setFocus()),400)}closeDrawer(){this.drawerOpen=false;setTimeout((()=>this.burgerButton.focus()),100)}collectMenuElements(){this.menuElements=Array.from(this.hostElement.querySelectorAll('[slot="menu"]'));this.menuElements.forEach(((t,i)=>t.htmlTabindex=i===0?0:-1));this.menuLength=this.menuElements.length;if(!this.enableOffcanvas){this.menuWidth=this.menuElements.reduce(((t,i)=>t+i.getBoundingClientRect().width),0)+(this.menuLength-1)32}this.setMenuFloatingMode()}setupMenuResizeObserver(){if(this.enableOffcanvas){return}this.menuResizeObserver=new ResizeObserver((t=>{if(this.isMobile){this.enableOffcanvas=true;return}const i=t[0].contentBoxSize[0].inlineSize;if(this.menuWidth===0){return}if(this.menuWidth>i&&!this.enableOffcanvas){this.enableOffcanvas=true}else if(this.menuWidth<=i&&this.enableOffcanvas){this.enableOffcanvas=false}}));this.menuResizeObserver.observe(this.container)}hasSlot(t){return this.hostElement.querySelector(`[slot="${t}"]`)!==null}moveFocus(t,i){t.htmlTabindex=-1;i.setFocus()}onOffcanvasKeydown(t){var i,e;if(t.key!==r.TAB\|\|!this.drawerOpen){return}const s=t.target.closest("z-menu");if(s){t.preventDefault();t.stopPropagation();s.htmlTabindex=0;this.closeDrawerButton.focus()}else if(t.target===this.closeDrawerButton){t.preventDefault();t.stopPropagation();if(t.shiftKey){((i=this.menuElements.filter((t=>t.open)).pop())!==null&&i!==void 0?i:this.menuElements[this.menuLength-1]).setFocus()}else{((e=this.menuElements.find((t=>t.open)))!==null&&e!==void 0?e:this.menuElements[0]).setFocus()}}}manageMenus(t){const i=this.menuElements.find((i=>C(i,t.target)));if(i){this.menuElements.forEach((t=>{if(t===i){return}t.htmlTabindex=-1;if(!this.drawerOpen){t.open=false}}))}else if(!this.drawerOpen){this.menuElements.forEach((t=>{t.open=false}))}}handleKeydown(t){var i,e;if(t.key===r.ESC&&this.drawerOpen){this.closeDrawer();return}if(!this.menuElements.some((i=>i.contains(t.target)))){return}const s=this.focusableMenu;const n=this.menuElements.indexOf(s);let a;if(t.key===r.ARROW_RIGHT&&!s.verticalContext\|\|t.key===r.ARROW_DOWN&&s.verticalContext){a=(i=this.menuElements[n+1])!==null&&i!==void 0?i:this.menuElements[0]}else if(t.key===r.ARROW_LEFT&&!s.verticalContext\|\|t.key===r.ARROW_UP&&s.verticalContext){a=(e=this.menuElements[n-1])!==null&&e!==void 0?e:this.menuElements[this.menuLength-1]}if(!a){return}if(t.key===r.ARROW_UP&&s.verticalContext){if(a.open){s.htmlTabindex=-1;a.focusLastItem();return}}this.moveFocus(s,a)}renderSeachbar(){if(this.isMobile&&!this.searchPageUrl&&this._stuck){return}if(this.searchPageUrl&&(this.isMobile\|\|this.isTablet)){return t("z-button",{class:"search-page-button",variant:l.SECONDARY,href:this.searchPageUrl,icon:"search",size:h.X_SMALL})}return t("z-searchbar",{value:this.searchString,placeholder:this.searchPlaceholder,showSearchButton:true,searchButtonIconOnly:this.isMobile\|\|this.isTablet,size:h.X_SMALL,variant:l.SECONDARY,preventSubmit:this.searchString.length<3,onSearchTyping:t=>this.searchString=t.detail})}renderProductLogos(){return t(i,null,this.enableZLogo&&t("span",{class:"z-logo"},t("img",{alt:"Logo Zanichelli"})),this.hostElement.querySelector("[slot='product-logo']")&&t("span",{class:"product-logo"},t("slot",{name:"product-logo"})))}renderMenuButton(){return this.menuLength>0&&(this.enableOffcanvas\|\|this._stuck\|\|this.isMobile)&&t("button",{ref:t=>this.burgerButton=t,class:"drawer-trigger","aria-label":"Apri menu","aria-haspopup":"menu","aria-expanded":`${this.drawerOpen}`,"aria-controls":"offcanvas-menu",onClick:this.openDrawer},t("z-icon",{name:"burger-menu"}))}renderOffcanvas(){return t("z-offcanvas",{id:"offcanvas-menu",variant:o.OVERLAY,transitiondirection:c.RIGHT,open:this.drawerOpen,onCanvasOpenStatusChanged:t=>this.drawerOpen=t.detail,onKeyDown:this.onOffcanvasKeydown},t("div",{slot:"canvasContent"},t("button",{ref:t=>this.closeDrawerButton=t,class:"drawer-close","aria-label":"Chiudi menu",onClick:this.closeDrawer,"aria-hidden":`${!this.drawerOpen}`,disabled:!this.drawerOpen},t("z-icon",{name:"close"})),t("div",{class:"drawer-content","aria-hidden":`${!this.drawerOpen}`},t("slot",{name:"menu",onSlotchange:this.collectMenuElements}))))}renderStuck(){return t("div",{class:"heading-stuck"},t("div",{class:"heading-stuck-content"},this.renderMenuButton(),t("div",{class:"heading-title"},this.renderProductLogos(),t("div",{class:"stucked-title"},t("slot",{name:"stucked-title"},this.title))),this.enableSearch&&this.renderSeachbar()))}constructor(t){e(this,t);this.sticking=s(this,"sticking",7);this.menuElements=[];this.stuckIntersecObserver=F?new IntersectionObserver((([t])=>{this._stuck=!t.isIntersecting}),{threshold:.5}):undefined;this.stuck=false;this.enableOffcanvas=false;this.enableSearch=false;this.searchPlaceholder="Cerca";this.searchString="";this.searchPageUrl=undefined;this.enableZLogo=true;this.drawerOpen=false;this._stuck=false;this.menuLength=undefined;this.isMobile=true;this.isTablet=false;this.openDrawer=this.openDrawer.bind(this);this.closeDrawer=this.closeDrawer.bind(this);this.collectMenuElements=this.collectMenuElements.bind(this);this.onOffcanvasKeydown=this.onOffcanvasKeydown.bind(this)}componentWillLoad(){this.collectMenuElements();const t=window.matchMedia(`(max-width: ${k.MOBILE}px)`);this.isMobile=t.matches;t.addEventListener("change",(t=>this.isMobile=t.matches));const i=window.matchMedia(`(min-width: ${k.MOBILE+1}px) and (max-width: ${k.TABLET}px)`);this.isTablet=i.matches;i.addEventListener("change",(t=>this.isTablet=t.matches))}componentDidLoad(){this.onStuckChange();this.setupMenuResizeObserver()}disconnectedCallback(){var t;(t=this.menuResizeObserver)===null\|\|t===void 0?void 0:t.disconnect()}render(){const i=this.hasSlot("top-subtitle");return t(n,{key:"cabccb026186feb602cd31cc410ac12bb374326d","menu-length":this.menuLength},t("div",{key:"c684735c076498f245c528f48cf306bf21cbb8ba",class:{"heading-panel":true,"has-menubar":this.menuLength>0&&!this.enableOffcanvas},ref:t=>this.container=t},t("div",{key:"30beac4e17122b912943f83cd9f57498200cc5d5",class:{"heading-container":true,"has-top-subtitle":i}},(!this.enableSearch&&this.isMobile\|\|!this.isMobile)&&t("div",{key:"cd5ceee248c0ef5283df7d846be121256933e75e",class:{"top-subtitle":true,"has-product-logo":i&&this.hasSlot("product-logo")}},t("slot",{key:"96d7891d2fef52dd8b601d31a4a36e3635428775",name:"top-subtitle"})),t("div",{key:"552c146d1edc5ecad7ed354859787c9ae811bbe1",class:"heading-title"},t("slot",{key:"a03a2cb293b596de013ccf6279a75d11b719f054",name:"menu-button"},this.renderMenuButton()),!this._stuck&&this.renderProductLogos(),t("slot",{key:"47899e75dea4f44b50ef4f981037e7a8d7652403",name:"title"}),this.enableSearch&&!this.isMobile&&this.renderSeachbar()),this.enableSearch&&this.isMobile&&this.renderSeachbar()),t("nav",{key:"46d0be7f5ac779ed93ff061332dbf8289d041b6d",class:"menu-container","aria-label":this.title\|\|undefined},this.canShowMenu&&t("div",{key:"a552a43cbf8b3bab46285bc2b5846c4925341eaa",role:"menubar","aria-label":this.title\|\|undefined},t("slot",{key:"7f93c00e6183af3a08b87513f2a41a0ec16c0b1d",name:"menu",onSlotchange:this.collectMenuElements})))),this.renderOffcanvas(),this._stuck&&this.renderStuck())}get hostElement(){return a(this)}static get watchers(){return{_stuck:["onStuck"],drawerOpen:["setMenuFloatingMode"],stuck:["onStuckChange"]}}};H.style=T;const R='.sc-z-button-h{display:inline-block;--z-icon-width:16px;--z-icon-height:16px;--z-icon-right-margin:0;--z-icon-left-margin:0}[disabled].sc-z-button-h:not([disabled="false"]){pointer-events:none}.sc-z-button-h .z-button--container.sc-z-button{display:inline-flex;width:100%;box-sizing:border-box;align-items:center;justify-content:center;padding:0;border-width:var(--border-size-medium);border-style:solid;border-radius:var(--border-radius);column-gap:var(--space-unit);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.3px;line-height:1;outline:none;text-decoration:none;text-transform:uppercase;white-space:nowrap}.sc-z-button-h .z-button--container.sc-z-button:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}.sc-z-button-h .z-button--container.z-button--has-text.sc-z-button{min-width:calc(var(--space-unit) 8);padding:0 calc(var(--space-unit) * 2)}[icon-position="right"].sc-z-button-h .z-button--container.z-button--has-text.sc-z-button{flex-direction:row-reverse}[size="big"].sc-z-button-h .z-button--container.sc-z-button{min-width:44px;height:44px}[size="small"].sc-z-button-h .z-button--container.sc-z-button{min-width:36px;height:36px}[size="x-small"].sc-z-button-h .z-button--container.sc-z-button{min-width:32px;height:32px}[variant="primary"].sc-z-button-h .z-button--container.sc-z-button{border-color:var(--color-primary01);background-color:var(--color-primary01);color:var(--color-text-inverse)}@media (hover: hover){[variant="primary"].sc-z-button-h .z-button--container.sc-z-button:hover{border-color:var(--color-hover-primary);background-color:var(--color-hover-primary);color:var(--color-text-inverse)}}[variant="primary"].sc-z-button-h .z-button--container.sc-z-button:active{border-color:var(--color-pressed-primary);background-color:var(--color-pressed-primary);box-shadow:var(--shadow-2);color:var(--color-text-inverse)}[variant="primary"][disabled].sc-z-button-h:not([disabled="false"]) .z-button--container.sc-z-button{border-color:var(--color-disabled01);background-color:var(--color-disabled01);color:var(--color-disabled03)}[variant="secondary"].sc-z-button-h .z-button--container.sc-z-button{border-color:var(--color-primary01);background-color:var(--color-button-secondary);color:var(--color-primary01)}@media (hover: hover){[variant="secondary"].sc-z-button-h .z-button--container.sc-z-button:hover{border-color:var(--color-hover-primary);background-color:var(--color-button-secondary);color:var(--color-hover-primary)}}[variant="secondary"].sc-z-button-h .z-button--container.sc-z-button:active{border-color:var(--color-pressed-primary);background-color:var(--color-button-secondary);box-shadow:var(--shadow-2);color:var(--color-pressed-primary)}[variant="secondary"][disabled].sc-z-button-h:not([disabled="false"]) .z-button--container.sc-z-button{border-color:var(--color-disabled01);background-color:var(--color-button-secondary);color:var(--color-disabled03)}[variant="tertiary"].sc-z-button-h .z-button--container.sc-z-button{border-color:var(--color-primary02);background-color:var(--color-primary02);color:var(--color-primary01)}@media (hover: hover){[variant="tertiary"].sc-z-button-h .z-button--container.sc-z-button:hover{border-color:var(--color-primary03);background-color:var(--color-primary03);color:var(--color-hover-primary)}}[variant="tertiary"].sc-z-button-h .z-button--container.sc-z-button:focus:focus-visible{border-color:var(--color-primary02);background-color:var(--color-primary02);color:var(--color-primary01)}[variant="tertiary"].sc-z-button-h .z-button--container.sc-z-button:active{border-color:var(--color-primary02);background-color:var(--color-primary02);box-shadow:var(--shadow-2);color:var(--color-primary01)}[variant="tertiary"][disabled].sc-z-button-h:not([disabled="false"]) .z-button--container.sc-z-button{border-color:var(--color-disabled01);background-color:var(--color-disabled01);color:var(--color-disabled03)}';const A=R;const D=class{constructor(t){e(this,t);this.ariaLabel=undefined;this.role="";this.htmlrole=undefined;this.href=undefined;this.target=undefined;this.htmlid=undefined;this.name=undefined;this.disabled=false;this.type=d.BUTTON;this.variant=l.PRIMARY;this.icon=undefined;this.iconPosition=u.LEFT;this.size=h.BIG}getAttributes(){return{id:this.htmlid,class:{"z-button--container":true,"z-button--has-text":!!this.hostElement.textContent.trim()}}}renderIcon(){return this.icon&&t("z-icon",{name:this.icon})}render(){if(this.href){return t("a",Object.assign({},this.getAttributes(),{"aria-label":this.ariaLabel\|\|undefined,href:this.href,target:this.target}),this.renderIcon(),t("slot",null))}return t("button",Object.assign({},this.getAttributes(),{"aria-label":this.ariaLabel\|\|undefined,name:this.name,type:this.type,disabled:this.disabled,role:this.htmlrole\|\|this.role\|\|undefined}),this.renderIcon(),t("slot",null))}get hostElement(){return a(this)}};D.style=A;const V=".sc-z-divider-h{display:block;padding:0;margin:0}.divider-horizontal.sc-z-divider-h{width:100%}.divider-vertical.sc-z-divider-h{height:100%}.divider-small.divider-horizontal.sc-z-divider-h{height:var(--border-size-small)}.divider-medium.divider-horizontal.sc-z-divider-h{height:var(--border-size-medium)}.divider-large.divider-horizontal.sc-z-divider-h{height:var(--border-size-large)}.divider-small.divider-vertical.sc-z-divider-h{width:var(--border-size-small)}.divider-medium.divider-vertical.sc-z-divider-h{width:var(--border-size-medium)}.divider-large.divider-vertical.sc-z-divider-h{width:var(--border-size-large)}";const _=V;const E=class{constructor(t){e(this,t);this.size=p.SMALL;this.color="gray200";this.orientation=f.HORIZONTAL}render(){return t(n,{key:"59e2f811ae879f15bfacb97769a2d43cf68b40a5",class:`divider-${this.size} divider-${this.orientation}`,style:{backgroundColor:`var(--${this.color})`}})}};E.style=_;const B=":host{margin-right:var(--z-icon-right-margin, 0);margin-left:var(--z-icon-left-margin, 0);line-height:0;vertical-align:middle}.icon-wrapper{position:relative;z-index:0;display:block}svg:not([width]){width:var(--z-icon-width, 1.125rem)}svg:not([height]){height:var(--z-icon-height, 1.125rem)}svg.color-indicator{position:absolute;z-index:-1;bottom:0;left:0}";const K=B;const P=class{constructor(t){e(this,t);this.name=undefined;this.height=undefined;this.width=undefined;this.iconid=undefined;this.fill=undefined;this.indicatorColor=undefined}selectPathOrPolygon(i){if(i===null\|\|i===void 0?void 0:i.startsWith("M")){return t("path",{d:i})}return t("polygon",{points:i})}render(){const i={viewBox:"0 0 1000 1000",width:this.width,height:this.height};return t(n,{key:"09183fdee2304748943d57bcfb10921369a84159","aria-hidden":"true"},t("div",{key:"8d1f3b6dd3a7cc69383be36f1951ee29694655b6",class:"icon-wrapper"},t("svg",Object.assign({key:"0ac79b86fdfa9083a7c4dc89d5a970d3fd89ded5",id:this.iconid\|\|undefined,fill:this.fill?`var(--${this.fill})`:undefined},i),this.selectPathOrPolygon($[this.name])),M.includes(this.name)&&t("svg",Object.assign({key:"9b08ff27c45ced5b70184b495f66ca3accf756df",class:"color-indicator",fill:this.indicatorColor\|\|"#FFFFFF00"},i),this.selectPathOrPolygon($["picker-color"]))))}};P.style=K;const Z='.sc-z-input-h{display:inline-block;width:inherit}.sc-z-input-h .sc-z-input{box-sizing:border-box}input.sc-z-input::-ms-clear,input.sc-z-input::-ms-reveal{display:none}.sc-z-input-h input.sc-z-input::-ms-clear,.sc-z-input-h input.sc-z-input::-ms-reveal{display:none}input.sc-z-input,textarea.sc-z-input{background:var(--color-form-background);fill:var(--color-form-default-icon);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg);outline:none}input.sc-z-input,.textarea-wrapper.sc-z-input{border:var(--border-size-small) solid var(--color-form-surface04);border-radius:var(--border-radius-small);color:var(--color-form-default-text)}[size="small"].sc-z-input-h input.sc-z-input,[size="small"].sc-z-input-h textarea.sc-z-input,[size="x-small"].sc-z-input-h input.sc-z-input,[size="x-small"].sc-z-input-h textarea.sc-z-input{font-size:var(--font-size-2)}.cursor-select.sc-z-input-h input.sc-z-input{cursor:pointer}input.sc-z-input:not([readonly]):hover,.textarea-wrapper.sc-z-input:not(.readonly):hover{outline:var(--border-size-medium) solid var(--color-surface04);outline-offset:-2px}.sc-z-input-h:not(.active-select) input.sc-z-input:focus:focus-visible,.sc-z-input-h:not([readonly="true"]) .textarea-wrapper.sc-z-input:focus-within{border-color:var(--color-form-active-primary);box-shadow:var(--shadow-focus-primary);color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible:hover,.textarea-wrapper.sc-z-input:not(.readonly):focus-within:hover{outline-color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input{fill:var(--color-form-active-primary)}.active-select.sc-z-input-h input.sc-z-input{border:var(--border-size-small) solid var(--color-form-active-primary)}.cursor-select.sc-z-input-h input.sc-z-input:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}.sc-z-input-h input[readonly].sc-z-input:focus:focus-visible{border-color:var(--color-form-surface03);box-shadow:none}.input-success.sc-z-input{border-color:var(--color-form-success01);background:var(--color-form-inverse-success)}.input-success.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-success.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-success01)}.input-error.sc-z-input{border-color:var(--color-form-hover-error);background:var(--color-form-inverse-error)}.input-error.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-error.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-error)}.input-warning.sc-z-input{border-color:var(--color-form-hover-warning);background:var(--color-form-inverse-warning)}.input-warning.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-warning.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-warning)}.sc-z-input:is(.input-success,.input-error.sc-z-input,.input-warning).sc-z-input:focus:focus-visible{color:var(--color-form-default-text)}.sc-z-input-h:not(.active-select) input[readonly].sc-z-input,.textarea-wrapper.readonly.sc-z-input{border-color:var(--color-form-surface03);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled="false"]) input.sc-z-input,[disabled].sc-z-input-h:not([disabled="false"]) .textarea-wrapper.sc-z-input,[disabled].sc-z-input-h:not([disabled="false"]) z-icon.sc-z-input{border-color:var(--color-form-disabled03);box-shadow:none;color:var(--color-form-disabled-text);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled="false"]) input.sc-z-input:hover{border-width:var(--border-size-small)}input.sc-z-input::placeholder,textarea.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::-webkit-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input:-ms-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}[disabled].sc-z-input-h:not([disabled="false"]) label.z-label.sc-z-input{color:var(--color-disabled03)}.text-wrapper.sc-z-input>div.sc-z-input{position:relative;z-index:1;fill:var(--color-form-default-icon)}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{width:100%;height:calc(var(--space-unit) 5.5);box-sizing:border-box;padding:0 calc(var(--space-unit) * 1.5);margin:0}[size="small"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4.5)}[size="x-small"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.sc-z-input,.text-wrapper.sc-z-input>div.sc-z-input>input.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 5.25)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 8)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input{position:absolute;z-index:2;top:50%;right:calc(var(--space-unit) * 1.5);display:flex;pointer-events:none;transform:translateY(-50%)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input{display:flex;padding:0;border:0;background:none;color:inherit;font:inherit;pointer-events:initial}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input+.input-icon.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.hidden.sc-z-input{display:none}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.reset-icon.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.toggle-password-icon.sc-z-input{cursor:pointer}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input{--z-icon-width:18px;--z-icon-height:18px;display:block}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.small.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.x-small.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:currentcolor}.textarea-wrapper.sc-z-input{width:100%;height:100%;padding:calc(var(--space-unit) * 1.5)}.textarea-wrapper.sc-z-input:not(.input-error,.input-success.sc-z-input,.input-warning).sc-z-input{background-color:var(--color-form-background)}textarea.sc-z-input{width:100%;min-height:132px;padding:0;border:none;margin:0;color:currentcolor;resize:none}.radio-wrapper.sc-z-input,.checkbox-wrapper.sc-z-input{position:relative;display:inline-flex;flex-direction:row;align-items:center;color:var(--color-default-text);fill:var(--color-primary01);font-family:var(--font-family-sans)}.radio-wrapper.sc-z-input:hover,.checkbox-wrapper.sc-z-input:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary-icon)}.radio-wrapper.sc-z-input>input.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input{position:absolute;z-index:-1;opacity:0;pointer-events:none}.radio-wrapper.sc-z-input .radio-label.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{display:inline-flex;align-items:center;margin:0;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1;text-transform:inherit}.radio-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.checkbox-label.sc-z-input{cursor:pointer}.radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{cursor:pointer;fill:inherit}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-2)}[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:14px;--z-icon-height:14px}[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-1)}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input{flex-direction:row}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input{flex-direction:row-reverse}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:var(--space-unit)}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:var(--space-unit)}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}[size="small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size="small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size="x-small"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:calc(var(--space-unit) * 0.5)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input{border-radius:50%}.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{border-radius:var(--border-radius-small)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{box-shadow:var(--shadow-focus-primary)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input{color:var(--color-disabled03)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input>z-icon.sc-z-input{cursor:default;fill:var(--color-disabled01)}';const N=Z;const W=class{constructor(t){e(this,t);this.inputChange=s(this,"inputChange",7);this.startTyping=s(this,"startTyping",7);this.stopTyping=s(this,"stopTyping",7);this.inputCheck=s(this,"inputCheck",7);this.inputFocus=s(this,"inputFocus",7);this.inputBlur=s(this,"inputBlur",7);this.typingtimeout=300;this.htmlid=`id-${O()}`;this.type=undefined;this.name=undefined;this.label=undefined;this.ariaLabel="";this.htmlAriaExpanded="";this.htmlAriaControls=undefined;this.htmlAriaAutocomplete=undefined;this.htmlAriaActivedescendant=undefined;this.value=undefined;this.disabled=false;this.readonly=false;this.required=false;this.checked=false;this.placeholder=undefined;this.htmltitle=undefined;this.status=undefined;this.message=true;this.labelPosition=v.RIGHT;this.autocomplete=undefined;this.role="";this.hasclearicon=true;this.icon=undefined;this.min=undefined;this.minlength=undefined;this.max=undefined;this.maxlength=undefined;this.step=undefined;this.pattern=undefined;this.size=h.BIG;this.isTyping=false;this.passwordHidden=true}inputCheckListener(t){const i=t.detail;switch(this.type){case b.RADIO:if(i.type===b.RADIO&&i.name===this.name&&i.id!==this.htmlid){this.checked=false}break}}async isChecked(){switch(this.type){case b.CHECKBOX:case b.RADIO:return this.checked;default:console.warn("`isChecked` method is only available for type `checkbox` and `radio`");return false}}emitInputChange(t){if(!this.isTyping){this.emitStartTyping()}let i;if(this.type===b.TEXTAREA){i=this.getValidity("textarea")}else{i=this.getValidity("input")}this.value=t;this.inputChange.emit({value:t,validity:i});clearTimeout(this.timer);this.timer=setTimeout((()=>{this.emitStopTyping(this.value,i)}),this.typingtimeout)}emitStartTyping(){this.isTyping=true;this.startTyping.emit()}emitStopTyping(t,i){this.isTyping=false;this.stopTyping.emit({value:t,validity:i})}emitInputCheck(t){this.inputCheck.emit({id:this.htmlid,checked:t,type:this.type,name:this.name,value:this.value,validity:this.getValidity("input")})}emitInputFocus(){this.inputFocus.emit({id:this.htmlid})}emitInputBlur(){this.inputBlur.emit({id:this.htmlid})}getValidity(t){const i=this.hostElement.querySelector(t);return i.validity}getTextAttributes(){return{id:this.htmlid,name:this.name,placeholder:this.placeholder,value:this.value,disabled:this.disabled,readonly:this.readonly,required:this.required,title:this.htmltitle,minlength:this.minlength,maxlength:this.maxlength,class:{[`input-${this.status}`]:!!this.status},autocomplete:this.autocomplete,onInput:t=>this.emitInputChange(t.target.value)}}getNumberAttributes(t){if(t!=b.NUMBER){return}return{min:this.min,max:this.max,step:this.step}}getPatternAttribute(t){if(t!=b.PASSWORD&&t!=b.TEXT&&t!=b.TEL&&t!=b.SEARCH&&t!=b.URL&&t!=b.EMAIL){return}return{pattern:this.pattern}}getRoleAttribute(){return this.role?{role:this.role}:{}}getAriaAttrubutes(){const t=this.htmlAriaExpanded?{"aria-expanded":this.htmlAriaExpanded}:{};const i=this.htmlAriaControls?{"aria-controls":this.htmlAriaControls}:{};const e=this.htmlAriaAutocomplete?{"aria-autocomplete":this.htmlAriaAutocomplete}:{};const s=this.htmlAriaActivedescendant?{"aria-activedescendant":this.htmlAriaActivedescendant}:{};return Object.assign(Object.assign(Object.assign(Object.assign({},t),i),e),s)}getFocusBlurAttributes(){return{onFocus:()=>this.emitInputFocus(),onBlur:()=>this.emitInputBlur()}}renderInputText(i=b.TEXT){const e=this.ariaLabel?{"aria-label":this.ariaLabel}:{};const s=Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},this.getTextAttributes()),this.getNumberAttributes(i)),this.getPatternAttribute(i)),e),this.getRoleAttribute()),this.getAriaAttrubutes()),this.getFocusBlurAttributes());if(this.icon\|\|i===b.PASSWORD){Object.assign(s.class,{"has-icon":true})}if(this.hasclearicon&&i!=b.NUMBER){Object.assign(s.class,{"has-clear-icon":true})}return t("div",{class:"text-wrapper"},this.renderLabel(),t("div",null,t("input",Object.assign({type:i===b.PASSWORD&&!this.passwordHidden?b.TEXT:i},s,{ref:t=>this.inputRef=t})),this.renderIcons()),this.renderMessage())}renderLabel(){if(!this.label){return}return t("label",{class:"z-label body-5-sb",id:`${this.htmlid}_label`,htmlFor:this.htmlid},this.label)}renderIcons(){return t("span",{class:"icons-wrapper"},this.renderResetIcon(),this.renderIcon())}renderIcon(){if(this.type===b.PASSWORD){return this.renderShowHidePassword()}if(!this.icon){return}return t("z-icon",{name:this.icon,class:{[this.size]:true,"input-icon":true}})}renderResetIcon(){let i=false;if(!this.hasclearicon\|\|!this.value\|\|this.disabled\|\|this.readonly\|\|this.type==b.NUMBER){i=true}return t("button",{type:"button",class:{"reset-icon":true,"input-icon":true,hidden:i},"aria-label":"cancella il contenuto dell'input",onClick:()=>{this.inputRef.value="";this.emitInputChange("")}},t("z-icon",{name:"multiply",class:this.size}))}renderShowHidePassword(){return t("button",{type:"button",class:"input-icon toggle-password-icon",disabled:this.disabled,"aria-label":this.passwordHidden?"mostra password":"nascondi password",onClick:()=>this.passwordHidden=!this.passwordHidden},t("z-icon",{name:this.passwordHidden?"view-filled":"view-off-filled",class:this.size}))}renderMessage(){if(j(this.message)===false){return}return t("z-input-message",{message:j(this.message)===true?undefined:this.message,status:this.status,class:this.size,disabled:this.disabled})}renderTextarea(){const e=this.getTextAttributes();return t(i,null,this.renderLabel(),t("div",{class:Object.assign(Object.assign({},e.class),{"textarea-wrapper":true,readonly:!!e.readonly})},t("textarea",Object.assign({},e,{class:Object.assign(Object.assign({},e.class),{"z-scrollbar":true}),"aria-label":this.ariaLabel\|\|undefined},this.getRoleAttribute()))),this.renderMessage())}handleCheck(t){this.checked=t.target.checked;this.emitInputCheck(this.checked)}renderCheckbox(){return t("div",{class:"checkbox-wrapper"},t("input",Object.assign({id:this.htmlid,type:"checkbox",name:this.name,checked:this.checked,disabled:this.disabled,readonly:this.readonly,required:this.required,onChange:this.handleCheck.bind(this),value:this.value},this.getRoleAttribute(),this.getFocusBlurAttributes())),t("label",{htmlFor:this.htmlid,class:{"checkbox-label":true,after:this.labelPosition===v.RIGHT,before:this.labelPosition===v.LEFT}},t("z-icon",{name:this.checked?"checkbox-checked":"checkbox",class:this.size}),this.label&&t("span",{innerHTML:this.label})))}renderRadio(){return t("div",{class:"radio-wrapper"},t("input",Object.assign({id:this.htmlid,type:"radio",name:this.name,checked:this.checked,disabled:this.disabled,readonly:this.readonly,onChange:this.handleCheck.bind(this),value:this.value},this.getRoleAttribute(),this.getFocusBlurAttributes())),t("label",{htmlFor:this.htmlid,class:{"radio-label":true,after:this.labelPosition===v.RIGHT,before:this.labelPosition===v.LEFT}},t("z-icon",{name:this.checked?"radio-button-checked":"radio-button",class:this.size}),this.label&&t("span",{innerHTML:this.label})))}render(){let i;switch(this.type){case b.TEXTAREA:i=this.renderTextarea();break;case b.CHECKBOX:i=this.renderCheckbox();break;case b.RADIO:i=this.renderRadio();break;default:i=this.renderInputText(this.type)}return t(n,{key:"12e6993a9f2e94db2300ccce3df5b839db56b09b"},i)}get hostElement(){return a(this)}};W.style=N;const X=':host{display:flex;min-height:calc(var(--space-unit) * 2.5);align-items:start;margin-top:var(--space-unit);color:var(--color-default-text);fill:currentcolor;font-family:var(--font-family-sans);font-size:var(--font-size-2);letter-spacing:0.16px}:host(.small),:host(.x-small){margin-top:calc(var(--space-unit) * 0.5);font-size:var(--font-size-1)}:host([status="success"]){color:var(--color-hover-success)}:host([status="error"]){color:var(--color-hover-error)}:host([status="warning"]){color:var(--color-hover-warning)}:host(:focus){outline:none}:host>z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);--z-icon-right-margin:var(--space-unit);margin-top:calc(var(--space-unit) * 0.25)}:host(.small)>z-icon,:host(.x-small)>z-icon{--z-icon-width:14px;--z-icon-height:14px;--z-icon-right-margin:calc(var(--space-unit) * 0.5)}:host([disabled]){color:var(--color-disabled03);fill:var(--color-disabled03)}';const Y=X;const q=class{constructor(t){e(this,t);this.statusIcons={success:"checkmark-circle",error:"multiply-circled",warning:"exclamation-circle"};this.message=undefined;this.status=undefined;this.disabled=undefined;this.statusRole={}}onMessageChange(){this.statusRole=this.message&&this.status?{role:"alert"}:{}}componentWillLoad(){this.onMessageChange()}render(){return t(n,Object.assign({key:"316945f2c121bb059ee4faebee44901d1e0169bf"},this.statusRole),this.statusIcons[this.status]&&this.message&&t("z-icon",{key:"f0732ad997a4d0ae8c51149e084bac772fd6bc59",name:this.statusIcons[this.status]}),t("span",{key:"466898eee1e923d9ffa259ec8a32585be01e3b7b",innerHTML:this.message}))}static get watchers(){return{message:["onMessageChange"],status:["onMessageChange"]}}};q.style=Y;const U=":host{display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}";const G=U;const J=class{constructor(t){e(this,t);this.size=z.MEDIUM;this.listType=m.NONE;this.role="list"}setChildrenSizeType(){const t=this.host.children;for(let i=0;i<t.length;i++){t[i].setAttribute("size",this.size);t[i].setAttribute("list-type",this.listType);t[i].setAttribute("list-element-position",(i+1).toString())}}componentDidLoad(){this.setChildrenSizeType()}render(){return t(n,{key:"e4034d75d571230ef00e2652e37c4181f5b822ae"},t("slot",{key:"90ff9e00ae2d1c4f78739c0e1b8fbbb38e2c4469"}))}get host(){return a(this)}};J.style=G;const Q=':host{outline:none}:host>.container{display:flex;box-sizing:border-box;flex-direction:column;justify-content:center;background-color:var(--background-color-list-element, var(--color-surface01));font-family:var(--font-family-sans);font-weight:var(--font-rg);outline:none}:host([size="small"])>.container{min-height:calc(var(--space-unit) * 4);padding:calc(var(--space-unit) / 2) 0}:host([size="medium"])>.container{min-height:calc(var(--space-unit) * 5);padding:var(--space-unit) 0}:host([size="medium"])>.tree-element-container{padding-top:0;padding-bottom:0}:host([size="large"])>.container{min-height:calc(var(--space-unit) * 7);padding:calc(var(--space-unit) * 2) 0}:host([size="x-large"])>.container{min-height:calc(var(--space-unit) * 9);padding:calc(var(--space-unit) * 3) 0}:host([expandable])>.container,:host([clickable])>.container{cursor:pointer}:host([expandable]:hover)>.container,:host([clickable]:hover)>.container{background-color:var(--background-hover-color-list-element, var(--color-background))}:host([expandable]:focus:focus-visible)>.container,:host([clickable]:focus:focus-visible)>.container{position:relative;z-index:1;box-shadow:var(--shadow-focus-primary)}:host([expandable]:active)>.container,:host([clickable]:active)>.container{background-color:var(--background-active-color-list-element, var(--color-background))}:host([align-button="left"][expandable])>.container>.z-list-element-container{display:flex}:host([align-button="right"][expandable])>.container>.z-list-element-container{display:flex;flex-direction:row-reverse;justify-content:space-between}:host([align-button="left"][expandable])>.container>.z-list-element-container>z-icon{margin-right:var(--space-unit)}:host([align-button="right"][expandable])>.container>.z-list-element-container>z-icon{margin-left:var(--space-unit)}:host>.container>.z-list-element-inner-container{display:none}:host>.container>.z-list-element-inner-container.expanded{display:block}.z-list-content-container{display:flex;align-items:center}:host .z-tree-list-divider{position:absolute;z-index:100;left:0}:host([disabled])>.container{color:var(--color-form-disabled03);cursor:default}';const tt=Q;const it=class{accessibleFocusHandler(t){if(this.listElementId===t.detail){const i=this.host.shadowRoot.getElementById(`z-list-element-id-${t.detail}`);i.focus()}}constructor(t){e(this,t);this.accessibleFocus=s(this,"accessibleFocus",7);this.ariaDescendantFocus=s(this,"ariaDescendantFocus",7);this.clickItem=s(this,"clickItem",7);this.openElementConfig={accordion:{open:"minus-circled",close:"plus-circled"},menu:{open:"chevron-up",close:"chevron-down"}};this.alignButton=g.LEFT;this.clickable=false;this.dividerColor="color-surface03";this.dividerType=x.NONE;this.dividerSize=p.SMALL;this.expandable=false;this.expandableStyle=w.ACCORDION;this.listElementId=undefined;this.size=z.MEDIUM;this.color="none";this.disabled=false;this.listElementPosition="0";this.listType=m.NONE;this.hasTreeItems=undefined;this.role="listitem";this.htmlTabindex=0;this.showInnerContent=false;this.handleClick=this.handleClick.bind(this);this.handleKeyDown=this.handleKeyDown.bind(this)}handleClick(){if(this.disabled){return}this.clickItem.emit(this.listElementId);if(!this.expandable){return}this.showInnerContent=!this.showInnerContent}handleKeyDown(t){const i=t.code===r.ENTER;switch(t.code){case r.ARROW_DOWN:t.preventDefault();this.accessibleFocus.emit(this.listElementId+1);break;case r.ARROW_UP:t.preventDefault();this.accessibleFocus.emit(this.listElementId-1);break;case r.ENTER:t.preventDefault();this.clickItem.emit(this.listElementId);break}if(!this.expandable\|\|!i){return}this.showInnerContent=!this.showInnerContent}renderExpandableButton(){if(!this.expandable){return null}return t("z-icon",{name:this.showInnerContent?this.openElementConfig[this.expandableStyle].open:this.openElementConfig[this.expandableStyle].close})}renderExpandedContent(){if(!this.expandable){return null}return t("div",{class:{"z-list-element-inner-container":true,expanded:this.showInnerContent}},t("slot",{name:"inner-content"}))}renderContent(){if(this.listType===m.NONE){return t("slot",null)}if(this.listType===m.ORDERED){return t("div",{class:"z-list-content-container"},t("div",null,this.listElementPosition,". "),t("slot",null))}if(this.listType===m.UNORDERED){return t("div",{class:"z-list-content-container"},t("span",null,"• "),t("slot",null))}}render(){return t(n,{key:"a194388e4dfdc5fad1ddcfaa075dd4a34a4db860","aria-expanded":this.expandable?this.showInnerContent:null,onClick:this.handleClick,onFocus:()=>this.ariaDescendantFocus.emit(this.listElementId),onKeyDown:this.handleKeyDown,clickable:this.clickable&&!this.disabled,tabIndex:this.hasTreeItems?undefined:this.htmlTabindex,role:this.hasTreeItems?"none":this.role},t("div",{key:"3d591e9d5d99e359c7d50865272962c557de50a3",class:this.hasTreeItems?"tree-element-container":"container",style:!this.disabled&&{color:`var(--${this.color})`},tabindex:"-1",id:`z-list-element-id-${this.listElementId}`,part:"list-item-container"},t("div",{key:"c059e51860af1665160c29e8361861c24e38dbf0",class:"z-list-element-container"},this.renderExpandableButton(),this.renderContent()),this.renderExpandedContent()),this.dividerType===x.ELEMENT&&t("z-divider",{key:"94cbb6abfdec4c000b696af653370e61e01cfe2a",class:{"z-tree-list-divider":this.hasTreeItems},color:this.dividerColor,size:this.dividerSize}))}get host(){return a(this)}};it.style=tt;const et=":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.z-list-group-header-container{color:var(--gray700);font-size:var(--font-size-2);font-weight:var(--font-sb) !important;letter-spacing:0.16px;line-height:1.4}:host>.z-list-group-header-container.has-header{padding-top:calc(var(--space-unit) * 1.5);padding-bottom:var(--space-unit)}:host>.z-list-group-header-container.has-header>z-divider{margin-top:var(--space-unit)}:host>.grouped-tree-list-header{padding-top:calc(var(--space-unit) * 1.5);padding-bottom:var(--space-unit)}";const st=et;const nt=class{constructor(t){e(this,t);this.size=z.MEDIUM;this.dividerType=x.NONE;this.dividerSize=p.SMALL;this.dividerColor="gray200";this.listType=m.NONE;this.hasTreeItems=undefined;this.role="group"}componentDidLoad(){const t=this.host.children;for(let i=0;i<t.length;i++){if(t.length-1>i){t[i].setAttribute("divider-type",this.dividerType);t[i].setAttribute("divider-size",this.dividerSize);t[i].setAttribute("divider-color",this.dividerColor)}t[i].setAttribute("size",this.size);t[i].setAttribute("list-type",this.listType);t[i].setAttribute("list-element-position",i.toString())}}componentWillLoad(){this.hasHeader=!!this.host.querySelector('[slot="header-title"]')}render(){return t(n,{key:"55624da5c3eb9a6acaf2b8c458f78eae89e47c50"},t("div",{key:"684bd97e774a83880c2c614eafcf62223581c77c",class:{"z-list-group-header-container":true,"has-header":this.hasHeader&&!this.hasTreeItems,"grouped-tree-list-header":this.hasTreeItems}},t("slot",{key:"146985789b9d7ecff79741d3677e5543fe0e9f4e",name:"header-title"}),this.dividerType===x.HEADER&&t("z-divider",{key:"abf96777c878069ec91d7481dbe5e2ebe19ddd01",color:this.dividerColor,size:this.dividerSize})),t("slot",{key:"6e80cadf2609cb6ddd511fbe39bf9f424a3bab04"}))}get host(){return a(this)}};nt.style=st;const at='.sc-z-offcanvas-h{font-family:var(--font-family-sans);font-weight:var(--font-rg)}[variant="pushcontent"].sc-z-offcanvas-h:not([transitiondirection="up"]){overflow:hidden}.canvas-container.sc-z-offcanvas{display:flex;overflow:hidden;min-width:100%;height:100%;background:var(--color-surface01);transform:translateX(0);transition:transform 0.4s ease-out}.sc-z-offcanvas-h>.sc-z-offcanvas{position:fixed;top:var(--z-offcanvas--top-space, 0);right:0;bottom:0;left:0}[open].sc-z-offcanvas-h>.sc-z-offcanvas{height:calc(100% - var(--z-offcanvas--top-space, 0px))}[transitiondirection="right"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{transform:translateX(-100%)}[transitiondirection="left"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{transform:translateX(100%)}[open][transitiondirection="right"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas,[open][transitiondirection="left"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{transform:translateX(0)}[transitiondirection="up"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{top:auto;bottom:0;height:var(--z-offcanvas--container-height, 90%);transform:translateY(100%)}[transitiondirection="up"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas,[variant="overlay"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{z-index:1001}[open][transitiondirection="up"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{transform:translateY(0)}[variant="pushcontent"].sc-z-offcanvas-h:not([transitiondirection="up"])>.canvas-container.sc-z-offcanvas{position:relative;height:100%}[variant="pushcontent"].sc-z-offcanvas-h:not([open]){display:none}[skip-animation].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{transition:none}.backdrop.sc-z-offcanvas{z-index:1000;width:100%;height:100%;background-color:var(--gray900);opacity:0;pointer-events:none;transition:opacity 0.4s ease-out}[open].sc-z-offcanvas-h>.backdrop.sc-z-offcanvas{opacity:0.7;pointer-events:unset}.canvas-container.sc-z-offcanvas>.canvas-content.sc-z-offcanvas{overflow:hidden auto;flex:1 auto;padding:0 calc(var(--space-unit) * 2);margin:calc(var(--space-unit) * 2) calc(var(--space-unit) / 2) calc(var(--space-unit) * 2) 0}@media (min-width: 768px){[variant="pushcontent"].sc-z-offcanvas-h:not([transitiondirection="up"]){flex:none}.canvas-container.sc-z-offcanvas{width:var(--z-offcanvas--container-width, 375px);min-width:var(--z-offcanvas--container-width, 375px)}[transitiondirection="up"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{width:100%}[transitiondirection="right"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{right:auto;left:0}[transitiondirection="left"].sc-z-offcanvas-h>.canvas-container.sc-z-offcanvas{right:0;left:auto}}';const rt=at;const ot=class{constructor(t){e(this,t);this.canvasOpenStatusChanged=s(this,"canvasOpenStatusChanged",7);this.allFocusableElements=[];this.previouslyFocusedElement=null;this.variant=o.PUSHCONTENT;this.open=false;this.transitiondirection=c.LEFT;this.skipLoadAnimation=false;this.showBackdrop=true;this.skipAnimation=false}getFocusableElements(){if(!this.canvasContent){return[]}const t=Array.from(this.canvasContent.querySelectorAll(""));return t.filter((t=>{const i=t.getAttribute("tabindex");const e=t.hasAttribute("disabled");const s=t.offsetParent===null;return!e&&!s&&(t.tabIndex>=0\|\|i==="0")}))}trapFocus(t){if(!this.allFocusableElements.length){return}const i=this.allFocusableElements[0];const e=this.allFocusableElements[this.allFocusableElements.length-1];const s=document.activeElement;if(t.shiftKey&&s===i){t.preventDefault();e.focus()}if(!t.shiftKey&&s===e){t.preventDefault();i.focus()}}handleKeyDown(t){if(!this.open){return}if(t.key===r.ESC){t.preventDefault();this.open=false;return}if(t.key===r.TAB){this.trapFocus(t)}}stopEvent(t){if(this.open){return}t.preventDefault();t.stopPropagation()}handlePageOverflow(){const t=this.variant===o.OVERLAY\|\|this.transitiondirection===c.UP?"overflow-y":"overflow-x";document.body.style[t]=this.open?"hidden":""}onOpenChanged(){var t,i,e;this.canvasOpenStatusChanged.emit(this.open);if(this.open){this.previouslyFocusedElement=document.activeElement;if(this.allFocusableElements.length>0){this.allFocusableElements[0].focus()}else{(t=this.canvasContent)===null\|\|t===void 0?void 0:t.focus()}this.handlePageOverflow()}else{(i=this.previouslyFocusedElement)===null\|\|i===void 0?void 0:i.focus();const t=()=>{this.handlePageOverflow();this.canvasContainer.removeEventListener("transitionend",t)};(e=this.canvasContainer)===null\|\|e===void 0?void 0:e.addEventListener("transitionend",t)}}componentWillLoad(){if(this.open){this.skipAnimation=true}}componentDidLoad(){this.handlePageOverflow()}componentDidRender(){this.skipAnimation=false;this.allFocusableElements=this.getFocusableElements()}connectedCallback(){this.handlePageOverflow()}disconnectedCallback(){this.open=false}render(){return t(n,{key:"8d7045110c92bf5ef1ef2f8d60ddaf1af55ace92","skip-animation":this.skipAnimation,"aria-hidden":!this.open?"true":null},t("div",{key:"ef823ffd39a7f63aae8ef95333da611ec4485292",class:"canvas-container",role:"presentation",ref:t=>this.canvasContainer=t},t("div",{key:"7a6586d273275f1686fe0b1406d71e782d5d71c3",class:"canvas-content z-scrollbar",role:"presentation",ref:t=>this.canvasContent=t},t("slot",{key:"5930bb55687c9dd286828dc262c1f2cb18ebdd75",name:"canvasContent"}))),(this.variant==o.OVERLAY\|\|this.transitiondirection===c.UP)&&this.showBackdrop&&t("div",{key:"a65de1a8b0e92e0520d410a88c98edfe5bb56100",class:"backdrop",onClick:()=>this.open=false}))}static get watchers(){return{variant:["handlePageOverflow"],open:["onOpenChanged"]}}};ot.style=rt;const ct=':host{--z-searchbar-tag-text-color:var(--color-primary03);--z-searchbar-tag-bg:var(--color-hover-primary);--z-searchbar-item-height:44px;z-index:15;display:flex;column-gap:calc(var(--space-unit) 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,{box-sizing:border-box}:host::part(list-item-container){display:block;min-height:unset;padding:0}.input-container{position:relative;display:flex;width:100%;flex-direction:column}.results-wrapper{position:absolute;top:calc(100% - 1px);left:0;width:100%;padding:calc(var(--space-unit) / 4);border:var(--border-size-small) solid var(--color-surface03);border-top:none;background:var(--color-surface01)}.results{overflow:auto;max-height:var(--z-searchbar-results-height, 540px);padding:calc(var(--space-unit) / 2) calc(var(--space-unit) 1.5)}.results::-webkit-scrollbar{width:6px;background:linear-gradient(to right, transparent 0 1px, var(--gray200) 1px 5px, transparent 5px 6px)}.results::-webkit-scrollbar-thumb{background-color:var(--color-primary01)}.results::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}@supports not selector(.results::-webkit-scrollbar-track){.results{scrollbar-color:var(--color-primary01) transparent}}.results .category-heading{display:block;font-size:var(--font-size-2);font-weight:var(--font-rg);line-height:var(--font-size-3)}.results .category-heading>{display:block}.results .category-heading>.category{color:var(--color-text05);font-style:italic}.results .category-heading>.subcategory{margin-top:var(--space-unit);color:var(--color-default-text);text-transform:uppercase}.results z-list-element{position:relative;display:block}z-list-element>.item-search{padding:var(--space-unit) 0}z-list z-list-element::before{position:absolute;z-index:100;top:5px;left:-20px;width:8px;height:1em;border-bottom:1px solid var(--color-disabled01-icon);border-left:1px solid var(--color-disabled01-icon);content:"";cursor:pointer}z-list z-list-element::after{position:absolute;z-index:100;top:5px;left:-20px;width:8px;height:100%;border-left:1px solid var(--color-disabled01-icon);content:"";cursor:pointer}z-list z-list-element:last-child::after{display:none}z-list>z-list-element::before,z-list>z-list-element::after,z-list>z-list-group>z-list-element::before,z-list>z-list-group>z-list-element::after{display:none}z-list>div.children-node{padding-left:calc(var(--space-unit) 3)}.results z-list-element>.list-element{display:flex;justify-content:space-between;padding:calc(var(--space-unit) * 1.25) 0;cursor:pointer}.results z-list-element>.list-element:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}.results z-list-element>.list-element .item.ellipsis{overflow:hidden}.results z-list-element .list-element::after{position:absolute;top:0;right:0;display:block;width:100%;height:44px;content:"";transform:translateX(-100%)}.results z-list-element .list-element.focused.hovered::after{padding-left:6px}.results z-list-element>.list-element:hover,.results z-list-element>.list-element:hover::after{background-color:var(--color-background);cursor:pointer}.results z-list-element>.list-element>z-tag{border:1px solid var(--gray800);font-size:var(--font-size-1);font-weight:var(--font-sb);--z-tag-bg:var(--z-searchbar-tag-bg);--z-tag-text-color:var(--z-searchbar-tag-text-color)}.results .item{--z-icon-height:12px;--z-icon-width:12px;display:flex;flex-flow:row nowrap;align-items:center;justify-content:flex-start;color:var(--color-default-text);column-gap:calc(var(--space-unit) * 1.5);fill:var(--color-default-icon);font-size:var(--font-size-2);line-height:var(--font-size-6)}.results .item.ellipsis>.item-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.results .item>.item-label mark{background:var(--color-primary03)}.results .item.item-search{--z-icon-height:16px;--z-icon-width:16px}.results .item-show-all{text-align:center}.results .item-no-results{display:block;font-size:var(--font-size-2);font-style:italic;line-height:var(--font-size-5)}.results .item-no-results>ul{padding-left:calc(var(--space-unit) * 2);margin:var(--space-unit)}@media (min-width: 768px){.results .category-heading{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item{font-size:var(--font-size-3);line-height:var(--font-size-6)}.results .item.item-search{--z-icon-height:18px;--z-icon-width:18px}.results .item.ellipsis>.item-label{height:1.5rem}.results z-list-element>.list-element>z-tag{min-width:max-content}}@media (min-width: 1152px){.results .item{cursor:pointer}.results .item-no-results{cursor:default;font-size:var(--font-size-3);line-height:var(--font-size-6)}}:host([size="small"]) .results :is(.item,.category-heading),:host([size="x-small"]) .results :is(.item,.category-heading){font-size:var(--font-size-2)}:host([size="small"]) .results .item:not(.has-category),:host([size="x-small"]) .results .item:not(.has-category){--z-icon-height:16px;--z-icon-width:16px}:host([size="small"]) z-list-element>.list-element,:host([size="small"]) z-list-element>.item-search{padding:calc(var(--space-unit) * 0.75) 0}:host([size="x-small"]) z-list-element>.list-element,:host([size="x-small"]) z-list-element>.item-search{padding:calc(var(--space-unit) / 2) 0}:host([size="small"]) z-list-element .list-element::after{height:36px}:host([size="x-small"]) z-list-element .list-element::after{height:32px}';const lt=ct;const ht=".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}";const dt=ht;const ut=class{constructor(t){e(this,t);this.searchSubmit=s(this,"searchSubmit",7);this.searchTyping=s(this,"searchTyping",7);this.searchItemClick=s(this,"searchItemClick",7);this.resultsItemsList=null;this.items=[];this.htmlid=`searchbar-${O()}`;this.preventSubmit=false;this.label=undefined;this.htmlAriaLabel=undefined;this.value=undefined;this.placeholder=undefined;this.autocomplete=false;this.autocompleteMinChars=3;this.resultsCount=undefined;this.searchHelperLabel="Cerca {searchString}";this.resultsItems=undefined;this.sortResultsItems=false;this.showSearchButton=false;this.searchButtonIconOnly=false;this.size=h.BIG;this.variant=l.PRIMARY;this.searchString=this.value;this.currResultsCount=0;this.showResults=false;this.isMobile=false;this.selectedItem=undefined}emitSearchSubmit(){this.searchSubmit.emit(this.inputRef.value)}emitSearchTyping(t){this.searchTyping.emit(t)}emitSearchItemClick(t){this.searchItemClick.emit(t);this.selectedItem=t;this.searchString=""}watchItems(){this.resultsItemsList=this.getResultsItemsList()}watchResultsCount(){this.currResultsCount=this.resultsCount}watchValue(){this.searchString=this.value}watchSearchString(){this.emitSearchTyping(this.searchString);this.items=[];if(!this.searchString){this.currResultsCount=this.resultsCount}}watchShowResults(){if(!this.showResults){this.items=[]}}disconnectedCallback(){var t;(t=this.resizeObserver)===null\|\|t===void 0?void 0:t.disconnect()}componentDidLoad(){this.resizeObserver=new ResizeObserver((()=>{if(S()===y.MOBILE&&!this.isMobile){this.isMobile=true}if(S()!==y.MOBILE&&this.isMobile){this.isMobile=false}}));this.resizeObserver.observe(this.element)}componentWillLoad(){this.resultsItemsList=this.getResultsItemsList();this.currResultsCount=this.resultsCount}getResultsItemsList(){return typeof this.resultsItems==="string"?JSON.parse(this.resultsItems):this.resultsItems}getGroupedItems(t){const i={};t.forEach((t=>{var e;const s=`${t===null\|\|t===void 0?void 0:t.category}${t===null\|\|t===void 0?void 0:t.subcategory}`;i[s]=(e=i[s])!==null&&e!==void 0?e:{category:t===null\|\|t===void 0?void 0:t.category,subcategory:t===null\|\|t===void 0?void 0:t.subcategory,items:[]};i[s]["items"].push(t)}));if(this.sortResultsItems){return Object.keys(i).sort().reduce(((t,e)=>{t[e]=Object.assign(Object.assign({},i[e]),{items:i[e]["items"].sort(((t,i)=>{const e=t.label.toUpperCase();const s=i.label.toUpperCase();if(e<s){return-1}if(e>s){return 1}return 0}))});return t}),{})}return i}checkResultsCount(t){if(!this.currResultsCount\|\|t<this.currResultsCount){return true}return false}handleStopTyping(t){t.stopPropagation();this.searchString=t.detail.value;if(this.selectedItem){this.selectedItem=undefined}}handleSubmit(){if(this.preventSubmit){return}this.emitSearchSubmit()}handleOutsideClick(t){const i=t.composedPath();const e=i.find((t=>t.nodeName==="Z-SEARCHBAR"));if(!e\|\|e.htmlid!==this.htmlid){this.showResults=false;return}if(i.find((t=>{var i;return(t===null\|\|t===void 0?void 0:t.nodeName)==="Z-INPUT"\|\|((i=t===null\|\|t===void 0?void 0:t.classList)===null\|\|i===void 0?void 0:i.contains("results"))}))){this.showResults=true;return}this.showResults=false}renderInput(){var i;return t("z-input",{ref:t=>{this.inputRef=t},htmlid:`input-${this.htmlid}`,message:false,placeholder:this.placeholder,onStopTyping:t=>this.handleStopTyping(t),onKeyUp:t=>{I(t,(()=>this.handleSubmit()));this.handleArrowsNavigation(t)},value:this.searchString\|\|((i=this.selectedItem)===null\|\|i===void 0?void 0:i.label),size:this.size,label:this.label,"aria-label":this.htmlAriaLabel\|\|this.placeholder})}renderButton(){if(!this.showSearchButton){return null}const i=this.searchButtonIconOnly?{icon:"search"}:null;const e=this.searchButtonIconOnly?"":"CERCA";const s=this.searchButtonIconOnly?{"aria-label":"CERCA"}:null;const n=Object.assign(Object.assign({disabled:this.preventSubmit,variant:this.variant,size:this.size,onClick:()=>this.handleSubmit()},i),s);return t("z-button",Object.assign({},n),e)}renderResults(){if(!this.showResults\|\|!this.autocomplete\|\|!this.searchString\|\|this.searchString.length<this.autocompleteMinChars\|\|!this.resultsItemsList){return null}return t("div",{class:"results-wrapper"},t("div",{class:"results"},this.renderResultsList()))}renderResultsList(){var i,e;if(this.preventSubmit&&!((i=this.resultsItemsList)===null\|\|i===void 0?void 0:i.length)){return t("span",{class:"item item-no-results"},"Non abbiamo trovato risultati per ",t("b",null,this.searchString),t("br",null),t("br",null),"Cosa puoi fare?",t("ul",null,t("li",null,"Verificare di aver scritto bene"),t("li",null,"Provare a cercare un'altra parola"),t("li",null,"Provare a cercare qualcosa di più generico")))}return t("z-list",{role:"listbox",id:`list-${this.htmlid}`,"aria-label":this.htmlAriaLabel\|\|this.label},this.renderSearchHelper(!!((e=this.resultsItemsList)===null\|\|e===void 0?void 0:e.length)),this.renderItems(),this.renderShowAllResults())}renderItems(){var i;if(!((i=this.resultsItemsList)===null\|\|i===void 0?void 0:i.length)){return[]}const e=this.getGroupedItems(this.resultsItemsList);const s=[];let n=0;Object.values(e).forEach(((i,e,a)=>{if(this.checkResultsCount(n)){const r=[];i.items.forEach(((t,i,s)=>{if(this.checkResultsCount(n)){const n=e===a.length-1&&i===s.length-1;r.push(this.renderItem(t,i,!n))}n++}));if(r.length){s.push(t("z-list-group",{"divider-type":x.ELEMENT},this.renderItemCategory(i),r))}}}));return s}handleArrowsNavigation(t){const i=t.target;const e=[r.ARROW_DOWN,r.ARROW_UP];if(!e.includes(t.key)){t.preventDefault();return}if(!this.items.length){const t=this.element.shadowRoot.querySelector("z-list");if(!t){return}this.items=Array.from(t.querySelectorAll(".list-element"))}this.items.forEach((t=>t.classList.contains("focused")&&t.classList.remove("focused")));const s=this.items.indexOf(i);if(t.key===r.ARROW_DOWN){t.preventDefault();const i=s+1;if(i<this.items.length){this.items[i].focus();this.items[i].classList.add("focused")}}if(t.key===r.ARROW_UP){t.preventDefault();const i=s-1;if(i<0){this.element.shadowRoot.querySelector("input").focus();this.element.shadowRoot.querySelector("input").setSelectionRange(this.inputRef.value.length,this.inputRef.value.length)}if(i>=0){this.items[i].focus();this.items[i].classList.add("focused")}}}renderItem(i,e,s){return t("z-list-element",{id:`list-item-${this.htmlid}-${e}`,tabIndex:0,role:"option",dividerType:s?x.ELEMENT:undefined,onKeyDown:t=>this.handleArrowsNavigation(t)},t("div",{class:"list-element",tabIndex:0,onClick:()=>this.emitSearchItemClick(i),onKeyDown:t=>I(t,(()=>this.emitSearchItemClick(i))),onMouseEnter:t=>{const i=t.target;i.classList.add("hovered")},onMouseLeave:t=>{const i=t.target;i.classList.contains("hovered")&&i.classList.remove("hovered")}},t("span",{class:"item ellipsis"},(i===null\|\|i===void 0?void 0:i.icon)&&t("z-icon",{class:"item-icon",name:i.icon}),t("span",{class:"item-label",title:i.label,innerHTML:this.renderItemLabel(i.label)})),(i===null\|\|i===void 0?void 0:i.tag)&&t("z-tag",{icon:i.tag.icon},!this.isMobile?i.tag.text:"")),i.children&&i.children.length>0?t("z-list",null,t("div",{class:"children-node"},i.children.map(((t,i)=>this.renderItem(t,i,false))))):null)}renderItemLabel(t){if(!this.searchString){return t}return t.replace(new RegExp(this.searchString.replace(/[.*+?^${}()\|[\]\\]/g,"\\$&"),"gmi"),(t=>`<mark>${t}</mark>`))}renderItemCategory(i){if(!(i===null\|\|i===void 0?void 0:i.category)){return null}return t("span",{class:"category-heading",slot:"header-title"},t("span",{class:"category"},i.category),(i===null\|\|i===void 0?void 0:i.subcategory)&&t("span",{class:"subcategory"},i.subcategory))}renderSearchHelper(i=true){if(!this.autocomplete\|\|this.preventSubmit\|\|!this.searchString){return null}return t("z-list-element",{role:"option",dividerType:i?x.ELEMENT:undefined,id:`list-item-${this.htmlid}-search`,onKeyDown:t=>this.handleArrowsNavigation(t)},t("div",{tabindex:0,onClick:()=>this.emitSearchSubmit(),onKeyDown:t=>I(t,(()=>this.emitSearchSubmit())),class:"list-element"},t("span",{class:"item item-search"},t("z-icon",{class:"search-icon",name:"left-magnifying-glass"}),t("span",{class:"item-label",innerHTML:this.searchHelperLabel.replace("{searchString}",`<mark>${this.searchString}</mark>`)}))))}renderShowAllResults(){var i,e;if(!this.currResultsCount\|\|!this.searchString\|\|!((i=this.resultsItemsList)===null\|\|i===void 0?void 0:i.length)\|\|this.currResultsCount>=((e=this.resultsItemsList)===null\|\|e===void 0?void 0:e.length)){return null}return t("z-list-element",{role:"option",tabindex:0,clickable:true,id:`list-item-${this.htmlid}-show-all`,onClickItem:()=>this.currResultsCount=0,color:"color-primary01"},t("div",{class:"item-show-all"},"Vedi tutti i risultati"))}render(){return t(n,{key:"403cde71029ade87b32bac86991c6ea3b1003150",onFocus:()=>this.showResults=true,onClick:t=>this.handleOutsideClick(t),class:{"has-submit":this.showSearchButton,"has-results":this.autocomplete}},t("div",{key:"66ca1b6a187f3ffd8a932144a9ace0f557c58bd5",class:"input-container"},this.renderInput(),this.renderResults()),this.renderButton())}get element(){return a(this)}static get watchers(){return{resultsItems:["watchItems"],resultsCount:["watchResultsCount"],value:["watchValue"],searchString:["watchSearchString"],showResults:["watchShowResults"]}}};ut.style=lt+dt;const pt=".sc-z-tag-h{--z-icon-width:14px;--z-icon-height:14px;display:flex;width:fit-content;max-width:inherit;height:fit-content;max-height:inherit;align-items:flex-start;padding:calc(var(--space-unit) / 2);background-color:var(--z-tag-bg, var(--color-hover-primary));border-radius:var(--border-radius);color:var(--z-tag-text-color, var(--color-text-inverse));fill:currentcolor;font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);letter-spacing:0.32px;line-height:14px;text-transform:uppercase}.sc-z-tag-h>z-icon.sc-z-tag{margin-right:0;transition:margin-right 0.3s ease-out}.has-text.sc-z-tag-h:not(.expandable)>z-icon.sc-z-tag{margin-right:var(--space-unit)}.has-text.expandable.sc-z-tag-h:hover>z-icon.sc-z-tag{margin-right:var(--space-unit)}.expandable.sc-z-tag-h>div.sc-z-tag{overflow:hidden;max-width:0;max-height:0}.expandable.sc-z-tag-h:hover>div.sc-z-tag{max-width:100%;max-height:100%}";const ft=pt;const vt=class{constructor(t){e(this,t);this.icon=undefined;this.expandable=undefined}render(){var i;const e=((i=this.host.textContent)===null\|\|i===void 0?void 0:i.trim().length)>0;return t(n,{key:"1414ca0881e2a62586b1e093e1fef75f1f74f6fe",class:{expandable:this.expandable&&!!this.icon,"has-text":e}},this.icon&&t("z-icon",{key:"1be6964fc0121d351bbdebdfe255d26702e81f8f",name:this.icon}),t("div",{key:"a7dac7e78d2cbc4a6d779a683e1d2b820af0fe6a"},t("slot",{key:"95de2b4d5958f7af33015e887ac854c472979ae3"})))}get host(){return a(this)}};vt.style=ft;export{H as z_app_header,D as z_button,E as z_divider,P as z_icon,W as z_input,q as z_input_message,J as z_list,it as z_list_element,nt as z_list_group,ot as z_offcanvas,ut as z_searchbar,vt as z_tag};
2	- //# sourceMappingURL=p-59fac888.entry.js.map