@digital-realty/ix-grid 1.0.38 → 2.0.0-alpha.0

package/dist/components/IxPagination.js

@@ -1,45 +1,45 @@
-import { __decorate } from "tslib";
-import { LitElement, html } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import '@digital-realty/ix-icon-button/ix-icon-button.js';
-import '@digital-realty/ix-select/ix-select.js';
-import { IxGridViewStyles } from '../grid-view-styles.js';
-import { PaginationStyles } from './pagination-styles.js';
-import { copy } from '../ix-grid-copy.js';
-let IxPagination = class IxPagination extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.recordCount = 0;
-        this.page = 1;
-        this.pageSize = 10;
-        this.pageSizes = [5, 10, 25, 100];
-    }
-    changePage(offset) {
-        this.page += offset;
-        this.updatePagination();
-    }
-    updatePagination(page = this.page, pageSize = this.pageSize) {
-        this.dispatchEvent(new CustomEvent('updatePagination', {
-            detail: {
-                page,
-                pageSize,
-            },
-            bubbles: true,
-            composed: true,
-        }));
-    }
-    render() {
-        const back = this.page > 1;
-        const next = this.recordCount > this.page * this.pageSize;
+import { __decorate } from "tslib";
+import { LitElement, html } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import '@digital-realty/ix-icon-button/ix-icon-button.js';
+import '@digital-realty/ix-select/ix-select.js';
+import { IxGridViewStyles } from '../grid-view-styles.js';
+import { PaginationStyles } from './pagination-styles.js';
+import { copy } from '../ix-grid-copy.js';
+let IxPagination = class IxPagination extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.recordCount = 0;
+        this.page = 1;
+        this.pageSize = 10;
+        this.pageSizes = [5, 10, 25, 100];
+    }
+    changePage(offset) {
+        this.page += offset;
+        this.updatePagination();
+    }
+    updatePagination(page = this.page, pageSize = this.pageSize) {
+        this.dispatchEvent(new CustomEvent('updatePagination', {
+            detail: {
+                page,
+                pageSize,
+            },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    render() {
+        const back = this.page > 1;
+        const next = this.recordCount > this.page * this.pageSize;
         return html ` <div class="pagination">
       <p>${copy.rowsPerPage}:</p>
       <ix-select
         wide-menu
         class="pagination__select-input"
-        @request-selection=${(e) => {
-            const el = e.target;
-            this.pageSize = Number(el.value);
-            this.updatePagination();
+        @request-selection=${(e) => {
+            const el = e.target;
+            this.pageSize = Number(el.value);
+            this.updatePagination();
         }}
         selected-index=${this.pageSizes.indexOf(this.pageSize)}
         filled
@@ -52,8 +52,8 @@ let IxPagination = class IxPagination extends LitElement {
       </ix-select>
       <p>
         ${(this.page - 1) * this.pageSize + 1} -
-        ${this.page * this.pageSize > this.recordCount
-            ? html `${this.recordCount}`
+        ${this.page * this.pageSize > this.recordCount
+            ? html `${this.recordCount}`
             : html `${this.page * this.pageSize}`}
         of ${this.recordCount}
       </p>
@@ -71,24 +71,24 @@ let IxPagination = class IxPagination extends LitElement {
         >
         </ix-icon-button>
       </div>
-    </div>`;
-    }
-};
-IxPagination.styles = [IxGridViewStyles, PaginationStyles];
-__decorate([
-    property({ type: Number })
-], IxPagination.prototype, "recordCount", void 0);
-__decorate([
-    property({ type: Number })
-], IxPagination.prototype, "page", void 0);
-__decorate([
-    property({ type: Number })
-], IxPagination.prototype, "pageSize", void 0);
-__decorate([
-    property({ type: Array })
-], IxPagination.prototype, "pageSizes", void 0);
-IxPagination = __decorate([
-    customElement('ix-pagination')
-], IxPagination);
-export { IxPagination };
+    </div>`;
+    }
+};
+IxPagination.styles = [IxGridViewStyles, PaginationStyles];
+__decorate([
+    property({ type: Number })
+], IxPagination.prototype, "recordCount", void 0);
+__decorate([
+    property({ type: Number })
+], IxPagination.prototype, "page", void 0);
+__decorate([
+    property({ type: Number })
+], IxPagination.prototype, "pageSize", void 0);
+__decorate([
+    property({ type: Array })
+], IxPagination.prototype, "pageSizes", void 0);
+IxPagination = __decorate([
+    customElement('ix-pagination')
+], IxPagination);
+export { IxPagination };
 //# sourceMappingURL=IxPagination.js.map

package/dist/components/grid-column-filter-styles.d.ts

@@ -1 +1 @@
-export declare const IxGridColumnFilterStyles: import("lit").CSSResult;
+export declare const IxGridColumnFilterStyles: import("lit").CSSResult;

package/dist/components/grid-column-filter-styles.js

@@ -1,4 +1,4 @@
-import { css } from 'lit';
+import { css } from 'lit';
 export const IxGridColumnFilterStyles = css `
   .dropdown-content {
     position: absolute;
@@ -97,5 +97,5 @@ export const IxGridColumnFilterStyles = css `
   .list {
     position: relative;
   }
-`;
+`;
 //# sourceMappingURL=grid-column-filter-styles.js.map

package/dist/components/grid-download-menu-styles.d.ts

@@ -1 +1 @@
-export declare const IxGridDownloadMenuStyles: import("lit").CSSResult;
+export declare const IxGridDownloadMenuStyles: import("lit").CSSResult;

package/dist/components/grid-download-menu-styles.js

@@ -1,7 +1,7 @@
-import { css } from 'lit';
+import { css } from 'lit';
 export const IxGridDownloadMenuStyles = css `
   ix-menu {
     --md-menu-container-color: #fff;
   }
-`;
+`;
 //# sourceMappingURL=grid-download-menu-styles.js.map

package/dist/components/grid-row-filter-styles.d.ts

@@ -1 +1 @@
-export declare const IxGridRowFilterStyles: import("lit").CSSResult;
+export declare const IxGridRowFilterStyles: import("lit").CSSResult;

package/dist/components/grid-row-filter-styles.js

@@ -1,4 +1,4 @@
-import { css } from 'lit';
+import { css } from 'lit';
 export const IxGridRowFilterStyles = css `
   .slot-wrap {
     display: flex;
@@ -438,5 +438,5 @@ export const IxGridRowFilterStyles = css `
     align-items: center;
     display: flex;
   }
-`;
+`;
 //# sourceMappingURL=grid-row-filter-styles.js.map

package/dist/components/ix-grid-nav.d.ts

@@ -1 +1 @@
-export {};
+export {};

package/dist/components/ix-grid-nav.js

@@ -1,3 +1,3 @@
-import { IxGridNavigation } from './IxGridNav.js';
-window.customElements.define('ix-grid-nav', IxGridNavigation);
+import { IxGridNavigation } from './IxGridNav.js';
+window.customElements.define('ix-grid-nav', IxGridNavigation);
 //# sourceMappingURL=ix-grid-nav.js.map

package/dist/components/pagination-styles.d.ts

@@ -1 +1 @@
-export declare const PaginationStyles: import("lit").CSSResult;
+export declare const PaginationStyles: import("lit").CSSResult;

package/dist/components/pagination-styles.js

@@ -1,4 +1,4 @@
-import { css } from 'lit';
+import { css } from 'lit';
 export const PaginationStyles = css `
   .pagination {
     display: flex;
@@ -45,5 +45,5 @@ export const PaginationStyles = css `
   ix-select-option {
     --md-menu-item-selected-container-color: rgba(20, 86, 224, 0.1);
   }
-`;
+`;
 //# sourceMappingURL=pagination-styles.js.map

package/dist/grid-view-styles.d.ts

@@ -1 +1 @@
-export declare const IxGridViewStyles: import("lit").CSSResult;
+export declare const IxGridViewStyles: import("lit").CSSResult;

package/dist/grid-view-styles.js

@@ -1,4 +1,4 @@
-import { css } from 'lit';
+import { css } from 'lit';
 export const IxGridViewStyles = css `
   @font-face {
     font-family: 'Material Icons';
@@ -207,5 +207,5 @@ export const IxGridViewStyles = css `
     display: flex;
     padding: 8px;
   }
-`;
+`;
 //# sourceMappingURL=grid-view-styles.js.map

package/dist/index.d.ts

@@ -1,2 +1,2 @@
-export { IxGrid } from './IxGrid.js';
-export { IxGridNavigation } from './components/IxGridNav.js';
+export { IxGrid } from './IxGrid.js';
+export { IxGridNavigation } from './components/IxGridNav.js';

package/dist/index.js

@@ -1,3 +1,3 @@
-export { IxGrid } from './IxGrid.js';
-export { IxGridNavigation } from './components/IxGridNav.js';
+export { IxGrid } from './IxGrid.js';
+export { IxGridNavigation } from './components/IxGridNav.js';
 //# sourceMappingURL=index.js.map

package/dist/ix-grid-copy.d.ts

@@ -1,10 +1,10 @@
-export declare const copy: {
-    activeFilter: string;
-    filters: string;
-    hideFilters: string;
-    showFilters: string;
-    rowsPerPage: string;
-    user: string;
-    viewMore: string;
-    viewLess: string;
-};
+export declare const copy: {
+    activeFilter: string;
+    filters: string;
+    hideFilters: string;
+    showFilters: string;
+    rowsPerPage: string;
+    user: string;
+    viewMore: string;
+    viewLess: string;
+};

package/dist/ix-grid-copy.js

@@ -1,11 +1,11 @@
-export const copy = {
-    activeFilter: 'active filter',
-    filters: 'Filters',
-    hideFilters: 'Hide Filters',
-    showFilters: 'Show Filters',
-    rowsPerPage: 'Rows per page',
-    user: 'user',
-    viewMore: 'VIEW MORE',
-    viewLess: 'VIEW LESS',
-};
+export const copy = {
+    activeFilter: 'active filter',
+    filters: 'Filters',
+    hideFilters: 'Hide Filters',
+    showFilters: 'Show Filters',
+    rowsPerPage: 'Rows per page',
+    user: 'user',
+    viewMore: 'VIEW MORE',
+    viewLess: 'VIEW LESS',
+};
 //# sourceMappingURL=ix-grid-copy.js.map

package/dist/ix-grid.d.ts

@@ -1 +1 @@
-export {};
+export {};

package/dist/ix-grid.js

@@ -1,3 +1,3 @@
-import { IxGrid } from './IxGrid.js';
-window.customElements.define('ix-grid', IxGrid);
+import { IxGrid } from './IxGrid.js';
+window.customElements.define('ix-grid', IxGrid);
 //# sourceMappingURL=ix-grid.js.map

package/dist/react/IxGridNav.d.ts

@@ -1,2 +1,2 @@
-import { IxGridNavigation } from '../components/IxGridNav.js';
-export declare const IxGridNav: import("@lit/react").ReactWebComponent<IxGridNavigation, {}>;
+import { IxGridNavigation } from '../components/IxGridNav.js';
+export declare const IxGridNav: import("@lit/react").ReactWebComponent<IxGridNavigation, {}>;

package/dist/react/IxGridNav.js

@@ -1,9 +1,9 @@
-import React from 'react';
-import { createComponent } from '@lit/react';
-import { IxGridNavigation } from '../components/IxGridNav.js';
-export const IxGridNav = createComponent({
-    tagName: 'ix-grid-nav',
-    elementClass: IxGridNavigation,
-    react: React,
-});
+import React from 'react';
+import { createComponent } from '@lit/react';
+import { IxGridNavigation } from '../components/IxGridNav.js';
+export const IxGridNav = createComponent({
+    tagName: 'ix-grid-nav',
+    elementClass: IxGridNavigation,
+    react: React,
+});
 //# sourceMappingURL=IxGridNav.js.map

package/dist/test/ix-grid-column-filter.test.d.ts

@@ -1 +1 @@
-import '../components/IxGridColumnFilter.js';
+import '../components/IxGridColumnFilter.js';

package/dist/test/ix-grid-column-filter.test.js

@@ -1,36 +1,36 @@
-import { html } from 'lit';
-import { fixture, expect, elementUpdated } from '@open-wc/testing';
-import '../components/IxGridColumnFilter.js';
-const columns = [
-    {
-        name: 'firstName',
-        header: 'First name',
-        hidden: false,
-    },
-    {
-        name: 'lastName',
-        header: 'Last name',
-        hidden: true,
-    },
-    {
-        name: 'middleName',
-        header: 'Middle name',
-        hidden: false,
-    },
-];
-describe('IxGridColumnFilter', () => {
-    it('renders the grid column filter component', async () => {
-        const el = await fixture(html `<ix-grid-column-filter></ix-grid-column-filter>`);
-        expect(el).to.not.be.null;
-    });
-    it('renders the grid column filters list', async () => {
-        var _a, _b;
-        const el = await fixture(html `<ix-grid-column-filter .columns=${columns}></ix-grid-column-filter>`);
-        const list = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.list');
-        list.click();
-        await elementUpdated(el);
-        const options = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('ix-switch');
-        expect(options === null || options === void 0 ? void 0 : options.length).to.equal(3);
-    });
-});
+import { html } from 'lit';
+import { fixture, expect, elementUpdated } from '@open-wc/testing';
+import '../components/IxGridColumnFilter.js';
+const columns = [
+    {
+        name: 'firstName',
+        header: 'First name',
+        hidden: false,
+    },
+    {
+        name: 'lastName',
+        header: 'Last name',
+        hidden: true,
+    },
+    {
+        name: 'middleName',
+        header: 'Middle name',
+        hidden: false,
+    },
+];
+describe('IxGridColumnFilter', () => {
+    it('renders the grid column filter component', async () => {
+        const el = await fixture(html `<ix-grid-column-filter></ix-grid-column-filter>`);
+        expect(el).to.not.be.null;
+    });
+    it('renders the grid column filters list', async () => {
+        var _a, _b;
+        const el = await fixture(html `<ix-grid-column-filter .columns=${columns}></ix-grid-column-filter>`);
+        const list = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.list');
+        list.click();
+        await elementUpdated(el);
+        const options = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('ix-switch');
+        expect(options === null || options === void 0 ? void 0 : options.length).to.equal(3);
+    });
+});
 //# sourceMappingURL=ix-grid-column-filter.test.js.map

package/dist/test/ix-grid-row-filter.test.d.ts

@@ -1 +1 @@
-import '../components/IxGridRowFilter.js';
+import '../components/IxGridRowFilter.js';

package/dist/test/ix-grid-row-filter.test.js

@@ -1,37 +1,37 @@
-import { html } from 'lit';
-import { fixture, expect, elementUpdated } from '@open-wc/testing';
-import '../components/IxGridRowFilter.js';
-const columns = [
-    {
-        name: 'firstName',
-        header: 'First name',
-        filterable: true,
-    },
-    {
-        name: 'lastName',
-        header: 'Last name',
-        filterable: true,
-    },
-    {
-        name: 'middleName',
-        header: 'Middle name',
-        filterable: false,
-    },
-    {
-        name: 'email',
-        header: 'Email',
-        filterable: true,
-    },
-];
-describe('IxGridRowFilter', () => {
-    it('renders and popluates the grid row filter', async () => {
-        var _a, _b;
-        const el = await fixture(html `<ix-grid-row-filter .columns=${columns}></ix-grid-row-filter>`);
-        const openMenu = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.filter-button');
-        openMenu.click();
-        await elementUpdated(el);
-        const options = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('select[data-v="firstName"] option');
-        expect(options === null || options === void 0 ? void 0 : options.length).to.equal(3);
-    });
-});
+import { html } from 'lit';
+import { fixture, expect, elementUpdated } from '@open-wc/testing';
+import '../components/IxGridRowFilter.js';
+const columns = [
+    {
+        name: 'firstName',
+        header: 'First name',
+        filterable: true,
+    },
+    {
+        name: 'lastName',
+        header: 'Last name',
+        filterable: true,
+    },
+    {
+        name: 'middleName',
+        header: 'Middle name',
+        filterable: false,
+    },
+    {
+        name: 'email',
+        header: 'Email',
+        filterable: true,
+    },
+];
+describe('IxGridRowFilter', () => {
+    it('renders and popluates the grid row filter', async () => {
+        var _a, _b;
+        const el = await fixture(html `<ix-grid-row-filter .columns=${columns}></ix-grid-row-filter>`);
+        const openMenu = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.filter-button');
+        openMenu.click();
+        await elementUpdated(el);
+        const options = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('select[data-v="firstName"] option');
+        expect(options === null || options === void 0 ? void 0 : options.length).to.equal(3);
+    });
+});
 //# sourceMappingURL=ix-grid-row-filter.test.js.map

package/dist/test/ix-grid.test.d.ts

@@ -1 +1 @@
-import '../ix-grid.js';
+import '../ix-grid.js';

package/dist/test/ix-grid.test.js

@@ -1,46 +1,46 @@
-import { html } from 'lit';
-import { fixture, expect } from '@open-wc/testing';
-import '../ix-grid.js';
-const rows = [
-    {
-        name: 'one',
-    },
-    {
-        name: 'two',
-    },
-    {
-        name: 'three',
-    },
-];
-const columns = [
-    {
-        name: 'one',
-        header: 'one',
-        bodyRenderer: row => html ` <span>${row.name}</span>`,
-    },
-    {
-        name: 'two',
-        header: 'one',
-        bodyRenderer: row => html ` <span>${row.name}</span>`,
-    },
-    {
-        name: 'three',
-        header: 'one',
-        bodyRenderer: row => html ` <span>${row.name}</span>`,
-    },
-];
-describe('IxGrid', () => {
-    it('renders a grid', async () => {
-        const el = await fixture(html `<ix-grid></ix-grid>`);
-        expect(el).to.not.be.null;
-    });
-    it('renders the correct number of rows', async () => {
+import { html } from 'lit';
+import { fixture, expect } from '@open-wc/testing';
+import '../ix-grid.js';
+const rows = [
+    {
+        name: 'one',
+    },
+    {
+        name: 'two',
+    },
+    {
+        name: 'three',
+    },
+];
+const columns = [
+    {
+        name: 'one',
+        header: 'one',
+        bodyRenderer: row => html ` <span>${row.name}</span>`,
+    },
+    {
+        name: 'two',
+        header: 'one',
+        bodyRenderer: row => html ` <span>${row.name}</span>`,
+    },
+    {
+        name: 'three',
+        header: 'one',
+        bodyRenderer: row => html ` <span>${row.name}</span>`,
+    },
+];
+describe('IxGrid', () => {
+    it('renders a grid', async () => {
+        const el = await fixture(html `<ix-grid></ix-grid>`);
+        expect(el).to.not.be.null;
+    });
+    it('renders the correct number of rows', async () => {
         const el = await fixture(html `<ix-grid
       .columns=${columns}
       .rows=${rows}
-    ></ix-grid>`);
-        expect(rows.length).to.equal(3);
-        expect(el).to.not.be.null;
-    });
-});
+    ></ix-grid>`);
+        expect(rows.length).to.equal(3);
+        expect(el).to.not.be.null;
+    });
+});
 //# sourceMappingURL=ix-grid.test.js.map

package/dist/test/ix-pagination.test.d.ts

@@ -1 +1 @@
-import '../components/IxPagination.js';
+import '../components/IxPagination.js';

package/dist/test/ix-pagination.test.js

@@ -1,28 +1,28 @@
-import { html } from 'lit';
-import { fixture, expect } from '@open-wc/testing';
-import '../components/IxPagination.js';
-describe('IxPagination', () => {
-    it('renders pagination', async () => {
-        const el = await fixture(html `<ix-pagination></ix-pagination>`);
-        expect(el).to.not.be.null;
-    });
-    it('renders pagination page size select', async () => {
-        var _a;
+import { html } from 'lit';
+import { fixture, expect } from '@open-wc/testing';
+import '../components/IxPagination.js';
+describe('IxPagination', () => {
+    it('renders pagination', async () => {
+        const el = await fixture(html `<ix-pagination></ix-pagination>`);
+        expect(el).to.not.be.null;
+    });
+    it('renders pagination page size select', async () => {
+        var _a;
         const el = await fixture(html `<ix-pagination
       .pageSizes=${[1, 2, 3]}
-    ></ix-pagination>`);
-        const pageSizeSelect = (_a = el === null || el === void 0 ? void 0 : el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('ix-select-option');
-        expect(pageSizeSelect === null || pageSizeSelect === void 0 ? void 0 : pageSizeSelect.length).to.equal(3);
-    });
-    it('renders pagination range info', async () => {
-        var _a;
+    ></ix-pagination>`);
+        const pageSizeSelect = (_a = el === null || el === void 0 ? void 0 : el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('ix-select-option');
+        expect(pageSizeSelect === null || pageSizeSelect === void 0 ? void 0 : pageSizeSelect.length).to.equal(3);
+    });
+    it('renders pagination range info', async () => {
+        var _a;
         const el = await fixture(html `<ix-pagination
       pageSize="10"
       page="2"
       recordCount="99"
-    ></ix-pagination>`);
-        const pageRangeInfo = (_a = el === null || el === void 0 ? void 0 : el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('p')[1];
-        expect(pageRangeInfo === null || pageRangeInfo === void 0 ? void 0 : pageRangeInfo.innerText).to.equal('11 - 20 of 99');
-    });
-});
+    ></ix-pagination>`);
+        const pageRangeInfo = (_a = el === null || el === void 0 ? void 0 : el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('p')[1];
+        expect(pageRangeInfo === null || pageRangeInfo === void 0 ? void 0 : pageRangeInfo.innerText).to.equal('11 - 20 of 99');
+    });
+});
 //# sourceMappingURL=ix-pagination.test.js.map