@3t-transform/threeteeui 0.1.28 → 0.1.30

package/dist/collection/components/atoms/tttx-button/test/tttx-button.e2e.js

@@ -1,9 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-describe('tttx-button', () => {
-  it('renders', async () => {
-    const page = await newE2EPage();
-    await page.setContent('<tttx-button></tttx-button>');
-    const element = await page.find('tttx-button');
-    expect(element).toHaveClass('hydrated');
-  });
-});

package/dist/collection/components/atoms/tttx-button/test/tttx-button.spec.js

@@ -1,83 +0,0 @@
-import { newSpecPage } from '@stencil/core/testing';
-import { TttxButton } from '../tttx-button';
-describe('tttx-button', () => {
-  it('renders', async () => {
-    const page = await newSpecPage({
-      components: [TttxButton],
-      html: '<tttx-button></tttx-button>',
-    });
-    expect(page.root).toEqualHtml(`
-            <tttx-button>
-                <mock:shadow-root>
-                    <button class="button default">
-                        <div class="button-content">
-                            <slot></slot>
-                        </div>
-                    </button>
-                </mock:shadow-root>
-            </tttx-button>
-        `);
-  });
-  it('renders a white icon', async () => {
-    const page = await newSpecPage({
-      components: [TttxButton],
-      html: '<tttx-button design="primary" icon="person"></tttx-button>',
-    });
-    expect(page.root).toEqualHtml(`
-            <tttx-button design="primary" icon="person">
-                <mock:shadow-root>
-                    <button class="button iconleft primary withicon">
-                        <div class="icon-left">
-                            <tttx-icon color="white" icon="person"></tttx-icon>
-                        </div>
-                        <div class="button-content">
-                            <slot></slot>
-                        </div>
-                    </button>
-                </mock:shadow-root>
-            </tttx-button>
-        `);
-  });
-  it('design doesn\'t exist', async () => {
-    const page = await newSpecPage({
-      components: [TttxButton],
-      html: '<tttx-button design="memphis" icon="person"></tttx-button>',
-    });
-    expect(page.root).toEqualHtml(`
-            <tttx-button design="memphis" icon="person">
-                <mock:shadow-root>
-                    <button class="button default iconleft withicon">
-                        <div class="icon-left">
-                            <tttx-icon color="black" icon="person"></tttx-icon>
-                        </div>
-                        <div class="button-content">
-                            <slot></slot>
-                        </div>
-                    </button>
-                </mock:shadow-root>
-            </tttx-button>
-        `);
-  });
-  it('clicks', async () => {
-    const page = await newSpecPage({
-      components: [TttxButton],
-      html: '<tttx-button></tttx-button>',
-    });
-    expect(page.root).toEqualHtml(`
-            <tttx-button>
-                <mock:shadow-root>
-                    <button class="button default">
-                        <div class="button-content">
-                            <slot></slot>
-                        </div>
-                    </button>
-                </mock:shadow-root>
-            </tttx-button>
-        `);
-    const callbackFn = jest.fn();
-    // add an event listener directly to the tttx-button host and click it
-    page.root.addEventListener('click', callbackFn);
-    page.root.click();
-    expect(callbackFn).toHaveBeenCalled();
-  });
-});

package/dist/collection/components/atoms/tttx-icon/test/tttx-icon.e2e.js

@@ -1,9 +0,0 @@
-import { newE2EPage } from '@stencil/core/testing';
-describe('tttx-icon', () => {
-  it('renders', async () => {
-    const page = await newE2EPage();
-    await page.setContent('<tttx-icon></tttx-icon>');
-    const element = await page.find('tttx-icon');
-    expect(element).toHaveClass('hydrated');
-  });
-});

package/dist/collection/components/atoms/tttx-icon/test/tttx-icon.spec.js

@@ -1,16 +0,0 @@
-import { newSpecPage } from '@stencil/core/testing';
-import { TttxIcon } from '../tttx-icon';
-describe('tttx-icon', () => {
-  it('renders', async () => {
-    const page = await newSpecPage({
-      components: [TttxIcon],
-      html: '<tttx-icon color="danger" icon="warning"></tttx-icon>',
-    });
-    expect(page.root).toEqualHtml(`
-        <tttx-icon color="danger" icon="warning">
-            <mock:shadow-root>
-                <span class="material-symbols-rounded danger">warning</span>
-            </mock:shadow-root>
-        </tttx-icon>`);
-  });
-});

