@zanichelli/albe-web-components 12.4.1-RC1 → 12.4.1

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

@@ -0,0 +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, Prop, h, EventEmitter, Event, State, Listen, Element, Host, Method} 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  /** 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    const files = this.files;\n    const file = files.find((file) => file.name === e.detail.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  /** 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  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'estensione non prevista\";\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 <span class=\"body-3\">{fileFormatString || fileWeightString ? finalString : null}</span>;\n  }\n\n  private renderFileSection(): HTMLElement {\n    return (\n      <section class={`files-container ${!this.files.length ? \"hidden\" : \"\"}`}>\n        <span class=\"heading-4-sb\">File appena caricati</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        Trascina o{\" \"}\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          carica\n        </span>{\" \"}\n        dal tuo computer\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] ? \", ed \" : \"\";\n\n    return `Il file ${key} ${value[0] ?? \"\"}${bothErrors}${value[1] ?? \"\"}.`;\n  }\n\n  private handleErrorModalContent(): HTMLDivElement {\n    return (\n      <div slot=\"modalContent\">\n        <div class=\"modal-wrapper\">\n          <div class=\"files\">\n            {Array.from(this.invalidFiles).map(([key, value]) => {\n              return <span class=\"body-3\">{this.formatErrorString(key, value)}</span>;\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=\"Attenzione\"\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

@@ -0,0 +1,136 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { ZFileUpload } from "./index";
+describe("Suite test ZFileUpload", () => {
+    it("Test render ZFileUpload default", async () => {
+        const page = await newSpecPage({
+            components: [ZFileUpload],
+            html: `<z-file-upload type="default"
+                            variant="primary"
+                            main-title="Allega un file"
+                            description="Vuoi allegare un file per chiarire meglio la tua richiesta?"
+                            accepted-format= ".pdf, .doc, .tiff, .png, .jpg, .jpeg"
+                            file-max-size="50">>
+             </z-file-upload>`,
+        });
+        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">
+         <span id="title">
+           Allega un file
+         </span>
+         <span class="body-3-sb">
+           Vuoi allegare un file per chiarire meglio la tua richiesta?
+         </span>
+         <span class="body-3">
+           Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.
+         </span>
+         <section class="files-container hidden">
+          <span class="heading-4-sb">
+            File appena caricati
+          </span>
+          <div class="files-wrapper">
+            <slot name="files"></slot>
+          </div>
+          <z-divider size="medium"></z-divider>
+         </section>
+         <input accept=".pdf, .doc, .tiff, .png, .jpg, .jpeg" id="file-elem" multiple="" type="file">
+         <z-button icon="upload" id="fileSelect">
+           allega
+         </z-button>
+       </div>
+      </mock:shadow-root>
+      &gt;
+    </z-file-upload>`);
+    });
+    it("Test render ZFileUpload dragdrop", async () => {
+        const page = await newSpecPage({
+            components: [ZFileUpload],
+            html: `<z-file-upload type="dragdrop"
+                            main-title="Allega un file"
+                            description="Vuoi allegare un file per chiarire meglio la tua richiesta?"
+                            accepted-format= ".pdf, .doc, .tiff, .png, .jpg, .jpeg"
+                            file-max-size="50">>
+             </z-file-upload>`,
+        });
+        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">
+         <span id="title">
+           Allega un file
+         </span>
+         <section class="files-container hidden">
+          <span class="heading-4-sb">
+            File appena caricati
+          </span>
+          <div class="files-wrapper">
+            <slot name="files"></slot>
+          </div>
+          <z-divider size="medium"></z-divider>
+         </section>
+         <z-dragdrop-area drag-and-drop-label="Rilascia i file in questa area per allegarli.">
+           <div class="text-container">
+             <span class="body-1">
+               Vuoi allegare un file per chiarire meglio la tua richiesta?
+             </span>
+             <input accept=".pdf, .doc, .tiff, .png, .jpg, .jpeg" id="file-elem" multiple="" type="file">
+             <span class="body-1 upload-link-text">
+               Trascina o
+               <span class="body-1-sb upload-link" tabindex="0">
+                 carica
+               </span>
+               dal tuo computer
+             </span>
+             <span class="body-3">
+               Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.
+             </span>
+           </div>
+         </z-dragdrop-area>
+       </div>
+      </mock:shadow-root>
+      &gt;
+      </z-file-upload>`);
+    });
+    it("Test render ZFileUpload with custom label and not main-title", async () => {
+        const page = await newSpecPage({
+            components: [ZFileUpload],
+            html: `<z-file-upload type="default"
+                            variant="primary"
+                            description="Vuoi allegare un file per chiarire meglio la tua richiesta?"
+                            accepted-format=".pdf, .doc, .tiff, .png, .jpg, .jpeg"
+                            upload-btn-label="testo custom"
+                            drag-and-drop-label="drag and drop custom label"
+                            file-max-size="50">>
+             </z-file-upload>`,
+        });
+        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">
+         <span class="body-3-sb">
+           Vuoi allegare un file per chiarire meglio la tua richiesta?
+         </span>
+         <span class="body-3">
+           Puoi allegare file nei formati PDF, DOC, TIFF, PNG, JPG, JPEG per un massimo di 50MB di peso.
+         </span>
+         <section class="files-container hidden">
+          <span class="heading-4-sb">
+            File appena caricati
+          </span>
+          <div class="files-wrapper">
+            <slot name="files"></slot>
+          </div>
+          <z-divider size="medium"></z-divider>
+         </section>
+         <input accept=".pdf, .doc, .tiff, .png, .jpg, .jpeg" id="file-elem" multiple="" type="file">
+         <z-button icon="upload" id="fileSelect">
+           testo custom
+         </z-button>
+       </div>
+      </mock:shadow-root>
+      &gt;
+    </z-file-upload>`);
+    });
+});
+//# sourceMappingURL=index.spec.js.map

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

@@ -0,0 +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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;uBAoCI,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      &gt;\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               Trascina o\n               <span class=\"body-1-sb upload-link\" tabindex=\"0\">\n                 carica\n               </span>\n               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      &gt;\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      &gt;\n    </z-file-upload>`);\n  });\n});\n"]}

package/dist/collection/components/file-upload/z-file-upload/test.e2e.js

@@ -0,0 +1,69 @@
+import { newE2EPage } from "@stencil/core/testing";
+describe("z-file-upload test end2end", () => {
+    it("Test z-file-upload -> add z-file by click", async () => {
+        const page = await newE2EPage();
+        await page.setContent(`
+    <z-file-upload type="default"
+      button-variant="primary"
+      main-title="Allega un file"
+      description="Vuoi allegare un file per chiarire meglio la tua richiesta?"
+      accepted-format= ".pdf, .doc, .tiff, .png, .jpg, .jpeg"
+      file-max-size="50">
+    </z-file-upload>
+  `);
+        const zfu = await page.find("z-file-upload");
+        await zfu.setProperty("acceptedFormat", ".md");
+        await page.waitForChanges();
+        // simulate upload of file
+        const button = await page.find("z-file-upload >>> div z-button >>> button");
+        button.click();
+        const fileChooser = await page.waitForFileChooser();
+        const fileInputEvent = await zfu.spyOnEvent("fileInput");
+        await fileChooser.accept(["./readme.md"]);
+        await page.waitForChanges();
+        expect(fileInputEvent).toHaveReceivedEvent();
+    });
+    it("Test z-file-upload -> add z-file by click ERROR: wrong file type", async () => {
+        const page = await newE2EPage();
+        await page.setContent(`
+    <z-file-upload type="default"
+      button-variant="primary"
+      main-title="Allega un file"
+      description="Vuoi allegare un file per chiarire meglio la tua richiesta?"
+      accepted-format= ".pdf, .doc, .tiff, .png, .jpg, .jpeg"
+      file-max-size="50">
+    </z-file-upload>
+  `);
+        const zfu = await page.find("z-file-upload");
+        // simulate upload of file
+        const button = await page.find("z-file-upload >>> div z-button >>> button");
+        button.click();
+        const fileChooser = await page.waitForFileChooser();
+        const fileInputEvent = await zfu.spyOnEvent("fileInput");
+        await fileChooser.accept(["./readme.md"]);
+        await page.waitForChanges();
+        expect(fileInputEvent).not.toHaveReceivedEvent();
+        const errorModal = await page.find("z-file-upload >>> z-modal");
+        expect(errorModal).not.toBeNull();
+    });
+    it("Test z-file-upload -> remove z-file", async () => {
+        const page = await newE2EPage();
+        await page.setContent(`
+    <z-file-upload type="default"
+      button-variant="primary"
+      main-title="Allega un file"
+      description="Vuoi allegare un file per chiarire meglio la tua richiesta?"
+      accepted-format= ".pdf, .doc, .tiff, .png, .jpg, .jpeg"
+      file-max-size="50">
+        <z-file slot="files" class="hydrated">Spike - Condivisione pagine Kitaboo-OK.pdf</z-file>
+    </z-file-upload>
+    `);
+        const zf = await page.find("z-file-upload z-file");
+        expect(zf).not.toBeNull();
+        page.evaluate(() => document.querySelector("z-file-upload z-file z-chip z-icon").click());
+        await page.waitForChanges();
+        const zfCheck = await page.find("z-file-upload z-file");
+        expect(zfCheck).toBeNull();
+    });
+});
+//# sourceMappingURL=test.e2e.js.map

package/dist/collection/components/file-upload/z-file-upload/test.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"test.e2e.js","sourceRoot":"","sources":["../../../../src/components/file-upload/z-file-upload/test.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import {newE2EPage} from \"@stencil/core/testing\";\n\ndescribe(\"z-file-upload test end2end\", () => {\n  it(\"Test z-file-upload -> add z-file by click\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`\n    <z-file-upload type=\"default\"\n      button-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    const zfu = await page.find(\"z-file-upload\");\n\n    await zfu.setProperty(\"acceptedFormat\", \".md\");\n    await page.waitForChanges();\n\n    // simulate upload of file\n    const button = await page.find(\"z-file-upload >>> div z-button >>> button\");\n    button.click();\n    const fileChooser = await page.waitForFileChooser();\n\n    const fileInputEvent = await zfu.spyOnEvent(\"fileInput\");\n\n    await fileChooser.accept([\"./readme.md\"]);\n    await page.waitForChanges();\n\n    expect(fileInputEvent).toHaveReceivedEvent();\n  });\n\n  it(\"Test z-file-upload -> add z-file by click ERROR: wrong file type\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`\n    <z-file-upload type=\"default\"\n      button-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    const zfu = await page.find(\"z-file-upload\");\n\n    // simulate upload of file\n    const button = await page.find(\"z-file-upload >>> div z-button >>> button\");\n    button.click();\n    const fileChooser = await page.waitForFileChooser();\n\n    const fileInputEvent = await zfu.spyOnEvent(\"fileInput\");\n\n    await fileChooser.accept([\"./readme.md\"]);\n    await page.waitForChanges();\n\n    expect(fileInputEvent).not.toHaveReceivedEvent();\n\n    const errorModal = await page.find(\"z-file-upload >>> z-modal\");\n    expect(errorModal).not.toBeNull();\n  });\n\n  it(\"Test z-file-upload -> remove z-file\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`\n    <z-file-upload type=\"default\"\n      button-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 slot=\"files\" class=\"hydrated\">Spike - Condivisione pagine Kitaboo-OK.pdf</z-file>\n    </z-file-upload>\n    `);\n\n    const zf = await page.find(\"z-file-upload z-file\");\n\n    expect(zf).not.toBeNull();\n\n    page.evaluate(() => (document.querySelector(\"z-file-upload z-file z-chip z-icon\") as HTMLElement).click());\n    await page.waitForChanges();\n    const zfCheck = await page.find(\"z-file-upload z-file\");\n\n    expect(zfCheck).toBeNull();\n  });\n});\n"]}