npm - @zanichelli/albe-web-components - Versions diffs - 20.0.0 → 20.0.2-RC - Mend

@zanichelli/albe-web-components 20.0.0 → 20.0.2-RC

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 (508) hide show

package/dist/components/index6.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["stylesGeneralCss","stylesTextCss","stylesTextareaCss","stylesCheckboxRadioCss","ZInput","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","htmlid","randomId","type","InputType","TEXT","disabled","readonly","required","checked","message","labelPosition","LabelPosition","RIGHT","hasclearicon","size","ControlSize","BIG","isTyping","passwordHidden","typingtimeout","inputCheckListener","e","data","detail","RADIO","name","id","isChecked","CHECKBOX","console","warn","emitInputChange","value","emitStartTyping","validity","TEXTAREA","getValidity","inputChange","emit","clearTimeout","timer","setTimeout","emitStopTyping","startTyping","stopTyping","emitInputCheck","inputCheck","emitInputFocus","inputFocus","emitInputBlur","inputBlur","input","hostElement","querySelector","getTextAttributes","placeholder","title","htmltitle","minlength","maxlength","class","status","autocomplete","onInput","target","getNumberAttributes","NUMBER","min","max","step","getPatternAttribute","PASSWORD","TEL","SEARCH","URL","EMAIL","pattern","inputHasMessage","boolean","getAriaAttributes","role","htmlRole","undefined","htmlAriaDescribedby","htmlAriaLabelledby","getTextAriaAttributes","Object","assign","htmlAriaExpanded","htmlAriaControls","htmlAriaAutocomplete","htmlAriaActivedescendant","InputStatus","ERROR","getFocusBlurAttributes","onFocus","onBlur","renderInputText","attr","htmlAriaLabel","icon","h","renderLabel","ref","el","inputRef","renderIcons","renderMessage","label","htmlFor","renderResetIcon","renderIcon","renderShowHidePassword","hidden","onClick","focus","renderTextarea","attributes","ariaAttributes","Fragment","handleCheck","ev","renderCheckbox","ariaRequired","onChange","bind","after","before","LEFT","innerHTML","renderRadio","render"],"sources":["src/components/z-input/styles-general.css?tag=z-input&encapsulation=scoped","src/components/z-input/styles-text.css?tag=z-input&encapsulation=scoped","src/components/z-input/styles-textarea.css?tag=z-input&encapsulation=scoped","src/components/z-input/styles-checkbox-radio.css?tag=z-input&encapsulation=scoped","src/components/z-input/index.tsx"],"sourcesContent":[":host {\n display: inline-block;\n width: inherit;\n}\n\n:host * {\n box-sizing: border-box;\n}\n\n/* GENERAL /\ninput::-ms-clear,\ninput::-ms-reveal {\n display: none;\n}\n\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-results-button,\ninput[type=\"search\"]::-webkit-search-results-decoration {\n display: none;\n}\n\ninput,\ntextarea {\n background: var(--color-form-background);\n fill: var(--color-form-default-icon);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n outline: none;\n}\n\ninput,\n.textarea-wrapper {\n border: var(--border-size-small) solid var(--color-form-surface04);\n border-radius: var(--border-radius-small);\n color: var(--color-form-default-text);\n}\n\n:host([size=\"small\"]) input,\n:host([size=\"small\"]) textarea,\n:host([size=\"x-small\"]) input,\n:host([size=\"x-small\"]) textarea {\n font-size: var(--font-size-2);\n}\n\n:host.cursor-select input {\n cursor: pointer;\n}\n\n/ HOVER /\ninput:not([readonly]):hover,\n.textarea-wrapper:not(.readonly):hover {\n outline: var(--border-size-medium) solid var(--color-surface04);\n outline-offset: -2px;\n}\n\n/ FOCUS /\n:host:not(.active-select) input:focus:focus-visible,\n:host:not([readonly=\"true\"]) .textarea-wrapper:focus-within {\n border-color: var(--color-form-active-primary);\n box-shadow: var(--shadow-focus-primary);\n color: var(--color-form-active-primary);\n}\n\n:host input:focus:focus-visible:hover,\n.textarea-wrapper:not(.readonly):focus-within:hover {\n outline-color: var(--color-form-active-primary);\n}\n\n:host input:focus:focus-visible + .icons-wrapper {\n fill: var(--color-form-active-primary);\n}\n\n:host.active-select input {\n border: var(--border-size-small) solid var(--color-form-active-primary);\n}\n\n:host.cursor-select input:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host input[readonly]:focus:focus-visible {\n border-color: var(--color-form-surface03);\n box-shadow: none;\n}\n\n/ STATUSES (success, warning, error) /\n.input-success {\n border-color: var(--color-form-success01);\n background: var(--color-form-inverse-success);\n}\n\n.input-success:focus:focus-visible + .icons-wrapper,\n.input-success + .icons-wrapper {\n fill: var(--color-form-success01);\n}\n\n.input-error {\n border-color: var(--color-form-hover-error);\n background: var(--color-form-inverse-error);\n}\n\n.input-error:focus:focus-visible + .icons-wrapper,\n.input-error + .icons-wrapper {\n fill: var(--color-form-hover-error);\n}\n\n.input-warning {\n border-color: var(--color-form-hover-warning);\n background: var(--color-form-inverse-warning);\n}\n\n.input-warning:focus:focus-visible + .icons-wrapper,\n.input-warning + .icons-wrapper {\n fill: var(--color-form-hover-warning);\n}\n\n:is(.input-success, .input-error, .input-warning):focus:focus-visible {\n color: var(--color-form-default-text);\n}\n\n/ READONLY /\n:host:not(.active-select) input[readonly],\n.textarea-wrapper.readonly {\n border-color: var(--color-form-surface03);\n fill: var(--color-form-disabled01-icon);\n pointer-events: none;\n}\n\n/ DISABLED /\n:host([disabled]:not([disabled=\"false\"])) input,\n:host([disabled]:not([disabled=\"false\"])) .textarea-wrapper,\n:host([disabled]:not([disabled=\"false\"])) z-icon {\n border-color: var(--color-form-disabled03);\n box-shadow: none;\n color: var(--color-form-disabled-text);\n fill: var(--color-form-disabled01-icon);\n pointer-events: none;\n}\n\n:host([disabled]:not([disabled=\"false\"])) input:hover {\n border-width: var(--border-size-small);\n}\n\n/ PLACEHOLDER /\ninput::placeholder,\ntextarea::placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n::-webkit-textarea-placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n:-ms-textarea-placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n::placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n:host([disabled]:not([disabled=\"false\"])) label.z-label {\n color: var(--color-disabled03);\n}\n",".text-wrapper > div {\n position: relative;\n z-index: 1;\n fill: var(--color-form-default-icon);\n}\n\n.text-wrapper > div > input {\n width: 100%;\n height: calc(var(--space-unit) 5.5);\n box-sizing: border-box;\n padding: 0 calc(var(--space-unit) * 1.5);\n margin: 0;\n}\n\n:host([size=\"small\"]) .text-wrapper > div > input {\n height: calc(var(--space-unit) * 4.5);\n}\n\n:host([size=\"x-small\"]) .text-wrapper > div > input {\n height: calc(var(--space-unit) * 4);\n}\n\n.text-wrapper > div > input.has-icon,\n.text-wrapper > div > input.has-clear-icon {\n padding-right: calc(var(--space-unit) * 5.25);\n}\n\n.text-wrapper > div > input.has-icon.has-clear-icon {\n padding-right: calc(var(--space-unit) * 8);\n}\n\n.text-wrapper .icons-wrapper {\n position: absolute;\n z-index: 2;\n top: 50%;\n right: calc(var(--space-unit) * 1.5);\n display: flex;\n pointer-events: none;\n transform: translateY(-50%);\n}\n\n.text-wrapper .icons-wrapper > button.input-icon {\n display: flex;\n padding: 0;\n border: 0;\n background: none;\n color: inherit;\n font: inherit;\n pointer-events: initial;\n}\n\n.text-wrapper .icons-wrapper > .input-icon + .input-icon {\n margin-left: calc(var(--space-unit) * 0.5);\n}\n\n.text-wrapper .icons-wrapper > button.input-icon.hidden {\n display: none;\n}\n\n.text-wrapper .icons-wrapper > button.reset-icon,\n.text-wrapper .icons-wrapper > button.toggle-password-icon {\n display: flex;\n min-width: 24px;\n min-height: 24px;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n}\n\n.text-wrapper .icons-wrapper > .input-icon {\n --z-icon-width: 18px;\n --z-icon-height: 18px;\n\n display: block;\n}\n\n.text-wrapper .icons-wrapper > .input-icon.small,\n.text-wrapper .icons-wrapper > .input-icon.x-small {\n --z-icon-width: 16px;\n --z-icon-height: 16px;\n}\n\n.text-wrapper .icons-wrapper > button.input-icon:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n/* stylelint-disable property-no-vendor-prefix /\n.text-wrapper > div > input:-webkit-autofill {\n -webkit-box-shadow: 0 0 0 1000px #fff inset;\n -webkit-text-fill-color: currentcolor;\n}\n",".textarea-wrapper {\n width: 100%;\n height: 100%;\n padding: calc(var(--space-unit) 1.5);\n}\n\n.textarea-wrapper:not(.input-error, .input-success, .input-warning) {\n background-color: var(--color-form-background);\n}\n\ntextarea {\n width: 100%;\n min-height: 132px;\n padding: 0;\n border: none;\n margin: 0;\n color: currentcolor;\n resize: none;\n}\n",".radio-wrapper,\n.checkbox-wrapper {\n position: relative;\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n color: var(--color-default-text);\n fill: var(--color-primary01);\n font-family: var(--font-family-sans);\n}\n\n.radio-wrapper:hover,\n.checkbox-wrapper:hover {\n color: var(--color-hover-primary);\n fill: var(--color-hover-primary-icon);\n}\n\n.radio-wrapper > input,\n.checkbox-wrapper > input {\n position: absolute;\n z-index: -1;\n opacity: 0;\n pointer-events: none;\n}\n\n.radio-wrapper .radio-label,\n.checkbox-wrapper .checkbox-label {\n display: inline-flex;\n min-height: 24px;\n align-items: center;\n padding: 3px 0;\n margin: 0;\n color: inherit;\n font-family: inherit;\n font-size: inherit;\n font-weight: inherit;\n line-height: 1;\n text-transform: inherit;\n}\n\n.radio-wrapper input:not(:disabled) + .radio-label,\n.checkbox-wrapper input:not(:disabled) + .checkbox-label {\n cursor: pointer;\n}\n\n.radio-wrapper .radio-label z-icon,\n.checkbox-wrapper .checkbox-label z-icon {\n cursor: pointer;\n fill: inherit;\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label z-icon,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label z-icon {\n --z-icon-width: 16px;\n --z-icon-height: 16px;\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label {\n font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) .radio-wrapper .radio-label z-icon,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label z-icon {\n --z-icon-width: 14px;\n --z-icon-height: 14px;\n}\n\n:host([size=\"x-small\"]) .radio-wrapper .radio-label,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label {\n font-size: var(--font-size-1);\n}\n\n.radio-wrapper .radio-label.after,\n.checkbox-wrapper .checkbox-label.after {\n flex-direction: row;\n}\n\n.radio-wrapper .radio-label.before,\n.checkbox-wrapper .checkbox-label.before {\n flex-direction: row-reverse;\n}\n\n.radio-wrapper .radio-label.after > span,\n.checkbox-wrapper .checkbox-label.after > span {\n margin-left: var(--space-unit);\n}\n\n.radio-wrapper .radio-label.before > span,\n.checkbox-wrapper .checkbox-label.before > span {\n margin-right: var(--space-unit);\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label.after > span,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label.after > span,\n:host([size=\"x-small\"]) .radio-wrapper .radio-label.after > span,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label.after > span {\n margin-left: calc(var(--space-unit) * 0.5);\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label.before > span,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label.before > span,\n:host([size=\"x-small\"]) .radio-wrapper .radio-label.before > span,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label.before > span {\n margin-right: calc(var(--space-unit) * 0.5);\n}\n\n/* focus /\n.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon {\n border-radius: 50%;\n}\n\n.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {\n border-radius: var(--border-radius-small);\n}\n\n.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon,\n.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {\n box-shadow: var(--shadow-focus-primary);\n}\n\n/ disabled /\n.radio-wrapper > input:disabled + .radio-label,\n.checkbox-wrapper > input:disabled + .checkbox-label {\n color: var(--color-disabled03);\n}\n\n.radio-wrapper > input:disabled + .radio-label > z-icon,\n.checkbox-wrapper > input:disabled + .checkbox-label > z-icon {\n cursor: default;\n fill: var(--color-disabled01);\n}\n","import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Listen,\n Method,\n Prop,\n State,\n h,\n} from \"@stencil/core\";\nimport {Fragment, JSXBase} from \"@stencil/core/internal\";\nimport {ControlSize, InputStatus, InputType, LabelPosition} from \"../../beans\";\nimport {boolean, randomId} from \"../../utils/utils\";\n\n@Component({\n tag: \"z-input\",\n styleUrls: [\"styles-general.css\", \"styles-text.css\", \"styles-textarea.css\", \"styles-checkbox-radio.css\"],\n shadow: false,\n scoped: true,\n})\nexport class ZInput implements ComponentInterface {\n @Element() hostElement: HTMLZInputElement;\n\n /* the id of the input element /\n @Prop()\n htmlid = `id-${randomId()}`;\n\n /* Input type /\n @Prop()\n type: InputType = InputType.TEXT;\n\n /* the input `name` attribute /\n @Prop()\n name?: string;\n\n /* the input label /\n @Prop()\n label?: string;\n\n /* the input `aria-label` /\n @Prop()\n htmlAriaLabel?: string;\n\n /* the input `aria-expanded`: available for text, password, number, email /\n @Prop()\n htmlAriaExpanded?: string;\n\n /* the input `aria-controls` (optional): available for text, password, number, email /\n @Prop()\n htmlAriaControls?: string;\n\n /* the input `aria-autocomplete` (optional): available for text, password, number, email /\n @Prop()\n htmlAriaAutocomplete?: string;\n\n /* the input `aria-activedescendant` (optional): available for text, password, number, email /\n @Prop()\n htmlAriaActivedescendant?: string;\n\n /* the input `aria-describedby` (optional) /\n @Prop()\n htmlAriaDescribedby?: string;\n\n /* the input `aria-labelledby` (optional) /\n @Prop()\n htmlAriaLabelledby?: string;\n\n /* the input value /\n @Prop({mutable: true})\n value?: string;\n\n /* the input is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* the input is readonly /\n @Prop()\n readonly?: boolean = false;\n\n /* the input is required (optional): available for text, password, number, email, textarea, checkbox /\n @Prop()\n required?: boolean = false;\n\n /* checked: available for checkbox, radio /\n @Prop({mutable: true})\n checked?: boolean = false;\n\n /* the input placeholder (optional) /\n @Prop()\n placeholder?: string;\n\n /* the input html title (optional) /\n @Prop()\n htmltitle?: string;\n\n /* the input status (optional): available for text, password, number, email, textarea /\n @Prop()\n status?: InputStatus;\n\n /* input helper message (optional): available for text, password, number, email, textarea - if set to `false` message won't be displayed /\n @Prop()\n message?: string \| boolean = true;\n\n /* the input label position: available for checkbox, radio /\n @Prop()\n labelPosition?: LabelPosition = LabelPosition.RIGHT;\n\n /* the input has autocomplete option (optional): available for text, password, number, email /\n @Prop()\n autocomplete?: string;\n\n /* the input `role` /\n @Prop()\n htmlRole?: string;\n\n /* render clear icon when typing (optional): available for text /\n @Prop()\n hasclearicon?: boolean = true;\n\n /* render icon (optional): available for text /\n @Prop()\n icon?: string;\n\n /* min number value (optional): available for number /\n @Prop()\n min?: number;\n\n /* Min length value (optional): available for text /\n @Prop()\n minlength?: number;\n\n /* max number value (optional): available for number /\n @Prop()\n max?: number;\n\n /* Max length value (optional): available for text /\n @Prop()\n maxlength?: number;\n\n /* step number value (optional): available for number /\n @Prop()\n step?: number;\n\n /* pattern value (optional): available for tel, text, search, url, email, password/\n @Prop()\n pattern?: string;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop({reflect: true})\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n isTyping = false;\n\n @State()\n passwordHidden = true;\n\n private timer;\n\n private typingtimeout = 300;\n\n private inputRef: HTMLInputElement;\n\n @Listen(\"inputCheck\", {target: \"document\"})\n inputCheckListener(e: CustomEvent): void {\n const data = e.detail;\n switch (this.type) {\n case InputType.RADIO:\n if (data.type === InputType.RADIO && data.name === this.name && data.id !== this.htmlid) {\n this.checked = false;\n }\n break;\n }\n }\n\n /* get checked status /\n @Method()\n async isChecked(): Promise<boolean> {\n switch (this.type) {\n case InputType.CHECKBOX:\n case InputType.RADIO:\n return this.checked;\n default:\n console.warn(\"`isChecked` method is only available for type `checkbox` and `radio`\");\n\n return false;\n }\n }\n\n /* Emitted on input value change, returns value, validity /\n @Event()\n inputChange: EventEmitter;\n\n private emitInputChange(value: string): void {\n if (!this.isTyping) {\n this.emitStartTyping();\n }\n\n let validity: ValidityState;\n if (this.type === InputType.TEXTAREA) {\n validity = this.getValidity(\"textarea\");\n } else {\n validity = this.getValidity(\"input\");\n }\n this.value = value;\n this.inputChange.emit({value, validity});\n\n clearTimeout(this.timer);\n this.timer = setTimeout(() => {\n this.emitStopTyping(this.value, validity);\n }, this.typingtimeout);\n }\n\n /* Emitted when user starts typing /\n @Event()\n startTyping: EventEmitter;\n\n private emitStartTyping(): void {\n this.isTyping = true;\n this.startTyping.emit();\n }\n\n /* Emitted when user stops typing, returns value, validity /\n @Event()\n stopTyping: EventEmitter;\n\n private emitStopTyping(value: string, validity: ValidityState): void {\n this.isTyping = false;\n this.stopTyping.emit({\n value: value,\n validity: validity,\n });\n }\n\n /* Emitted on checkbox check/uncheck, returns id, checked, type, name, value, validity /\n @Event()\n inputCheck: EventEmitter;\n\n private emitInputCheck(checked: boolean): void {\n this.inputCheck.emit({\n id: this.htmlid,\n checked: checked,\n type: this.type,\n name: this.name,\n value: this.value,\n validity: this.getValidity(\"input\"),\n });\n }\n\n /* Emitted on input focus /\n @Event()\n inputFocus: EventEmitter;\n\n private emitInputFocus(): void {\n this.inputFocus.emit({id: this.htmlid});\n }\n\n /* Emitted on input blur /\n @Event()\n inputBlur: EventEmitter;\n\n private emitInputBlur(): void {\n this.inputBlur.emit({id: this.htmlid});\n }\n\n private getValidity(type: string): ValidityState {\n const input = this.hostElement.querySelector(type) as HTMLInputElement;\n\n return input.validity;\n }\n\n / START text/password/email/number /\n\n private getTextAttributes(): JSXBase.InputHTMLAttributes<HTMLInputElement \| HTMLTextAreaElement> {\n return {\n id: this.htmlid,\n name: this.name,\n placeholder: this.placeholder,\n value: this.value,\n disabled: this.disabled,\n readonly: this.readonly,\n required: this.required,\n title: this.htmltitle,\n minlength: this.minlength,\n maxlength: this.maxlength,\n class: {\n [`input-${this.status}`]: !!this.status,\n },\n autocomplete: this.autocomplete,\n onInput: (e: InputEvent) => this.emitInputChange((e.target as HTMLInputElement).value),\n };\n }\n\n private getNumberAttributes(type: InputType): JSXBase.InputHTMLAttributes<HTMLInputElement> {\n if (type != InputType.NUMBER) {\n return;\n }\n\n return {\n min: this.min,\n max: this.max,\n step: this.step,\n };\n }\n\n private getPatternAttribute(type: InputType): JSXBase.InputHTMLAttributes<HTMLInputElement> {\n if (\n type != InputType.PASSWORD &&\n type != InputType.TEXT &&\n type != InputType.TEL &&\n type != InputType.SEARCH &&\n type != InputType.URL &&\n type != InputType.EMAIL\n ) {\n return;\n }\n\n return {\n pattern: this.pattern,\n };\n }\n\n private inputHasMessage(): boolean {\n if (typeof boolean(this.message) === \"boolean\") {\n return false;\n }\n\n return true;\n }\n\n private getAriaAttributes(): Record<string, string \| undefined> {\n return {\n \"role\": this.htmlRole \|\| undefined,\n \"aria-describedby\": this.htmlAriaDescribedby \|\| undefined,\n \"aria-labelledby\": this.htmlAriaLabelledby \|\| undefined,\n };\n }\n\n private getTextAriaAttributes(): Record<string, string \| undefined> {\n return {\n ...this.getAriaAttributes(),\n \"aria-expanded\": this.htmlAriaExpanded \|\| undefined,\n \"aria-controls\": this.htmlAriaControls \|\| undefined,\n \"aria-autocomplete\": this.htmlAriaAutocomplete \|\| undefined,\n \"aria-activedescendant\": this.htmlAriaActivedescendant \|\| undefined,\n \"aria-describedby\":\n this.htmlAriaDescribedby \|\| this.inputHasMessage()\n ? this.htmlAriaDescribedby \|\| `${this.htmlid}-message`\n : undefined,\n \"aria-invalid\": this.status === InputStatus.ERROR ? \"true\" : undefined,\n \"aria-required\": this.required ? \"true\" : undefined,\n };\n }\n\n private getFocusBlurAttributes(): JSXBase.InputHTMLAttributes<HTMLInputElement \| HTMLTextAreaElement> {\n return {\n onFocus: () => this.emitInputFocus(),\n onBlur: () => this.emitInputBlur(),\n };\n }\n\n private renderInputText(type: InputType = InputType.TEXT): HTMLDivElement {\n const attr = {\n ...this.getTextAttributes(),\n ...this.getNumberAttributes(type),\n ...this.getPatternAttribute(type),\n ...this.getTextAriaAttributes(),\n ...this.getFocusBlurAttributes(),\n \"aria-label\": this.htmlAriaLabel \|\| undefined,\n };\n\n attr.class = {\n ...(attr.class as {[className: string]: boolean}),\n \"has-icon\": !!this.icon \|\| type === InputType.PASSWORD,\n \"has-clear-icon\": this.hasclearicon && type != InputType.NUMBER,\n };\n\n return (\n <div class=\"text-wrapper\">\n {this.renderLabel()}\n <div>\n <input\n {...attr}\n type={type === InputType.PASSWORD && !this.passwordHidden ? InputType.TEXT : type}\n ref={(el) => (this.inputRef = el)}\n />\n {this.renderIcons()}\n </div>\n {this.renderMessage()}\n </div>\n );\n }\n\n private renderLabel(): HTMLLabelElement {\n if (!this.label) {\n return;\n }\n\n return (\n <label\n class=\"z-label body-5-sb\"\n id={`${this.htmlid}_label`}\n htmlFor={this.htmlid}\n >\n {this.label}\n </label>\n );\n }\n\n private renderIcons(): HTMLSpanElement {\n return (\n <span class=\"icons-wrapper\">\n {this.renderResetIcon()}\n {this.renderIcon()}\n </span>\n );\n }\n\n private renderIcon(): HTMLButtonElement {\n if (this.type === InputType.PASSWORD) {\n return this.renderShowHidePassword();\n }\n\n if (!this.icon) {\n return;\n }\n\n return (\n <z-icon\n name={this.icon}\n class={{[this.size]: true, \"input-icon\": true}}\n />\n );\n }\n\n private renderResetIcon(): HTMLButtonElement {\n let hidden = false;\n if (!this.hasclearicon \|\| !this.value \|\| this.disabled \|\| this.readonly \|\| this.type == InputType.NUMBER) {\n hidden = true;\n }\n\n return (\n <button\n type=\"button\"\n class={{\"reset-icon\": true, \"input-icon\": true, hidden}}\n aria-label=\"cancella il contenuto dell'input\"\n onClick={() => {\n this.inputRef.value = \"\";\n this.emitInputChange(\"\");\n this.inputRef.focus();\n }}\n >\n <z-icon\n name=\"multiply\"\n class={this.size}\n />\n </button>\n );\n }\n\n private renderShowHidePassword(): HTMLButtonElement {\n return (\n <button\n type=\"button\"\n class=\"input-icon toggle-password-icon\"\n disabled={this.disabled}\n aria-label=\"mostra password\"\n aria-pressed={!this.passwordHidden ? \"true\" : \"false\"}\n onClick={() => (this.passwordHidden = !this.passwordHidden)}\n >\n <z-icon\n name={this.passwordHidden ? \"view-filled\" : \"view-off-filled\"}\n class={this.size}\n />\n </button>\n );\n }\n\n private renderMessage(): HTMLZInputMessageElement {\n if (boolean(this.message) === false) {\n return;\n }\n\n return (\n <z-input-message\n html-id={`${this.htmlid}-message`}\n message={boolean(this.message) === true ? undefined : (this.message as string)}\n status={this.status}\n class={this.size}\n disabled={this.disabled}\n />\n );\n }\n\n / END text/password/email/number /\n\n / START textarea /\n\n private renderTextarea(): HTMLDivElement {\n const attributes = this.getTextAttributes();\n const ariaAttributes = this.getTextAriaAttributes();\n\n return (\n <Fragment>\n {this.renderLabel()}\n <div\n class={{\n ...(attributes.class as {[className: string]: boolean}),\n \"textarea-wrapper\": true,\n \"readonly\": !!attributes.readonly,\n }}\n >\n <textarea\n {...attributes}\n {...ariaAttributes}\n class={{\n ...(attributes.class as {[className: string]: boolean}),\n \"z-scrollbar\": true,\n }}\n aria-label={this.htmlAriaLabel \|\| undefined}\n ></textarea>\n </div>\n {this.renderMessage()}\n </Fragment>\n );\n }\n\n / END textarea /\n\n private handleCheck(ev: Event): void {\n this.checked = (ev.target as HTMLInputElement).checked;\n this.emitInputCheck(this.checked);\n }\n\n / START checkbox /\n private renderCheckbox(): HTMLDivElement {\n const ariaRequired = this.required ? {\"aria-required\": \"true\"} : {};\n\n return (\n <div class=\"checkbox-wrapper\">\n <input\n id={this.htmlid}\n type=\"checkbox\"\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n readonly={this.readonly}\n required={this.required}\n onChange={this.handleCheck.bind(this)}\n value={this.value}\n {...ariaRequired}\n {...this.getAriaAttributes()}\n {...this.getFocusBlurAttributes()}\n />\n\n <label\n htmlFor={this.htmlid}\n class={{\n \"checkbox-label\": true,\n \"after\": this.labelPosition === LabelPosition.RIGHT,\n \"before\": this.labelPosition === LabelPosition.LEFT,\n }}\n >\n <z-icon\n name={this.checked ? \"checkbox-checked\" : \"checkbox\"}\n class={this.size}\n />\n {this.label && <span innerHTML={this.label}></span>}\n </label>\n </div>\n );\n }\n\n / END checkbox /\n\n / START radio /\n private renderRadio(): HTMLDivElement {\n const ariaRequired = this.required ? {\"aria-required\": \"true\"} : {};\n\n return (\n <div class=\"radio-wrapper\">\n <input\n id={this.htmlid}\n type=\"radio\"\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n readonly={this.readonly}\n required={this.required}\n onChange={this.handleCheck.bind(this)}\n value={this.value}\n {...this.getAriaAttributes()}\n {...this.getFocusBlurAttributes()}\n {...ariaRequired}\n />\n\n <label\n htmlFor={this.htmlid}\n class={{\n \"radio-label\": true,\n \"after\": this.labelPosition === LabelPosition.RIGHT,\n \"before\": this.labelPosition === LabelPosition.LEFT,\n }}\n >\n <z-icon\n name={this.checked ? \"radio-button-checked\" : \"radio-button\"}\n class={this.size}\n />\n {this.label && <span innerHTML={this.label} />}\n </label>\n </div>\n );\n }\n / END radio */\n\n render(): HTMLInputElement \| HTMLDivElement {\n switch (this.type) {\n case InputType.TEXTAREA:\n return this.renderTextarea();\n case InputType.CHECKBOX:\n return this.renderCheckbox();\n case InputType.RADIO:\n return this.renderRadio();\n case InputType.TEXT:\n default:\n return this.renderInputText(this.type);\n }\n }\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["stylesGeneralCss","stylesTextCss","stylesTextareaCss","stylesCheckboxRadioCss","ZInput","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","htmlid","randomId","type","InputType","TEXT","disabled","readonly","required","checked","indeterminate","message","labelPosition","LabelPosition","RIGHT","hasclearicon","size","ControlSize","BIG","isTyping","passwordHidden","typingtimeout","inputCheckListener","e","data","detail","RADIO","name","id","watchIndeterminate","syncCheckboxIndeterminate","CHECKBOX","inputRef","isChecked","console","warn","emitInputChange","value","emitStartTyping","validity","TEXTAREA","getValidity","inputChange","emit","clearTimeout","timer","setTimeout","emitStopTyping","startTyping","stopTyping","emitInputCheck","inputCheck","emitInputFocus","inputFocus","emitInputBlur","inputBlur","input","hostElement","querySelector","getTextAttributes","placeholder","title","htmltitle","minlength","maxlength","class","status","autocomplete","onInput","target","getNumberAttributes","NUMBER","min","max","step","getPatternAttribute","PASSWORD","TEL","SEARCH","URL","EMAIL","pattern","inputHasMessage","boolean","getAriaAttributes","role","htmlRole","undefined","htmlAriaDescribedby","htmlAriaLabelledby","getTextAriaAttributes","Object","assign","htmlAriaExpanded","htmlAriaControls","htmlAriaAutocomplete","htmlAriaActivedescendant","InputStatus","ERROR","getFocusBlurAttributes","onFocus","onBlur","renderInputText","attr","htmlAriaLabel","icon","h","renderLabel","ref","el","renderIcons","renderMessage","label","htmlFor","renderResetIcon","renderIcon","renderShowHidePassword","hidden","onClick","focus","renderTextarea","attributes","ariaAttributes","Fragment","handleCheck","ev","renderCheckbox","ariaRequired","onChange","bind","after","before","LEFT","innerHTML","renderRadio","render"],"sources":["src/components/z-input/styles-general.css?tag=z-input&encapsulation=scoped","src/components/z-input/styles-text.css?tag=z-input&encapsulation=scoped","src/components/z-input/styles-textarea.css?tag=z-input&encapsulation=scoped","src/components/z-input/styles-checkbox-radio.css?tag=z-input&encapsulation=scoped","src/components/z-input/index.tsx"],"sourcesContent":[":host {\n display: inline-block;\n width: inherit;\n}\n\n:host * {\n box-sizing: border-box;\n}\n\n/* GENERAL /\ninput::-ms-clear,\ninput::-ms-reveal {\n display: none;\n}\n\ninput[type=\"search\"]::-webkit-search-decoration,\ninput[type=\"search\"]::-webkit-search-cancel-button,\ninput[type=\"search\"]::-webkit-search-results-button,\ninput[type=\"search\"]::-webkit-search-results-decoration {\n display: none;\n}\n\ninput,\ntextarea {\n background: var(--color-form-background);\n fill: var(--color-form-default-icon);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-3);\n font-weight: var(--font-rg);\n outline: none;\n}\n\ninput,\n.textarea-wrapper {\n border: var(--border-size-small) solid var(--color-form-surface04);\n border-radius: var(--border-radius-small);\n color: var(--color-form-default-text);\n}\n\n:host([size=\"small\"]) input,\n:host([size=\"small\"]) textarea,\n:host([size=\"x-small\"]) input,\n:host([size=\"x-small\"]) textarea {\n font-size: var(--font-size-2);\n}\n\n:host.cursor-select input {\n cursor: pointer;\n}\n\n/ HOVER /\ninput:not([readonly]):hover,\n.textarea-wrapper:not(.readonly):hover {\n outline: var(--border-size-medium) solid var(--color-surface04);\n outline-offset: -2px;\n}\n\n/ FOCUS /\n:host:not(.active-select) input:focus:focus-visible,\n:host:not([readonly=\"true\"]) .textarea-wrapper:focus-within {\n border-color: var(--color-form-active-primary);\n box-shadow: var(--shadow-focus-primary);\n color: var(--color-form-active-primary);\n}\n\n:host input:focus:focus-visible:hover,\n.textarea-wrapper:not(.readonly):focus-within:hover {\n outline-color: var(--color-form-active-primary);\n}\n\n:host input:focus:focus-visible + .icons-wrapper {\n fill: var(--color-form-active-primary);\n}\n\n:host.active-select input {\n border: var(--border-size-small) solid var(--color-form-active-primary);\n}\n\n:host.cursor-select input:focus:focus-visible {\n box-shadow: var(--shadow-focus-primary);\n}\n\n:host input[readonly]:focus:focus-visible {\n border-color: var(--color-form-surface03);\n box-shadow: none;\n}\n\n/ STATUSES (success, warning, error) /\n.input-success {\n border-color: var(--color-form-success01);\n background: var(--color-form-inverse-success);\n}\n\n.input-success:focus:focus-visible + .icons-wrapper,\n.input-success + .icons-wrapper {\n fill: var(--color-form-success01);\n}\n\n.input-error {\n border-color: var(--color-form-hover-error);\n background: var(--color-form-inverse-error);\n}\n\n.input-error:focus:focus-visible + .icons-wrapper,\n.input-error + .icons-wrapper {\n fill: var(--color-form-hover-error);\n}\n\n.input-warning {\n border-color: var(--color-form-hover-warning);\n background: var(--color-form-inverse-warning);\n}\n\n.input-warning:focus:focus-visible + .icons-wrapper,\n.input-warning + .icons-wrapper {\n fill: var(--color-form-hover-warning);\n}\n\n:is(.input-success, .input-error, .input-warning):focus:focus-visible {\n color: var(--color-form-default-text);\n}\n\n/ READONLY /\n:host:not(.active-select) input[readonly],\n.textarea-wrapper.readonly {\n border-color: var(--color-form-surface03);\n fill: var(--color-form-disabled01-icon);\n pointer-events: none;\n}\n\n/ DISABLED /\n:host([disabled]:not([disabled=\"false\"])) input,\n:host([disabled]:not([disabled=\"false\"])) .textarea-wrapper,\n:host([disabled]:not([disabled=\"false\"])) z-icon {\n border-color: var(--color-form-disabled03);\n box-shadow: none;\n color: var(--color-form-disabled-text);\n fill: var(--color-form-disabled01-icon);\n pointer-events: none;\n}\n\n:host([disabled]:not([disabled=\"false\"])) input:hover {\n border-width: var(--border-size-small);\n}\n\n/ PLACEHOLDER /\ninput::placeholder,\ntextarea::placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n::-webkit-textarea-placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n:-ms-textarea-placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n::placeholder {\n color: var(--color-form-placeholder-text);\n}\n\n:host([disabled]:not([disabled=\"false\"])) label.z-label {\n color: var(--color-disabled03);\n}\n",".text-wrapper > div {\n position: relative;\n z-index: 1;\n fill: var(--color-form-default-icon);\n}\n\n.text-wrapper > div > input {\n width: 100%;\n height: calc(var(--space-unit) 5.5);\n box-sizing: border-box;\n padding: 0 calc(var(--space-unit) * 1.5);\n margin: 0;\n}\n\n:host([size=\"small\"]) .text-wrapper > div > input {\n height: calc(var(--space-unit) * 4.5);\n}\n\n:host([size=\"x-small\"]) .text-wrapper > div > input {\n height: calc(var(--space-unit) * 4);\n}\n\n.text-wrapper > div > input.has-icon,\n.text-wrapper > div > input.has-clear-icon {\n padding-right: calc(var(--space-unit) * 5.25);\n}\n\n.text-wrapper > div > input.has-icon.has-clear-icon {\n padding-right: calc(var(--space-unit) * 8);\n}\n\n.text-wrapper .icons-wrapper {\n position: absolute;\n z-index: 2;\n top: 50%;\n right: calc(var(--space-unit) * 1.5);\n display: flex;\n pointer-events: none;\n transform: translateY(-50%);\n}\n\n.text-wrapper .icons-wrapper > button.input-icon {\n display: flex;\n padding: 0;\n border: 0;\n background: none;\n color: inherit;\n font: inherit;\n pointer-events: initial;\n}\n\n.text-wrapper .icons-wrapper > .input-icon + .input-icon {\n margin-left: calc(var(--space-unit) * 0.5);\n}\n\n.text-wrapper .icons-wrapper > button.input-icon.hidden {\n display: none;\n}\n\n.text-wrapper .icons-wrapper > button.reset-icon,\n.text-wrapper .icons-wrapper > button.toggle-password-icon {\n display: flex;\n min-width: 24px;\n min-height: 24px;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n}\n\n.text-wrapper .icons-wrapper > .input-icon {\n --z-icon-width: 18px;\n --z-icon-height: 18px;\n\n display: block;\n}\n\n.text-wrapper .icons-wrapper > .input-icon.small,\n.text-wrapper .icons-wrapper > .input-icon.x-small {\n --z-icon-width: 16px;\n --z-icon-height: 16px;\n}\n\n.text-wrapper .icons-wrapper > button.input-icon:focus {\n box-shadow: var(--shadow-focus-primary);\n outline: none !important;\n}\n\n/* stylelint-disable property-no-vendor-prefix /\n.text-wrapper > div > input:-webkit-autofill {\n -webkit-box-shadow: 0 0 0 1000px #fff inset;\n -webkit-text-fill-color: currentcolor;\n}\n",".textarea-wrapper {\n width: 100%;\n height: 100%;\n padding: calc(var(--space-unit) 1.5);\n}\n\n.textarea-wrapper:not(.input-error, .input-success, .input-warning) {\n background-color: var(--color-form-background);\n}\n\ntextarea {\n width: 100%;\n min-height: 132px;\n padding: 0;\n border: none;\n margin: 0;\n color: currentcolor;\n resize: none;\n}\n",".radio-wrapper,\n.checkbox-wrapper {\n position: relative;\n display: inline-flex;\n flex-direction: row;\n align-items: center;\n color: var(--color-default-text);\n fill: var(--color-primary01-icon);\n font-family: var(--font-family-sans);\n}\n\n.radio-wrapper:hover,\n.checkbox-wrapper:hover {\n color: var(--color-hover-primary);\n fill: var(--color-hover-primary-icon);\n}\n\n.radio-wrapper > input,\n.checkbox-wrapper > input {\n position: absolute;\n z-index: -1;\n opacity: 0;\n pointer-events: none;\n}\n\n.radio-wrapper .radio-label,\n.checkbox-wrapper .checkbox-label {\n display: inline-flex;\n min-height: 24px;\n align-items: center;\n padding: 3px 0;\n margin: 0;\n color: inherit;\n font-family: inherit;\n font-size: inherit;\n font-weight: inherit;\n line-height: 1;\n text-transform: inherit;\n}\n\n.radio-wrapper input:not(:disabled) + .radio-label,\n.checkbox-wrapper input:not(:disabled) + .checkbox-label {\n cursor: pointer;\n}\n\n.radio-wrapper .radio-label z-icon,\n.checkbox-wrapper .checkbox-label z-icon {\n cursor: pointer;\n fill: inherit;\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label z-icon,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label z-icon {\n --z-icon-width: 16px;\n --z-icon-height: 16px;\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label {\n font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) .radio-wrapper .radio-label z-icon,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label z-icon {\n --z-icon-width: 14px;\n --z-icon-height: 14px;\n}\n\n:host([size=\"x-small\"]) .radio-wrapper .radio-label,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label {\n font-size: var(--font-size-1);\n}\n\n.radio-wrapper .radio-label.after,\n.checkbox-wrapper .checkbox-label.after {\n flex-direction: row;\n}\n\n.radio-wrapper .radio-label.before,\n.checkbox-wrapper .checkbox-label.before {\n flex-direction: row-reverse;\n}\n\n.radio-wrapper .radio-label.after > span,\n.checkbox-wrapper .checkbox-label.after > span {\n margin-left: var(--space-unit);\n}\n\n.radio-wrapper .radio-label.before > span,\n.checkbox-wrapper .checkbox-label.before > span {\n margin-right: var(--space-unit);\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label.after > span,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label.after > span,\n:host([size=\"x-small\"]) .radio-wrapper .radio-label.after > span,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label.after > span {\n margin-left: calc(var(--space-unit) * 0.5);\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label.before > span,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label.before > span,\n:host([size=\"x-small\"]) .radio-wrapper .radio-label.before > span,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label.before > span {\n margin-right: calc(var(--space-unit) * 0.5);\n}\n\n/* focus /\n.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon {\n border-radius: 50%;\n}\n\n.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {\n border-radius: var(--border-radius-small);\n}\n\n.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon,\n.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {\n box-shadow: var(--shadow-focus-primary);\n}\n\n/ disabled /\n.radio-wrapper > input:disabled + .radio-label,\n.checkbox-wrapper > input:disabled + .checkbox-label {\n color: var(--color-disabled03);\n}\n\n.radio-wrapper > input:disabled + .radio-label > z-icon,\n.checkbox-wrapper > input:disabled + .checkbox-label > z-icon {\n cursor: default;\n fill: var(--color-disabled03-icon);\n}\n","import {\n Component,\n ComponentInterface,\n Element,\n Event,\n EventEmitter,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n h,\n} from \"@stencil/core\";\nimport {Fragment, JSXBase} from \"@stencil/core/internal\";\nimport {ControlSize, InputStatus, InputType, LabelPosition} from \"../../beans\";\nimport {boolean, randomId} from \"../../utils/utils\";\n\n@Component({\n tag: \"z-input\",\n styleUrls: [\"styles-general.css\", \"styles-text.css\", \"styles-textarea.css\", \"styles-checkbox-radio.css\"],\n shadow: false,\n scoped: true,\n})\nexport class ZInput implements ComponentInterface {\n @Element() hostElement: HTMLZInputElement;\n\n /* the id of the input element /\n @Prop()\n htmlid = `id-${randomId()}`;\n\n /* Input type /\n @Prop()\n type: InputType = InputType.TEXT;\n\n /* the input `name` attribute /\n @Prop()\n name?: string;\n\n /* the input label /\n @Prop()\n label?: string;\n\n /* the input `aria-label` /\n @Prop()\n htmlAriaLabel?: string;\n\n /* the input `aria-expanded`: available for text, password, number, email /\n @Prop()\n htmlAriaExpanded?: string;\n\n /* the input `aria-controls` (optional): available for text, password, number, email /\n @Prop()\n htmlAriaControls?: string;\n\n /* the input `aria-autocomplete` (optional): available for text, password, number, email /\n @Prop()\n htmlAriaAutocomplete?: string;\n\n /* the input `aria-activedescendant` (optional): available for text, password, number, email /\n @Prop()\n htmlAriaActivedescendant?: string;\n\n /* the input `aria-describedby` (optional) /\n @Prop()\n htmlAriaDescribedby?: string;\n\n /* the input `aria-labelledby` (optional) /\n @Prop()\n htmlAriaLabelledby?: string;\n\n /* the input value /\n @Prop({mutable: true})\n value?: string;\n\n /* the input is disabled /\n @Prop({reflect: true})\n disabled?: boolean = false;\n\n /* the input is readonly /\n @Prop()\n readonly?: boolean = false;\n\n /* the input is required (optional): available for text, password, number, email, textarea, checkbox /\n @Prop()\n required?: boolean = false;\n\n /* checked: available for checkbox, radio /\n @Prop({mutable: true})\n checked?: boolean = false;\n\n /* indeterminate: available for checkbox /\n @Prop({mutable: true})\n indeterminate?: boolean = false;\n\n /* the input placeholder (optional) /\n @Prop()\n placeholder?: string;\n\n /* the input html title (optional) /\n @Prop()\n htmltitle?: string;\n\n /* the input status (optional): available for text, password, number, email, textarea /\n @Prop()\n status?: InputStatus;\n\n /* input helper message (optional): available for text, password, number, email, textarea - if set to `false` message won't be displayed /\n @Prop()\n message?: string \| boolean = true;\n\n /* the input label position: available for checkbox, radio /\n @Prop()\n labelPosition?: LabelPosition = LabelPosition.RIGHT;\n\n /* the input has autocomplete option (optional): available for text, password, number, email /\n @Prop()\n autocomplete?: string;\n\n /* the input `role` /\n @Prop()\n htmlRole?: string;\n\n /* render clear icon when typing (optional): available for text /\n @Prop()\n hasclearicon?: boolean = true;\n\n /* render icon (optional): available for text /\n @Prop()\n icon?: string;\n\n /* min number value (optional): available for number /\n @Prop()\n min?: number;\n\n /* Min length value (optional): available for text /\n @Prop()\n minlength?: number;\n\n /* max number value (optional): available for number /\n @Prop()\n max?: number;\n\n /* Max length value (optional): available for text /\n @Prop()\n maxlength?: number;\n\n /* step number value (optional): available for number /\n @Prop()\n step?: number;\n\n /* pattern value (optional): available for tel, text, search, url, email, password/\n @Prop()\n pattern?: string;\n\n /* Available sizes: `big`, `small` and `x-small`. Defaults to `big`. /\n @Prop({reflect: true})\n size?: ControlSize = ControlSize.BIG;\n\n @State()\n isTyping = false;\n\n @State()\n passwordHidden = true;\n\n private timer;\n\n private typingtimeout = 300;\n\n private inputRef: HTMLInputElement;\n\n @Listen(\"inputCheck\", {target: \"document\"})\n inputCheckListener(e: CustomEvent): void {\n const data = e.detail;\n switch (this.type) {\n case InputType.RADIO:\n if (data.type === InputType.RADIO && data.name === this.name && data.id !== this.htmlid) {\n this.checked = false;\n }\n break;\n }\n }\n\n @Watch(\"indeterminate\")\n watchIndeterminate(): void {\n this.syncCheckboxIndeterminate();\n }\n\n private syncCheckboxIndeterminate(): void {\n if (this.type !== InputType.CHECKBOX \|\| !this.inputRef) {\n return;\n }\n\n this.inputRef.indeterminate = !!this.indeterminate;\n }\n\n /* get checked status /\n @Method()\n async isChecked(): Promise<boolean> {\n switch (this.type) {\n case InputType.CHECKBOX:\n case InputType.RADIO:\n return this.checked;\n default:\n console.warn(\"`isChecked` method is only available for type `checkbox` and `radio`\");\n\n return false;\n }\n }\n\n /* Emitted on input value change, returns value, validity /\n @Event()\n inputChange: EventEmitter;\n\n private emitInputChange(value: string): void {\n if (!this.isTyping) {\n this.emitStartTyping();\n }\n\n let validity: ValidityState;\n if (this.type === InputType.TEXTAREA) {\n validity = this.getValidity(\"textarea\");\n } else {\n validity = this.getValidity(\"input\");\n }\n this.value = value;\n this.inputChange.emit({value, validity});\n\n clearTimeout(this.timer);\n this.timer = setTimeout(() => {\n this.emitStopTyping(this.value, validity);\n }, this.typingtimeout);\n }\n\n /* Emitted when user starts typing /\n @Event()\n startTyping: EventEmitter;\n\n private emitStartTyping(): void {\n this.isTyping = true;\n this.startTyping.emit();\n }\n\n /* Emitted when user stops typing, returns value, validity /\n @Event()\n stopTyping: EventEmitter;\n\n private emitStopTyping(value: string, validity: ValidityState): void {\n this.isTyping = false;\n this.stopTyping.emit({\n value: value,\n validity: validity,\n });\n }\n\n /* Emitted on checkbox check/uncheck, returns id, checked, type, name, value, validity /\n @Event()\n inputCheck: EventEmitter;\n\n private emitInputCheck(checked: boolean): void {\n this.inputCheck.emit({\n id: this.htmlid,\n checked: checked,\n type: this.type,\n name: this.name,\n value: this.value,\n validity: this.getValidity(\"input\"),\n });\n }\n\n /* Emitted on input focus /\n @Event()\n inputFocus: EventEmitter;\n\n private emitInputFocus(): void {\n this.inputFocus.emit({id: this.htmlid});\n }\n\n /* Emitted on input blur /\n @Event()\n inputBlur: EventEmitter;\n\n private emitInputBlur(): void {\n this.inputBlur.emit({id: this.htmlid});\n }\n\n private getValidity(type: string): ValidityState {\n const input = this.hostElement.querySelector(type) as HTMLInputElement;\n\n return input.validity;\n }\n\n / START text/password/email/number /\n\n private getTextAttributes(): JSXBase.InputHTMLAttributes<HTMLInputElement \| HTMLTextAreaElement> {\n return {\n id: this.htmlid,\n name: this.name,\n placeholder: this.placeholder,\n value: this.value,\n disabled: this.disabled,\n readonly: this.readonly,\n required: this.required,\n title: this.htmltitle,\n minlength: this.minlength,\n maxlength: this.maxlength,\n class: {\n [`input-${this.status}`]: !!this.status,\n },\n autocomplete: this.autocomplete,\n onInput: (e: InputEvent) => this.emitInputChange((e.target as HTMLInputElement).value),\n };\n }\n\n private getNumberAttributes(type: InputType): JSXBase.InputHTMLAttributes<HTMLInputElement> {\n if (type != InputType.NUMBER) {\n return;\n }\n\n return {\n min: this.min,\n max: this.max,\n step: this.step,\n };\n }\n\n private getPatternAttribute(type: InputType): JSXBase.InputHTMLAttributes<HTMLInputElement> {\n if (\n type != InputType.PASSWORD &&\n type != InputType.TEXT &&\n type != InputType.TEL &&\n type != InputType.SEARCH &&\n type != InputType.URL &&\n type != InputType.EMAIL\n ) {\n return;\n }\n\n return {\n pattern: this.pattern,\n };\n }\n\n private inputHasMessage(): boolean {\n if (typeof boolean(this.message) === \"boolean\") {\n return false;\n }\n\n return true;\n }\n\n private getAriaAttributes(): Record<string, string \| undefined> {\n return {\n \"role\": this.htmlRole \|\| undefined,\n \"aria-describedby\": this.htmlAriaDescribedby \|\| undefined,\n \"aria-labelledby\": this.htmlAriaLabelledby \|\| undefined,\n };\n }\n\n private getTextAriaAttributes(): Record<string, string \| undefined> {\n return {\n ...this.getAriaAttributes(),\n \"aria-expanded\": this.htmlAriaExpanded \|\| undefined,\n \"aria-controls\": this.htmlAriaControls \|\| undefined,\n \"aria-autocomplete\": this.htmlAriaAutocomplete \|\| undefined,\n \"aria-activedescendant\": this.htmlAriaActivedescendant \|\| undefined,\n \"aria-describedby\":\n this.htmlAriaDescribedby \|\| this.inputHasMessage()\n ? this.htmlAriaDescribedby \|\| `${this.htmlid}-message`\n : undefined,\n \"aria-invalid\": this.status === InputStatus.ERROR ? \"true\" : undefined,\n \"aria-required\": this.required ? \"true\" : undefined,\n };\n }\n\n private getFocusBlurAttributes(): JSXBase.InputHTMLAttributes<HTMLInputElement \| HTMLTextAreaElement> {\n return {\n onFocus: () => this.emitInputFocus(),\n onBlur: () => this.emitInputBlur(),\n };\n }\n\n private renderInputText(type: InputType = InputType.TEXT): HTMLDivElement {\n const attr = {\n ...this.getTextAttributes(),\n ...this.getNumberAttributes(type),\n ...this.getPatternAttribute(type),\n ...this.getTextAriaAttributes(),\n ...this.getFocusBlurAttributes(),\n \"aria-label\": this.htmlAriaLabel \|\| undefined,\n };\n\n attr.class = {\n ...(attr.class as {[className: string]: boolean}),\n \"has-icon\": !!this.icon \|\| type === InputType.PASSWORD,\n \"has-clear-icon\": this.hasclearicon && type != InputType.NUMBER,\n };\n\n return (\n <div class=\"text-wrapper\">\n {this.renderLabel()}\n <div>\n <input\n {...attr}\n type={type === InputType.PASSWORD && !this.passwordHidden ? InputType.TEXT : type}\n ref={(el) => (this.inputRef = el)}\n />\n {this.renderIcons()}\n </div>\n {this.renderMessage()}\n </div>\n );\n }\n\n private renderLabel(): HTMLLabelElement {\n if (!this.label) {\n return;\n }\n\n return (\n <label\n class=\"z-label body-5-sb\"\n id={`${this.htmlid}_label`}\n htmlFor={this.htmlid}\n >\n {this.label}\n </label>\n );\n }\n\n private renderIcons(): HTMLSpanElement {\n return (\n <span class=\"icons-wrapper\">\n {this.renderResetIcon()}\n {this.renderIcon()}\n </span>\n );\n }\n\n private renderIcon(): HTMLButtonElement {\n if (this.type === InputType.PASSWORD) {\n return this.renderShowHidePassword();\n }\n\n if (!this.icon) {\n return;\n }\n\n return (\n <z-icon\n name={this.icon}\n class={{[this.size]: true, \"input-icon\": true}}\n />\n );\n }\n\n private renderResetIcon(): HTMLButtonElement {\n let hidden = false;\n if (!this.hasclearicon \|\| !this.value \|\| this.disabled \|\| this.readonly \|\| this.type == InputType.NUMBER) {\n hidden = true;\n }\n\n return (\n <button\n type=\"button\"\n class={{\"reset-icon\": true, \"input-icon\": true, hidden}}\n aria-label=\"cancella il contenuto dell'input\"\n onClick={() => {\n this.inputRef.value = \"\";\n this.emitInputChange(\"\");\n this.inputRef.focus();\n }}\n >\n <z-icon\n name=\"multiply\"\n class={this.size}\n />\n </button>\n );\n }\n\n private renderShowHidePassword(): HTMLButtonElement {\n return (\n <button\n type=\"button\"\n class=\"input-icon toggle-password-icon\"\n disabled={this.disabled}\n aria-label=\"mostra password\"\n aria-pressed={!this.passwordHidden ? \"true\" : \"false\"}\n onClick={() => (this.passwordHidden = !this.passwordHidden)}\n >\n <z-icon\n name={this.passwordHidden ? \"view-filled\" : \"view-off-filled\"}\n class={this.size}\n />\n </button>\n );\n }\n\n private renderMessage(): HTMLZInputMessageElement {\n if (boolean(this.message) === false) {\n return;\n }\n\n return (\n <z-input-message\n html-id={`${this.htmlid}-message`}\n message={boolean(this.message) === true ? undefined : (this.message as string)}\n status={this.status}\n class={this.size}\n disabled={this.disabled}\n />\n );\n }\n\n / END text/password/email/number /\n\n / START textarea /\n\n private renderTextarea(): HTMLDivElement {\n const attributes = this.getTextAttributes();\n const ariaAttributes = this.getTextAriaAttributes();\n\n return (\n <Fragment>\n {this.renderLabel()}\n <div\n class={{\n ...(attributes.class as {[className: string]: boolean}),\n \"textarea-wrapper\": true,\n \"readonly\": !!attributes.readonly,\n }}\n >\n <textarea\n {...attributes}\n {...ariaAttributes}\n class={{\n ...(attributes.class as {[className: string]: boolean}),\n \"z-scrollbar\": true,\n }}\n aria-label={this.htmlAriaLabel \|\| undefined}\n ></textarea>\n </div>\n {this.renderMessage()}\n </Fragment>\n );\n }\n\n / END textarea /\n\n private handleCheck(ev: Event): void {\n if (this.type === InputType.CHECKBOX && this.indeterminate) {\n this.indeterminate = false;\n }\n\n this.checked = (ev.target as HTMLInputElement).checked;\n this.emitInputCheck(this.checked);\n }\n\n / START checkbox /\n private renderCheckbox(): HTMLDivElement {\n const ariaRequired = this.required ? {\"aria-required\": \"true\"} : {};\n\n return (\n <div class=\"checkbox-wrapper\">\n <input\n id={this.htmlid}\n type=\"checkbox\"\n name={this.name}\n checked={this.indeterminate ? false : this.checked}\n disabled={this.disabled}\n readonly={this.readonly}\n required={this.required}\n onChange={this.handleCheck.bind(this)}\n value={this.value}\n {...ariaRequired}\n {...this.getAriaAttributes()}\n {...this.getFocusBlurAttributes()}\n ref={(el) => {\n this.inputRef = el;\n this.syncCheckboxIndeterminate();\n }}\n />\n\n <label\n htmlFor={this.htmlid}\n class={{\n \"checkbox-label\": true,\n \"after\": this.labelPosition === LabelPosition.RIGHT,\n \"before\": this.labelPosition === LabelPosition.LEFT,\n }}\n >\n <z-icon\n name={this.indeterminate ? \"indeterminated-checkbox\" : this.checked ? \"checkbox-checked\" : \"checkbox\"}\n class={this.size}\n />\n {this.label && <span innerHTML={this.label}></span>}\n </label>\n </div>\n );\n }\n\n / END checkbox /\n\n / START radio /\n private renderRadio(): HTMLDivElement {\n const ariaRequired = this.required ? {\"aria-required\": \"true\"} : {};\n\n return (\n <div class=\"radio-wrapper\">\n <input\n id={this.htmlid}\n type=\"radio\"\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n readonly={this.readonly}\n required={this.required}\n onChange={this.handleCheck.bind(this)}\n value={this.value}\n {...this.getAriaAttributes()}\n {...this.getFocusBlurAttributes()}\n {...ariaRequired}\n />\n\n <label\n htmlFor={this.htmlid}\n class={{\n \"radio-label\": true,\n \"after\": this.labelPosition === LabelPosition.RIGHT,\n \"before\": this.labelPosition === LabelPosition.LEFT,\n }}\n >\n <z-icon\n name={this.checked ? \"radio-button-checked\" : \"radio-button\"}\n class={this.size}\n />\n {this.label && <span innerHTML={this.label} />}\n </label>\n </div>\n );\n }\n / END radio */\n\n render(): HTMLInputElement \| HTMLDivElement {\n switch (this.type) {\n case InputType.TEXTAREA:\n return this.renderTextarea();\n case InputType.CHECKBOX:\n return this.renderCheckbox();\n case InputType.RADIO:\n return this.renderRadio();\n case InputType.TEXT:\n default:\n return this.renderInputText(this.type);\n }\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components/index7.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as s,h as e,Host as i,transformTag as o}from"@stencil/core/internal/client";import{r as c}from"./utils.js";import{d as a}from"./index3.js";const r=()=>`: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 n=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.htmlId=`id-${c()}`;this.htmlRole="alert";this.statusIcons={success:"checkmark-circle",error:"multiply-circled",warning:"exclamation-circle"}}render(){return e(i,{key:"071b2ab5bc953c916bf735be221071740cf48293",role:this.htmlRole&&this.message&&this.status?this.htmlRole:undefined,id:this.htmlId},this.statusIcons[this.status]&&this.message&&e("z-icon",{key:"3fa408351b28bb7998bb743ebcf05fbebe40ff4e",name:this.statusIcons[this.status]}),e("span",{key:"48d15076d87920c4e5abee2aae5b4e65fb17cefc",innerHTML:this.message}))}static get style(){return r()}},[1,"z-input-message",{message:[1],htmlId:[1,"html-id"],htmlRole:[1,"html-role"],status:[513],disabled:[516]}]);function l(){if(typeof customElements==="undefined"){return}const t=["z-input-message","z-icon"];t.forEach((t=>{switch(t){case"z-input-message":if(!customElements.get(o(t))){customElements.define(o(t),n)}break;case"z-icon":if(!customElements.get(o(t))){a()}break}}))}export{n as Z,l as d};
+import{proxyCustomElement as t,HTMLElement as s,h as i,Host as e,transformTag as c}from"@stencil/core/internal/client";import{r as a}from"./utils.js";import{d as o}from"./index3.js";const r=()=>`: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 n=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.htmlId=`id-${a()}`;this.htmlRole="alert";this.statusIcons={success:"checkmark-circle",error:"multiply-circled",warning:"exclamation-circle"}}render(){return i(e,{key:"acc2b74cb7dfda1d8529785c601d3fd92c2884dc",role:this.htmlRole&&this.message&&this.status?this.htmlRole:undefined,id:this.htmlId},this.statusIcons[this.status]&&this.message&&i("z-icon",{key:"b9532d92b1a91d4218c30ed7bb543964c7822b03",name:this.statusIcons[this.status]}),i("span",{key:"933d1ac0a4194da9ec3f70ca715812d6cf3a7891",innerHTML:this.message}))}static get style(){return r()}},[1,"z-input-message",{message:[1],htmlId:[1,"html-id"],htmlRole:[1,"html-role"],status:[513],disabled:[516]}]);function l(){if(typeof customElements==="undefined"){return}const t=["z-input-message","z-icon"];t.forEach((t=>{switch(t){case"z-input-message":if(!customElements.get(c(t))){customElements.define(c(t),n)}break;case"z-icon":if(!customElements.get(c(t))){o()}break}}))}export{n as Z,l as d};
 //# sourceMappingURL=index7.js.map

