@watermarkinsights/ripple 4.0.0-9 → 4.0.0

package/dist/collection/components/wm-tag-input/wm-tag-option/wm-tag-option.js

@@ -0,0 +1,241 @@
+import { generateId } from "../../../global/functions";
+export class TagOption {
+  constructor() {
+    this.selected = false;
+    this.locked = false;
+    this.col1 = undefined;
+    this.col2 = undefined;
+    this.col3 = undefined;
+    this.col4 = undefined;
+  }
+  async emitSelectedEvent() {
+    this.wmTagOptionSelected.emit();
+  }
+  async emitDeselectedEvent() {
+    this.wmTagOptionDeselected.emit();
+  }
+  componentWillLoad() {
+    if (!this.el.id) {
+      this.el.id = generateId();
+    }
+  }
+  handleSelected() {
+    // to update tag input when options state change.
+    this.selected ? this.privTagOptionSelected.emit() : this.privTagOptionDeselected.emit();
+  }
+  static get is() { return "wm-tag-option"; }
+  static get properties() {
+    return {
+      "selected": {
+        "type": "boolean",
+        "mutable": true,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "selected",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "locked": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "locked",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "col1": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "col1",
+        "reflect": false
+      },
+      "col2": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "col2",
+        "reflect": false
+      },
+      "col3": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "col3",
+        "reflect": false
+      },
+      "col4": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string | undefined",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "col4",
+        "reflect": false
+      }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "privTagOptionSelected",
+        "name": "privTagOptionSelected",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "privTagOptionDeselected",
+        "name": "privTagOptionDeselected",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "void",
+          "resolved": "void",
+          "references": {}
+        }
+      }, {
+        "method": "wmTagOptionSelected",
+        "name": "wmTagOptionSelected",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }, {
+        "method": "wmTagOptionDeselected",
+        "name": "wmTagOptionDeselected",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get methods() {
+    return {
+      "emitSelectedEvent": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      },
+      "emitDeselectedEvent": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      }
+    };
+  }
+  static get elementRef() { return "el"; }
+  static get watchers() {
+    return [{
+        "propName": "selected",
+        "methodName": "handleSelected"
+      }];
+  }
+}

package/dist/collection/components/wm-uploader/wm-uploader.e2e.js

