npm - @zanichelli/albe-web-components - Versions diffs - 15.0.1-RC → 15.0.2 - Mend

@zanichelli/albe-web-components 15.0.1-RC → 15.0.2

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

package/dist/collection/components/file-upload/z-file-upload/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/file-upload/z-file-upload/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, h} from \"@stencil/core\";\nimport {ButtonVariant, Device, DividerSize, ZFileUploadType} from \"../../../beans\";\nimport {getDevice} from \"../../../utils/utils\";\n\n@Component({\n tag: \"z-file-upload\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZFileUpload {\n /** Prop indicating the file upload type - can be default or dragdrop /\n @Prop({reflect: true})\n type: ZFileUploadType = ZFileUploadType.DEFAULT;\n\n /* Prop indicating the button variant/\n @Prop()\n buttonVariant?: ButtonVariant;\n\n /* Prop indicating the accepted file type: ex \".pdf, .doc, .jpg\" /\n @Prop()\n acceptedFormat?: string;\n\n /* Max file dimension in Megabyte /\n @Prop()\n fileMaxSize?: number;\n\n /* Title /\n @Prop()\n mainTitle?: string;\n\n /* Description /\n @Prop()\n description?: string;\n\n /* Files added by the user /\n @State()\n files: File[] = [];\n\n /* upoload button label /\n @Prop()\n uploadBtnLabel?: string = \"allega\";\n\n /* drag & drop button label /\n @Prop()\n dragAndDropLabel?: string = \"Rilascia i file in questa area per allegarli.\";\n\n /* allowed file message /\n @Prop()\n allowedFilesMessage?: string;\n\n /* upload clickable message /\n @Prop()\n uploadClickableMessage?: string = \"Carica\";\n\n /* upload message /\n @Prop()\n uploadMessage?: string = \"o trascina dal tuo computer\";\n\n /* error modal title /\n @Prop()\n errorModalTitle?: string = \"Errore di caricamento\";\n\n /* error modal message /\n @Prop()\n errorModalMessage?: string;\n\n /* loaded files label /\n @Prop()\n uploadedFilesLabel?: string = \"File appena caricati\";\n\n /* uploaded files history rendering /\n @Prop()\n hasFileSection?: boolean = true;\n\n /* List of files not allowed to be uploaded /\n @State()\n invalidFiles: Map<string, string[]>;\n\n @Element() el: HTMLZFileUploadElement;\n\n private input: HTMLInputElement;\n\n private button: HTMLZButtonElement;\n\n private errorModal: HTMLZModalElement;\n\n private uploadLink: HTMLSpanElement;\n\n private inputAttributes = {\n type: \"file\",\n id: \"file-elem\",\n multiple: true,\n };\n\n /* Listen removeFile event sent from z-file component /\n @Listen(\"removeFile\")\n removeFileListener(e: CustomEvent): void {\n this.removeFileHandler(e.detail);\n }\n\n /* Listen fileDropped event sent from z-dragdrop-area component /\n @Listen(\"fileDropped\")\n fileDroppedListener(e: CustomEvent): void {\n this.input.files = e.detail;\n this.fileInputHandler();\n }\n\n componentDidUpdate(): void {\n this.handleAccessibility();\n this.invalidFiles.size && this.errorModal.focus();\n }\n\n componentWillLoad(): void {\n this.invalidFiles = new Map<string, string[]>();\n }\n\n /* Emitted when user select one or more files /\n @Event()\n fileInput: EventEmitter;\n\n private fileInputHandler(): void {\n if (this.input.files.length) {\n this.invalidFiles = this.checkFiles(Array.from(this.input.files));\n }\n }\n\n /* get array of uploaded files /\n @Method()\n async getFiles(): Promise<File[]> {\n return this.files;\n }\n\n /* remove file from the array */\n @Method()\n async removeFile(fileName: string): Promise<void> {\n this.removeFileHandler(fileName);\n }\n\n private removeFileHandler(fileName: string): void {\n const files = this.files;\n const file = files.find((file) => file.name === fileName);\n if (file) {\n const index = files.indexOf(file);\n if (index >= 0) {\n files.splice(index, 1);\n this.files = [...files];\n }\n }\n }\n\n private getType(): ZFileUploadType {\n if (getDevice() !== Device.DESKTOP && getDevice() !== Device.DESKTOP_WIDE) {\n return ZFileUploadType.DEFAULT;\n }\n\n return this.type;\n }\n\n private handleAccessibility(): void {\n const lastFile = this.el.querySelector(\"z-file:last-child z-chip button\");\n if (this.files.length > 0 && lastFile) {\n (lastFile as HTMLElement).focus();\n } else {\n this.getType() === ZFileUploadType.DEFAULT\n ? this.button.querySelector(\"button\").focus()\n : this.uploadLink.focus();\n }\n }\n\n private checkFiles(files: File[]): Map<string, string[]> {\n const errors = new Map<string, string[]>();\n const sizeErrorString = `supera il limite di ${this.fileMaxSize}MB`;\n const formatErrorString = \" ha un formato non supportato\";\n files.forEach((file: File) => {\n const fileSize = file.size / 1024 / 1024;\n const fileFormatOk = this.acceptedFormat\n .split(\",\")\n .some((ext: string) => file.name.toLowerCase().endsWith(ext.trim()));\n const fileSizeOk = fileSize <= this.fileMaxSize;\n if (fileSizeOk && fileFormatOk) {\n if (!this.files.find((f) => f.name === file.name)) {\n this.files.push(file);\n this.fileInput.emit(file);\n this.input.value = \"\";\n }\n\n return;\n }\n errors.set(file.name, []);\n if (!fileSizeOk) {\n errors.get(file.name).push(sizeErrorString);\n }\n if (!fileFormatOk) {\n errors.get(file.name).push(formatErrorString);\n }\n });\n\n return errors;\n }\n\n private renderTitle(): HTMLElement {\n return <span id=\"title\">{this.mainTitle}</span>;\n }\n\n private renderDescription(cssClass): HTMLElement {\n return <span class={cssClass}>{this.description}</span>;\n }\n\n private renderAllowedFileExtensions(): HTMLElement {\n let fileFormatString = \"\";\n let fileWeightString = \"\";\n\n if (this.acceptedFormat) {\n const fileFormat = this.acceptedFormat\n .split(\", \")\n .map((string) => string.substring(1).toUpperCase())\n .join(\", \");\n fileFormatString = ` nei formati ${fileFormat}`;\n }\n\n if (this.fileMaxSize) {\n fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;\n }\n\n const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;\n\n return (\n <span class=\"body-3\">\n {this.allowedFilesMessage\n ? this.allowedFilesMessage\n : fileFormatString \|\| fileWeightString\n ? finalString\n : null}\n </span>\n );\n }\n\n private renderFileSection(): HTMLElement {\n if (!this.hasFileSection) {\n return;\n }\n\n return (\n <section class={`files-container ${!this.files.length ? \"hidden\" : \"\"}`}>\n <span class=\"heading-4-sb\">{this.uploadedFilesLabel}</span>\n <div class=\"files-wrapper\">\n <slot name=\"files\" />\n </div>\n <z-divider size={DividerSize.MEDIUM} />\n </section>\n );\n }\n\n private renderInput(): HTMLInputElement {\n return (\n <input\n {...this.inputAttributes}\n onChange={() => this.fileInputHandler()}\n accept={this.acceptedFormat}\n ref={(val) => (this.input = val)}\n />\n );\n }\n\n private renderUploadButton(): unknown[] {\n return [\n this.renderInput(),\n <z-button\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n id=\"fileSelect\"\n variant={this.buttonVariant}\n icon=\"upload\"\n ref={(val) => (this.button = val)}\n >\n {this.uploadBtnLabel}\n </z-button>,\n ];\n }\n\n private renderUploadLink(): unknown[] {\n return [\n this.renderInput(),\n <span class=\"body-1 upload-link-text\">\n <span\n tabIndex={0}\n class=\"body-1-sb upload-link\"\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n ref={(val) => (this.uploadLink = val)}\n >\n {this.uploadClickableMessage}\n </span>{\" \"}\n {this.uploadMessage}\n </span>,\n ];\n }\n\n private renderDefaultMode(): unknown[] {\n return [\n this.renderDescription(\"body-3-sb\"),\n this.renderAllowedFileExtensions(),\n this.renderFileSection(),\n this.renderUploadButton(),\n ];\n }\n\n private renderDragDropMode(): unknown[] {\n return [\n this.renderFileSection(),\n <z-dragdrop-area drag-and-drop-label={this.dragAndDropLabel}>\n <div class=\"text-container\">\n {this.renderDescription(\"body-1\")}\n {this.renderUploadLink()}\n {this.renderAllowedFileExtensions()}\n </div>\n </z-dragdrop-area>,\n ];\n }\n\n private formatErrorString(key, value): string {\n const bothErrors = value[0] && value[1] ? \" e \" : \"\";\n\n return (\n <span class=\"error-message\">\n Il file <span class=\"file-name\">{key}</span> {value[1] ?? \"\"}\n {bothErrors}\n {value[0] ?? \"\"}.\n </span>\n );\n }\n\n private handleErrorModalContent(): HTMLDivElement {\n return (\n <div slot=\"modalContent\">\n <div class=\"modal-wrapper\">\n <div class=\"files\">\n {this.errorModalMessage ? (\n <span class=\"body-3\">{this.errorModalMessage}</span>\n ) : (\n Array.from(this.invalidFiles).map(([key, value]) => {\n return <span class=\"body-3\">{this.formatErrorString(key, value)}</span>;\n })\n )}\n </div>\n </div>\n </div>\n );\n }\n\n render(): HTMLZFileUploadElement {\n return (\n <Host>\n <div\n tabIndex={0}\n class={`container ${this.getType()}`}\n >\n {this.mainTitle && this.renderTitle()}\n {this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()}\n </div>\n {!!this.invalidFiles.size && (\n <z-modal\n modalid={`file-upload-${this.type}-error-modal`}\n tabIndex={0}\n ref={(val) => (this.errorModal = val)}\n modaltitle={this.errorModalTitle}\n onModalClose={() => (this.invalidFiles = new Map<string, string[]>())}\n onModalBackgroundClick={() => (this.invalidFiles = new Map<string, string[]>())}\n >\n {this.handleErrorModalContent()}\n </z-modal>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/file-upload/z-file-upload/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, h} from \"@stencil/core\";\nimport {ButtonVariant, Device, DividerSize, ZFileUploadType} from \"../../../beans\";\nimport {getDevice} from \"../../../utils/utils\";\n\n@Component({\n tag: \"z-file-upload\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZFileUpload {\n /** Prop indicating the file upload type - can be default or dragdrop /\n @Prop({reflect: true})\n type: ZFileUploadType = ZFileUploadType.DEFAULT;\n\n /* Prop indicating the button variant/\n @Prop()\n buttonVariant?: ButtonVariant;\n\n /* Prop indicating the accepted file type: ex \".pdf, .doc, .jpg\" /\n @Prop()\n acceptedFormat?: string;\n\n /* Max file dimension in Megabyte /\n @Prop()\n fileMaxSize?: number;\n\n /* Title /\n @Prop()\n mainTitle?: string;\n\n /* Description /\n @Prop()\n description?: string;\n\n /* Files added by the user /\n @State()\n files: File[] = [];\n\n /* upoload button label /\n @Prop()\n uploadBtnLabel?: string = \"allega\";\n\n /* drag & drop button label /\n @Prop()\n dragAndDropLabel?: string = \"Rilascia i file in questa area per allegarli.\";\n\n /* allowed file message /\n @Prop()\n allowedFilesMessage?: string;\n\n /* upload clickable message /\n @Prop()\n uploadClickableMessage?: string = \"Carica\";\n\n /* upload message /\n @Prop()\n uploadMessage?: string = \"o trascina dal tuo computer\";\n\n /* error modal title /\n @Prop()\n errorModalTitle?: string = \"Errore di caricamento\";\n\n /* error modal message /\n @Prop()\n errorModalMessage?: string;\n\n /* loaded files label /\n @Prop()\n uploadedFilesLabel?: string = \"File appena caricati\";\n\n /* uploaded files history rendering /\n @Prop()\n hasFileSection?: boolean = true;\n\n /* List of files not allowed to be uploaded /\n @State()\n invalidFiles: Map<string, string[]>;\n\n @Element() el: HTMLZFileUploadElement;\n\n private input: HTMLInputElement;\n\n private button: HTMLZButtonElement;\n\n private errorModal: HTMLZModalElement;\n\n private uploadLink: HTMLSpanElement;\n\n private inputAttributes = {\n type: \"file\",\n id: \"file-elem\",\n multiple: true,\n };\n\n /* Listen removeFile event sent from z-file component /\n @Listen(\"removeFile\")\n removeFileListener(e: CustomEvent): void {\n this.removeFileHandler(e.detail);\n }\n\n /* Listen fileDropped event sent from z-dragdrop-area component /\n @Listen(\"fileDropped\")\n fileDroppedListener(e: CustomEvent): void {\n this.input.files = e.detail;\n this.fileInputHandler();\n }\n\n componentDidUpdate(): void {\n this.handleAccessibility();\n this.invalidFiles.size && this.errorModal.focus();\n }\n\n componentWillLoad(): void {\n this.invalidFiles = new Map<string, string[]>();\n }\n\n /* Emitted when user select one or more files /\n @Event()\n fileInput: EventEmitter;\n\n private fileInputHandler(): void {\n if (this.input.files.length) {\n this.invalidFiles = this.checkFiles(Array.from(this.input.files));\n }\n }\n\n /* get array of uploaded files /\n @Method()\n async getFiles(): Promise<File[]> {\n return this.files;\n }\n\n /* remove file from the array */\n @Method()\n async removeFile(fileName: string): Promise<void> {\n this.removeFileHandler(fileName);\n }\n\n private removeFileHandler(fileName: string): void {\n const files = this.files;\n const file = files.find((file) => file.name === fileName);\n if (file) {\n const index = files.indexOf(file);\n if (index >= 0) {\n files.splice(index, 1);\n this.files = [...files];\n }\n }\n }\n\n private getType(): ZFileUploadType {\n if (getDevice() !== Device.DESKTOP && getDevice() !== Device.DESKTOP_WIDE) {\n return ZFileUploadType.DEFAULT;\n }\n\n return this.type;\n }\n\n private handleAccessibility(): void {\n const lastFile = this.el.querySelector(\"z-file:last-child z-chip button\");\n if (this.files.length > 0 && lastFile) {\n (lastFile as HTMLElement).focus();\n } else {\n this.getType() === ZFileUploadType.DEFAULT\n ? this.button.querySelector(\"button\").focus()\n : this.uploadLink.focus();\n }\n }\n\n private checkFiles(files: File[]): Map<string, string[]> {\n const errors = new Map<string, string[]>();\n const sizeErrorString = `supera il limite di ${this.fileMaxSize}MB`;\n const formatErrorString = \" ha un formato non supportato\";\n files.forEach((file: File) => {\n const fileSize = file.size / 1024 / 1024;\n const fileFormatOk = this.acceptedFormat\n .split(\",\")\n .some((ext: string) => file.name.toLowerCase().endsWith(ext.trim()));\n const fileSizeOk = fileSize <= this.fileMaxSize;\n if (fileSizeOk && fileFormatOk) {\n if (!this.files.find((f) => f.name === file.name)) {\n this.files.push(file);\n this.fileInput.emit(file);\n this.input.value = \"\";\n }\n\n return;\n }\n errors.set(file.name, []);\n if (!fileSizeOk) {\n errors.get(file.name).push(sizeErrorString);\n }\n if (!fileFormatOk) {\n errors.get(file.name).push(formatErrorString);\n }\n });\n\n return errors;\n }\n\n private renderTitle(): HTMLElement {\n return <span id=\"title\">{this.mainTitle}</span>;\n }\n\n private renderDescription(cssClass): HTMLElement {\n return <span class={cssClass}>{this.description}</span>;\n }\n\n private renderAllowedFileExtensions(): HTMLElement {\n let fileFormatString = \"\";\n let fileWeightString = \"\";\n\n if (this.acceptedFormat) {\n const fileFormat = this.acceptedFormat\n .split(\", \")\n .map((string) => string.substring(1).toUpperCase())\n .join(\", \");\n fileFormatString = ` nei formati ${fileFormat}`;\n }\n\n if (this.fileMaxSize) {\n fileWeightString = ` per un massimo di ${this.fileMaxSize}MB di peso`;\n }\n\n const finalString = `Puoi allegare file${fileFormatString}${fileWeightString}.`;\n\n return (\n <span class=\"body-3\">\n {this.allowedFilesMessage\n ? this.allowedFilesMessage\n : fileFormatString \|\| fileWeightString\n ? finalString\n : null}\n </span>\n );\n }\n\n private renderFileSection(): HTMLElement {\n if (!this.hasFileSection) {\n return;\n }\n\n return (\n <section class={`files-container ${!this.files.length ? \"hidden\" : \"\"}`}>\n <span class=\"heading-4-sb\">{this.uploadedFilesLabel}</span>\n <div class=\"files-wrapper\">\n <slot name=\"files\" />\n </div>\n <z-divider size={DividerSize.MEDIUM} />\n </section>\n );\n }\n\n private renderInput(): HTMLInputElement {\n return (\n <input\n {...this.inputAttributes}\n onChange={() => this.fileInputHandler()}\n accept={this.acceptedFormat}\n ref={(val) => (this.input = val)}\n />\n );\n }\n\n private renderUploadButton(): unknown[] {\n return [\n this.renderInput(),\n <z-button\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n id=\"fileSelect\"\n variant={this.buttonVariant}\n icon=\"upload\"\n ref={(val) => (this.button = val)}\n >\n {this.uploadBtnLabel}\n </z-button>,\n ];\n }\n\n private renderUploadLink(): unknown[] {\n return [\n this.renderInput(),\n <span class=\"body-1 upload-link-text\">\n <span\n tabIndex={0}\n class=\"body-1-sb upload-link\"\n onClick={() => this.input.click()}\n onKeyPress={(e) => {\n if (e.code == \"Space\" \|\| e.code == \"Enter\") {\n e.preventDefault();\n this.input.click();\n }\n }}\n ref={(val) => (this.uploadLink = val)}\n >\n {this.uploadClickableMessage}\n </span>{\" \"}\n {this.uploadMessage}\n </span>,\n ];\n }\n\n private renderDefaultMode(): unknown[] {\n return [\n this.renderDescription(\"body-3-sb\"),\n this.renderAllowedFileExtensions(),\n this.renderFileSection(),\n this.renderUploadButton(),\n ];\n }\n\n private renderDragDropMode(): unknown[] {\n return [\n this.renderFileSection(),\n <z-dragdrop-area drag-and-drop-label={this.dragAndDropLabel}>\n <div class=\"text-container\">\n {this.renderDescription(\"body-1\")}\n {this.renderUploadLink()}\n {this.renderAllowedFileExtensions()}\n </div>\n </z-dragdrop-area>,\n ];\n }\n\n private formatErrorString(key, value): string {\n const bothErrors = value[0] && value[1] ? \" e \" : \"\";\n\n return (\n <span class=\"error-message\">\n Il file <span class=\"file-name\">{key}</span> {value[1] ?? \"\"}\n {bothErrors}\n {value[0] ?? \"\"}.\n </span>\n );\n }\n\n private handleErrorModalContent(): HTMLDivElement {\n return (\n <div slot=\"modalContent\">\n <div class=\"modal-wrapper\">\n <div class=\"files\">\n {this.errorModalMessage ? (\n <span class=\"body-3\">{this.errorModalMessage}</span>\n ) : (\n Array.from(this.invalidFiles).map(([key, value]) => {\n return <span class=\"body-3\">{this.formatErrorString(key, value)}</span>;\n })\n )}\n </div>\n </div>\n </div>\n );\n }\n\n render(): HTMLZFileUploadElement {\n return (\n <Host>\n <div class={`container ${this.getType()}`}>\n {this.mainTitle && this.renderTitle()}\n {this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()}\n </div>\n {!!this.invalidFiles.size && (\n <z-modal\n modalid={`file-upload-${this.type}-error-modal`}\n tabIndex={0}\n ref={(val) => (this.errorModal = val)}\n modaltitle={this.errorModalTitle}\n onModalClose={() => (this.invalidFiles = new Map<string, string[]>())}\n onModalBackgroundClick={() => (this.invalidFiles = new Map<string, string[]>())}\n >\n {this.handleErrorModalContent()}\n </z-modal>\n )}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/file-upload/z-file-upload/index.spec.js CHANGED Viewed