package/dist/components/index8.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,h as s,Host as i,transformTag as n}from"@stencil/core/internal/client";import{i as r,m as o}from"./index2.js";const l=()=>`:host{display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}`;const a=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.size=r.MEDIUM;this.listType=o.NONE;this.htmlRole="list"}onRoleChange(e){this.htmlRole=e}setChildrenProps(){Array.from(this.host.children).filter((e=>e.tagName.toLowerCase()==="z-list-element")).forEach(((e,t)=>{e.size=this.size;e.listType=this.listType;e.listElementPosition=`${t+1}`}))}render(){return s(i,{key:"4c8361413296bef0a2156a5429825c156a15c5aa",role:this.htmlRole},s("slot",{key:"f7052cf14285ec66d66da900a7c76ef21c11c243"}))}get host(){return this}static get watchers(){return{role:[{onRoleChange:1}],size:[{setChildrenProps:1}],listType:[{setChildrenProps:1}]}}static get style(){return l()}},[257,"z-list",{size:[513],listType:[513,"list-type"],htmlRole:[32]},undefined,{role:[{onRoleChange:1}],size:[{setChildrenProps:1}],listType:[{setChildrenProps:1}]}]);function c(){if(typeof customElements==="undefined"){return}const e=["z-list"];e.forEach((e=>{switch(e){case"z-list":if(!customElements.get(n(e))){customElements.define(n(e),a)}break}}))}export{a as Z,c as d};
+import{proxyCustomElement as e,HTMLElement as t,h as s,Host as i,transformTag as n}from"@stencil/core/internal/client";import{i as r,m as o}from"./index2.js";const l=()=>`:host{display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}`;const a=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.size=r.MEDIUM;this.listType=o.NONE;this.htmlRole="list"}onRoleChange(e){this.htmlRole=e}setChildrenProps(){Array.from(this.host.children).filter((e=>e.tagName.toLowerCase()==="z-list-element")).forEach(((e,t)=>{e.size=this.size;e.listType=this.listType;e.listElementPosition=`${t+1}`}))}render(){return s(i,{key:"aeaf7ef699223b8f5da68f49d8eb6ea5ea5cebb1",role:this.htmlRole},s("slot",{key:"942882c5e4f03ef9dd64ec255b4cd8b8c5c2c107"}))}get host(){return this}static get watchers(){return{role:[{onRoleChange:1}],size:[{setChildrenProps:1}],listType:[{setChildrenProps:1}]}}static get style(){return l()}},[257,"z-list",{size:[513],listType:[513,"list-type"],htmlRole:[32]},undefined,{role:[{onRoleChange:1}],size:[{setChildrenProps:1}],listType:[{setChildrenProps:1}]}]);function c(){if(typeof customElements==="undefined"){return}const e=["z-list"];e.forEach((e=>{switch(e){case"z-list":if(!customElements.get(n(e))){customElements.define(n(e),a)}break}}))}export{a as Z,c as d};
 //# sourceMappingURL=index8.js.map