package/dist/collection/components/atoms/tttx-keyvalue-block/test/tttx-keyvalue-block.spec.js

@@ -1,216 +0,0 @@
-import { h } from '@stencil/core';
-import { newSpecPage } from '@stencil/core/testing';
-import { TttxKeyvalueBlock } from '../tttx-keyvalue-block';
-describe('tttx-keyvalue-block', () => {
-  it('renders multiple key value pairs', async () => {
-    const keyValuePair = {
-      'Name': 'John Doe',
-      'Date of birth': '14 Jan 1981',
-      'Start of postcode': 'AB10'
-    };
-    const page = await newSpecPage({
-      components: [TttxKeyvalueBlock],
-      html: `<tttx-keyvalue-block keyvalues='${JSON.stringify(keyValuePair)}' />`
-    });
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-            <tttx-keyvalue-block keyvalues='{"Name":"John Doe","Date of birth":"14 Jan 1981","Start of postcode":"AB10"}'>
-                <mock:shadow-root>
-                    <dl>
-                        <dt>
-                            Name
-                        </dt>
-                        <dd>
-                            John Doe
-                        </dd>
-                        <dt>
-                            Date of birth
-                        </dt>
-                        <dd>
-                            14 Jan 1981
-                        </dd>
-                        <dt>
-                            Start of postcode
-                        </dt>
-                        <dd>
-                            AB10
-                        </dd>
-                    </dl>
-                </mock:shadow-root>
-            </tttx-keyvalue-block>
-        `);
-  });
-  it('renders multiple key value pairs from a stencil template', async () => {
-    const keyValuePair = {
-      'Name': 'John Doe',
-      'Date of birth': '14 Jan 1981',
-      'Start of postcode': 'AB10'
-    };
-    const page = await newSpecPage({
-      components: [TttxKeyvalueBlock],
-      template: () => (h("tttx-keyvalue-block", { keyvalues: keyValuePair }))
-    });
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-            <tttx-keyvalue-block>
-                <mock:shadow-root>
-                    <dl>
-                        <dt>
-                            Name
-                        </dt>
-                        <dd>
-                            John Doe
-                        </dd>
-                        <dt>
-                            Date of birth
-                        </dt>
-                        <dd>
-                            14 Jan 1981
-                        </dd>
-                        <dt>
-                            Start of postcode
-                        </dt>
-                        <dd>
-                            AB10
-                        </dd>
-                    </dl>
-                </mock:shadow-root>
-            </tttx-keyvalue-block>
-        `);
-  });
-  it('renders with missing keyvalue object', async () => {
-    const page = await newSpecPage({
-      components: [TttxKeyvalueBlock],
-      template: () => (h("tttx-keyvalue-block", null))
-    });
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-            <tttx-keyvalue-block>
-                <mock:shadow-root>
-                </mock:shadow-root>
-            </tttx-keyvalue-block>
-        `);
-  });
-  it('renders an array of key value subtitles', async () => {
-    const keyValueArray = [
-      { title: 'title', subTitle: 'sub', data: 'data' },
-      { title: 'title2', subTitle: 'sub2', data: 'data2' }
-    ];
-    const page = await newSpecPage({
-      components: [TttxKeyvalueBlock],
-      html: `<tttx-keyvalue-block keyvalues='${JSON.stringify(keyValueArray)}' />`
-    });
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-            <tttx-keyvalue-block keyvalues='[{"title":"title","subTitle":"sub","data":"data"},{"title":"title2","subTitle":"sub2","data":"data2"}]'>
-                <mock:shadow-root>
-                    <dl>
-                        <dt class="mainTitle">
-                            title
-                        </dt>
-                        <dt class="subTitle">
-                            sub
-                        </dt>
-                        <dd>
-                            data
-                        </dd>
-                        <dt class="mainTitle">
-                            title2
-                        </dt>
-                        <dt class="subTitle">
-                            sub2
-                        </dt>
-                        <dd>
-                            data2
-                        </dd>
-                    </dl>
-                </mock:shadow-root>
-            </tttx-keyvalue-block>
-        `);
-  });
-  it('renders multiple horizontal key value pairs', async () => {
-    const keyValuePair = {
-      'Name': 'John Doe',
-      'Date of birth': '14 Jan 1981',
-      'Start of postcode': 'AB10'
-    };
-    const page = await newSpecPage({
-      components: [TttxKeyvalueBlock],
-      html: `<tttx-keyvalue-block horizontal="true" keyvalues='${JSON.stringify(keyValuePair)}' />`
-    });
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-            <tttx-keyvalue-block horizontal="true" keyvalues='{"Name":"John Doe","Date of birth":"14 Jan 1981","Start of postcode":"AB10"}'>
-                <mock:shadow-root>
-                    <dl class="horizontal">
-                        <div style="max-width: 33.333333333333336%;">
-                            <dt>
-                                Name
-                            </dt>
-                            <dd>
-                                John Doe
-                            </dd>
-                        </div>
-                        <div style="max-width: 33.333333333333336%;">
-                            <dt>
-                                Date of birth
-                            </dt>
-                            <dd>
-                                14 Jan 1981
-                            </dd>
-                        </div>
-                        <div style="max-width: 33.333333333333336%;">
-                            <dt>
-                                Start of postcode
-                            </dt>
-                            <dd>
-                                AB10
-                            </dd>
-                        </div>
-                    </dl>
-                </mock:shadow-root>
-            </tttx-keyvalue-block>
-        `);
-  });
-  it('renders an array of horizontal key value subtitles', async () => {
-    const keyValueArray = [
-      { title: 'title', subTitle: 'sub', data: 'data' },
-      { title: 'title2', subTitle: 'sub2', data: 'data2' }
-    ];
-    const page = await newSpecPage({
-      components: [TttxKeyvalueBlock],
-      html: `<tttx-keyvalue-block horizontal="true" keyvalues='${JSON.stringify(keyValueArray)}' />`
-    });
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-            <tttx-keyvalue-block horizontal="true" keyvalues='[{"title":"title","subTitle":"sub","data":"data"},{"title":"title2","subTitle":"sub2","data":"data2"}]'>
-                <mock:shadow-root>
-                    <dl class="horizontal">
-                        <div style="max-width: 50%;">
-                            <dt class="mainTitle">
-                                title
-                            </dt>
-                            <dt class="subTitle">
-                                sub
-                            </dt>
-                            <dd>
-                                data
-                            </dd>
-                        </div>
-                        <div style="max-width: 50%;">
-                            <dt class="mainTitle">
-                                title2
-                            </dt>
-                            <dt class="subTitle">
-                                sub2
-                            </dt>
-                            <dd>
-                                data2
-                            </dd>
-                        </div>
-                    </dl>
-                </mock:shadow-root>
-            </tttx-keyvalue-block>
-        `);
-  });
-});