@@ -1,13 +1,15 @@
 import { newE2EPage } from "@stencil/core/testing";
 import { AxePuppeteer } from "@axe-core/puppeteer";
 describe("wm-uploader", () => {
-  let page, component, input, label;
+  let page, input, label;
   beforeEach(async () => {
     page = await newE2EPage();
     await page.setContent(`<html lang='en'><head><title>Page</title></head><body><main><h1>Title</h1>
-      <wm-uploader button-text="Upload new document" empty-state-text="Browse and upload files" files='[{"id": "file1", "name": "File retrieved from server", "type": "pdf", "lastUpdated": "2020-01-28T22:29:10.397Z"},{"id": "file2", "name": "Second file", "type": "jpeg", "lastUpdated": "2019-02-14T12:21:05.397Z"}]' ></wm-uploader>
+      <wm-uploader button-text="Upload new document">
+        <wm-file id="file1" name="File retrieved from server" type="pdf" last-updated="2020-01-28T22:29:10.397Z"></wm-file>
+        <wm-file id="file2" name="Second file" type="jpeg" last-updated="2019-02-14T12:21:05.397Z"></wm-file>
+      </wm-uploader>
       </main></body></html>`);
-    component = await page.find("wm-uploader");
     input = await page.find("wm-uploader >>> input[type='file']");
     label = await page.find("wm-uploader >>> label");
     await page.waitForChanges();
@@ -23,65 +25,42 @@ describe("wm-uploader", () => {
   it("focuses previous file when deleting with the keyboard", async () => {
     page = await newE2EPage();
     await page.setContent(`<html lang='en'><head><title>Page</title></head><body><main><h1>Title</h1>
-      <wm-uploader button-text="Upload new document" empty-state-text="Browse and upload files"
-      files='[{"id": "file1", "name": "And another", "type": "exe", "lastUpdated": "2010-11-14T12:21:05.397Z", "fileActions": "preview delete", "size": "7650620"},{"id": "file2", "name": "File retrieved from server", "type": "pdf", "lastUpdated": "2011-01-28T22:29:10.397Z", "fileActions": "", "size": "92620"},{"id": "file3", "name": "File retrieved from server2", "type": "pdf", "lastUpdated": "2012-01-28T22:29:10.397Z", "fileActions": "preview download delete", "size": "92620"},{"id": "file4", "name": "File retrieved from server4", "type": "pdf", "lastUpdated": "2013-01-28T22:29:10.397Z", "fileActions": "preview download delete", "size": "92620"}]'
-      ></wm-uploader>
+      <wm-uploader button-text="Upload new document">
+        <wm-file id="file1" name="First file" type="pdf" file-actions="preview delete"></wm-file>
+        <wm-file id="file2" name="Second file" type="pdf" file-actions="delete"></wm-file>
+      </wm-uploader>
       </main></body></html>`);
     await page.waitForChanges();
-    component = await page.find("wm-uploader");
-    let fileEls = await page.findAll("wm-uploader >>> wm-file");
+    let fileEls = await page.findAll("wm-file");
+    let secondFileEl = fileEls[1];
     // inital check of file count
-    expect(fileEls.length).toBe(4);
+    expect(fileEls.length).toBe(2);
     // user must be tabbing for these changes to occur
     await page.keyboard.press("Tab");
     await page.keyboard.press("Tab");
     await page.keyboard.press("Tab");
     await page.keyboard.press("Tab");
-    await page.keyboard.press("Tab");
-    await page.keyboard.press("Tab");
-    await page.keyboard.press("Tab");
-    await page.keyboard.press("Tab");
-    await page.keyboard.press("Tab");
     await page.keyboard.press("Enter");
     await page.waitForChanges();
     // check focused element is last file, delete button
-    let activeElId = await page.evaluate(() => document.activeElement.shadowRoot.activeElement.id);
-    expect(activeElId).toBe("file-file4");
-    let activeElButtonType = await page.evaluate(() => { var _a; return (_a = document.activeElement.shadowRoot.activeElement.shadowRoot.activeElement) === null || _a === void 0 ? void 0 : _a.classList[0]; });
+    let activeElId = await page.evaluate(() => document.activeElement.id);
+    expect(activeElId).toBe("file2");
+    let activeElButtonType = await page.evaluate(() => document.activeElement.shadowRoot.activeElement.classList[0]);
     expect(activeElButtonType).toBe("delete-button");
-    // remove last file
-    component.setProperty("files", '[{"id": "file1", "name": "And another", "type": "exe", "lastUpdated": "2010-11-14T12:21:05.397Z", "fileActions": "preview delete", "size": "7650620"},{"id": "file2", "name": "File retrieved from server", "type": "pdf", "lastUpdated": "2011-01-28T22:29:10.397Z", "fileActions": "", "size": "92620"},{"id": "file3", "name": "File retrieved from server2", "type": "pdf", "lastUpdated": "2012-01-28T22:29:10.397Z", "fileActions": "preview download delete", "size": "92620"}]');
+    let mockFileDeleteEvent = new CustomEvent("wmFileDelete");
+    //@ts-ignore
+    mockFileDeleteEvent.target = secondFileEl;
+    secondFileEl.dispatchEvent(mockFileDeleteEvent);
+    await page.evaluate(() => { var _a; return (_a = document.getElementById("file2")) === null || _a === void 0 ? void 0 : _a.remove(); });
     await page.waitForChanges();
     // confirm file has been removed
-    fileEls = await page.findAll("wm-uploader >>> wm-file");
-    expect(fileEls.length).toBe(3);
-    // check focused element is what was preceding removed element
-    activeElId = await page.evaluate(() => document.activeElement.shadowRoot.activeElement.id);
-    expect(activeElId).toBe("file-file3");
-    activeElButtonType = await page.evaluate(() => { var _a; return (_a = document.activeElement.shadowRoot.activeElement.shadowRoot.activeElement) === null || _a === void 0 ? void 0 : _a.classList[0]; });
-    expect(activeElButtonType).toBe("delete-button");
-    // remove last file
-    // in this case focus should go to file1 not file2, because file2 does not have any file action buttons
-    component.setProperty("files", '[{"id": "file1", "name": "And another", "type": "exe", "lastUpdated": "2010-11-14T12:21:05.397Z", "fileActions": "preview delete", "size": "7650620"},{"id": "file2", "name": "File retrieved from server", "type": "pdf", "lastUpdated": "2011-01-28T22:29:10.397Z", "fileActions": "", "size": "92620"}]');
-    await page.waitForChanges();
-    // confirm file has been removed
-    fileEls = await page.findAll("wm-uploader >>> wm-file");
-    expect(fileEls.length).toBe(2);
-    // check focused element is what was preceding removed element
-    activeElId = await page.evaluate(() => document.activeElement.shadowRoot.activeElement.id);
-    expect(activeElId).toBe("file-file1");
-    activeElButtonType = await page.evaluate(() => { var _a; return (_a = document.activeElement.shadowRoot.activeElement.shadowRoot.activeElement) === null || _a === void 0 ? void 0 : _a.classList[0]; });
-    expect(activeElButtonType).toBe("delete-button");
-    // remove first file
-    // in this case focus should go to the upload button
-    component.setProperty("files", '[{"id": "file2", "name": "File retrieved from server", "type": "pdf", "lastUpdated": "2011-01-28T22:29:10.397Z", "fileActions": "", "size": "92620"}]');
-    await page.waitForChanges();
-    // confirm file has been removed
-    fileEls = await page.findAll("wm-uploader >>> wm-file");
+    fileEls = await page.findAll("wm-file");
     expect(fileEls.length).toBe(1);
-    // check focused element is what was preceding removed element (upload button)
-    activeElId = await page.evaluate(() => document.activeElement.shadowRoot.activeElement.nodeName);
-    expect(activeElId).toBe("INPUT");
+    // check focused element is last file, delete button
+    activeElId = await page.evaluate(() => document.activeElement.id);
+    expect(activeElId).toBe("file1");
+    activeElButtonType = await page.evaluate(() => document.activeElement.shadowRoot.activeElement.classList[0]);
+    expect(activeElButtonType).toBe("delete-button");
   });
   //  it("disables the button dynamically", async () => {
   // disabled when maxed out

package/dist/collection/components/wm-uploader/wm-uploader.js

@@ -276,11 +276,11 @@ export class Uploader {
         "defaultValue": "\"pdf txt log xml doc docx xls xlsx ppt pptx gif jpg jpeg png csv\""
       },
       "maxSize": {
-        "type": "number",
+        "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "number | null",
-          "resolved": "null | number | undefined",
+          "original": "string",
+          "resolved": "string | undefined",
           "references": {}
         },
         "required": false,