package/dist/components/index9.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as n,Host as s,transformTag as a}from"@stencil/core/internal/client";import{j as o,l,D as r,E as c,i as h,m as d,g as u}from"./index2.js";import{d as b}from"./index5.js";import{d as m}from"./index3.js";const f=()=>`: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 p=e(class e extends t{accessibleFocusHandler(e){if(this.listElementId===e.detail){const t=this.host.shadowRoot.getElementById(`z-list-element-id-${e.detail}`);t.focus()}}constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.accessibleFocus=i(this,"accessibleFocus",7);this.ariaDescendantFocus=i(this,"ariaDescendantFocus",7);this.clickItem=i(this,"clickItem",7);this.alignButton=o.LEFT;this.clickable=false;this.dividerColor="color-surface03";this.dividerType=l.NONE;this.dividerSize=r.SMALL;this.expandable=false;this.expandableStyle=c.ACCORDION;this.size=h.MEDIUM;this.color="none";this.disabled=false;this.listElementPosition="0";this.listType=d.NONE;this.htmlTabindex=0;this.showInnerContent=false;this.htmlRole="listitem";this.openElementConfig={accordion:{open:"minus-circled",close:"plus-circled"},menu:{open:"chevron-up",close:"chevron-down"}};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(e){const t=e.code===u.ENTER;switch(e.code){case u.ARROW_DOWN:e.preventDefault();this.accessibleFocus.emit(this.listElementId+1);break;case u.ARROW_UP:e.preventDefault();this.accessibleFocus.emit(this.listElementId-1);break;case u.ENTER:e.preventDefault();this.clickItem.emit(this.listElementId);break}if(!this.expandable||!t){return}this.showInnerContent=!this.showInnerContent}onRoleChange(e){this.htmlRole=e}renderExpandableButton(){if(!this.expandable){return null}return n("z-icon",{name:this.showInnerContent?this.openElementConfig[this.expandableStyle].open:this.openElementConfig[this.expandableStyle].close})}renderExpandedContent(){if(!this.expandable){return null}return n("div",{class:{"z-list-element-inner-container":true,expanded:this.showInnerContent}},n("slot",{name:"inner-content"}))}renderContent(){if(this.listType===d.NONE){return n("slot",null)}if(this.listType===d.ORDERED){return n("div",{class:"z-list-content-container"},n("div",null,this.listElementPosition,". "),n("slot",null))}if(this.listType===d.UNORDERED){return n("div",{class:"z-list-content-container"},n("span",null,"• "),n("slot",null))}}render(){return n(s,{key:"42e6fa098aebb80fd08b32c8180bba0c76b1138d","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.htmlRole},n("div",{key:"22e92a49de4b42710f68ca8e39ca1e90ae207427",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"},n("div",{key:"adca72d657b257755ecda2cbd5b50757cf271cdf",class:"z-list-element-container"},this.renderExpandableButton(),this.renderContent()),this.renderExpandedContent()),this.dividerType===l.ELEMENT&&n("z-divider",{key:"479602f15efb7232a952b1b50db0db5a28f3ba7c",class:{"z-tree-list-divider":this.hasTreeItems},color:this.dividerColor,size:this.dividerSize}))}get host(){return this}static get watchers(){return{role:[{onRoleChange:1}]}}static get style(){return f()}},[257,"z-list-element",{alignButton:[513,"align-button"],clickable:[516],dividerColor:[1,"divider-color"],dividerType:[1,"divider-type"],dividerSize:[1,"divider-size"],expandable:[516],expandableStyle:[1,"expandable-style"],listElementId:[514,"list-element-id"],size:[513],color:[513],disabled:[516],listElementPosition:[513,"list-element-position"],listType:[513,"list-type"],hasTreeItems:[4,"has-tree-items"],htmlTabindex:[2,"html-tabindex"],showInnerContent:[32],htmlRole:[32]},[[4,"accessibleFocus","accessibleFocusHandler"]],{role:[{onRoleChange:1}]}]);function v(){if(typeof customElements==="undefined"){return}const e=["z-list-element","z-divider","z-icon"];e.forEach((e=>{switch(e){case"z-list-element":if(!customElements.get(a(e))){customElements.define(a(e),p)}break;case"z-divider":if(!customElements.get(a(e))){b()}break;case"z-icon":if(!customElements.get(a(e))){m()}break}}))}export{p as Z,v as d};
+import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as n,Host as s,transformTag as a}from"@stencil/core/internal/client";import{j as o,l,D as r,E as c,i as h,m as d,g as u}from"./index2.js";import{d as m}from"./index5.js";import{d as b}from"./index3.js";const f=()=>`: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 p=e(class e extends t{accessibleFocusHandler(e){if(this.listElementId===e.detail){const t=this.host.shadowRoot.getElementById(`z-list-element-id-${e.detail}`);t.focus()}}constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.accessibleFocus=i(this,"accessibleFocus",7);this.ariaDescendantFocus=i(this,"ariaDescendantFocus",7);this.clickItem=i(this,"clickItem",7);this.alignButton=o.LEFT;this.clickable=false;this.dividerColor="color-surface03";this.dividerType=l.NONE;this.dividerSize=r.SMALL;this.expandable=false;this.expandableStyle=c.ACCORDION;this.size=h.MEDIUM;this.color="none";this.disabled=false;this.listElementPosition="0";this.listType=d.NONE;this.htmlTabindex=0;this.showInnerContent=false;this.htmlRole="listitem";this.openElementConfig={accordion:{open:"minus-circled",close:"plus-circled"},menu:{open:"chevron-up",close:"chevron-down"}};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(e){const t=e.code===u.ENTER;switch(e.code){case u.ARROW_DOWN:e.preventDefault();this.accessibleFocus.emit(this.listElementId+1);break;case u.ARROW_UP:e.preventDefault();this.accessibleFocus.emit(this.listElementId-1);break;case u.ENTER:e.preventDefault();this.clickItem.emit(this.listElementId);break}if(!this.expandable||!t){return}this.showInnerContent=!this.showInnerContent}onRoleChange(e){this.htmlRole=e}renderExpandableButton(){if(!this.expandable){return null}return n("z-icon",{name:this.showInnerContent?this.openElementConfig[this.expandableStyle].open:this.openElementConfig[this.expandableStyle].close})}renderExpandedContent(){if(!this.expandable){return null}return n("div",{class:{"z-list-element-inner-container":true,expanded:this.showInnerContent}},n("slot",{name:"inner-content"}))}renderContent(){if(this.listType===d.NONE){return n("slot",null)}if(this.listType===d.ORDERED){return n("div",{class:"z-list-content-container"},n("div",null,this.listElementPosition,". "),n("slot",null))}if(this.listType===d.UNORDERED){return n("div",{class:"z-list-content-container"},n("span",null,"• "),n("slot",null))}}render(){return n(s,{key:"08ed403eb2e275906b9cce38cd09d8ad26683efc","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.htmlRole},n("div",{key:"64c3b6826652d98b557f32098ab87b3eccabed93",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"},n("div",{key:"222187f25d69dd2fb6128ce6a0c5c81dd6a05b31",class:"z-list-element-container"},this.renderExpandableButton(),this.renderContent()),this.renderExpandedContent()),this.dividerType===l.ELEMENT&&n("z-divider",{key:"1ff298c5fc086f1e303194b69de2324e5448508f",class:{"z-tree-list-divider":this.hasTreeItems},color:this.dividerColor,size:this.dividerSize}))}get host(){return this}static get watchers(){return{role:[{onRoleChange:1}]}}static get style(){return f()}},[257,"z-list-element",{alignButton:[513,"align-button"],clickable:[516],dividerColor:[1,"divider-color"],dividerType:[1,"divider-type"],dividerSize:[1,"divider-size"],expandable:[516],expandableStyle:[1,"expandable-style"],listElementId:[514,"list-element-id"],size:[513],color:[513],disabled:[516],listElementPosition:[513,"list-element-position"],listType:[513,"list-type"],hasTreeItems:[4,"has-tree-items"],htmlTabindex:[2,"html-tabindex"],showInnerContent:[32],htmlRole:[32]},[[4,"accessibleFocus","accessibleFocusHandler"]],{role:[{onRoleChange:1}]}]);function v(){if(typeof customElements==="undefined"){return}const e=["z-list-element","z-divider","z-icon"];e.forEach((e=>{switch(e){case"z-list-element":if(!customElements.get(a(e))){customElements.define(a(e),p)}break;case"z-divider":if(!customElements.get(a(e))){m()}break;case"z-icon":if(!customElements.get(a(e))){b()}break}}))}export{p as Z,v as d};
 //# sourceMappingURL=index9.js.map

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