@@ -15,7 +15,7 @@ describe("Suite test ZFileUpload", () => {
         expect(page.root).toEqualHtml(`
     <z-file-upload accepted-format=".pdf, .doc, .tiff, .png, .jpg, .jpeg" description="Vuoi allegare un file per chiarire meglio la tua richiesta?" file-max-size="50" main-title="Allega un file" type="default" variant="primary">
       <mock:shadow-root>
-       <div class="container default" tabindex="0">
+       <div class="container default">
          <span id="title">
            Allega un file
          </span>
@@ -56,7 +56,7 @@ describe("Suite test ZFileUpload", () => {
         expect(page.root)
             .toEqualHtml(`     <z-file-upload accepted-format=".pdf, .doc, .tiff, .png, .jpg, .jpeg" description="Vuoi allegare un file per chiarire meglio la tua richiesta?" file-max-size="50" main-title="Allega un file" type="dragdrop">
        <mock:shadow-root>
-       <div class="container dragdrop" tabindex="0">
+       <div class="container dragdrop">
          <span id="title">
            Allega un file
          </span>
@@ -106,7 +106,7 @@ describe("Suite test ZFileUpload", () => {
         expect(page.root).toEqualHtml(`
     <z-file-upload accepted-format=".pdf, .doc, .tiff, .png, .jpg, .jpeg" description="Vuoi allegare un file per chiarire meglio la tua richiesta?" file-max-size="50" upload-btn-label="testo custom" drag-and-drop-label="drag and drop custom label" type="default" variant="primary">
       <mock:shadow-root>
-       <div class="container default" tabindex="0">
+       <div class="container default">
          <span class="body-3-sb">
            Vuoi allegare un file per chiarire meglio la tua richiesta?
          </span>

package/dist/collection/components/file-upload/z-file-upload/index.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../../src/components/file-upload/z-file-upload/index.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAEpC,QAAQ,CAAC,wBAAwB,EAAE,GAAG,EAAE;IACtC,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QAC/C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE;;;;;;8BAMkB;SACzB,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA6Bb,CAAC,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE;;;;;8BAKkB;SACzB,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;aACd,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAmCI,CAAC,CAAC;IACvB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC5E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE;;;;;;;8BAOkB;SACzB,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;qBA0Bb,CAAC,CAAC;IACrB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZFileUpload} from \"./index\";\n\ndescribe(\"Suite test ZFileUpload\", () => {\n it(\"Test render ZFileUpload default\", async () => {\n const page = await newSpecPage({\n components: [ZFileUpload],\n html: `<z-file-upload type=\"default\"\n variant=\"primary\"\n main-title=\"Allega un file\"\n description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\"\n accepted-format= \".pdf, .doc, .tiff, .png, .jpg, .jpeg\"\n file-max-size=\"50\">>\n </z-file-upload>`,\n });\n expect(page.root).toEqualHtml(`\n <z-file-upload accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\" file-max-size=\"50\" main-title=\"Allega un file\" type=\"default\" variant=\"primary\">\n <mock:shadow-root>\n <div class=\"container default\" ~~tabindex=\"0\"~~>\n <span id=\"title\">\n Allega un file\n </span>\n <span class=\"body-3-sb\">\n Vuoi allegare un file per chiarire meglio la tua richiesta?\n </span>\n <span class=\"body-3\">\n Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.\n </span>\n <section class=\"files-container hidden\">\n <span class=\"heading-4-sb\">\n File appena caricati\n </span>\n <div class=\"files-wrapper\">\n <slot name=\"files\"></slot>\n </div>\n <z-divider size=\"medium\"></z-divider>\n </section>\n <input accept=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" id=\"file-elem\" multiple=\"\" type=\"file\">\n <z-button icon=\"upload\" id=\"fileSelect\">\n allega\n </z-button>\n </div>\n </mock:shadow-root>\n >\n </z-file-upload>`);\n });\n\n it(\"Test render ZFileUpload dragdrop\", async () => {\n const page = await newSpecPage({\n components: [ZFileUpload],\n html: `<z-file-upload type=\"dragdrop\"\n main-title=\"Allega un file\"\n description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\"\n accepted-format= \".pdf, .doc, .tiff, .png, .jpg, .jpeg\"\n file-max-size=\"50\">>\n </z-file-upload>`,\n });\n expect(page.root)\n .toEqualHtml(` <z-file-upload accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\" file-max-size=\"50\" main-title=\"Allega un file\" type=\"dragdrop\">\n <mock:shadow-root>\n <div class=\"container dragdrop\" ~~tabindex=\"0\"~~>\n <span id=\"title\">\n Allega un file\n </span>\n <section class=\"files-container hidden\">\n <span class=\"heading-4-sb\">\n File appena caricati\n </span>\n <div class=\"files-wrapper\">\n <slot name=\"files\"></slot>\n </div>\n <z-divider size=\"medium\"></z-divider>\n </section>\n <z-dragdrop-area drag-and-drop-label=\"Rilascia i file in questa area per allegarli.\">\n <div class=\"text-container\">\n <span class=\"body-1\">\n Vuoi allegare un file per chiarire meglio la tua richiesta?\n </span>\n <input accept=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" id=\"file-elem\" multiple=\"\" type=\"file\">\n <span class=\"body-1 upload-link-text\">\n <span class=\"body-1-sb upload-link\" tabindex=\"0\">\n Carica\n </span>\n o trascina dal tuo computer\n </span>\n <span class=\"body-3\">\n Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.\n </span>\n </div>\n </z-dragdrop-area>\n </div>\n </mock:shadow-root>\n >\n </z-file-upload>`);\n });\n\n it(\"Test render ZFileUpload with custom label and not main-title\", async () => {\n const page = await newSpecPage({\n components: [ZFileUpload],\n html: `<z-file-upload type=\"default\"\n variant=\"primary\"\n description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\"\n accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\"\n upload-btn-label=\"testo custom\"\n drag-and-drop-label=\"drag and drop custom label\"\n file-max-size=\"50\">>\n </z-file-upload>`,\n });\n expect(page.root).toEqualHtml(`\n <z-file-upload accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\" file-max-size=\"50\" upload-btn-label=\"testo custom\" drag-and-drop-label=\"drag and drop custom label\" type=\"default\" variant=\"primary\">\n <mock:shadow-root>\n <div class=\"container default\" ~~tabindex=\"0\"~~>\n <span class=\"body-3-sb\">\n Vuoi allegare un file per chiarire meglio la tua richiesta?\n </span>\n <span class=\"body-3\">\n Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.\n </span>\n <section class=\"files-container hidden\">\n <span class=\"heading-4-sb\">\n File appena caricati\n </span>\n <div class=\"files-wrapper\">\n <slot name=\"files\"></slot>\n </div>\n <z-divider size=\"medium\"></z-divider>\n </section>\n <input accept=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" id=\"file-elem\" multiple=\"\" type=\"file\">\n <z-button icon=\"upload\" id=\"fileSelect\">\n testo custom\n </z-button>\n </div>\n </mock:shadow-root>\n >\n </z-file-upload>`);\n });\n});\n"]}
1	+ {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../../src/components/file-upload/z-file-upload/index.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAEpC,QAAQ,CAAC,wBAAwB,EAAE,GAAG,EAAE;IACtC,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QAC/C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE;;;;;;8BAMkB;SACzB,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA6Bb,CAAC,CAAC;IACrB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kCAAkC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE;;;;;8BAKkB;SACzB,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;aACd,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAmCI,CAAC,CAAC;IACvB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC5E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,WAAW,CAAC;YACzB,IAAI,EAAE;;;;;;;8BAOkB;SACzB,CAAC,CAAC;QACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;qBA0Bb,CAAC,CAAC;IACrB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZFileUpload} from \"./index\";\n\ndescribe(\"Suite test ZFileUpload\", () => {\n it(\"Test render ZFileUpload default\", async () => {\n const page = await newSpecPage({\n components: [ZFileUpload],\n html: `<z-file-upload type=\"default\"\n variant=\"primary\"\n main-title=\"Allega un file\"\n description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\"\n accepted-format= \".pdf, .doc, .tiff, .png, .jpg, .jpeg\"\n file-max-size=\"50\">>\n </z-file-upload>`,\n });\n expect(page.root).toEqualHtml(`\n <z-file-upload accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\" file-max-size=\"50\" main-title=\"Allega un file\" type=\"default\" variant=\"primary\">\n <mock:shadow-root>\n <div class=\"container default\">\n <span id=\"title\">\n Allega un file\n </span>\n <span class=\"body-3-sb\">\n Vuoi allegare un file per chiarire meglio la tua richiesta?\n </span>\n <span class=\"body-3\">\n Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.\n </span>\n <section class=\"files-container hidden\">\n <span class=\"heading-4-sb\">\n File appena caricati\n </span>\n <div class=\"files-wrapper\">\n <slot name=\"files\"></slot>\n </div>\n <z-divider size=\"medium\"></z-divider>\n </section>\n <input accept=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" id=\"file-elem\" multiple=\"\" type=\"file\">\n <z-button icon=\"upload\" id=\"fileSelect\">\n allega\n </z-button>\n </div>\n </mock:shadow-root>\n >\n </z-file-upload>`);\n });\n\n it(\"Test render ZFileUpload dragdrop\", async () => {\n const page = await newSpecPage({\n components: [ZFileUpload],\n html: `<z-file-upload type=\"dragdrop\"\n main-title=\"Allega un file\"\n description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\"\n accepted-format= \".pdf, .doc, .tiff, .png, .jpg, .jpeg\"\n file-max-size=\"50\">>\n </z-file-upload>`,\n });\n expect(page.root)\n .toEqualHtml(` <z-file-upload accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\" file-max-size=\"50\" main-title=\"Allega un file\" type=\"dragdrop\">\n <mock:shadow-root>\n <div class=\"container dragdrop\">\n <span id=\"title\">\n Allega un file\n </span>\n <section class=\"files-container hidden\">\n <span class=\"heading-4-sb\">\n File appena caricati\n </span>\n <div class=\"files-wrapper\">\n <slot name=\"files\"></slot>\n </div>\n <z-divider size=\"medium\"></z-divider>\n </section>\n <z-dragdrop-area drag-and-drop-label=\"Rilascia i file in questa area per allegarli.\">\n <div class=\"text-container\">\n <span class=\"body-1\">\n Vuoi allegare un file per chiarire meglio la tua richiesta?\n </span>\n <input accept=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" id=\"file-elem\" multiple=\"\" type=\"file\">\n <span class=\"body-1 upload-link-text\">\n <span class=\"body-1-sb upload-link\" tabindex=\"0\">\n Carica\n </span>\n o trascina dal tuo computer\n </span>\n <span class=\"body-3\">\n Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.\n </span>\n </div>\n </z-dragdrop-area>\n </div>\n </mock:shadow-root>\n >\n </z-file-upload>`);\n });\n\n it(\"Test render ZFileUpload with custom label and not main-title\", async () => {\n const page = await newSpecPage({\n components: [ZFileUpload],\n html: `<z-file-upload type=\"default\"\n variant=\"primary\"\n description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\"\n accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\"\n upload-btn-label=\"testo custom\"\n drag-and-drop-label=\"drag and drop custom label\"\n file-max-size=\"50\">>\n </z-file-upload>`,\n });\n expect(page.root).toEqualHtml(`\n <z-file-upload accepted-format=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" description=\"Vuoi allegare un file per chiarire meglio la tua richiesta?\" file-max-size=\"50\" upload-btn-label=\"testo custom\" drag-and-drop-label=\"drag and drop custom label\" type=\"default\" variant=\"primary\">\n <mock:shadow-root>\n <div class=\"container default\">\n <span class=\"body-3-sb\">\n Vuoi allegare un file per chiarire meglio la tua richiesta?\n </span>\n <span class=\"body-3\">\n Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.\n </span>\n <section class=\"files-container hidden\">\n <span class=\"heading-4-sb\">\n File appena caricati\n </span>\n <div class=\"files-wrapper\">\n <slot name=\"files\"></slot>\n </div>\n <z-divider size=\"medium\"></z-divider>\n </section>\n <input accept=\".pdf, .doc, .tiff, .png, .jpg, .jpeg\" id=\"file-elem\" multiple=\"\" type=\"file\">\n <z-button icon=\"upload\" id=\"fileSelect\">\n testo custom\n </z-button>\n </div>\n </mock:shadow-root>\n >\n </z-file-upload>`);\n });\n});\n"]}

package/dist/collection/components/file-upload/z-file-upload/styles.css CHANGED Viewed

@@ -1,3 +1,8 @@
+*:focus {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 :host {
   color: var(--color-default-text);
   font-family: var(--font-family-sans);

package/dist/collection/components/z-app-header/styles.css CHANGED Viewed

@@ -240,6 +240,11 @@ z-searchbar {
   cursor: pointer;
 }
+.drawer-trigger:focus-visible {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 .drawer-trigger z-icon {
   --z-icon-width: var(--app-header-drawer-trigger-size);
   --z-icon-height: var(--app-header-drawer-trigger-size);

package/dist/collection/components/z-book-card/styles.css CHANGED Viewed

@@ -64,6 +64,11 @@
   cursor: pointer;
 }
+:host > article div.cover .ribbon.interactive:focus {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 :host > article div.cover .ribbon span {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -157,6 +162,11 @@
   fill: var(--color-primary01-icon);
 }
+:host > article ::slotted([slot="header-cta"]:focus) {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 /* EXPANDED STYLES */
 :host > article.expanded {

package/dist/collection/components/z-card/styles.css CHANGED Viewed

@@ -23,6 +23,11 @@ respecting the grid indications of the design. */
   box-sizing: border-box;
 }
+*:focus {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 :host(:not([variant="overlay"])) .cover-container {
   position: relative;
   width: 100%;
@@ -112,6 +117,11 @@ Unfortunately the `aspect-ratio` property is still experimental */
   text-decoration: none;
 }
+::slotted([slot="title"]:focus) {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 ::slotted([slot="text"]) {
   margin: 0;
   -webkit-line-clamp: 3;
@@ -129,6 +139,11 @@ Unfortunately the `aspect-ratio` property is still experimental */
   margin-right: calc(var(--space-unit) * 2);
 }
+::slotted([slot="action"]:focus) {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 :host([clickable]) ::slotted([slot="title"]:focus:focus-visible)::before {
   box-shadow: var(--shadow-focus-primary);
 }

package/dist/collection/components/z-input/styles-checkbox-radio.css CHANGED Viewed

@@ -104,9 +104,16 @@
 }
 /* focus */
-.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon,
+.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon {
+  border-radius: 50%;
+}
 .checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {
   border-radius: var(--border-radius-small);
+}
+.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon,
+.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {
   box-shadow: var(--shadow-focus-primary);
 }

package/dist/collection/components/z-input/styles-general.css CHANGED Viewed

@@ -44,7 +44,7 @@ textarea,
 /* FOCUS */
 :host:not(.active-select) input:focus:focus-visible,
-:host([readonly="false"]) .textarea-wrapper:focus-within {
+:host:not([readonly="true"]) .textarea-wrapper:focus-within {
   box-shadow: var(--shadow-focus-primary);
 }

package/dist/collection/components/z-input/styles-text.css CHANGED Viewed

@@ -74,6 +74,11 @@
   --z-icon-height: 16px;
 }
+.text-wrapper .icons-wrapper > button.icon-button:focus {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 /* stylelint-disable property-no-vendor-prefix */
 .text-wrapper > div > input:-webkit-autofill {
   -webkit-box-shadow: 0 0 0 1000px #fff inset;

package/dist/collection/components/z-modal/index.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { h } from "@stencil/core";
 import dialogPolyfill from "dialog-polyfill";
 import { KeyboardCode } from "../../beans";
+import { mobileBreakpoint } from "../../constants/breakpoints";
 const FOCUSABLE_ELEMENTS_SELECTOR = ':is(button, input, select, textarea, [contenteditable=""], [contenteditable="true"], a[href], [tabindex], summary):not([disabled], [disabled=""], [tabindex="-1"], [aria-hidden="true"], [hidden])';
 /**
  * @slot modalCloseButton - accept custom close button
@@ -29,6 +30,10 @@ export class ZModal {
             this.modalBackgroundClick.emit({ modalid: this.modalid });
         }
     }
+    handlePageOverflow() {
+        const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);
+        document.body.style["overflow-y"] = mobileMediaQuery.matches ? "hidden" : "";
+    }
     componentDidLoad() {
         if (typeof window.HTMLDialogElement !== "function") {
             /* workaround to fix `registerDialog` in test environment:
@@ -43,6 +48,7 @@ export class ZModal {
         else {
             this.open();
         }
+        this.handlePageOverflow();
     }
     /** open modal */
     async open() {
@@ -70,6 +76,9 @@ export class ZModal {
         ].filter((element) => getComputedStyle(element).display !== "none");
     }
     handleKeyDown(e) {
+        if (e.code === KeyboardCode.ESC && !this.closable) {
+            e.preventDefault();
+        }
         if (e.code !== KeyboardCode.TAB) {
             return;
         }
@@ -101,16 +110,16 @@ export class ZModal {
         e.preventDefault();
     }
     render() {
-        return (h("dialog", { key: '502c0fd42f37a498ef3ec2b2b174ac4950287883', class: {
+        return (h("dialog", { key: '50df4e07a74c86679fd2243e6795da0eeaae9c2c', class: {
                 "modal-dialog": !this.scrollInside,
-            }, "aria-labelledby": "modal-title", "aria-describedby": "modal-content", role: this.alertdialog ? "alertdialog" : undefined, ref: (el) => (this.dialog = el), onClose: () => this.emitModalClose(), onCancel: (e) => this.handleEscape(e) }, h("div", { key: '0dd9496ca11660307bcb8d751e8793659aa30741', class: {
+            }, "aria-labelledby": "modal-title", "aria-describedby": "modal-content", role: this.alertdialog ? "alertdialog" : undefined, ref: (el) => (this.dialog = el), onClose: () => this.emitModalClose(), onCancel: (e) => this.handleEscape(e) }, h("div", { key: '035ad0b71a6726e43c1fb52dae69257afd054525', class: {
                 "modal-container": true,
                 "modal-container-scroll-inside": this.scrollInside,
                 "modal-container-scroll-outside": !this.scrollInside,
-            }, id: this.modalid }, h("header", { key: '6952365a4a1d64e1ce23a9454f11cd4ae76e37ca', onClick: this.emitModalHeaderActive.bind(this) }, h("div", { key: 'fe219a40167ad9984255885bb189d9a9a0509cd5' }, this.modaltitle && h("h1", { key: '2991d4e6c254160dfe33e3558dc5db4d4dbf0abf', id: "modal-title" }, this.modaltitle), this.closeButtonSlot()), this.modalsubtitle && (h("div", { key: '5a612bc3eb027b488a37918794c4f24e1991a38d', class: "subtitle", id: "modal-subtitle" }, this.modalsubtitle))), h("div", { key: '34008ade3d0f05c701b4d94df647086a8de3cd27', class: {
+            }, id: this.modalid }, h("header", { key: '8f9e92a6c41e4dbff647c4140a1efc42adf258a9', onClick: this.emitModalHeaderActive.bind(this) }, h("div", { key: '3521275e24a100ba06c2f259ef239a361a6841e5' }, this.modaltitle && h("h1", { key: '3c345754f355fbe4cb7c0515404b01a3ff647b26', id: "modal-title" }, this.modaltitle), this.closeButtonSlot()), this.modalsubtitle && (h("div", { key: '5307334b7aca04ae351a0a69cbdaa6ec0ee32654', class: "subtitle", id: "modal-subtitle" }, this.modalsubtitle))), h("div", { key: 'fe5a158f3a0f0d6a06e83ce4cf32fb50ea5bf79f', class: {
                 "modal-content-scroll-inside": this.scrollInside,
                 "modal-content-scroll-outside": !this.scrollInside,
-            }, id: "modal-content" }, h("slot", { key: '7ce631a687090f9b69bafa8de5dbe76d21d2c554', name: "modalContent" }))), h("div", { key: '8fc40e271bec8219fbbbf208bbba900a74ebdec8', class: {
+            }, id: "modal-content" }, h("slot", { key: 'c2e5855dc48026fda519ad69bf5a7f9c3c1a2773', name: "modalContent" }))), h("div", { key: 'd7f80d8206c262bf5166ee1231d78eb0e55e4bb5', class: {
                 "modal-background": true,
                 "modal-background-scroll-outside": !this.scrollInside,
             }, "data-action": "modalBackground", "data-modal": this.modalid, onClick: () => {

package/dist/collection/components/z-modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-modal/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Listen, Method, Prop, h} from \"@stencil/core\";\nimport dialogPolyfill from \"dialog-polyfill\";\nimport {KeyboardCode} from \"../../beans\";\n\nconst FOCUSABLE_ELEMENTS_SELECTOR =\n ':is(button, input, select, textarea, [contenteditable=\"\"], [contenteditable=\"true\"], a[href], [tabindex], summary):not([disabled], [disabled=\"\"], [tabindex=\"-1\"], [aria-hidden=\"true\"], [hidden])';\n\n/*\n @slot modalCloseButton - accept custom close button\n * @slot modalContent - set the content of the modal\n /\n@Component({\n tag: \"z-modal\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZModal {\n /* unique id /\n @Prop()\n modalid: string;\n\n /* title text (optional) /\n @Prop()\n modaltitle?: string;\n\n /* subtitle (optional) /\n @Prop()\n modalsubtitle?: string;\n\n /* aria-label for close button (optional) /\n @Prop()\n closeButtonLabel = \"chiudi modale\";\n\n /* add role \"alertdialog\" to dialog (optional, default is false) /\n @Prop()\n alertdialog?: boolean = false;\n\n /* if true, the modal is closable (optional, default is true) /\n @Prop()\n closable?: boolean = true;\n\n /* if true, the modal can scroll inside, if false the viewport can scroll /\n @Prop()\n scrollInside?: boolean = true;\n\n private dialog: HTMLDialogElement;\n\n @Element() host: HTMLZModalElement;\n\n /* emitted on close button click, returns modalid /\n @Event()\n modalClose: EventEmitter;\n\n private emitModalClose(): void {\n if (this.closable) {\n this.modalClose.emit({modalid: this.modalid});\n }\n }\n\n /* emitted on modal header click, returns modalid /\n @Event()\n modalHeaderActive: EventEmitter;\n\n private emitModalHeaderActive(): void {\n this.modalHeaderActive.emit({modalid: this.modalid});\n }\n\n /* emitted on background click, returns modalid /\n @Event()\n modalBackgroundClick: EventEmitter;\n\n private emitBackgroundClick(): void {\n if (this.closable) {\n this.modalBackgroundClick.emit({modalid: this.modalid});\n }\n }\n\n componentDidLoad(): void {\n if (typeof window.HTMLDialogElement !== \"function\") {\n / workaround to fix `registerDialog` in test environment:\n stencil converts html elements to MockHTMLElement but this element is missing the `localName` property,\n which is used by `registerDialog` to recognize the element as dialog /\n if (!this.dialog.localName) {\n Object.defineProperty(this.dialog, \"localName\", {value: \"dialog\"});\n }\n dialogPolyfill.registerDialog(this.dialog);\n this.dialog.setAttribute(\"open\", \"true\");\n } else {\n this.open();\n }\n }\n\n /* open modal /\n @Method()\n async open(): Promise<void> {\n this.dialog?.showModal();\n }\n\n /* close modal /\n @Method()\n async close(): Promise<void> {\n if (this.closable) {\n this.dialog?.close();\n }\n }\n\n /\n Get a list of focusable elements in the dialog.\n * Remove elements with `display: none` from the list, because they're not focusable.\n \n N.B. The list is built on the assumption that elements inside shadow root are placed ALL before the `modalContent` slot.\n * Adding focusable elements after the `modalContent` slot would break the order of elements in the list.\n */\n private get focusableElements(): HTMLElement[] {\n return [\n ...Array.from(this.host.shadowRoot.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS_SELECTOR)),\n ...Array.from(this.host.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS_SELECTOR)),\n ].filter((element) => getComputedStyle(element).display !== \"none\");\n }\n\n @Listen(\"keydown\")\n handleKeyDown(e: KeyboardEvent): void {\n if (e.code !== KeyboardCode.TAB) {\n return;\n }\n\n const focusableElements = this.focusableElements;\n const shadowActiveElement = this.host.shadowRoot.activeElement;\n const activeElement = this.host.ownerDocument.activeElement;\n const firstFocusableElement = focusableElements[0];\n const lastFocusableElement = focusableElements[focusableElements.length - 1];\n if (e.shiftKey && (shadowActiveElement == firstFocusableElement \|\| activeElement == firstFocusableElement)) {\n // shift + tab was pressed and current active element is the first focusable element\n e.preventDefault();\n lastFocusableElement.focus();\n } else if (!e.shiftKey && (shadowActiveElement == lastFocusableElement \|\| activeElement == lastFocusableElement)) {\n // shift + tab was pressed and current active element is the first focusable element\n e.preventDefault();\n firstFocusableElement.focus();\n }\n }\n\n private closeButtonSlot(): HTMLElement \| void {\n if (this.closable) {\n return (\n <slot name=\"modalCloseButton\">\n <button\n aria-label={this.closeButtonLabel}\n onClick={() => this.close()}\n >\n <z-icon name=\"multiply-circle-filled\"></z-icon>\n </button>\n </slot>\n );\n }\n }\n\n private handleEscape(e: Event): void {\n if (this.closable) {\n return;\n }\n e.preventDefault();\n }\n\n render(): HTMLZModalElement {\n return (\n <dialog\n class={{\n \"modal-dialog\": !this.scrollInside,\n }}\n aria-labelledby=\"modal-title\"\n aria-describedby=\"modal-content\"\n role={this.alertdialog ? \"alertdialog\" : undefined}\n ref={(el) => (this.dialog = el as HTMLDialogElement)}\n onClose={() => this.emitModalClose()}\n onCancel={(e) => this.handleEscape(e)}\n >\n <div\n class={{\n \"modal-container\": true,\n \"modal-container-scroll-inside\": this.scrollInside,\n \"modal-container-scroll-outside\": !this.scrollInside,\n }}\n id={this.modalid}\n >\n <header onClick={this.emitModalHeaderActive.bind(this)}>\n <div>\n {this.modaltitle && <h1 id=\"modal-title\">{this.modaltitle}</h1>}\n {this.closeButtonSlot()}\n </div>\n {this.modalsubtitle && (\n <div\n class=\"subtitle\"\n id=\"modal-subtitle\"\n >\n {this.modalsubtitle}\n </div>\n )}\n </header>\n\n <div\n class={{\n \"modal-content-scroll-inside\": this.scrollInside,\n \"modal-content-scroll-outside\": !this.scrollInside,\n }}\n id=\"modal-content\"\n >\n <slot name=\"modalContent\"></slot>\n </div>\n </div>\n <div\n class={{\n \"modal-background\": true,\n \"modal-background-scroll-outside\": !this.scrollInside,\n }}\n data-action=\"modalBackground\"\n data-modal={this.modalid}\n onClick={() => {\n this.emitBackgroundClick();\n this.close();\n }}\n ></div>\n </dialog>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-modal/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Listen, Method, Prop, h} from \"@stencil/core\";\nimport dialogPolyfill from \"dialog-polyfill\";\nimport {KeyboardCode} from \"../../beans\";\nimport {mobileBreakpoint} from \"../../constants/breakpoints\";\n\nconst FOCUSABLE_ELEMENTS_SELECTOR =\n ':is(button, input, select, textarea, [contenteditable=\"\"], [contenteditable=\"true\"], a[href], [tabindex], summary):not([disabled], [disabled=\"\"], [tabindex=\"-1\"], [aria-hidden=\"true\"], [hidden])';\n\n/*\n @slot modalCloseButton - accept custom close button\n * @slot modalContent - set the content of the modal\n /\n@Component({\n tag: \"z-modal\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZModal {\n /* unique id /\n @Prop()\n modalid: string;\n\n /* title text (optional) /\n @Prop()\n modaltitle?: string;\n\n /* subtitle (optional) /\n @Prop()\n modalsubtitle?: string;\n\n /* aria-label for close button (optional) /\n @Prop()\n closeButtonLabel = \"chiudi modale\";\n\n /* add role \"alertdialog\" to dialog (optional, default is false) /\n @Prop()\n alertdialog?: boolean = false;\n\n /* if true, the modal is closable (optional, default is true) /\n @Prop()\n closable?: boolean = true;\n\n /* if true, the modal can scroll inside, if false the viewport can scroll /\n @Prop()\n scrollInside?: boolean = true;\n\n private dialog: HTMLDialogElement;\n\n @Element() host: HTMLZModalElement;\n\n /* emitted on close button click, returns modalid /\n @Event()\n modalClose: EventEmitter;\n\n private emitModalClose(): void {\n if (this.closable) {\n this.modalClose.emit({modalid: this.modalid});\n }\n }\n\n /* emitted on modal header click, returns modalid /\n @Event()\n modalHeaderActive: EventEmitter;\n\n private emitModalHeaderActive(): void {\n this.modalHeaderActive.emit({modalid: this.modalid});\n }\n\n /* emitted on background click, returns modalid /\n @Event()\n modalBackgroundClick: EventEmitter;\n\n private emitBackgroundClick(): void {\n if (this.closable) {\n this.modalBackgroundClick.emit({modalid: this.modalid});\n }\n }\n\n private handlePageOverflow(): void {\n const mobileMediaQuery = window.matchMedia(`(max-width: ${mobileBreakpoint}px)`);\n document.body.style[\"overflow-y\"] = mobileMediaQuery.matches ? \"hidden\" : \"\";\n }\n\n componentDidLoad(): void {\n if (typeof window.HTMLDialogElement !== \"function\") {\n / workaround to fix `registerDialog` in test environment:\n stencil converts html elements to MockHTMLElement but this element is missing the `localName` property,\n which is used by `registerDialog` to recognize the element as dialog /\n if (!this.dialog.localName) {\n Object.defineProperty(this.dialog, \"localName\", {value: \"dialog\"});\n }\n dialogPolyfill.registerDialog(this.dialog);\n this.dialog.setAttribute(\"open\", \"true\");\n } else {\n this.open();\n }\n\n this.handlePageOverflow();\n }\n\n /* open modal /\n @Method()\n async open(): Promise<void> {\n this.dialog?.showModal();\n }\n\n /* close modal /\n @Method()\n async close(): Promise<void> {\n if (this.closable) {\n this.dialog?.close();\n }\n }\n\n /\n Get a list of focusable elements in the dialog.\n * Remove elements with `display: none` from the list, because they're not focusable.\n \n N.B. The list is built on the assumption that elements inside shadow root are placed ALL before the `modalContent` slot.\n * Adding focusable elements after the `modalContent` slot would break the order of elements in the list.\n */\n private get focusableElements(): HTMLElement[] {\n return [\n ...Array.from(this.host.shadowRoot.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS_SELECTOR)),\n ...Array.from(this.host.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS_SELECTOR)),\n ].filter((element) => getComputedStyle(element).display !== \"none\");\n }\n\n @Listen(\"keydown\")\n handleKeyDown(e: KeyboardEvent): void {\n if (e.code === KeyboardCode.ESC && !this.closable) {\n e.preventDefault();\n }\n\n if (e.code !== KeyboardCode.TAB) {\n return;\n }\n\n const focusableElements = this.focusableElements;\n const shadowActiveElement = this.host.shadowRoot.activeElement;\n const activeElement = this.host.ownerDocument.activeElement;\n const firstFocusableElement = focusableElements[0];\n const lastFocusableElement = focusableElements[focusableElements.length - 1];\n if (e.shiftKey && (shadowActiveElement == firstFocusableElement \|\| activeElement == firstFocusableElement)) {\n // shift + tab was pressed and current active element is the first focusable element\n e.preventDefault();\n lastFocusableElement.focus();\n } else if (!e.shiftKey && (shadowActiveElement == lastFocusableElement \|\| activeElement == lastFocusableElement)) {\n // shift + tab was pressed and current active element is the first focusable element\n e.preventDefault();\n firstFocusableElement.focus();\n }\n }\n\n private closeButtonSlot(): HTMLElement \| void {\n if (this.closable) {\n return (\n <slot name=\"modalCloseButton\">\n <button\n aria-label={this.closeButtonLabel}\n onClick={() => this.close()}\n >\n <z-icon name=\"multiply-circle-filled\"></z-icon>\n </button>\n </slot>\n );\n }\n }\n\n private handleEscape(e: Event): void {\n if (this.closable) {\n return;\n }\n e.preventDefault();\n }\n\n render(): HTMLZModalElement {\n return (\n <dialog\n class={{\n \"modal-dialog\": !this.scrollInside,\n }}\n aria-labelledby=\"modal-title\"\n aria-describedby=\"modal-content\"\n role={this.alertdialog ? \"alertdialog\" : undefined}\n ref={(el) => (this.dialog = el as HTMLDialogElement)}\n onClose={() => this.emitModalClose()}\n onCancel={(e) => this.handleEscape(e)}\n >\n <div\n class={{\n \"modal-container\": true,\n \"modal-container-scroll-inside\": this.scrollInside,\n \"modal-container-scroll-outside\": !this.scrollInside,\n }}\n id={this.modalid}\n >\n <header onClick={this.emitModalHeaderActive.bind(this)}>\n <div>\n {this.modaltitle && <h1 id=\"modal-title\">{this.modaltitle}</h1>}\n {this.closeButtonSlot()}\n </div>\n {this.modalsubtitle && (\n <div\n class=\"subtitle\"\n id=\"modal-subtitle\"\n >\n {this.modalsubtitle}\n </div>\n )}\n </header>\n\n <div\n class={{\n \"modal-content-scroll-inside\": this.scrollInside,\n \"modal-content-scroll-outside\": !this.scrollInside,\n }}\n id=\"modal-content\"\n >\n <slot name=\"modalContent\"></slot>\n </div>\n </div>\n <div\n class={{\n \"modal-background\": true,\n \"modal-background-scroll-outside\": !this.scrollInside,\n }}\n data-action=\"modalBackground\"\n data-modal={this.modalid}\n onClick={() => {\n this.emitBackgroundClick();\n this.close();\n }}\n ></div>\n </dialog>\n );\n }\n}\n"]}

package/dist/collection/components/z-modal/styles.css CHANGED Viewed

@@ -1,3 +1,9 @@
+*:focus {
+  border-radius: 50%;
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 :host {
   font-family: var(--font-family-sans);
   font-weight: var(--font-rg);
@@ -49,7 +55,8 @@
 }
 .modal-container > header {
-  padding: calc(var(--space-unit) * 2 - 2px) calc(var(--space-unit) * 2);
+  padding: calc(var(--space-unit) * 1.75) calc(var(--space-unit) * 2) calc(var(--space-unit) * 1.75)
+    calc(var(--space-unit) * 2);
   background: var(--color-surface02);
 }
@@ -63,8 +70,8 @@
 }
 .modal-container > header z-icon {
-  --z-icon-width: calc(var(--space-unit) * 2.5);
-  --z-icon-height: calc(var(--space-unit) * 2.5);
+  --z-icon-width: calc(var(--space-unit) * 2.25);
+  --z-icon-height: calc(var(--space-unit) * 2.25);
   display: flex;
   fill: var(--color-primary01-icon);
@@ -73,7 +80,7 @@
 .modal-container > header > div {
   display: flex;
   width: 100%;
-  align-items: center;
+  align-items: baseline;
   margin-right: calc(var(--space-unit) * 2);
 }
@@ -82,7 +89,7 @@
   padding: 0;
   margin: 0;
   color: var(--color-default-text);
-  font-weight: var(--font-rg);
+  font-weight: var(--font-sb);
 }
 .modal-container > header h1 {
@@ -93,6 +100,7 @@
 .modal-container > header .subtitle {
   font-size: var(--font-size-3);
+  font-weight: var(--font-rg);
   letter-spacing: 0;
   line-height: 1.5;
 }
@@ -213,34 +221,25 @@
   .modal-dialog::-webkit-scrollbar {
     display: none;
   }
-  .modal-container > header z-icon {
-    --z-icon-width: calc(var(--space-unit) * 3);
-    --z-icon-height: calc(var(--space-unit) * 3);
-  }
-}
-/* Tablet */
-@media only screen and (min-width: 768px) and (max-width: 1151px) {
-  .modal-container > header {
-    padding: calc(var(--space-unit) * 3 - 2px) calc(var(--space-unit) * 3);
-  }
 }
 /* Desktop */
 @media only screen and (min-width: 1152px) {
   .modal-container > header {
-    padding: calc(var(--space-unit) * 4 - 4px) calc(var(--space-unit) * 4);
+    padding-top: calc(var(--space-unit) * 1.5);
+    padding-bottom: calc(var(--space-unit) * 1.5);
   }
   .modal-container > header h1 {
     font-size: var(--font-size-6);
+    font-weight: var(--font-sb);
     letter-spacing: 0;
-    line-height: 1.33;
+    line-height: 1.333;
   }
   .modal-container > header .subtitle {
     font-size: var(--font-size-4);
+    font-weight: var(--font-rg);
     letter-spacing: 0;
     line-height: 1.5;
   }

package/dist/collection/components/z-navigation-tabs/styles.css CHANGED Viewed

@@ -134,7 +134,7 @@ z-navigation-tabs > nav > a {
 z-navigation-tabs > nav > *:focus:focus-visible {
   z-index: 1;
-  box-shadow: inset 0 0 4px 3px var(--color-highlight);
+  box-shadow: inset 0 0 4px 3px var(--blue800);
 }
 z-navigation-tabs > nav > :not([disabled]):hover {

package/dist/collection/components/z-notification/styles.css CHANGED Viewed

@@ -94,6 +94,11 @@
   line-height: 16px;
 }
+.action-button:focus {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 .content-container + .close-button {
   margin-left: calc(var(--space-unit) * 2);
 }
@@ -103,7 +108,7 @@
 }
 /* Tablet breakpoint */
-@media and (min-width: 768px) {
+@media only screen and (min-width: 768px) {
   .content-container {
     flex-wrap: nowrap;
   }

package/dist/collection/components/z-searchbar/styles.css CHANGED Viewed

@@ -14,6 +14,11 @@
   box-sizing: border-box;
 }
+*:focus {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none !important;
+}
 .input-container {
   position: relative;
   display: flex;

package/dist/collection/components/z-stepper/index.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import { Host, h } from "@stencil/core";
 /**
- * @slot - slot for `z-stepper-item`s
+ * @slot - slot for `z-stepper-item`
  */
 export class ZStepper {
     render() {
-        return (h(Host, { key: 'c1069a6d199240aa1e8eb9fe30be9a75b2dabecb', role: "list" }, h("slot", { key: '283f1f42d5f73259b7c04e965bf592e4ba543fc8' })));
+        return (h(Host, { key: '80b89caa35e9adb82ad413783b16eae491a26f48', role: "list" }, h("slot", { key: '140e35a55637873b1eee70d5a7a8c2b03af3eed7' })));
     }
     static get is() { return "z-stepper"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-stepper/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-stepper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAEjD;;GAEG;AAMH,MAAM,OAAO,QAAQ;IACnB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,MAAM;YACf,8DAAQ,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import {Component, Host, h} from \"@stencil/core\";\n\n/*\n @slot - slot for `z-stepper-item~~`s\~~n */\n@Component({\n tag: \"z-stepper\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZStepper {\n render(): HTMLSlotElement {\n return (\n <Host role=\"list\">\n <slot />\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-stepper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAEjD;;GAEG;AAMH,MAAM,OAAO,QAAQ;IACnB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDAAC,IAAI,EAAC,MAAM;YACf,8DAAQ,CACH,CACR,CAAC;IACJ,CAAC;;;;;;;;;CACF","sourcesContent":["import {Component, Host, h} from \"@stencil/core\";\n\n/*\n @slot - slot for `z-stepper-item`\n */\n@Component({\n tag: \"z-stepper\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZStepper {\n render(): HTMLSlotElement {\n return (\n <Host role=\"list\">\n <slot />\n </Host>\n );\n }\n}\n"]}