genesys-spark-components 4.0.0-beta.38 → 4.0.0-beta.39

package/dist/collection/components/legacy/gux-tabs-advanced-legacy/gux-tab-advanced-panel/gux-tab-advanced-panel.js

@@ -1,107 +0,0 @@
-import { h } from "@stencil/core";
-/**
- * @slot - content
- */
-export class GuxTabAdvancedPanelLegacy {
-  constructor() {
-    this.tabId = undefined;
-    this.active = false;
-  }
-  // eslint-disable-next-line @typescript-eslint/require-await
-  async guxSetActive(active) {
-    this.active = active;
-  }
-  watchActivePanel() {
-    if (this.active === true) {
-      this.guxactivepanelchange.emit(this.tabId);
-    }
-  }
-  render() {
-    return (h("div", { id: `gux-${this.tabId}-panel`, role: "tabpanel", "aria-labelledby": `gux-${this.tabId}-tab`, tabIndex: 0, hidden: !this.active, "aria-live": "assertive" }, h("slot", null)));
-  }
-  static get is() { return "gux-tab-advanced-panel-legacy"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["gux-tab-advanced-panel.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["gux-tab-advanced-panel.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "tabId": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "tab-id",
-        "reflect": false
-      }
-    };
-  }
-  static get states() {
-    return {
-      "active": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "guxactivepanelchange",
-        "name": "guxactivepanelchange",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        }
-      }];
-  }
-  static get methods() {
-    return {
-      "guxSetActive": {
-        "complexType": {
-          "signature": "(active: boolean) => Promise<void>",
-          "parameters": [{
-              "tags": [],
-              "text": ""
-            }],
-          "references": {
-            "Promise": {
-              "location": "global",
-              "id": "global::Promise"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": []
-        }
-      }
-    };
-  }
-  static get watchers() {
-    return [{
-        "propName": "active",
-        "methodName": "watchActivePanel"
-      }];
-  }
-}

package/dist/collection/components/legacy/gux-tabs-advanced-legacy/gux-tabs-advanced.css

@@ -1,3 +0,0 @@
-gux-tabs-advanced-legacy {
-  -custom-noop: noop;
-}

package/dist/collection/components/legacy/gux-tabs-advanced-legacy/gux-tabs-advanced.js

@@ -1,148 +0,0 @@
-import { h, Host } from "@stencil/core";
-import { trackComponent } from "../../../utils/tracking/usage";
-/**
- * @slot tab-list - Slot for gux-tab-advanced-list element
- * @slot - collection of gux-tab-advanced-panel elements
- */
-export class GuxTabsAdvancedLegacy {
-  constructor() {
-    this.tabList = undefined;
-    this.tabPanels = [];
-    this.activeTab = undefined;
-  }
-  watchActiveTab(newValue) {
-    this.activateTab(newValue, this.tabList, this.tabPanels);
-    this.guxactivetabchange.emit(newValue);
-  }
-  onInternalActivateTabPanel(event) {
-    event.stopPropagation();
-    const tabId = event.detail;
-    this.activateTab(tabId, this.tabList, this.tabPanels);
-  }
-  // eslint-disable-next-line @typescript-eslint/require-await
-  async guxActivate(tabId) {
-    this.activateTab(tabId, this.tabList, this.tabPanels);
-  }
-  onSlotchange() {
-    const [tabListSlot, defaultSlot] = Array.from(this.root.shadowRoot.querySelectorAll('slot'));
-    this.tabList =
-      tabListSlot.assignedElements()[0];
-    this.tabPanels =
-      defaultSlot.assignedElements();
-    this.activateTab(this.activeTab, this.tabList, this.tabPanels);
-  }
-  activateTab(tabId, tabList, panels) {
-    var _a;
-    if (tabId) {
-      this.activeTab = tabId;
-    }
-    else {
-      this.activeTab = (_a = tabList === null || tabList === void 0 ? void 0 : tabList.querySelector('gux-tab-advanced-legacy')) === null || _a === void 0 ? void 0 : _a.getAttribute('tab-id');
-    }
-    void tabList.guxSetActive(this.activeTab);
-    panels.forEach(panel => void panel.guxSetActive(panel.tabId === this.activeTab));
-  }
-  componentWillLoad() {
-    trackComponent(this.root);
-  }
-  render() {
-    return (h(Host, null, h("div", { class: "gux-tabs" }, h("slot", { name: "tab-list" }), h("div", null, h("slot", { onSlotchange: this.onSlotchange.bind(this) })))));
-  }
-  static get is() { return "gux-tabs-advanced-legacy"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["gux-tabs-advanced.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["gux-tabs-advanced.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "activeTab": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "tabId of the currently selected tab"
-        },
-        "attribute": "active-tab",
-        "reflect": false
-      }
-    };
-  }
-  static get states() {
-    return {
-      "tabList": {},
-      "tabPanels": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "guxactivetabchange",
-        "name": "guxactivetabchange",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Triggers when the active tab changes."
-        },
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        }
-      }];
-  }
-  static get methods() {
-    return {
-      "guxActivate": {
-        "complexType": {
-          "signature": "(tabId: string) => Promise<void>",
-          "parameters": [{
-              "tags": [],
-              "text": ""
-            }],
-          "references": {
-            "Promise": {
-              "location": "global",
-              "id": "global::Promise"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": []
-        }
-      }
-    };
-  }
-  static get elementRef() { return "root"; }
-  static get watchers() {
-    return [{
-        "propName": "activeTab",
-        "methodName": "watchActiveTab"
-      }];
-  }
-  static get listeners() {
-    return [{
-        "name": "internalactivatetabpanel",
-        "method": "onInternalActivateTabPanel",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }];
-  }
-}

package/dist/collection/components/legacy/gux-tabs-advanced-legacy/tests/gux-tabs-advanced.e2e.js

@@ -1,216 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { a11yCheck } from "../../../../test/e2eTestUtils";
-const axeExclusions = [
-  {
-    issueId: 'duplicate-id-aria',
-    exclusionReason: 'Test uses seeded value for Math.random, so duplicate ids are expected (tooltips)'
-  },
-  {
-    issueId: 'duplicate-id-active',
-    exclusionReason: 'Test uses seeded value for Math.random, so duplicate ids are expected (option buttons)'
-  }
-];
-async function newNonrandomE2EPage({ html }, lang = 'en') {
-  const page = await newE2EPage();
-  await page.evaluateOnNewDocument(() => {
-    Math.random = () => 0.5;
-  });
-  await page.setContent(`<div lang=${lang}>${html}</div>`);
-  await page.waitForChanges();
-  await page.addScriptTag({
-    path: '../../node_modules/axe-core/axe.min.js'
-  });
-  await page.waitForChanges();
-  return page;
-}
-describe('gux-tabs-advanced-legacy', () => {
-  const htmlExample1 = `
-  <gux-tabs-advanced-legacy>
-    <gux-tab-advanced-list-legacy
-      slot="tab-list"
-      allow-sort="false"
-      show-new-tab-button="true"
-    >
-      <gux-tab-advanced-legacy tab-id="1-1">
-        Tab Header 1
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="close" decorative="true"></gux-icon>
-            Close
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy tab-id="1-2">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Tab Header 2
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy gux-disabled tab-id="1-3">
-        Tab Header 3
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy tab-id="1-4">
-        Tab Header 4
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy tab-id="1-5">
-        Tab Header 5 long long
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy tab-id="1-6">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Tab Header 6
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="close" decorative="true"></gux-icon>
-            Close
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy tab-id="1-7">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Tab Header 7 long long long
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-            Close
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy tab-id="1-8">
-      Tab Header 8 longlonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglong
-      <gux-list slot="dropdown-options">
-        <gux-list-item>
-          <gux-icon icon-name="close" decorative="true"></gux-icon>
-          Close
-        </gux-list-item>
-      </gux-list>
-    </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy gux-disabled tab-id="1-9">
-        Tab Header 9 long long long
-      </gux-tab-advanced-legacy>
-    </gux-tab-advanced-list-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-1">
-      <span>Tab content 1</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-2">
-      <span>Tab content 2</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-3">
-      <span>Tab content 3</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-4">
-      <span>Tab content 4</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-5">
-      <span>Tab content 5</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-6">
-      <span>Tab content 6</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-7">
-      <span>Tab content 7</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-8">
-      <span>Tab content 8</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-9">
-      <span>Tab content 9</span>
-    </gux-tab-advanced-panel-legacy>
-  </gux-tabs-advanced-legacy>
-`;
-  const htmlExample2 = `
-    <gux-tabs-advanced-legacy>
-      <gux-tab-advanced-list-legacy
-        slot="tab-list"
-        allow-sort="false"
-        show-new-tab-button="true"
-      >
-        <gux-tab-advanced-legacy tab-id="1-1">
-          Tab Header 1
-        </gux-tab-advanced-legacy>
-        <gux-tab-advanced-legacy tab-id="1-2">
-          <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-          Tab Header 2
-        </gux-tab-advanced-legacy>
-        <gux-tab-advanced-legacy gux-disabled tab-id="1-3">
-          Tab Header 3
-        </gux-tab-advanced-legacy>
-        <gux-tab-advanced-legacy tab-id="1-4">
-          Tab Header 4
-        </gux-tab-advanced-legacy>
-      </gux-tab-advanced-list-legacy>
-      <gux-tab-advanced-panel-legacy tab-id="1-1">
-        <span>Tab content 1</span>
-      </gux-tab-advanced-panel-legacy>
-      <gux-tab-advanced-panel-legacy tab-id="1-2">
-        <span>Tab content 2</span>
-      </gux-tab-advanced-panel-legacy>
-      <gux-tab-advanced-panel-legacy tab-id="1-3">
-        <span>Tab content 3</span>
-      </gux-tab-advanced-panel-legacy>
-      <gux-tab-advanced-panel-legacy tab-id="1-4">
-        <span>Tab content 4</span>
-      </gux-tab-advanced-panel-legacy>
-    </gux-tabs-advanced-legacy>
-    `;
-  describe('#render', () => {
-    // This test is flaky
-    it('renders', async () => {
-      const page = await newNonrandomE2EPage({ html: htmlExample2 });
-      const element = await page.find('gux-tabs-advanced-legacy');
-      await a11yCheck(page, axeExclusions);
-      expect(element.outerHTML).toMatchSnapshot();
-    });
-    it('renders i18n strings', async () => {
-      const restrictedWidthHtml = `<div style="width: 200px">${htmlExample2}</div>`;
-      const page = await newNonrandomE2EPage({ html: restrictedWidthHtml }, 'ja');
-      const element = await page.find('gux-tabs-advanced-legacy');
-      expect(element.outerHTML).toMatchSnapshot();
-    });
-    it('does not render the scroll buttons when tabs fit container', async () => {
-      const page = await newNonrandomE2EPage({ html: htmlExample2 });
-      const scrollButtons = await page.findAll('.gux-scroll-button');
-      await a11yCheck(page, axeExclusions);
-      expect(scrollButtons.length).toBe(0);
-    });
-    it('renders scroll buttons when tabs overflow container', async () => {
-      const restrictedWidthHtml = `<div style="width: 200px">${htmlExample2}</div>`;
-      const page = await newNonrandomE2EPage({ html: restrictedWidthHtml });
-      const scrollButtons = await page.findAll('.gux-scroll-button');
-      await a11yCheck(page, axeExclusions);
-      expect(scrollButtons.length).toBe(2);
-    });
-  });
-  describe('#interactions', () => {
-    it('should change tabpanel content when tab is changed', async () => {
-      const page = await newNonrandomE2EPage({ html: htmlExample1 });
-      const tabTarget = await page.find('gux-tab-advanced-legacy[tab-id="1-2"]');
-      const tabPanel = await page.find('gux-tab-advanced-panel-legacy[tab-id="1-2"]');
-      const spyOnActivePanelChangeEvent = await tabPanel.spyOnEvent('guxactivepanelchange');
-      await tabTarget.click();
-      await page.waitForChanges();
-      expect(spyOnActivePanelChangeEvent.length).toBe(1);
-      expect(spyOnActivePanelChangeEvent.events[0].detail).toBe('1-2');
-    });
-    it('should not change tabpanel content when tab is disabled', async () => {
-      const page = await newNonrandomE2EPage({ html: htmlExample1 });
-      const tabTarget = await page.find('gux-tab-advanced-legacy[tab-id="1-3"]');
-      const tabPanel = await page.find('gux-tab-advanced-panel-legacy[tab-id="1-3"]');
-      const spyOnActivePanelChangeEvent = await tabPanel.spyOnEvent('guxactivepanelchange');
-      await tabTarget.click();
-      await page.waitForChanges();
-      expect(spyOnActivePanelChangeEvent.length).toBe(0);
-    });
-    it('should open and close options popup on click', async () => {
-      const page = await newNonrandomE2EPage({ html: htmlExample1 });
-      const optionPopoverTarget = await page.find('gux-tab-advanced-legacy[tab-id="1-1"] .gux-tab-options-button');
-      await optionPopoverTarget.click();
-      await page.waitForChanges();
-      await a11yCheck(page, axeExclusions, 'options popover expanded');
-      const optionPopover = await page.find('gux-tab-advanced-legacy[tab-id="1-1"] gux-popover-list');
-      let optionPopoverHidden = optionPopover.getAttribute('hidden');
-      expect(optionPopoverHidden).toBe(null);
-      await optionPopoverTarget.click();
-      await page.waitForChanges();
-      optionPopoverHidden = optionPopover.getAttribute('hidden');
-      expect(optionPopoverHidden).toBe('');
-    });
-  });
-});

package/dist/collection/components/legacy/gux-tabs-advanced-legacy/tests/gux-tabs-advanced.spec.js

@@ -1,73 +0,0 @@
-import { newSpecPage } from "../../../../test/specTestUtils";
-import { GuxTabsAdvancedLegacy } from "../gux-tabs-advanced";
-import { GuxTabAdvancedLegacy } from "../gux-tab-advanced/gux-tab-advanced";
-import { GuxTabAdvancedListLegacy } from "../gux-tab-advanced-list/gux-tab-advanced-list";
-import { GuxTabAdvancedPanelLegacy } from "../gux-tab-advanced-panel/gux-tab-advanced-panel";
-const components = [
-  GuxTabsAdvancedLegacy,
-  GuxTabAdvancedLegacy,
-  GuxTabAdvancedListLegacy,
-  GuxTabAdvancedPanelLegacy
-];
-const html = `
-  <gux-tabs-advanced-legacy lang="en" id="interactive">
-    <gux-tab-advanced-list-legacy slot="tab-list" show-new-tab-button="true">
-      <gux-tab-advanced-legacy tab-id="1-1">
-        <gux-icon icon-name="lock" decorative="true"></gux-icon>
-        Hello World
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="edit" decorative="true"></gux-icon>
-            Edit
-          </gux-list-item>
-          <gux-list-item>
-            <gux-icon icon-name="clone" decorative="true"></gux-icon>
-            Clone
-          </gux-list-item>
-          <gux-list-item>
-            <gux-icon icon-name="share" decorative="true"></gux-icon>
-            Share
-          </gux-list-item>
-          <gux-list-item>
-            <gux-icon icon-name="download" decorative="true"></gux-icon>
-            Download
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy tab-id="1-2">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Hello World 2 long long long long long
-      </gux-tab-advanced-legacy>
-      <gux-tab-advanced-legacy gux-disabled tab-id="1-3">
-      Hello World 3
-    </gux-tab-advanced-legacy>
-    <div slot="add-tab">
-      <gux-icon icon-name="file-preview" decorative></gux-icon>
-      Add View
-    </div>
-    </gux-tab-advanced-list-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-1">
-      <span>Tab content 1</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-2">
-      <span>Tab content 2</span>
-    </gux-tab-advanced-panel-legacy>
-    <gux-tab-advanced-panel-legacy tab-id="1-3">
-    <span>Tab content 3</span>
-    </gux-tab-advanced-panel-legacy>
-  </gux-tabs-advanced-legacy>
-`;
-const language = 'en';
-describe('gux-tabs-advanced-legacy', () => {
-  describe('#render', () => {
-    it(`should render as expected`, async () => {
-      const page = await newSpecPage({
-        components,
-        html,
-        language
-      });
-      expect(page.rootInstance).toBeInstanceOf(GuxTabsAdvancedLegacy);
-      expect(page.root).toMatchSnapshot();
-    });
-  });
-});

package/dist/esm/en-b0526f2a.js

@@ -1,22 +0,0 @@
-const createNewTab = "Create New Tab";
-const scrollLeft = "Scroll Left";
-const scrollRight = "Scroll Right";
-const options = "Tab Options for {tabTitle}";
-const disableNewTab = "Maximum number of tabs created has been reached";
-const toggleSort = "Toggle sort mode using space";
-const sortModeOn = "Sort mode on, use the left and right arrow keys to reorder tabs. Press space or enter key to complete sort. Press escape key to cancel sort";
-const sortComplete = "Sort complete";
-const sortCancelled = "Sort cancelled";
-const tabsResources = {
-	createNewTab: createNewTab,
-	scrollLeft: scrollLeft,
-	scrollRight: scrollRight,
-	options: options,
-	disableNewTab: disableNewTab,
-	toggleSort: toggleSort,
-	sortModeOn: sortModeOn,
-	sortComplete: sortComplete,
-	sortCancelled: sortCancelled
-};
-
-export { tabsResources as t };