@@ -1,2 +1,2 @@
-import{proxyCustomElement as a,HTMLElement as o,createEvent as r,h as i,transformTag as e}from"@stencil/core/internal/client";import{e as s,a0 as t}from"./index2.js";import{d as c}from"./index3.js";const n=()=>`:host,:host *,:host ::slotted(*){box-sizing:border-box}:host{--z-accordion-highlight-color:transparent;--z-accordion-bg:var(--color-surface01);--z-accordion-label-color:var(--color-default-text);--z-accordion-disabled-label-color:var(--color-text03);--z-accordion-content-bg:var(--color-surface01);--z-accordion-content-fg:var(--color-default-text);--z-accordion-hover-color:var(--color-surface02);--z-accordion-left-padding:calc(var(--space-unit) * 2);--z-accordion-right-padding:var(--space-unit);--z-accordion-label-font-weight:var(--font-sb);display:block;border-top:var(--border-size-small) solid var(--color-surface03);border-bottom:var(--border-size-small) solid var(--color-surface03);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host([variant="background"]){border:var(--border-size-small) solid var(--color-surface03);border-radius:var(--border-radius)}:host([variant="background"][shadow]){box-shadow:var(--shadow-2)}details{background-color:transparent}summary{--summary-x-small-height:32px;--summary-small-height:36px;--summary-big-height:44px;--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit);position:relative;display:flex;min-height:var(--summary-height);align-items:center;padding:var(--summary-y-padding) var(--z-accordion-right-padding) var(--summary-y-padding)     var(--z-accordion-left-padding);background-color:var(--z-accordion-bg);column-gap:var(--space-unit);cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}:host([size="x-small"]) summary{--summary-height:var(--summary-x-small-height)}:host([size="small"]) summary{--summary-height:var(--summary-small-height)}:host(:is([size="x-small"],[size="small"])) summary{--summary-y-padding:calc(var(--space-unit) / 2)}:host([variant="background"]) summary{padding-right:calc(var(--space-unit) * 2);border-radius:calc(var(--border-radius) - var(--border-size-small))}:host([variant="background"][open]) summary{border-bottom-left-radius:0;border-bottom-right-radius:0}:host([is-disabled]) summary{cursor:default}summary:focus:focus-visible{background-color:var(--z-accordion-hover-color);box-shadow:var(--shadow-focus-primary);outline:none}summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{position:absolute;top:0;left:0;display:block;width:var(--space-unit);height:100%;content:""}:host([highlight][variant="background"]) summary::before{border-top-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight][variant="background"]:not([open])) summary::before,:host([highlight][variant="background"][open]) .z-accordion-content::before{border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight]) summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-highlight-color, transparent)}:host([is-disabled][highlight]) summary::before,:host([is-disabled][highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-disabled-label-color)}summary>z-icon{fill:var(--z-accordion-label-color)}:host([is-disabled]) summary>z-icon{fill:var(--z-accordion-disabled-label-color)}.z-accordion-label{color:var(--z-accordion-label-color);font-size:var(--font-size-3);font-weight:var(--z-accordion-label-font-weight)}:host([size="x-small"]) .z-accordion-label{font-size:var(--font-size-2)}:host([size="x-small"]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:16px;--z-icon-height:16px}.z-accordion-tags{display:flex;align-items:center;column-gap:calc(var(--space-unit) / 2)}summary z-icon.z-accordion-chevron{margin-left:auto}.z-accordion-content{position:relative;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2) calc(var(--space-unit) * 2);background-color:var(--z-accordion-content-bg);color:var(--z-accordion-content-fg);font-size:var(--font-size-2);}:host(:is([size="x-small"],[size="small"])) .z-accordion-content{padding-bottom:var(--space-unit)}:host([size="x-small"]) .z-accordion-content{font-size:var(--font-size-1)}:host([variant="background"]) .z-accordion-content{padding-right:calc(var(--space-unit) * 2);border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small));border-bottom-right-radius:calc(var(--border-radius) - var(--border-size-small))}:host([is-disabled]) .z-accordion-label{color:var(--z-accordion-disabled-label-color)}:host([is-disabled]) .z-accordion-tags ::slotted(z-tag[slot="tag"]){--z-tag-bg:var(--z-accordion-disabled-label-color) !important;--z-tag-text-color:var(--color-text-inverse) !important}@media (hover: hover){summary:focus:focus-visible{position:relative;z-index:1}:host(:not([is-disabled])) summary:hover{background-color:var(--z-accordion-hover-color)}:host(:not([is-disabled])) summary:hover .z-accordion-label{text-decoration:underline}}@media (hover: none){:host([size]) summary{--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit)}:host([size]) .z-accordion-label{font-size:var(--font-size-3)}:host([size]) .z-accordion-content{font-size:var(--font-size-2)}:host([size]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:18px;--z-icon-height:18px}}`;const l=a(class a extends o{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow();this.toggled=r(this,"toggled",7);this.size=s.BIG;this.isDisabled=false;this.open=false;this.highlight=false;this.variant=t.DEFAULT;this.shadow=true;this.hasSlottedTags=false}onDisabledChange(){if(this.isDisabled){this.open=false}}checkSlottedTags(){this.hasSlottedTags=!!this.host.querySelector('[slot="tag"]')}onDetailsToggle(){if(this.isDisabled){this.open=false;this.detailsElm.open=false;return}this.open=this.detailsElm.open;this.toggled.emit(this.open)}componentWillLoad(){this.checkSlottedTags()}render(){return i("details",{key:"0400f292718d11e914939c7276fff21a8d07b5a3",ref:a=>this.detailsElm=a,onToggle:this.onDetailsToggle.bind(this),open:this.open},i("summary",{key:"215728fe582184bb8f39815e96fdc4a34f983ea6",tabIndex:this.isDisabled?-1:null,part:"summary"},this.icon&&i("z-icon",{key:"05e95bad3e66ab3730711a9f5cd1077015ef48d7",class:"z-accordion-label-icon",name:this.icon}),i("span",{key:"babacc83020de2cdf14588e184d8834d0eb87029",class:"z-accordion-label"},this.label),this.hasSlottedTags&&i("span",{key:"01ba1004d19c5e9b394f286f2efb0112f4c70e1f",class:"z-accordion-tags"},i("slot",{key:"e6a74b5c588056f46dd07b28e24f4cd9b10cea8a",name:"tag",onSlotchange:()=>this.checkSlottedTags()})),i("z-icon",{key:"c71ca8f7f20de925508801cffe7cdb690a21dc4b",class:"z-accordion-chevron",name:this.open?"chevron-up":"chevron-down"})),!this.isDisabled&&i("div",{key:"96abd1bf924f77162cee791269701180f22f096e",class:"z-accordion-content",part:"content"},i("slot",{key:"8a1618b8228c985ad7d229ca78f056af6c2dd469"})))}get host(){return this}static get watchers(){return{isDisabled:[{onDisabledChange:0}]}}static get style(){return n()}},[257,"z-accordion",{label:[1],icon:[1],size:[513],isDisabled:[516,"is-disabled"],open:[1540],highlight:[516],variant:[513],shadow:[516],hasSlottedTags:[32]},undefined,{isDisabled:[{onDisabledChange:0}]}]);function d(){if(typeof customElements==="undefined"){return}const a=["z-accordion","z-icon"];a.forEach((a=>{switch(a){case"z-accordion":if(!customElements.get(e(a))){customElements.define(e(a),l)}break;case"z-icon":if(!customElements.get(e(a))){c()}break}}))}const h=l;const b=d;export{h as ZAccordion,b as defineCustomElement};
+import{proxyCustomElement as a,HTMLElement as o,createEvent as r,h as i,transformTag as e}from"@stencil/core/internal/client";import{e as s,a0 as t}from"./index2.js";import{d as c}from"./index3.js";const n=()=>`:host,:host *,:host ::slotted(*){box-sizing:border-box}:host{--z-accordion-highlight-color:transparent;--z-accordion-bg:var(--color-surface01);--z-accordion-label-color:var(--color-default-text);--z-accordion-disabled-label-color:var(--color-text03);--z-accordion-content-bg:var(--color-surface01);--z-accordion-content-fg:var(--color-default-text);--z-accordion-hover-color:var(--color-surface02);--z-accordion-left-padding:calc(var(--space-unit) * 2);--z-accordion-right-padding:var(--space-unit);--z-accordion-label-font-weight:var(--font-sb);display:block;border-top:var(--border-size-small) solid var(--color-surface03);border-bottom:var(--border-size-small) solid var(--color-surface03);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host([variant="background"]){border:var(--border-size-small) solid var(--color-surface03);border-radius:var(--border-radius)}:host([variant="background"][shadow]){box-shadow:var(--shadow-2)}details{background-color:transparent}summary{--summary-x-small-height:32px;--summary-small-height:36px;--summary-big-height:44px;--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit);position:relative;display:flex;min-height:var(--summary-height);align-items:center;padding:var(--summary-y-padding) var(--z-accordion-right-padding) var(--summary-y-padding)     var(--z-accordion-left-padding);background-color:var(--z-accordion-bg);column-gap:var(--space-unit);cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}:host([size="x-small"]) summary{--summary-height:var(--summary-x-small-height)}:host([size="small"]) summary{--summary-height:var(--summary-small-height)}:host(:is([size="x-small"],[size="small"])) summary{--summary-y-padding:calc(var(--space-unit) / 2)}:host([variant="background"]) summary{padding-right:calc(var(--space-unit) * 2);border-radius:calc(var(--border-radius) - var(--border-size-small))}:host([variant="background"][open]) summary{border-bottom-left-radius:0;border-bottom-right-radius:0}:host([is-disabled]) summary{cursor:default}summary:focus:focus-visible{background-color:var(--z-accordion-hover-color);box-shadow:var(--shadow-focus-primary);outline:none}summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{position:absolute;top:0;left:0;display:block;width:var(--space-unit);height:100%;content:""}:host([highlight][variant="background"]) summary::before{border-top-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight][variant="background"]:not([open])) summary::before,:host([highlight][variant="background"][open]) .z-accordion-content::before{border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small))}:host([highlight]) summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-highlight-color, transparent)}:host([is-disabled][highlight]) summary::before,:host([is-disabled][highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-disabled-label-color)}summary>z-icon{fill:var(--z-accordion-label-color)}:host([is-disabled]) summary>z-icon{fill:var(--z-accordion-disabled-label-color)}.z-accordion-label{color:var(--z-accordion-label-color);font-size:var(--font-size-3);font-weight:var(--z-accordion-label-font-weight)}:host([size="x-small"]) .z-accordion-label{font-size:var(--font-size-2)}:host([size="x-small"]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:16px;--z-icon-height:16px}.z-accordion-tags{display:flex;align-items:center;column-gap:calc(var(--space-unit) / 2)}summary z-icon.z-accordion-chevron{margin-left:auto}.z-accordion-content{position:relative;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2) calc(var(--space-unit) * 2);background-color:var(--z-accordion-content-bg);color:var(--z-accordion-content-fg);font-size:var(--font-size-2);}:host(:is([size="x-small"],[size="small"])) .z-accordion-content{padding-bottom:var(--space-unit)}:host([size="x-small"]) .z-accordion-content{font-size:var(--font-size-1)}:host([variant="background"]) .z-accordion-content{padding-right:calc(var(--space-unit) * 2);border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small));border-bottom-right-radius:calc(var(--border-radius) - var(--border-size-small))}:host([is-disabled]) .z-accordion-label{color:var(--z-accordion-disabled-label-color)}:host([is-disabled]) .z-accordion-tags ::slotted(z-tag[slot="tag"]){--z-tag-bg:var(--z-accordion-disabled-label-color) !important;--z-tag-text-color:var(--color-text-inverse) !important}@media (hover: hover){summary:focus:focus-visible{position:relative;z-index:1}:host(:not([is-disabled])) summary:hover{background-color:var(--z-accordion-hover-color)}:host(:not([is-disabled])) summary:hover .z-accordion-label{text-decoration:underline}}@media (hover: none){:host([size]) summary{--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit)}:host([size]) .z-accordion-label{font-size:var(--font-size-3)}:host([size]) .z-accordion-content{font-size:var(--font-size-2)}:host([size]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:18px;--z-icon-height:18px}}`;const l=a(class a extends o{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow();this.toggled=r(this,"toggled",7);this.size=s.BIG;this.isDisabled=false;this.open=false;this.highlight=false;this.variant=t.DEFAULT;this.shadow=true;this.hasSlottedTags=false}onDisabledChange(){if(this.isDisabled){this.open=false}}checkSlottedTags(){this.hasSlottedTags=!!this.host.querySelector('[slot="tag"]')}onDetailsToggle(){if(this.isDisabled){this.open=false;this.detailsElm.open=false;return}this.open=this.detailsElm.open;this.toggled.emit(this.open)}componentWillLoad(){this.checkSlottedTags()}render(){return i("details",{key:"9dbc24c1558cb8dd8278224d4721a173dc6050f3",ref:a=>this.detailsElm=a,onToggle:this.onDetailsToggle.bind(this),open:this.open},i("summary",{key:"191e306e811898c6e199664af41746a7f7fc6885",tabIndex:this.isDisabled?-1:null,part:"summary"},this.icon&&i("z-icon",{key:"8562f6af8717ec125a8be1def19816c67437a3d0",class:"z-accordion-label-icon",name:this.icon}),i("span",{key:"0a863e554c09d43fe7c778fb15266232c45e5c8c",class:"z-accordion-label"},this.label),this.hasSlottedTags&&i("span",{key:"ec62cf2331385b745e9abde47b763c4f76291cc7",class:"z-accordion-tags"},i("slot",{key:"f4e709e2eeb465595e96fe24b4a0bda02f6eaa84",name:"tag",onSlotchange:()=>this.checkSlottedTags()})),i("z-icon",{key:"dec4e49f0d1fee8f59d38b9d97f98aad3affd8aa",class:"z-accordion-chevron",name:this.open?"chevron-up":"chevron-down"})),!this.isDisabled&&i("div",{key:"21a60ab43db780e601d886f6d7ab3a63e2e102a8",class:"z-accordion-content",part:"content"},i("slot",{key:"8a43604d836c04288661b83fc479cec799143cfc"})))}get host(){return this}static get watchers(){return{isDisabled:[{onDisabledChange:0}]}}static get style(){return n()}},[257,"z-accordion",{label:[1],icon:[1],size:[513],isDisabled:[516,"is-disabled"],open:[1540],highlight:[516],variant:[513],shadow:[516],hasSlottedTags:[32]},undefined,{isDisabled:[{onDisabledChange:0}]}]);function d(){if(typeof customElements==="undefined"){return}const a=["z-accordion","z-icon"];a.forEach((a=>{switch(a){case"z-accordion":if(!customElements.get(e(a))){customElements.define(e(a),l)}break;case"z-icon":if(!customElements.get(e(a))){c()}break}}))}const h=l;const m=d;export{h as ZAccordion,m as defineCustomElement};
 //# sourceMappingURL=z-accordion.js.map