package/dist/collection/components/atoms/tttx-loading-spinner/Test/tttx-loading-spinner.spec.js

@@ -1,64 +0,0 @@
-import { newSpecPage } from '@stencil/core/testing';
-import { TttxLoadingSpinner } from '../tttx-loading-spinner';
-describe('tttx-loading-spinner', () => {
-  it('renders the loading text when the loading message prop is set to true', async () => {
-    const page = await newSpecPage({
-      components: [TttxLoadingSpinner],
-      html: '<tttx-loading-spinner></tttx-loading-spinner>',
-    });
-    page.rootInstance.loadingMessage = true;
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-      <tttx-loading-spinner>
-        <mock:shadow-root>
-          <div class='spinner-container'><div class="loading-box"><span class='spinner large'></span></div><div class='loading-text'>Loading, please wait...</div></div>
-        </mock:shadow-root>
-      </tttx-loading-spinner>
-    `);
-  });
-  it('renders without the loading text when the loading message prop is set to false', async () => {
-    const page = await newSpecPage({
-      components: [TttxLoadingSpinner],
-      html: '<tttx-loading-spinner></tttx-loading-spinner>',
-    });
-    page.rootInstance.loadingMessage = false;
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-      <tttx-loading-spinner>
-        <mock:shadow-root>
-          <div class='spinner-container'><div class="loading-box"><span class='spinner large'></span></div></div>
-        </mock:shadow-root>
-      </tttx-loading-spinner>
-    `);
-  });
-  it('renders the small spinner when the size prop is set to small', async () => {
-    const page = await newSpecPage({
-      components: [TttxLoadingSpinner],
-      html: '<tttx-loading-spinner></tttx-loading-spinner>',
-    });
-    page.rootInstance.size = 'small';
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-      <tttx-loading-spinner>
-        <mock:shadow-root>
-          <div class='spinner-container'><div class="loading-box"><span class='spinner small'></span></div></div>
-        </mock:shadow-root>
-      </tttx-loading-spinner>
-    `);
-  });
-  it('renders the large spinner when the size prop is set to large', async () => {
-    const page = await newSpecPage({
-      components: [TttxLoadingSpinner],
-      html: '<tttx-loading-spinner></tttx-loading-spinner>',
-    });
-    page.rootInstance.size = 'large';
-    await page.waitForChanges();
-    expect(page.root).toEqualHtml(`
-      <tttx-loading-spinner>
-        <mock:shadow-root>
-          <div class='spinner-container'><div class="loading-box"><span class='spinner large'></span></div></div>
-        </mock:shadow-root>
-      </tttx-loading-spinner>
-    `);
-  });
-});

package/dist/collection/components/molecules/tttx-filter/test/tttx-filter.spec.js

@@ -1,231 +0,0 @@
-import { newSpecPage } from '@stencil/core/testing';
-import { TttxFilter } from '../tttx-filter';
-describe('tttx-filter', () => {
-  let tttxFilter;
-  beforeEach(() => {
-    tttxFilter = new TttxFilter();
-  });
-  it('should render the filter button', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter></tttx-filter>',
-    });
-    expect(page.root).toEqualHtml(`
-    <tttx-filter id="filter__undefined">
-        <mock:shadow-root>
-        <div class="filter-container">
-            <button class="filter-button" type="button">
-            <tttx-icon class="filter-icon" color="black" icon="filter_list"></tttx-icon>
-            Filter
-            </button>
-        </div>
-        </mock:shadow-root>
-    </tttx-filter>
-    `);
-  });
-  it('should render the filter button without select all option', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter show-select-all="false"></tttx-filter>',
-    });
-    const filterButton = page.root.shadowRoot.querySelector('.filter-button');
-    filterButton === null || filterButton === void 0 ? void 0 : filterButton.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const selectAllIcon = page.root.shadowRoot.querySelector('.select-all-icon');
-    expect(selectAllIcon).toBeNull();
-  });
-  it('should render the filter button with search field', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter show-search-field ></tttx-filter>',
-    });
-    const filterButton = page.root.shadowRoot.querySelector('.filter-button');
-    filterButton === null || filterButton === void 0 ? void 0 : filterButton.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const searchField = page.root.shadowRoot.querySelector('.--with-search-field');
-    expect(searchField).toEqualHtml(`
-    <div class="--with-search-field filter-popover-container">
-    <div class="filter-header">
-      Qualification status
-    </div>
-    <div class="search-field-container">
-      <tttx-icon class="search-icon" icon="search"></tttx-icon>
-      <input class="search-input" placeholder="Search" type="text" value="">
-    </div>
-    <div class="filter-options-container">
-      <div class="filter-option" tabindex="-1">
-        <tttx-icon class="select-all-icon" color="blue" icon="check_box"></tttx-icon>
-        <label class="filter-label">
-          Select all
-        </label>
-      </div>
-      <div class="filter-option" tabindex="-1">
-        <tttx-icon class="checkbox-icon" color="blue" icon="check_box"></tttx-icon>
-        <tttx-icon color="darkred" icon="cancel"></tttx-icon>
-        <label class="filter-label">
-          Expired
-        </label>
-      </div>
-      <div class="filter-option" tabindex="-1">
-        <tttx-icon class="checkbox-icon" color="blue" icon="check_box"></tttx-icon>
-        <tttx-icon color="orange" icon="warning"></tttx-icon>
-        <label class="filter-label">
-          Expiring soon
-        </label>
-      </div>
-      <div class="filter-option" tabindex="-1">
-        <tttx-icon class="checkbox-icon" color="blue" icon="check_box"></tttx-icon>
-        <tttx-icon color="green" icon="check_circle"></tttx-icon>
-        <label class="filter-label">
-          Active
-        </label>
-      </div>
-    </div>
-    <div class="filter-popover-button-container">
-      <button class="close-button" type="button">
-        Close
-      </button>
-      <button class="apply-button" type="button">
-        Apply
-      </button>
-    </div>
-  </div>
-    `);
-  });
-  it('should hide filter popover when close button is clicked', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter></tttx-filter>',
-    });
-    const filterButton = page.root.shadowRoot.querySelector('.filter-button');
-    filterButton === null || filterButton === void 0 ? void 0 : filterButton.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const closeButton = page.root.shadowRoot.querySelector('.close-button');
-    closeButton === null || closeButton === void 0 ? void 0 : closeButton.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const popoverContainer = page.root.shadowRoot.querySelector('.filter-popover-container');
-    expect(popoverContainer).toBeFalsy();
-  });
-  it('should select all options when select all checkbox is clicked', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter></tttx-filter>',
-    });
-    const filterButton = page.root.shadowRoot.querySelector('.filter-button');
-    filterButton === null || filterButton === void 0 ? void 0 : filterButton.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const selectAllCheckbox = page.root.shadowRoot.querySelector('.filter-option');
-    selectAllCheckbox === null || selectAllCheckbox === void 0 ? void 0 : selectAllCheckbox.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const filterOptionsUnchecked = page.root.shadowRoot.querySelectorAll('.filter-option');
-    filterOptionsUnchecked.forEach(option => {
-      const checkbox = option.querySelector('.checkbox-icon');
-      if (checkbox) {
-        expect(checkbox.getAttribute('icon')).toBe('check_box_outline_blank');
-      }
-    });
-    selectAllCheckbox === null || selectAllCheckbox === void 0 ? void 0 : selectAllCheckbox.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const filterOptionsChecked = page.root.shadowRoot.querySelectorAll('.filter-option');
-    filterOptionsChecked.forEach(option => {
-      const checkbox = option.querySelector('.checkbox-icon');
-      if (checkbox) {
-        expect(checkbox.getAttribute('icon')).toBe('check_box');
-      }
-    });
-  });
-  it('should handle filter option selection', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter show-select-all="false" ></tttx-filter>',
-    });
-    const filterButton = page.root.shadowRoot.querySelector('.filter-button');
-    filterButton === null || filterButton === void 0 ? void 0 : filterButton.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const checkbox = page.root.shadowRoot.querySelector('.filter-option');
-    checkbox === null || checkbox === void 0 ? void 0 : checkbox.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const icon = checkbox.querySelector('tttx-icon');
-    expect(icon.getAttribute('icon')).toBe('check_box_outline_blank');
-    checkbox === null || checkbox === void 0 ? void 0 : checkbox.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    expect(icon.getAttribute('icon')).toBe('check_box');
-  });
-  it('should update filterSearchTerm and displayedFilterSettings when handleFilterChange is called', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter show-search-field></tttx-filter>',
-    });
-    const filter = page.root.shadowRoot.querySelector('.filter-button');
-    filter.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const searchTextField = page.root.shadowRoot.querySelector('.search-input');
-    searchTextField.value = 'exp';
-    searchTextField.dispatchEvent(new Event('input'));
-    await page.waitForChanges();
-    const filterOptions = page.root.shadowRoot.querySelectorAll('.filter-option');
-    expect(filterOptions.length).toEqual(3);
-  });
-  it('should update selectedFilters and allSelected when onSelectAllClick is called', () => {
-    tttxFilter.displayedFilterSettings = [
-      { optionIcon: 'cancel', optionIconColor: 'darkred', optionText: 'Expired' },
-      { optionIcon: 'warning', optionIconColor: 'orange', optionText: 'Expiring soon' },
-      { optionIcon: 'check_circle', optionIconColor: 'green', optionText: 'Active' },
-    ];
-    tttxFilter.allSelected = false;
-    tttxFilter.selectedFilters = [];
-    tttxFilter.onSelectAllClick();
-    expect(tttxFilter.selectedFilters).toEqual(['Expired', 'Expiring soon', 'Active']);
-    expect(tttxFilter.allSelected).toBe(true);
-  });
-  it('should return the correct class name for the button style', () => {
-    const tableIconClass = tttxFilter.getFilterButtonClassName('table icon');
-    expect(tableIconClass).toBe('--table-icon');
-    const listIconClass = tttxFilter.getFilterButtonClassName('list icon');
-    expect(listIconClass).toBe('--list-icon');
-    const defaultClass = tttxFilter.getFilterButtonClassName('unknown style');
-    expect(defaultClass).toBe('');
-  });
-  it('emits filterChangeEvent on apply button click', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter></tttx-filter>',
-    });
-    const filterComponent = page.rootInstance;
-    const filterChangeEvent = jest.fn();
-    page.root.addEventListener('filterChangeEvent', filterChangeEvent);
-    filterComponent.onApplyFilterButtonClick();
-    expect(filterChangeEvent).toHaveBeenCalled();
-  });
-  it('should toggle the popover on the filter button', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter></tttx-filter>',
-    });
-    const filter = page.root.shadowRoot.querySelector('.filter-button');
-    filter.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const filterOptions = page.root.shadowRoot.querySelector('.filter-option');
-    expect(filterOptions).not.toBeNull();
-    filter.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const filterOptionsNew = page.root.shadowRoot.querySelector('.filter-option');
-    expect(filterOptionsNew).toBeNull();
-  });
-  it('should toggle the popover when the close button is clicked', async () => {
-    const page = await newSpecPage({
-      components: [TttxFilter],
-      html: '<tttx-filter></tttx-filter>',
-    });
-    const filter = page.root.shadowRoot.querySelector('.filter-button');
-    filter.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const filterOptions = page.root.shadowRoot.querySelector('.filter-option');
-    expect(filterOptions).not.toBeNull();
-    const closeButton = page.root.shadowRoot.querySelector('.close-button');
-    closeButton.dispatchEvent(new Event('click'));
-    await page.waitForChanges();
-    const filterOptionsNew = page.root.shadowRoot.querySelector('.filter-option');
-    expect(filterOptionsNew).toBeNull();
-  });
-});

package/dist/collection/components/molecules/tttx-form/lib/setErrorState.spec.js

@@ -1,38 +0,0 @@
-import setErrorState from './setErrorState';
-describe('setErrorState', () => {
-  let target;
-  let errorBubble;
-  beforeEach(() => {
-    target = document.createElement('input');
-    errorBubble = document.createElement('div');
-    errorBubble.className = 'errorBubble';
-    target.parentElement = document.createElement('div');
-    target.parentElement.appendChild(errorBubble);
-  });
-  afterEach(() => {
-    target = null;
-    errorBubble = null;
-  });
-  test('should set error state correctly when hasError is true', () => {
-    setErrorState(target, true, 'Invalid value');
-    expect(target.className).toBe('invalid');
-    expect(errorBubble.innerHTML).toBe('<span class="material-symbols-rounded">warning</span>Invalid value');
-  });
-  test('should clear error state correctly when hasError is false', () => {
-    target.className = 'invalid';
-    errorBubble.innerHTML = '<span class="material-symbols-rounded">warning</span>Invalid value';
-    setErrorState(target, false, '');
-    expect(target.className).toBe('');
-    expect(errorBubble.innerHTML).toBe('');
-  });
-  test('should set error state correctly with custom error message', () => {
-    setErrorState(target, true, 'Custom error message');
-    expect(target.className).toBe('invalid');
-    expect(errorBubble.innerHTML).toBe('<span class="material-symbols-rounded">warning</span>Custom error message');
-  });
-  test('should set error state correctly with no error message', () => {
-    setErrorState(target, true, '');
-    expect(target.className).toBe('invalid');
-    expect(errorBubble.innerHTML).toBe('<span class="material-symbols-rounded">warning</span> ');
-  });
-});