package/dist/components/z-anchor-navigation.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{proxyCustomElement as o,HTMLElement as n,h as a,Host as t,transformTag as e}from"@stencil/core/internal/client";import{B as i,e as r}from"./index2.js";import{d as s}from"./index4.js";import{d as c}from"./index3.js";const l=()=>`html{scroll-behavior:smooth}z-anchor-navigation nav{display:none;flex-direction:column;justify-content:flex-start;row-gap:calc(var(--space-unit) / 2)}z-anchor-navigation[collapsed] nav{display:flex;margin-top:var(--space-unit)}z-anchor-navigation nav a{display:-webkit-box;overflow:clip;width:100%;box-sizing:border-box;padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 2);-webkit-box-orient:vertical;font-weight:inherit;-webkit-line-clamp:2;line-clamp:2;overflow-clip-margin:content-box;text-decoration:none}z-anchor-navigation nav>* a{color:inherit}z-anchor-navigation nav * a:not(:only-child){padding-right:calc(var(--space-unit) * 5)}@supports not (overflow-clip-margin: content-box){z-anchor-navigation nav a{display:inline-block;overflow:hidden;-webkit-line-clamp:none;line-clamp:none;text-overflow:ellipsis;white-space:nowrap}}z-anchor-navigation nav>*{position:relative;border-left:var(--border-size-large) solid var(--color-default-icon);color:var(--color-default-text);font-family:var(--font-family-sans);transition:background-color 0.3s ease-in-out,     border-color 0.3s ease-in-out,     color 0.3s ease-in-out}z-anchor-navigation nav>[data-current]{border-left-color:var(--color-primary01);color:var(--color-primary01);font-weight:var(--font-sb)}z-anchor-navigation nav>*>*:is(z-button,button){position:absolute;top:50%;right:0;transform:translateY(-50%);transition:opacity 0.3s ease-in-out}z-anchor-navigation nav>*:focus:focus-visible,z-anchor-navigation nav>*>*:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}z-anchor-navigation nav button{padding:0;border:none;margin:0;background-color:transparent}@media (min-width: 768px){z-anchor-navigation:not([is-collapsed]) z-button.toggle{display:none !important}z-anchor-navigation:not([is-collapsed]) nav{display:flex}z-anchor-navigation nav>*>:is(z-button,button){opacity:0;pointer-events:none}@media (hover: hover){z-anchor-navigation nav>:is([data-current],:hover,:focus,:focus-within)>:is(z-button,button){fill:var(--color-default-icon);opacity:1;pointer-events:unset}z-anchor-navigation nav>*:hover{border-left-color:var(--color-hover-primary);background-color:var(--color-background);color:var(--color-hover-primary)}}z-anchor-navigation[hide-unselected] nav>*:not([data-current],:hover,:focus,:focus-within){color:transparent;fill:transparent}}`;const d=o(class o extends n{constructor(o){super();if(o!==false){this.__registerHost()}this.hideUnselected=false;this.autoCurrent=true;this.collapsedLabel="salta a";this.isCollapsed=false;this.collapsed=false}setCurrent(){const o=Array.from(this.nav.querySelectorAll("a")).find((o=>o.href===this.host.ownerDocument.location.href));Array.from(this.nav.children).forEach((n=>{const a=n instanceof HTMLAnchorElement?n:n.querySelector("a");const t=a===o;a.setAttribute("aria-current",t.toString());n.toggleAttribute("data-current",t)}))}toggleCollapsed(){this.collapsed=!this.collapsed}componentDidLoad(){if(this.autoCurrent){window.addEventListener("hashchange",this.setCurrent.bind(this));this.setCurrent()}}disconnectedCallback(){window.removeEventListener("hashchange",this.setCurrent)}render(){return a(t,{key:"f2cbf308e24c100b40858ad4370d7fb1b83c91b4",collapsed:this.collapsed,class:"z-scrollbar"},a("z-button",{key:"964c11320f7dff05208327e7f591ea90bad3763c",class:"toggle",size:r.SMALL,variant:i.SECONDARY,icon:this.collapsed?"chevron-up":"chevron-down",onClick:this.toggleCollapsed.bind(this)},this.collapsedLabel),a("nav",{key:"21a8634ee51e4a1a824685e95ef58ed6a87e10e2",ref:o=>this.nav=o},a("slot",{key:"bf93f6bd1d2948839da0e7e103f05ebd55135a33"})))}get host(){return this}static get style(){return l()}},[260,"z-anchor-navigation",{hideUnselected:[516,"hide-unselected"],autoCurrent:[4,"auto-current"],collapsedLabel:[1,"collapsed-label"],isCollapsed:[516,"is-collapsed"],collapsed:[32]}]);function h(){if(typeof customElements==="undefined"){return}const o=["z-anchor-navigation","z-button","z-icon"];o.forEach((o=>{switch(o){case"z-anchor-navigation":if(!customElements.get(e(o))){customElements.define(e(o),d)}break;case"z-button":if(!customElements.get(e(o))){s()}break;case"z-icon":if(!customElements.get(e(o))){c()}break}}))}const v=d;const u=h;export{v as ZAnchorNavigation,u as defineCustomElement};
+import{proxyCustomElement as o,HTMLElement as a,h as n,Host as t,transformTag as i}from"@stencil/core/internal/client";import{B as e,e as r}from"./index2.js";import{d as c}from"./index4.js";import{d as s}from"./index3.js";const l=()=>`html{scroll-behavior:smooth}z-anchor-navigation nav{display:none;flex-direction:column;justify-content:flex-start;row-gap:calc(var(--space-unit) / 2)}z-anchor-navigation[collapsed] nav{display:flex;margin-top:var(--space-unit)}z-anchor-navigation nav a{display:-webkit-box;overflow:clip;width:100%;box-sizing:border-box;padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 2);-webkit-box-orient:vertical;font-weight:inherit;-webkit-line-clamp:2;line-clamp:2;overflow-clip-margin:content-box;text-decoration:none}z-anchor-navigation nav>* a{color:inherit}z-anchor-navigation nav * a:not(:only-child){padding-right:calc(var(--space-unit) * 5)}@supports not (overflow-clip-margin: content-box){z-anchor-navigation nav a{display:inline-block;overflow:hidden;-webkit-line-clamp:none;line-clamp:none;text-overflow:ellipsis;white-space:nowrap}}z-anchor-navigation nav>*{position:relative;border-left:var(--border-size-large) solid var(--color-default-icon);color:var(--color-default-text);font-family:var(--font-family-sans);transition:background-color 0.3s ease-in-out,     border-color 0.3s ease-in-out,     color 0.3s ease-in-out}z-anchor-navigation nav>[data-current]{border-left-color:var(--color-primary01);color:var(--color-primary01);font-weight:var(--font-sb)}z-anchor-navigation nav>*>*:is(z-button,button){position:absolute;top:50%;right:0;transform:translateY(-50%);transition:opacity 0.3s ease-in-out}z-anchor-navigation nav>*:focus:focus-visible,z-anchor-navigation nav>*>*:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}z-anchor-navigation nav button{padding:0;border:none;margin:0;background-color:transparent}@media (min-width: 768px){z-anchor-navigation:not([is-collapsed]) z-button.toggle{display:none !important}z-anchor-navigation:not([is-collapsed]) nav{display:flex}z-anchor-navigation nav>*>:is(z-button,button){opacity:0;pointer-events:none}@media (hover: hover){z-anchor-navigation nav>:is([data-current],:hover,:focus,:focus-within)>:is(z-button,button){fill:var(--color-default-icon);opacity:1;pointer-events:unset}z-anchor-navigation nav>*:hover{border-left-color:var(--color-hover-primary);background-color:var(--color-background);color:var(--color-hover-primary)}}z-anchor-navigation[hide-unselected] nav>*:not([data-current],:hover,:focus,:focus-within){color:transparent;fill:transparent}}`;const h=o(class o extends a{constructor(o){super();if(o!==false){this.__registerHost()}this.hideUnselected=false;this.autoCurrent=true;this.collapsedLabel="salta a";this.isCollapsed=false;this.collapsed=false}setCurrent(){const o=Array.from(this.nav.querySelectorAll("a")).find((o=>o.href===this.host.ownerDocument.location.href));Array.from(this.nav.children).forEach((a=>{const n=a instanceof HTMLAnchorElement?a:a.querySelector("a");const t=n===o;n.setAttribute("aria-current",t.toString());a.toggleAttribute("data-current",t)}))}toggleCollapsed(){this.collapsed=!this.collapsed}componentDidLoad(){if(this.autoCurrent){window.addEventListener("hashchange",this.setCurrent.bind(this));this.setCurrent()}}disconnectedCallback(){window.removeEventListener("hashchange",this.setCurrent)}render(){return n(t,{key:"89751109cccb5d8bef38667bbfdfdc28e1a1febf",collapsed:this.collapsed,class:"z-scrollbar"},n("z-button",{key:"2b5cbb4358af217a87d52c52a24326c316dbc56b",class:"toggle",size:r.SMALL,variant:e.SECONDARY,icon:this.collapsed?"chevron-up":"chevron-down",onClick:this.toggleCollapsed.bind(this)},this.collapsedLabel),n("nav",{key:"3f5560712a71aaa112b1258b2177efcbb260487d",ref:o=>this.nav=o},n("slot",{key:"da9a478eb5667533ffc14e3ea7f4c28aba30218a"})))}get host(){return this}static get style(){return l()}},[260,"z-anchor-navigation",{hideUnselected:[516,"hide-unselected"],autoCurrent:[4,"auto-current"],collapsedLabel:[1,"collapsed-label"],isCollapsed:[516,"is-collapsed"],collapsed:[32]}]);function d(){if(typeof customElements==="undefined"){return}const o=["z-anchor-navigation","z-button","z-icon"];o.forEach((o=>{switch(o){case"z-anchor-navigation":if(!customElements.get(i(o))){customElements.define(i(o),h)}break;case"z-button":if(!customElements.get(i(o))){c()}break;case"z-icon":if(!customElements.get(i(o))){s()}break}}))}const v=h;const u=d;export{v as ZAnchorNavigation,u as defineCustomElement};
 //# sourceMappingURL=z-anchor-navigation.js.map

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

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,h as i,Fragment as a,createEvent as s,Host as n,transformTag as o}from"@stencil/core/internal/client";import{g as r,e as l,B as h,u as c,v as d}from"./index2.js";import{B as u}from"./breakpoints.js";import{a as f}from"./utils.js";import{d as p}from"./index4.js";import{d as g}from"./index5.js";import{d as m}from"./index3.js";import{d as v}from"./index6.js";import{d as b}from"./index7.js";import{d as w}from"./index8.js";import{d as x}from"./index9.js";import{d as z}from"./index10.js";import{d as k}from"./index11.js";import{d as y}from"./index12.js";import{d as C}from"./index13.js";const M=()=>`: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}z-searchbar.has-label{align-items:flex-end}.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 E=typeof IntersectionObserver!=="undefined";const S=e(class e extends t{onStuck(){const e=this.scrollParent;if(!e){return}this.sticking.emit(this._stuck)}setMenuFloatingMode(){if(this.menuElements.length===0){return}this.menuElements.forEach((e=>{e.open=false;e.verticalContext=this.drawerOpen}))}onStuckChange(){var e,t;if(!this.container){return}if(this.stuck){(e=this.stuckIntersecObserver)===null||e===void 0?void 0:e.observe(this.container)}else{this._stuck=false;(t=this.stuckIntersecObserver)===null||t===void 0?void 0:t.unobserve(this.container)}}get title(){var e;return(e=this.hostElement.querySelector('[slot="title"]'))===null||e===void 0?void 0:e.textContent.trim()}get scrollParent(){const e=this.hostElement.offsetParent;if(e===document.body||e===document.documentElement){return window}return e}get canShowMenu(){return!this.enableOffcanvas&&this.menuElements.length>0&&!this.isMobile&&!this.drawerOpen}get focusableMenu(){return this.menuElements.find((e=>e.htmlTabindex===0))}openDrawer(){this.drawerOpen=true;this.menuElements.forEach(((e,t)=>e.htmlTabindex=t===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(((e,t)=>e.htmlTabindex=t===0?0:-1));this.menuLength=this.menuElements.length;if(!this.enableOffcanvas){this.menuWidth=this.menuElements.reduce(((e,t)=>e+t.getBoundingClientRect().width),0)+(this.menuLength-1)*32}this.setMenuFloatingMode()}setupMenuResizeObserver(){if(this.enableOffcanvas){return}this.menuResizeObserver=new ResizeObserver((e=>{if(this.isMobile){this.enableOffcanvas=true;return}const t=e[0].contentBoxSize[0].inlineSize;if(this.menuWidth===0){return}if(this.menuWidth>t&&!this.enableOffcanvas){this.enableOffcanvas=true}else if(this.menuWidth<=t&&this.enableOffcanvas){this.enableOffcanvas=false}}));this.menuResizeObserver.observe(this.container)}hasSlot(e){return this.hostElement.querySelector(`[slot="${e}"]`)!==null}moveFocus(e,t){e.htmlTabindex=-1;t.setFocus()}onOffcanvasKeydown(e){var t,i;if(e.key!==r.TAB||!this.drawerOpen){return}const a=e.target.closest("z-menu");if(a){e.preventDefault();e.stopPropagation();a.htmlTabindex=0;this.closeDrawerButton.focus()}else if(e.target===this.closeDrawerButton){e.preventDefault();e.stopPropagation();if(e.shiftKey){((t=this.menuElements.filter((e=>e.open)).pop())!==null&&t!==void 0?t:this.menuElements[this.menuLength-1]).setFocus()}else{((i=this.menuElements.find((e=>e.open)))!==null&&i!==void 0?i:this.menuElements[0]).setFocus()}}}manageMenus(e){const t=this.menuElements.find((t=>f(t,e.target)));if(t){this.menuElements.forEach((e=>{if(e===t){return}e.htmlTabindex=-1;if(!this.drawerOpen){e.open=false}}))}else if(!this.drawerOpen){this.menuElements.forEach((e=>{e.open=false}))}}handleKeydown(e){var t,i;if(e.key===r.ESC&&this.drawerOpen){this.closeDrawer();return}if(!this.menuElements.some((t=>t.contains(e.target)))){return}const a=this.focusableMenu;const s=this.menuElements.indexOf(a);let n;if(e.key===r.ARROW_RIGHT&&!a.verticalContext||e.key===r.ARROW_DOWN&&a.verticalContext){n=(t=this.menuElements[s+1])!==null&&t!==void 0?t:this.menuElements[0]}else if(e.key===r.ARROW_LEFT&&!a.verticalContext||e.key===r.ARROW_UP&&a.verticalContext){n=(i=this.menuElements[s-1])!==null&&i!==void 0?i:this.menuElements[this.menuLength-1]}if(!n){return}if(e.key===r.ARROW_UP&&a.verticalContext){if(n.open){a.htmlTabindex=-1;n.focusLastItem();return}}this.moveFocus(a,n)}renderSeachbar(){if(this.isMobile&&!this.searchPageUrl&&this._stuck){return}if(this.searchPageUrl&&(this.isMobile||this.isTablet)){return i("z-button",{class:"search-page-button",variant:h.SECONDARY,href:this.searchPageUrl,icon:"search",size:l.X_SMALL})}return i("z-searchbar",{class:{"has-label":!!this.searchLabel},value:this.searchString,placeholder:this.searchPlaceholder,label:this.searchLabel,showSearchButton:true,searchButtonIconOnly:this.isMobile||this.isTablet,searchButtonLabel:this.isMobile||this.isTablet?undefined:this.searchButtonLabel,size:l.X_SMALL,variant:h.SECONDARY,preventSubmit:this.searchString.length<3,onSearchTyping:e=>this.searchString=e.detail})}renderProductLogos(){return i(a,null,this.enableZLogo&&i("span",{class:"z-logo"},i("img",{alt:"Logo Zanichelli"})),this.hostElement.querySelector("[slot='product-logo']")&&i("span",{class:"product-logo"},i("slot",{name:"product-logo"})))}renderMenuButton(){return this.menuLength>0&&(this.enableOffcanvas||this._stuck||this.isMobile)&&i("button",{ref:e=>this.burgerButton=e,class:"drawer-trigger","aria-label":"Apri menu","aria-haspopup":"menu","aria-expanded":`${this.drawerOpen}`,"aria-controls":"offcanvas-menu",onClick:this.openDrawer},i("z-icon",{name:"burger-menu"}))}renderOffcanvas(){return i("z-offcanvas",{id:"offcanvas-menu",variant:d.OVERLAY,transitiondirection:c.RIGHT,open:this.drawerOpen,onCanvasOpenStatusChanged:e=>this.drawerOpen=e.detail,onKeyDown:this.onOffcanvasKeydown},i("div",{slot:"canvasContent"},i("button",{ref:e=>this.closeDrawerButton=e,class:"drawer-close","aria-label":"Chiudi menu",onClick:this.closeDrawer,"aria-hidden":`${!this.drawerOpen}`,disabled:!this.drawerOpen},i("z-icon",{name:"close"})),i("div",{class:"drawer-content","aria-hidden":`${!this.drawerOpen}`},i("slot",{name:"menu",onSlotchange:this.collectMenuElements}))))}renderStuck(){return i("div",{class:"heading-stuck"},i("div",{class:"heading-stuck-content"},this.renderMenuButton(),i("div",{class:"heading-title"},this.renderProductLogos(),i("div",{class:"stucked-title"},i("slot",{name:"stucked-title"},this.title))),this.enableSearch&&this.renderSeachbar()))}constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.sticking=s(this,"sticking",7);this.stuck=false;this.enableOffcanvas=false;this.enableSearch=false;this.searchPlaceholder="Cerca";this.searchString="";this.enableZLogo=true;this.drawerOpen=false;this._stuck=false;this.isMobile=true;this.isTablet=false;this.menuElements=[];this.stuckIntersecObserver=E?new IntersectionObserver((([e])=>{this._stuck=!e.isIntersecting}),{threshold:.5}):undefined;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 e=window.matchMedia(`(max-width: ${u.MOBILE}px)`);this.isMobile=e.matches;e.addEventListener("change",(e=>this.isMobile=e.matches));const t=window.matchMedia(`(min-width: ${u.MOBILE+1}px) and (max-width: ${u.TABLET}px)`);this.isTablet=t.matches;t.addEventListener("change",(e=>this.isTablet=e.matches))}componentDidLoad(){this.onStuckChange();this.setupMenuResizeObserver()}disconnectedCallback(){var e;(e=this.menuResizeObserver)===null||e===void 0?void 0:e.disconnect()}render(){const e=this.hasSlot("top-subtitle");return i(n,{key:"3c87b576bc0b22b6466d371cc1e5a6c92632cb3f","menu-length":this.menuLength},i("div",{key:"5fea095adcdc48b7ef7f1a2c0a9fbebb2f774f7c",class:{"heading-panel":true,"has-menubar":this.menuLength>0&&!this.enableOffcanvas},ref:e=>this.container=e},i("div",{key:"4c2af7cd90d3aed866fc0bb1e12c3a7040b8eab7",class:{"heading-container":true,"has-top-subtitle":e}},(!this.enableSearch&&this.isMobile||!this.isMobile)&&i("div",{key:"123f4dbda4424a699098f8cd56e6e0af285555d9",class:{"top-subtitle":true,"has-product-logo":e&&this.hasSlot("product-logo")}},i("slot",{key:"7e46ed5fcf49e61c69cd808f323e642bd1dc8f44",name:"top-subtitle"})),i("div",{key:"459505e2ebe168001292351e85002584b6efed1f",class:"heading-title"},i("slot",{key:"579d2eb490d5c876b0a7ffd111c923d2240a5e18",name:"menu-button"},this.renderMenuButton()),!this._stuck&&this.renderProductLogos(),i("slot",{key:"f6fc213fd474fd75222e2dafc044624f4c468297",name:"title"}),this.enableSearch&&!this.isMobile&&this.renderSeachbar()),this.enableSearch&&this.isMobile&&this.renderSeachbar()),i("nav",{key:"792cf8b185cf12ae234a5e75f8dc4db33fd97e98",class:"menu-container","aria-label":this.title||undefined},this.canShowMenu&&i("div",{key:"6f8e3558678da2a099aa86f63d2dcbc4be9762a3",role:"menubar","aria-label":this.title||undefined},i("slot",{key:"aa700689a8b05503079e69a5808442db280e8e4e",name:"menu",onSlotchange:this.collectMenuElements})))),this.renderOffcanvas(),this._stuck&&this.renderStuck())}get hostElement(){return this}static get watchers(){return{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}}static get style(){return M()}},[257,"z-app-header",{stuck:[516],enableOffcanvas:[1540,"enable-offcanvas"],enableSearch:[516,"enable-search"],searchLabel:[1,"search-label"],searchPlaceholder:[1,"search-placeholder"],searchButtonLabel:[1,"search-button-label"],searchString:[1025,"search-string"],searchPageUrl:[1,"search-page-url"],enableZLogo:[516,"enable-z-logo"],drawerOpen:[1028,"drawer-open"],_stuck:[32],menuLength:[32],isMobile:[32],isTablet:[32]},[[5,"focusin","manageMenus"],[5,"click","manageMenus"],[1,"keydown","handleKeydown"]],{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}]);function j(){if(typeof customElements==="undefined"){return}const e=["z-app-header","z-button","z-divider","z-icon","z-input","z-input-message","z-list","z-list-element","z-list-group","z-offcanvas","z-searchbar","z-tag"];e.forEach((e=>{switch(e){case"z-app-header":if(!customElements.get(o(e))){customElements.define(o(e),S)}break;case"z-button":if(!customElements.get(o(e))){p()}break;case"z-divider":if(!customElements.get(o(e))){g()}break;case"z-icon":if(!customElements.get(o(e))){m()}break;case"z-input":if(!customElements.get(o(e))){v()}break;case"z-input-message":if(!customElements.get(o(e))){b()}break;case"z-list":if(!customElements.get(o(e))){w()}break;case"z-list-element":if(!customElements.get(o(e))){x()}break;case"z-list-group":if(!customElements.get(o(e))){z()}break;case"z-offcanvas":if(!customElements.get(o(e))){k()}break;case"z-searchbar":if(!customElements.get(o(e))){y()}break;case"z-tag":if(!customElements.get(o(e))){C()}break}}))}const H=S;const V=j;export{H as ZAppHeader,V as defineCustomElement};
+import{proxyCustomElement as e,HTMLElement as t,h as i,Fragment as a,createEvent as s,Host as n,transformTag as o}from"@stencil/core/internal/client";import{g as r,e as l,B as h,u as c,v as d}from"./index2.js";import{B as u}from"./breakpoints.js";import{a as f}from"./utils.js";import{d as p}from"./index4.js";import{d as g}from"./index5.js";import{d as m}from"./index3.js";import{d as v}from"./index6.js";import{d as b}from"./index7.js";import{d as w}from"./index8.js";import{d as x}from"./index9.js";import{d as z}from"./index10.js";import{d as k}from"./index11.js";import{d as y}from"./index12.js";import{d as C}from"./index13.js";const M=()=>`: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}z-searchbar.has-label{align-items:flex-end}.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 E=typeof IntersectionObserver!=="undefined";const S=e(class e extends t{onStuck(){const e=this.scrollParent;if(!e){return}this.sticking.emit(this._stuck)}setMenuFloatingMode(){if(this.menuElements.length===0){return}this.menuElements.forEach((e=>{e.open=false;e.verticalContext=this.drawerOpen}))}onStuckChange(){var e,t;if(!this.container){return}if(this.stuck){(e=this.stuckIntersecObserver)===null||e===void 0?void 0:e.observe(this.container)}else{this._stuck=false;(t=this.stuckIntersecObserver)===null||t===void 0?void 0:t.unobserve(this.container)}}get title(){var e;return(e=this.hostElement.querySelector('[slot="title"]'))===null||e===void 0?void 0:e.textContent.trim()}get scrollParent(){const e=this.hostElement.offsetParent;if(e===document.body||e===document.documentElement){return window}return e}get canShowMenu(){return!this.enableOffcanvas&&this.menuElements.length>0&&!this.isMobile&&!this.drawerOpen}get focusableMenu(){return this.menuElements.find((e=>e.htmlTabindex===0))}openDrawer(){this.drawerOpen=true;this.menuElements.forEach(((e,t)=>e.htmlTabindex=t===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(((e,t)=>e.htmlTabindex=t===0?0:-1));this.menuLength=this.menuElements.length;if(!this.enableOffcanvas){this.menuWidth=this.menuElements.reduce(((e,t)=>e+t.getBoundingClientRect().width),0)+(this.menuLength-1)*32}this.setMenuFloatingMode()}setupMenuResizeObserver(){if(this.enableOffcanvas){return}this.menuResizeObserver=new ResizeObserver((e=>{if(this.isMobile){this.enableOffcanvas=true;return}const t=e[0].contentBoxSize[0].inlineSize;if(this.menuWidth===0){return}if(this.menuWidth>t&&!this.enableOffcanvas){this.enableOffcanvas=true}else if(this.menuWidth<=t&&this.enableOffcanvas){this.enableOffcanvas=false}}));this.menuResizeObserver.observe(this.container)}hasSlot(e){return this.hostElement.querySelector(`[slot="${e}"]`)!==null}moveFocus(e,t){e.htmlTabindex=-1;t.setFocus()}onOffcanvasKeydown(e){var t,i;if(e.key!==r.TAB||!this.drawerOpen){return}const a=e.target.closest("z-menu");if(a){e.preventDefault();e.stopPropagation();a.htmlTabindex=0;this.closeDrawerButton.focus()}else if(e.target===this.closeDrawerButton){e.preventDefault();e.stopPropagation();if(e.shiftKey){((t=this.menuElements.filter((e=>e.open)).pop())!==null&&t!==void 0?t:this.menuElements[this.menuLength-1]).setFocus()}else{((i=this.menuElements.find((e=>e.open)))!==null&&i!==void 0?i:this.menuElements[0]).setFocus()}}}manageMenus(e){const t=this.menuElements.find((t=>f(t,e.target)));if(t){this.menuElements.forEach((e=>{if(e===t){return}e.htmlTabindex=-1;if(!this.drawerOpen){e.open=false}}))}else if(!this.drawerOpen){this.menuElements.forEach((e=>{e.open=false}))}}handleKeydown(e){var t,i;if(e.key===r.ESC&&this.drawerOpen){this.closeDrawer();return}if(!this.menuElements.some((t=>t.contains(e.target)))){return}const a=this.focusableMenu;const s=this.menuElements.indexOf(a);let n;if(e.key===r.ARROW_RIGHT&&!a.verticalContext||e.key===r.ARROW_DOWN&&a.verticalContext){n=(t=this.menuElements[s+1])!==null&&t!==void 0?t:this.menuElements[0]}else if(e.key===r.ARROW_LEFT&&!a.verticalContext||e.key===r.ARROW_UP&&a.verticalContext){n=(i=this.menuElements[s-1])!==null&&i!==void 0?i:this.menuElements[this.menuLength-1]}if(!n){return}if(e.key===r.ARROW_UP&&a.verticalContext){if(n.open){a.htmlTabindex=-1;n.focusLastItem();return}}this.moveFocus(a,n)}renderSeachbar(){if(this.isMobile&&!this.searchPageUrl&&this._stuck){return}if(this.searchPageUrl&&(this.isMobile||this.isTablet)){return i("z-button",{class:"search-page-button",variant:h.SECONDARY,href:this.searchPageUrl,icon:"search",size:l.X_SMALL})}return i("z-searchbar",{class:{"has-label":!!this.searchLabel},value:this.searchString,placeholder:this.searchPlaceholder,label:this.searchLabel,showSearchButton:true,searchButtonIconOnly:this.isMobile||this.isTablet,searchButtonLabel:this.isMobile||this.isTablet?undefined:this.searchButtonLabel,size:l.X_SMALL,variant:h.SECONDARY,preventSubmit:this.searchString.length<3,onSearchTyping:e=>this.searchString=e.detail})}renderProductLogos(){return i(a,null,this.enableZLogo&&i("span",{class:"z-logo"},i("img",{alt:"Logo Zanichelli"})),this.hostElement.querySelector("[slot='product-logo']")&&i("span",{class:"product-logo"},i("slot",{name:"product-logo"})))}renderMenuButton(){return this.menuLength>0&&(this.enableOffcanvas||this._stuck||this.isMobile)&&i("button",{ref:e=>this.burgerButton=e,class:"drawer-trigger","aria-label":"Apri menu","aria-haspopup":"menu","aria-expanded":`${this.drawerOpen}`,"aria-controls":"offcanvas-menu",onClick:this.openDrawer},i("z-icon",{name:"burger-menu"}))}renderOffcanvas(){return i("z-offcanvas",{id:"offcanvas-menu",variant:d.OVERLAY,transitiondirection:c.RIGHT,open:this.drawerOpen,onCanvasOpenStatusChanged:e=>this.drawerOpen=e.detail,onKeyDown:this.onOffcanvasKeydown},i("div",{slot:"canvasContent"},i("button",{ref:e=>this.closeDrawerButton=e,class:"drawer-close","aria-label":"Chiudi menu",onClick:this.closeDrawer,"aria-hidden":`${!this.drawerOpen}`,disabled:!this.drawerOpen},i("z-icon",{name:"close"})),i("div",{class:"drawer-content","aria-hidden":`${!this.drawerOpen}`},i("slot",{name:"menu",onSlotchange:this.collectMenuElements}))))}renderStuck(){return i("div",{class:"heading-stuck"},i("div",{class:"heading-stuck-content"},this.renderMenuButton(),i("div",{class:"heading-title"},this.renderProductLogos(),i("div",{class:"stucked-title"},i("slot",{name:"stucked-title"},this.title))),this.enableSearch&&this.renderSeachbar()))}constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.sticking=s(this,"sticking",7);this.stuck=false;this.enableOffcanvas=false;this.enableSearch=false;this.searchPlaceholder="Cerca";this.searchString="";this.enableZLogo=true;this.drawerOpen=false;this._stuck=false;this.isMobile=true;this.isTablet=false;this.menuElements=[];this.stuckIntersecObserver=E?new IntersectionObserver((([e])=>{this._stuck=!e.isIntersecting}),{threshold:.5}):undefined;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 e=window.matchMedia(`(max-width: ${u.MOBILE}px)`);this.isMobile=e.matches;e.addEventListener("change",(e=>this.isMobile=e.matches));const t=window.matchMedia(`(min-width: ${u.MOBILE+1}px) and (max-width: ${u.TABLET}px)`);this.isTablet=t.matches;t.addEventListener("change",(e=>this.isTablet=e.matches))}componentDidLoad(){this.onStuckChange();this.setupMenuResizeObserver()}disconnectedCallback(){var e;(e=this.menuResizeObserver)===null||e===void 0?void 0:e.disconnect()}render(){const e=this.hasSlot("top-subtitle");return i(n,{key:"a464234ec0ce538282727aa83c43d30b5ea23ffa","menu-length":this.menuLength},i("div",{key:"0f41b7571c5e1acf4298910ab415ca986616a40e",class:{"heading-panel":true,"has-menubar":this.menuLength>0&&!this.enableOffcanvas},ref:e=>this.container=e},i("div",{key:"9b9d45789be83c2db23e035a72b60cd4910b68b2",class:{"heading-container":true,"has-top-subtitle":e}},(!this.enableSearch&&this.isMobile||!this.isMobile)&&i("div",{key:"bd1196659bc19936603de3994011b82ea7649147",class:{"top-subtitle":true,"has-product-logo":e&&this.hasSlot("product-logo")}},i("slot",{key:"5d50957c5b91c138ad21efb849fdd371e93057ae",name:"top-subtitle"})),i("div",{key:"47a21fe5a5b508fe23cf4e185813743e8dce0fab",class:"heading-title"},i("slot",{key:"1c027312231d68cb2ebc625b6aeed177d2e22cf4",name:"menu-button"},this.renderMenuButton()),!this._stuck&&this.renderProductLogos(),i("slot",{key:"6917fa59229dc3d80b5c3ca472bd14b671be9e27",name:"title"}),this.enableSearch&&!this.isMobile&&this.renderSeachbar()),this.enableSearch&&this.isMobile&&this.renderSeachbar()),i("nav",{key:"e3ac84ff0933a8955fa7433f8ea0ae94e5eec080",class:"menu-container","aria-label":this.title||undefined},this.canShowMenu&&i("div",{key:"1f3461f8b2b99d8515774265c07ddcb850ed7757",role:"menubar","aria-label":this.title||undefined},i("slot",{key:"eda425c16602287225554fcca0c65661b46e0366",name:"menu",onSlotchange:this.collectMenuElements})))),this.renderOffcanvas(),this._stuck&&this.renderStuck())}get hostElement(){return this}static get watchers(){return{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}}static get style(){return M()}},[257,"z-app-header",{stuck:[516],enableOffcanvas:[1540,"enable-offcanvas"],enableSearch:[516,"enable-search"],searchLabel:[1,"search-label"],searchPlaceholder:[1,"search-placeholder"],searchButtonLabel:[1,"search-button-label"],searchString:[1025,"search-string"],searchPageUrl:[1,"search-page-url"],enableZLogo:[516,"enable-z-logo"],drawerOpen:[1028,"drawer-open"],_stuck:[32],menuLength:[32],isMobile:[32],isTablet:[32]},[[5,"focusin","manageMenus"],[5,"click","manageMenus"],[1,"keydown","handleKeydown"]],{_stuck:[{onStuck:0}],drawerOpen:[{setMenuFloatingMode:0}],stuck:[{onStuckChange:0}]}]);function j(){if(typeof customElements==="undefined"){return}const e=["z-app-header","z-button","z-divider","z-icon","z-input","z-input-message","z-list","z-list-element","z-list-group","z-offcanvas","z-searchbar","z-tag"];e.forEach((e=>{switch(e){case"z-app-header":if(!customElements.get(o(e))){customElements.define(o(e),S)}break;case"z-button":if(!customElements.get(o(e))){p()}break;case"z-divider":if(!customElements.get(o(e))){g()}break;case"z-icon":if(!customElements.get(o(e))){m()}break;case"z-input":if(!customElements.get(o(e))){v()}break;case"z-input-message":if(!customElements.get(o(e))){b()}break;case"z-list":if(!customElements.get(o(e))){w()}break;case"z-list-element":if(!customElements.get(o(e))){x()}break;case"z-list-group":if(!customElements.get(o(e))){z()}break;case"z-offcanvas":if(!customElements.get(o(e))){k()}break;case"z-searchbar":if(!customElements.get(o(e))){y()}break;case"z-tag":if(!customElements.get(o(e))){C()}break}}))}const H=S;const V=j;export{H as ZAppHeader,V as defineCustomElement};
 //# sourceMappingURL=z-app-header.js.map

package/dist/components/z-aria-alert.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,h as r,Host as a,transformTag as s}from"@stencil/core/internal/client";import{t as i}from"./index2.js";const c=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.mode=i.POLITE}render(){return r(a,{key:"55fc317227e17c4c018d382367f0e243a769df3b","aria-live":this.mode,"aria-atomic":"true","aria-relevant":"additions"},r("slot",{key:"749d024688dc33287157e9405cbac013fc59a197"}))}},[260,"z-aria-alert",{mode:[1]}]);function n(){if(typeof customElements==="undefined"){return}const e=["z-aria-alert"];e.forEach((e=>{switch(e){case"z-aria-alert":if(!customElements.get(s(e))){customElements.define(s(e),c)}break}}))}const o=c;const l=n;export{o as ZAriaAlert,l as defineCustomElement};
+import{proxyCustomElement as e,HTMLElement as t,h as a,Host as r,transformTag as s}from"@stencil/core/internal/client";import{t as i}from"./index2.js";const c=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.mode=i.POLITE}render(){return a(r,{key:"89e5c5f82f37b016ae8df7949c2f8f4c29c4de41","aria-live":this.mode,"aria-atomic":"true","aria-relevant":"additions"},a("slot",{key:"794641d2a1cc26567755a7ab12b389446c4ef500"}))}},[260,"z-aria-alert",{mode:[1]}]);function n(){if(typeof customElements==="undefined"){return}const e=["z-aria-alert"];e.forEach((e=>{switch(e){case"z-aria-alert":if(!customElements.get(s(e))){customElements.define(s(e),c)}break}}))}const o=c;const f=n;export{o as ZAriaAlert,f as defineCustomElement};
 //# sourceMappingURL=z-aria-alert.js.map

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

@@ -1,2 +1,2 @@
-import{proxyCustomElement as t,HTMLElement as e,h as s,Host as a,transformTag as i}from"@stencil/core/internal/client";import{A as r}from"./index2.js";const o=()=>`:host{display:inline-flex;overflow:hidden;align-items:center;justify-content:center;background-color:var(--gray700);border-radius:50%;font-family:var(--font-family-sans);text-transform:uppercase}:host(.small),:host(.small)>img{width:calc(var(--space-unit) * 3);height:calc(var(--space-unit) * 3)}:host(.medium),:host(.medium)>img{width:calc(var(--space-unit) * 4);height:calc(var(--space-unit) * 4)}:host(.large),:host(.large)>img{width:calc(var(--space-unit) * 5);height:calc(var(--space-unit) * 5)}:host>img{object-fit:cover}`;const c=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();var e,s;this.size=r.MEDIUM;this.textColor="color-white";this.backgroundColor="gray700";if(((e=this.text)===null||e===void 0?void 0:e.length)===0&&((s=this.image)===null||s===void 0?void 0:s.length)===0){console.warn("z-avatar must contain at least one prop between text and image")}}getTextSize(){if(this.size===r.SMALL){return"5"}else if(this.size===r.MEDIUM){return"4"}else if(this.size===r.LARGE){return"2"}}render(){return s(a,{key:"3420b1414f9869a0715dd0510dacdf7f5189d60a",class:{[this.size]:true,[`body-${this.getTextSize()}-sb`]:true},style:{color:`var(--${this.textColor})`,backgroundColor:`var(--${this.backgroundColor})`}},this.text&&!this.image&&s("span",{key:"0af7952baeb4cce47b083d508ab0ca0cb961e724"},this.text.substring(0,2)),this.image&&s("img",{key:"d74633bfd9fa75ee84cc2070ee6a549e755821d2",src:this.image,onError:()=>this.image=""}))}static get style(){return o()}},[1,"z-avatar",{size:[1],text:[1],textColor:[1,"text-color"],backgroundColor:[1,"background-color"],image:[1025]}]);function n(){if(typeof customElements==="undefined"){return}const t=["z-avatar"];t.forEach((t=>{switch(t){case"z-avatar":if(!customElements.get(i(t))){customElements.define(i(t),c)}break}}))}const l=c;const h=n;export{l as ZAvatar,h as defineCustomElement};
+import{proxyCustomElement as t,HTMLElement as e,h as s,Host as i,transformTag as a}from"@stencil/core/internal/client";import{A as r}from"./index2.js";const o=()=>`:host{display:inline-flex;overflow:hidden;align-items:center;justify-content:center;background-color:var(--gray700);border-radius:50%;font-family:var(--font-family-sans);text-transform:uppercase}:host(.small),:host(.small)>img{width:calc(var(--space-unit) * 3);height:calc(var(--space-unit) * 3)}:host(.medium),:host(.medium)>img{width:calc(var(--space-unit) * 4);height:calc(var(--space-unit) * 4)}:host(.large),:host(.large)>img{width:calc(var(--space-unit) * 5);height:calc(var(--space-unit) * 5)}:host>img{object-fit:cover}`;const c=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();var e,s;this.size=r.MEDIUM;this.textColor="color-white";this.backgroundColor="gray700";if(((e=this.text)===null||e===void 0?void 0:e.length)===0&&((s=this.image)===null||s===void 0?void 0:s.length)===0){console.warn("z-avatar must contain at least one prop between text and image")}}getTextSize(){if(this.size===r.SMALL){return"5"}else if(this.size===r.MEDIUM){return"4"}else if(this.size===r.LARGE){return"2"}}render(){return s(i,{key:"d9d28e0b7d72b7ece067fa8195c96c00be2fa1f7",class:{[this.size]:true,[`body-${this.getTextSize()}-sb`]:true},style:{color:`var(--${this.textColor})`,backgroundColor:`var(--${this.backgroundColor})`}},this.text&&!this.image&&s("span",{key:"98969977ff87ee66004e581cb22a824566355054"},this.text.substring(0,2)),this.image&&s("img",{key:"9710677913311401b39258f3a1eedbfca55f2ea2",src:this.image,onError:()=>this.image=""}))}static get style(){return o()}},[1,"z-avatar",{size:[1],text:[1],textColor:[1,"text-color"],backgroundColor:[1,"background-color"],image:[1025]}]);function n(){if(typeof customElements==="undefined"){return}const t=["z-avatar"];t.forEach((t=>{switch(t){case"z-avatar":if(!customElements.get(a(t))){customElements.define(a(t),c)}break}}))}const l=c;const h=n;export{l as ZAvatar,h as defineCustomElement};
 //# sourceMappingURL=z-avatar.js.map

package/dist/components/z-book-card-app.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as n,transformTag as o}from"@stencil/core/internal/client";import{M as a,e as l}from"./index2.js";import{d as s}from"./index3.js";import{d as r}from"./index15.js";const f=()=>`:host{display:block;width:inherit;min-width:300px;height:inherit;min-height:32px;background-color:var(--color-surface01)}:host>div{display:flex;width:100%;height:100%;box-sizing:border-box;align-items:center;justify-content:space-between;padding:var(--z-book-card-app-padding-y, calc(var(--space-unit) * 1.5))     var(--z-book-card-app-padding-x, var(--space-unit));gap:calc(var(--space-unit) * 2)}:host>div .app{display:flex;flex:1;align-items:center;gap:var(--space-unit)}:host>div .app.z-link{color:inherit;text-decoration:none}:host>div .app.z-link:focus{text-decoration:none}:host>div .app img{width:1.5rem;height:1.5rem;min-height:32px}:host>div .app .name{display:-webkit-box;overflow:hidden;height:1.4rem;-webkit-box-orient:vertical;font-family:var(--font-family-serif);-webkit-line-clamp:1;line-clamp:1;text-overflow:ellipsis;word-break:break-all}:host>div .app .name .laz{color:var(--red500)}:host>div z-info-reveal{--z-info-reveal-panel-width:250px;--trigger-icon-size-x-small:1rem;font-family:var(--font-family-sans);--color-surface05:var(--color-surface01);--color-text-inverse:var(--color-default-text);--color-inverse-icon:var(--color-primary01)}:host z-icon{--z-icon-width:1rem;--z-icon-height:1rem}`;const b=()=>`button.z-link{padding:0;border:0;margin:0;background-color:transparent}a.z-link,button.z-link{display:inline-flex;cursor:pointer;font-family:var(--font-family-sans);line-height:inherit;text-decoration:none}a.z-link.z-link-icon,button.z-link.z-link-icon{--z-icon-width:1.125em;--z-icon-height:1.125em;align-items:center;column-gap:0.5em}a.z-link.z-link-sb,button.z-link.z-link-sb{font-weight:var(--font-sb)}a.z-link.z-link-underline,button.z-link.z-link-underline{text-decoration:underline}a.z-link:hover,button.z-link:hover,a.z-link:focus-visible,button.z-link:focus-visible,a.z-link:active,button.z-link:active{text-decoration:underline}a.z-link:focus-visible,button.z-link:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}a.z-link.z-link-disabled,button.z-link.z-link-disabled{box-shadow:none;color:var(--color-disabled03);cursor:default;fill:var(--color-disabled03);outline:none;pointer-events:none;text-decoration:none}a.z-link,button.z-link,a.z-link.z-link-active,button.z-link.z-link-active,a.z-link:hover,button.z-link:hover,a.z-link.z-link-active:hover,button.z-link.z-link-active:hover,a.z-link:focus-visible,button.z-link:focus-visible,a.z-link.z-link-active:focus-visible,button.z-link.z-link-active:focus-visible,a.z-link:active,button.z-link:active,a.z-link.z-link-active:active,button.z-link.z-link-active:active,a.z-link:visited,button.z-link:visited,a.z-link.z-link-active:visited,button.z-link.z-link-active:visited{color:var(--color-text-link-default);fill:var(--color-text-link-default)}a.z-link.z-link-blue,button.z-link.z-link-blue,a.z-link.z-link-blue.z-link-active,button.z-link.z-link-blue.z-link-active{color:var(--color-text-link-blue);fill:var(--color-text-link-blue)}a.z-link.z-link-red,button.z-link.z-link-red,a.z-link.z-link-red.z-link-active,button.z-link.z-link-red.z-link-active{color:var(--color-text-link-red);fill:var(--color-text-link-red)}a.z-link.z-link-inverse,button.z-link.z-link-inverse,a.z-link.z-link-inverse.z-link-active,button.z-link.z-link-inverse.z-link-active{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}a.z-link.z-link-blue:hover,button.z-link.z-link-blue:hover{color:var(--color-text-link-blue-hover);fill:var(--color-text-link-blue-hover)}a.z-link.z-link-red:hover,button.z-link.z-link-red:hover{color:var(--color-text-link-red-hover);fill:var(--color-text-link-red-hover)}a.z-link.z-link-inverse:hover,button.z-link.z-link-inverse:hover{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}a.z-link.z-link-blue:active,button.z-link.z-link-blue:active,a.z-link.z-link-blue:focus-visible,button.z-link.z-link-blue:focus-visible{color:var(--color-text-link-blue-active);fill:var(--color-text-link-blue-active)}a.z-link.z-link-red:active,button.z-link.z-link-red:active,a.z-link.z-link-red:focus-visible,button.z-link.z-link-red:focus-visible{color:var(--color-text-link-red-active);fill:var(--color-text-link-red-active)}a.z-link.z-link-inverse:active,button.z-link.z-link-inverse:active,a.z-link.z-link-inverse:focus-visible,button.z-link.z-link-inverse:focus-visible{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}a.z-link.z-link-blue:visited,button.z-link.z-link-blue:visited{color:var(--color-text-link-blue-visited);fill:var(--color-text-link-blue-visited)}a.z-link.z-link-red:visited,button.z-link.z-link-red:visited{color:var(--color-text-link-red-visited);fill:var(--color-text-link-red-visited)}a.z-link.z-link-inverse:visited,button.z-link.z-link-inverse:visited{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}`;const d=()=>`:root{--font-family-sans:"IBM Plex Sans", sans-serif;--font-family-serif:"IBM Plex Serif", serif;--font-lt:300;--font-rg:400;--font-sb:600;--font-bd:700;--font-size-1:0.75rem;--font-size-2:0.875rem;--font-size-3:1rem;--font-size-4:1.125rem;--font-size-5:1.25rem;--font-size-6:1.5rem;--font-size-7:1.75rem;--font-size-8:2rem;--font-size-9:2.25rem;--font-size-10:2.625rem;--font-size-11:3rem;--font-size-12:3.375rem;--font-size-13:3.75rem;--font-size-14:4.25rem;--font-size-15:4.75rem;--font-size-16:5.25rem;--font-size-17:5.75rem;--section-title-1:var(--font-sb) var(--font-size-11) / 1.083 var(--font-family-serif);--section-title-2:var(--font-sb) var(--font-size-10) / 1.142 var(--font-family-serif);--section-title-3:var(--font-sb) var(--font-size-9) / 1.222 var(--font-family-serif);--section-title-4:var(--font-sb) var(--font-size-8) / 1.25 var(--font-family-serif);--section-title-5:var(--font-sb) var(--font-size-7) / 1.2857 var(--font-family-serif);--section-title-6:var(--font-sb) var(--font-size-6) / 1.333 var(--font-family-serif)}.heading-1,.heading-1-sb,.heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.heading-2,.heading-2-sb,.heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.heading-3,.heading-3-sb,.heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.heading-4,.heading-4-sb,.heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.body-1,.body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.body-2,.body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.body-3,.body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.body-4,.body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.body-5,.body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.interactive-1,.interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.interactive-2,.interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.interactive-3,.interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.helper,.helper-sb{font-size:var(--font-size-1);font-style:italic;font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.section-title-1{font:var(--section-title-1)}.section-title-2{font:var(--section-title-2)}.section-title-3{font:var(--section-title-3)}.section-title-4{font:var(--section-title-4)}.section-title-5{font:var(--section-title-5)}.section-title-6{font:var(--section-title-6)}@media (min-width: 1152px){.heading-1,.heading-1-sb,.heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.heading-2,.heading-2-sb,.heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}}@media (max-width: 767px){.mobile-heading-1,.mobile-heading-1-sb,.mobile-heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.mobile-heading-2,.mobile-heading-2-sb,.mobile-heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.mobile-heading-3,.mobile-heading-3-sb,.mobile-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.mobile-heading-4,.mobile-heading-4-sb,.mobile-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.mobile-body-1,.mobile-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.mobile-body-2,.mobile-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.mobile-body-3,.mobile-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.mobile-body-4,.mobile-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.mobile-body-5,.mobile-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.mobile-interactive-1,.mobile-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.mobile-interactive-2,.mobile-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.mobile-interactive-3,.mobile-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.mobile-section-title-1{font:var(--section-title-1)}.mobile-section-title-2{font:var(--section-title-2)}.mobile-section-title-3{font:var(--section-title-3)}.mobile-section-title-4{font:var(--section-title-4)}.mobile-section-title-5{font:var(--section-title-5)}.mobile-section-title-6{font:var(--section-title-6)}.mobile-heading-1-lt,.mobile-heading-2-lt,.mobile-heading-3-lt,.mobile-heading-4-lt{font-weight:var(--font-lt)}.mobile-heading-1-sb,.mobile-heading-2-sb,.mobile-heading-3-sb,.mobile-heading-4-sb,.mobile-body-1-sb,.mobile-body-2-sb,.mobile-body-3-sb,.mobile-body-4-sb,.mobile-body-5-sb,.mobile-interactive-1-sb,.mobile-interactive-2-sb,.mobile-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 768px) and (max-width: 1151px){.tablet-heading-1,.tablet-heading-1-sb,.tablet-heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.tablet-heading-2,.tablet-heading-2-sb,.tablet-heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.tablet-heading-3,.tablet-heading-3-sb,.tablet-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.tablet-heading-4,.tablet-heading-4-sb,.tablet-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.tablet-body-1,.tablet-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.tablet-body-2,.tablet-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.tablet-body-3,.tablet-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.tablet-body-4,.tablet-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.tablet-body-5,.tablet-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.tablet-interactive-1,.tablet-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.tablet-interactive-2,.tablet-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.tablet-interactive-3,.tablet-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.tablet-section-title-1{font:var(--section-title-1)}.tablet-section-title-2{font:var(--section-title-2)}.tablet-section-title-3{font:var(--section-title-3)}.tablet-section-title-4{font:var(--section-title-4)}.tablet-section-title-5{font:var(--section-title-5)}.tablet-section-title-6{font:var(--section-title-6)}.tablet-heading-1-lt,.tablet-heading-2-lt,.tablet-heading-3-lt,.tablet-heading-4-lt{font-weight:var(--font-lt)}.tablet-heading-1-sb,.tablet-heading-2-sb,.tablet-heading-3-sb,.tablet-heading-4-sb,.tablet-body-1-sb,.tablet-body-2-sb,.tablet-body-3-sb,.tablet-body-4-sb,.tablet-body-5-sb,.tablet-interactive-1-sb,.tablet-interactive-2-sb,.tablet-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 1152px) and (max-width: 1365px){.desktop-heading-1,.desktop-heading-1-sb,.desktop-heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.desktop-heading-2,.desktop-heading-2-sb,.desktop-heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.desktop-heading-3,.desktop-heading-3-sb,.desktop-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.desktop-heading-4,.desktop-heading-4-sb,.desktop-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.desktop-body-1,.desktop-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.desktop-body-2,.desktop-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.desktop-body-3,.desktop-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.desktop-body-4,.desktop-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.desktop-body-5,.desktop-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.desktop-interactive-1,.desktop-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.desktop-interactive-2,.desktop-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.desktop-interactive-3,.desktop-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.desktop-section-title-1{font:var(--section-title-1)}.desktop-section-title-2{font:var(--section-title-2)}.desktop-section-title-3{font:var(--section-title-3)}.desktop-section-title-4{font:var(--section-title-4)}.desktop-section-title-5{font:var(--section-title-5)}.desktop-section-title-6{font:var(--section-title-6)}.desktop-heading-1-lt,.desktop-heading-2-lt,.desktop-heading-3-lt,.desktop-heading-4-lt{font-weight:var(--font-lt)}.desktop-heading-1-sb,.desktop-heading-2-sb,.desktop-heading-3-sb,.desktop-heading-4-sb,.desktop-body-1-sb,.desktop-body-2-sb,.desktop-body-3-sb,.desktop-body-4-sb,.desktop-body-5-sb,.desktop-interactive-1-sb,.desktop-interactive-2-sb,.desktop-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 1366px){.wide-heading-1,.wide-heading-1-sb,.wide-heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.wide-heading-2,.wide-heading-2-sb,.wide-heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.wide-heading-3,.wide-heading-3-sb,.wide-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.wide-heading-4,.wide-heading-4-sb,.wide-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.wide-body-1,.wide-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.wide-body-2,.wide-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.wide-body-3,.wide-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.wide-body-4,.wide-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.wide-body-5,.wide-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.wide-interactive-1,.wide-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.wide-interactive-2,.wide-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.wide-interactive-3,.wide-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.wide-section-title-1{font:var(--section-title-1)}.wide-section-title-2{font:var(--section-title-2)}.wide-section-title-3{font:var(--section-title-3)}.wide-section-title-4{font:var(--section-title-4)}.wide-section-title-5{font:var(--section-title-5)}.wide-section-title-6{font:var(--section-title-6)}.wide-heading-1-lt,.wide-heading-2-lt,.wide-heading-3-lt,.wide-heading-4-lt{font-weight:var(--font-lt)}.wide-heading-1-sb,.wide-heading-2-sb,.wide-heading-3-sb,.wide-heading-4-sb,.wide-body-1-sb,.wide-body-2-sb,.wide-body-3-sb,.wide-body-4-sb,.wide-body-5-sb,.wide-interactive-1-sb,.wide-interactive-2-sb,.wide-interactive-3-sb{font-weight:var(--font-sb)}}.heading-1-lt,.heading-2-lt,.heading-3-lt,.heading-4-lt{font-weight:var(--font-lt)}.heading-1-sb,.heading-2-sb,.heading-3-sb,.heading-4-sb,.body-1-sb,.body-2-sb,.body-3-sb,.body-4-sb,.body-5-sb,.interactive-1-sb,.interactive-2-sb,.interactive-3-sb,.helper-sb{font-weight:var(--font-sb)}`;const h=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.appClick=i(this,"appClick",7);this.laz=true}emitAppClick(){this.appClick.emit()}renderLaz(){if(this.laz){return n("span",{class:"laz"},"laZ ")}return null}render(){return n("div",{key:"1d1b2f0e55e862d339781bcc5569643b4600c1ac"},n("a",{key:"ce545fd451b0508cd5242ac5fe78a53f05bcd470",class:"app z-link",href:this.link,"aria-label":`vai a ${this.laz?"laz":""} ${this.name}`,onClick:()=>this.emitAppClick(),target:"_blank"},this.logo&&n("img",{key:"e6f70c907d4536ff79efb82d52520b250abe41ed",src:this.logo,alt:""}),n("div",{key:"7159aca193bad1acab23f66074b07a8d37e82f4f",class:"name body-4-sb"},this.renderLaz(),this.name)),this.info&&n("z-info-reveal",{key:"354d150ea3ca2c1f5b21466da28f267548e0ee9c",icon:"info",size:l.X_SMALL,position:a.TOP_RIGHT,class:"info body-5"},n("div",{key:"361e85815010eba5863e1a49cb190150413f48f1"},this.info)),n("a",{key:"52713f456a71c32de4d300c0411a8874364d7cf1",class:"z-link z-link-icon",href:this.link,"aria-label":`vai a ${this.laz?"laz":""} ${this.name}`,onClick:()=>this.emitAppClick(),target:"_blank"},n("z-icon",{key:"746e103053881320ed6840fecca10baf23b0a80a",name:"chevron-right",fill:"color-primary01-icon"})))}get hostElement(){return this}static get style(){return f()+(b()+d())}},[1,"z-book-card-app",{logo:[1],name:[1],link:[1],laz:[4],info:[1]}]);function v(){if(typeof customElements==="undefined"){return}const e=["z-book-card-app","z-icon","z-info-reveal"];e.forEach((e=>{switch(e){case"z-book-card-app":if(!customElements.get(o(e))){customElements.define(o(e),h)}break;case"z-icon":if(!customElements.get(o(e))){s()}break;case"z-info-reveal":if(!customElements.get(o(e))){r()}break}}))}const g=h;const c=v;export{g as ZBookCardApp,c as defineCustomElement};
+import{proxyCustomElement as e,HTMLElement as t,createEvent as i,h as n,transformTag as o}from"@stencil/core/internal/client";import{M as a,e as l}from"./index2.js";import{d as s}from"./index3.js";import{d as r}from"./index15.js";const f=()=>`:host{display:block;width:inherit;min-width:300px;height:inherit;min-height:32px;background-color:var(--color-surface01)}:host>div{display:flex;width:100%;height:100%;box-sizing:border-box;align-items:center;justify-content:space-between;padding:var(--z-book-card-app-padding-y, calc(var(--space-unit) * 1.5))     var(--z-book-card-app-padding-x, var(--space-unit));gap:calc(var(--space-unit) * 2)}:host>div .app{display:flex;flex:1;align-items:center;gap:var(--space-unit)}:host>div .app.z-link{color:inherit;text-decoration:none}:host>div .app.z-link:focus{text-decoration:none}:host>div .app img{width:1.5rem;height:1.5rem;min-height:32px}:host>div .app .name{display:-webkit-box;overflow:hidden;height:1.4rem;-webkit-box-orient:vertical;font-family:var(--font-family-serif);-webkit-line-clamp:1;line-clamp:1;text-overflow:ellipsis;word-break:break-all}:host>div .app .name .laz{color:var(--red500)}:host>div z-info-reveal{--z-info-reveal-panel-width:250px;--trigger-icon-size-x-small:1rem;font-family:var(--font-family-sans);--color-surface05:var(--color-surface01);--color-text-inverse:var(--color-default-text);--color-inverse-icon:var(--color-primary01)}:host z-icon{--z-icon-width:1rem;--z-icon-height:1rem}`;const b=()=>`button.z-link{padding:0;border:0;margin:0;background-color:transparent}a.z-link,button.z-link{display:inline-flex;cursor:pointer;font-family:var(--font-family-sans);line-height:inherit;text-decoration:none}a.z-link.z-link-icon,button.z-link.z-link-icon{--z-icon-width:1.125em;--z-icon-height:1.125em;align-items:center;column-gap:0.5em}a.z-link.z-link-sb,button.z-link.z-link-sb{font-weight:var(--font-sb)}a.z-link.z-link-underline,button.z-link.z-link-underline{text-decoration:underline}a.z-link:hover,button.z-link:hover,a.z-link:focus-visible,button.z-link:focus-visible,a.z-link:active,button.z-link:active{text-decoration:underline}a.z-link:focus-visible,button.z-link:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}a.z-link.z-link-disabled,button.z-link.z-link-disabled{box-shadow:none;color:var(--color-disabled03);cursor:default;fill:var(--color-disabled03);outline:none;pointer-events:none;text-decoration:none}a.z-link,button.z-link,a.z-link.z-link-active,button.z-link.z-link-active,a.z-link:hover,button.z-link:hover,a.z-link.z-link-active:hover,button.z-link.z-link-active:hover,a.z-link:focus-visible,button.z-link:focus-visible,a.z-link.z-link-active:focus-visible,button.z-link.z-link-active:focus-visible,a.z-link:active,button.z-link:active,a.z-link.z-link-active:active,button.z-link.z-link-active:active,a.z-link:visited,button.z-link:visited,a.z-link.z-link-active:visited,button.z-link.z-link-active:visited{color:var(--color-text-link-default);fill:var(--color-text-link-default)}a.z-link.z-link-blue,button.z-link.z-link-blue,a.z-link.z-link-blue.z-link-active,button.z-link.z-link-blue.z-link-active{color:var(--color-text-link-blue);fill:var(--color-text-link-blue)}a.z-link.z-link-red,button.z-link.z-link-red,a.z-link.z-link-red.z-link-active,button.z-link.z-link-red.z-link-active{color:var(--color-text-link-red);fill:var(--color-text-link-red)}a.z-link.z-link-inverse,button.z-link.z-link-inverse,a.z-link.z-link-inverse.z-link-active,button.z-link.z-link-inverse.z-link-active{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}a.z-link.z-link-blue:hover,button.z-link.z-link-blue:hover{color:var(--color-text-link-blue-hover);fill:var(--color-text-link-blue-hover)}a.z-link.z-link-red:hover,button.z-link.z-link-red:hover{color:var(--color-text-link-red-hover);fill:var(--color-text-link-red-hover)}a.z-link.z-link-inverse:hover,button.z-link.z-link-inverse:hover{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}a.z-link.z-link-blue:active,button.z-link.z-link-blue:active,a.z-link.z-link-blue:focus-visible,button.z-link.z-link-blue:focus-visible{color:var(--color-text-link-blue-active);fill:var(--color-text-link-blue-active)}a.z-link.z-link-red:active,button.z-link.z-link-red:active,a.z-link.z-link-red:focus-visible,button.z-link.z-link-red:focus-visible{color:var(--color-text-link-red-active);fill:var(--color-text-link-red-active)}a.z-link.z-link-inverse:active,button.z-link.z-link-inverse:active,a.z-link.z-link-inverse:focus-visible,button.z-link.z-link-inverse:focus-visible{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}a.z-link.z-link-blue:visited,button.z-link.z-link-blue:visited{color:var(--color-text-link-blue-visited);fill:var(--color-text-link-blue-visited)}a.z-link.z-link-red:visited,button.z-link.z-link-red:visited{color:var(--color-text-link-red-visited);fill:var(--color-text-link-red-visited)}a.z-link.z-link-inverse:visited,button.z-link.z-link-inverse:visited{color:var(--color-text-link-inverse);fill:var(--color-text-link-inverse)}`;const d=()=>`:root{--font-family-sans:"IBM Plex Sans", sans-serif;--font-family-serif:"IBM Plex Serif", serif;--font-lt:300;--font-rg:400;--font-sb:600;--font-bd:700;--font-size-1:0.75rem;--font-size-2:0.875rem;--font-size-3:1rem;--font-size-4:1.125rem;--font-size-5:1.25rem;--font-size-6:1.5rem;--font-size-7:1.75rem;--font-size-8:2rem;--font-size-9:2.25rem;--font-size-10:2.625rem;--font-size-11:3rem;--font-size-12:3.375rem;--font-size-13:3.75rem;--font-size-14:4.25rem;--font-size-15:4.75rem;--font-size-16:5.25rem;--font-size-17:5.75rem;--section-title-1:var(--font-sb) var(--font-size-11) / 1.083 var(--font-family-serif);--section-title-2:var(--font-sb) var(--font-size-10) / 1.142 var(--font-family-serif);--section-title-3:var(--font-sb) var(--font-size-9) / 1.222 var(--font-family-serif);--section-title-4:var(--font-sb) var(--font-size-8) / 1.25 var(--font-family-serif);--section-title-5:var(--font-sb) var(--font-size-7) / 1.2857 var(--font-family-serif);--section-title-6:var(--font-sb) var(--font-size-6) / 1.333 var(--font-family-serif)}.heading-1,.heading-1-sb,.heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.heading-2,.heading-2-sb,.heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.heading-3,.heading-3-sb,.heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.heading-4,.heading-4-sb,.heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.body-1,.body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.body-2,.body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.body-3,.body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.body-4,.body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.body-5,.body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.interactive-1,.interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.interactive-2,.interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.interactive-3,.interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.helper,.helper-sb{font-size:var(--font-size-1);font-style:italic;font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.section-title-1{font:var(--section-title-1)}.section-title-2{font:var(--section-title-2)}.section-title-3{font:var(--section-title-3)}.section-title-4{font:var(--section-title-4)}.section-title-5{font:var(--section-title-5)}.section-title-6{font:var(--section-title-6)}@media (min-width: 1152px){.heading-1,.heading-1-sb,.heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.heading-2,.heading-2-sb,.heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}}@media (max-width: 767px){.mobile-heading-1,.mobile-heading-1-sb,.mobile-heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.mobile-heading-2,.mobile-heading-2-sb,.mobile-heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.mobile-heading-3,.mobile-heading-3-sb,.mobile-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.mobile-heading-4,.mobile-heading-4-sb,.mobile-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.mobile-body-1,.mobile-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.mobile-body-2,.mobile-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.mobile-body-3,.mobile-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.mobile-body-4,.mobile-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.mobile-body-5,.mobile-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.mobile-interactive-1,.mobile-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.mobile-interactive-2,.mobile-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.mobile-interactive-3,.mobile-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.mobile-section-title-1{font:var(--section-title-1)}.mobile-section-title-2{font:var(--section-title-2)}.mobile-section-title-3{font:var(--section-title-3)}.mobile-section-title-4{font:var(--section-title-4)}.mobile-section-title-5{font:var(--section-title-5)}.mobile-section-title-6{font:var(--section-title-6)}.mobile-heading-1-lt,.mobile-heading-2-lt,.mobile-heading-3-lt,.mobile-heading-4-lt{font-weight:var(--font-lt)}.mobile-heading-1-sb,.mobile-heading-2-sb,.mobile-heading-3-sb,.mobile-heading-4-sb,.mobile-body-1-sb,.mobile-body-2-sb,.mobile-body-3-sb,.mobile-body-4-sb,.mobile-body-5-sb,.mobile-interactive-1-sb,.mobile-interactive-2-sb,.mobile-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 768px) and (max-width: 1151px){.tablet-heading-1,.tablet-heading-1-sb,.tablet-heading-1-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.tablet-heading-2,.tablet-heading-2-sb,.tablet-heading-2-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.tablet-heading-3,.tablet-heading-3-sb,.tablet-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.tablet-heading-4,.tablet-heading-4-sb,.tablet-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.tablet-body-1,.tablet-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.tablet-body-2,.tablet-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.tablet-body-3,.tablet-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.tablet-body-4,.tablet-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.tablet-body-5,.tablet-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.tablet-interactive-1,.tablet-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.tablet-interactive-2,.tablet-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.tablet-interactive-3,.tablet-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.tablet-section-title-1{font:var(--section-title-1)}.tablet-section-title-2{font:var(--section-title-2)}.tablet-section-title-3{font:var(--section-title-3)}.tablet-section-title-4{font:var(--section-title-4)}.tablet-section-title-5{font:var(--section-title-5)}.tablet-section-title-6{font:var(--section-title-6)}.tablet-heading-1-lt,.tablet-heading-2-lt,.tablet-heading-3-lt,.tablet-heading-4-lt{font-weight:var(--font-lt)}.tablet-heading-1-sb,.tablet-heading-2-sb,.tablet-heading-3-sb,.tablet-heading-4-sb,.tablet-body-1-sb,.tablet-body-2-sb,.tablet-body-3-sb,.tablet-body-4-sb,.tablet-body-5-sb,.tablet-interactive-1-sb,.tablet-interactive-2-sb,.tablet-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 1152px) and (max-width: 1365px){.desktop-heading-1,.desktop-heading-1-sb,.desktop-heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.desktop-heading-2,.desktop-heading-2-sb,.desktop-heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.desktop-heading-3,.desktop-heading-3-sb,.desktop-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.desktop-heading-4,.desktop-heading-4-sb,.desktop-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.desktop-body-1,.desktop-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.desktop-body-2,.desktop-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.desktop-body-3,.desktop-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.desktop-body-4,.desktop-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.desktop-body-5,.desktop-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.desktop-interactive-1,.desktop-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.desktop-interactive-2,.desktop-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.desktop-interactive-3,.desktop-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.desktop-section-title-1{font:var(--section-title-1)}.desktop-section-title-2{font:var(--section-title-2)}.desktop-section-title-3{font:var(--section-title-3)}.desktop-section-title-4{font:var(--section-title-4)}.desktop-section-title-5{font:var(--section-title-5)}.desktop-section-title-6{font:var(--section-title-6)}.desktop-heading-1-lt,.desktop-heading-2-lt,.desktop-heading-3-lt,.desktop-heading-4-lt{font-weight:var(--font-lt)}.desktop-heading-1-sb,.desktop-heading-2-sb,.desktop-heading-3-sb,.desktop-heading-4-sb,.desktop-body-1-sb,.desktop-body-2-sb,.desktop-body-3-sb,.desktop-body-4-sb,.desktop-body-5-sb,.desktop-interactive-1-sb,.desktop-interactive-2-sb,.desktop-interactive-3-sb{font-weight:var(--font-sb)}}@media (min-width: 1366px){.wide-heading-1,.wide-heading-1-sb,.wide-heading-1-lt{font-size:var(--font-size-8);font-weight:var(--font-rg);line-height:1.25}.wide-heading-2,.wide-heading-2-sb,.wide-heading-2-lt{font-size:var(--font-size-7);font-weight:var(--font-rg);line-height:1.28}.wide-heading-3,.wide-heading-3-sb,.wide-heading-3-lt{font-size:var(--font-size-6);font-weight:var(--font-rg);line-height:1.333}.wide-heading-4,.wide-heading-4-sb,.wide-heading-4-lt{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.wide-body-1,.wide-body-1-sb{font-size:var(--font-size-5);font-weight:var(--font-rg);line-height:1.4}.wide-body-2,.wide-body-2-sb{font-size:var(--font-size-4);font-weight:var(--font-rg);line-height:1.5}.wide-body-3,.wide-body-3-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.wide-body-4,.wide-body-4-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.wide-body-5,.wide-body-5-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.wide-interactive-1,.wide-interactive-1-sb{font-size:var(--font-size-3);font-weight:var(--font-rg);line-height:1.5}.wide-interactive-2,.wide-interactive-2-sb{font-size:var(--font-size-2);font-weight:var(--font-rg);letter-spacing:0.16px;line-height:1.4}.wide-interactive-3,.wide-interactive-3-sb{font-size:var(--font-size-1);font-weight:var(--font-rg);letter-spacing:0.32px;line-height:1.333}.wide-section-title-1{font:var(--section-title-1)}.wide-section-title-2{font:var(--section-title-2)}.wide-section-title-3{font:var(--section-title-3)}.wide-section-title-4{font:var(--section-title-4)}.wide-section-title-5{font:var(--section-title-5)}.wide-section-title-6{font:var(--section-title-6)}.wide-heading-1-lt,.wide-heading-2-lt,.wide-heading-3-lt,.wide-heading-4-lt{font-weight:var(--font-lt)}.wide-heading-1-sb,.wide-heading-2-sb,.wide-heading-3-sb,.wide-heading-4-sb,.wide-body-1-sb,.wide-body-2-sb,.wide-body-3-sb,.wide-body-4-sb,.wide-body-5-sb,.wide-interactive-1-sb,.wide-interactive-2-sb,.wide-interactive-3-sb{font-weight:var(--font-sb)}}.heading-1-lt,.heading-2-lt,.heading-3-lt,.heading-4-lt{font-weight:var(--font-lt)}.heading-1-sb,.heading-2-sb,.heading-3-sb,.heading-4-sb,.body-1-sb,.body-2-sb,.body-3-sb,.body-4-sb,.body-5-sb,.interactive-1-sb,.interactive-2-sb,.interactive-3-sb,.helper-sb{font-weight:var(--font-sb)}`;const h=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.appClick=i(this,"appClick",7);this.laz=true}emitAppClick(){this.appClick.emit()}renderLaz(){if(this.laz){return n("span",{class:"laz"},"laZ ")}return null}render(){return n("div",{key:"fce744f158319d3fb1564c75410098d042490579"},n("a",{key:"9120ac9d00ffb3e4a638511ceb4ab4548ffeb556",class:"app z-link",href:this.link,"aria-label":`vai a ${this.laz?"laz":""} ${this.name}`,onClick:()=>this.emitAppClick(),target:"_blank"},this.logo&&n("img",{key:"9040bf4ba19a5f7627b7e5a317c814487bde3680",src:this.logo,alt:""}),n("div",{key:"aca3d44fb28ac31619357bcea89b36622f83cfc7",class:"name body-4-sb"},this.renderLaz(),this.name)),this.info&&n("z-info-reveal",{key:"b2f680fa53efcf6d2c44c4e4c273fb1f5bcffbec",icon:"info",size:l.X_SMALL,position:a.TOP_RIGHT,class:"info body-5"},n("div",{key:"3171a9a277d1e7c09940f7dcb07e6ff3780a8071"},this.info)),n("a",{key:"2b8b5e66b9184a075c7e6184ef48d63fe52f487c",class:"z-link z-link-icon",href:this.link,"aria-label":`vai a ${this.laz?"laz":""} ${this.name}`,onClick:()=>this.emitAppClick(),target:"_blank"},n("z-icon",{key:"19ee937a556f68ad1276eab43e4a35c46f4e87bd",name:"chevron-right",fill:"color-primary01-icon"})))}get hostElement(){return this}static get style(){return f()+(b()+d())}},[1,"z-book-card-app",{logo:[1],name:[1],link:[1],laz:[4],info:[1]}]);function v(){if(typeof customElements==="undefined"){return}const e=["z-book-card-app","z-icon","z-info-reveal"];e.forEach((e=>{switch(e){case"z-book-card-app":if(!customElements.get(o(e))){customElements.define(o(e),h)}break;case"z-icon":if(!customElements.get(o(e))){s()}break;case"z-info-reveal":if(!customElements.get(o(e))){r()}break}}))}const g=h;const c=v;export{g as ZBookCardApp,c as defineCustomElement};
 //# sourceMappingURL=z-book-card-app.js.map