@digital-realty/ix-grid 1.2.6 → 1.2.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (21) hide show
  1. package/dist/IxGrid.d.ts +2 -1
  2. package/dist/IxGrid.js +24 -19
  3. package/dist/IxGrid.js.map +1 -1
  4. package/dist/components/IxGridColumnFilter.js +5 -6
  5. package/dist/components/IxGridColumnFilter.js.map +1 -1
  6. package/dist/components/IxGridNoRows.js +1 -1
  7. package/dist/components/IxGridNoRows.js.map +1 -1
  8. package/dist/components/grid-column-filter-styles.js +1 -1
  9. package/dist/components/grid-column-filter-styles.js.map +1 -1
  10. package/dist/grid-view-styles.js +5 -0
  11. package/dist/grid-view-styles.js.map +1 -1
  12. package/dist/ix-grid.min.js +2 -2
  13. package/dist/test/ix-grid.test.js +5 -1
  14. package/dist/test/ix-grid.test.js.map +1 -1
  15. package/package.json +2 -2
  16. package/src/IxGrid.ts +30 -19
  17. package/src/components/IxGridColumnFilter.ts +5 -4
  18. package/src/components/IxGridNoRows.ts +1 -1
  19. package/src/components/grid-column-filter-styles.ts +1 -1
  20. package/src/grid-view-styles.ts +5 -0
  21. package/src/test/ix-grid.test.ts +5 -1
package/dist/IxGrid.d.ts CHANGED
@@ -4,7 +4,7 @@ import '@digital-realty/ix-progress/ix-progress.js';
4
4
  import '@vaadin/grid';
5
5
  import { GridItemModel } from '@vaadin/grid';
6
6
  import { GridColumn } from '@vaadin/grid/src/vaadin-grid-column.js';
7
- import { LitElement } from 'lit';
7
+ import { LitElement, nothing } from 'lit';
8
8
  import './components/IxGridColumnFilter.js';
9
9
  import './components/IxGridDownloadMenu.js';
10
10
  import './components/IxGridRowFilter.js';
@@ -114,5 +114,6 @@ export declare class IxGrid extends LitElement {
114
114
  private renderPaginationControls;
115
115
  renderColumns(): import("lit-html").TemplateResult<1>;
116
116
  renderLoading(): import("lit-html").TemplateResult<1>;
117
+ renderGrid(): import("lit-html").TemplateResult<1> | typeof nothing;
117
118
  render(): import("lit-html").TemplateResult<1>;
118
119
  }
package/dist/IxGrid.js CHANGED
@@ -426,6 +426,7 @@ export class IxGrid extends LitElement {
426
426
  return;
427
427
  this.displayColumns[id].hidden = column === null || column === void 0 ? void 0 : column.hidden;
428
428
  });
429
+ this.displayColumns = [...this.displayColumns];
429
430
  this.updatePage(false);
430
431
  }
431
432
  cellPartNameGenerator(_column, model) {
@@ -464,31 +465,35 @@ export class IxGrid extends LitElement {
464
465
  <ix-progress .indeterminate=${true}></ix-progress>
465
466
  </div>`;
466
467
  }
468
+ renderGrid() {
469
+ if (this.isColumnsReordering) {
470
+ return nothing;
471
+ }
472
+ const columnDisplayed = this.displayColumns.find((column) => column.hidden !== true);
473
+ if (this.rows.length === 0 || !columnDisplayed) {
474
+ return html `<slot name="no-rows"></slot>`;
475
+ }
476
+ return html `<vaadin-grid
477
+ class=${this.hideColumnHeaders ? 'hide-column-headers' : ''}
478
+ .items=${this.rowLimit > 0 && !this.isExpanded
479
+ ? this.rows.slice(0, this.rowLimit)
480
+ : this.rows}
481
+ all-rows-visible
482
+ ?column-reordering-allowed=${this.columnReorderingAllowed}
483
+ theme="no-border"
484
+ .cellPartNameGenerator=${this.cellPartNameGenerator}
485
+ @mouseup=${this.reorderColumnsFromTable}
486
+ >
487
+ ${this.renderColumns()}
488
+ </vaadin-grid>`;
489
+ }
467
490
  render() {
468
491
  return html `
469
492
  <div
470
493
  class=${`grid-container ${this.isColumnsReordering ? 'columns-reordering' : ''} ${this.variantClass}`}
471
494
  >
472
495
  ${this.hideHeader ? nothing : this.renderHeader()}
473
- ${this.renderLoading()}
474
- ${!this.isColumnsReordering
475
- ? html `<vaadin-grid
476
- class=${this.hideColumnHeaders ? 'hide-column-headers' : ''}
477
- .items=${this.rowLimit > 0 && !this.isExpanded
478
- ? this.rows.slice(0, this.rowLimit)
479
- : this.rows}
480
- all-rows-visible
481
- ?column-reordering-allowed=${this.columnReorderingAllowed}
482
- theme="no-border"
483
- .cellPartNameGenerator=${this.cellPartNameGenerator}
484
- @mouseup=${this.reorderColumnsFromTable}
485
- >
486
- ${this.renderColumns()}
487
- </vaadin-grid>
488
- ${this.rows.length === 0 && !this.isColumnsReordering
489
- ? html `<slot name="no-rows"></slot>`
490
- : nothing}`
491
- : nothing}
496
+ ${this.renderLoading()} ${this.renderGrid()}
492
497
  ${this.rowLimit > 0
493
498
  ? this.renderRowLimitControls()
494
499
  : this.renderPaginationControls()}
package/dist/IxGrid.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IxGrid.js","sourceRoot":"","sources":["../src/IxGrid.ts"],"names":[],"mappings":";AAAA,yCAAyC;AACzC,OAAO,kDAAkD,CAAC;AAC1D,OAAO,oCAAoC,CAAC;AAC5C,OAAO,4CAA4C,CAAC;AACpD,OAAO,cAAc,CAAC;AAEtB,OAAO,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAE3D,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,KAAK,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,oCAAoC,CAAC;AAC5C,OAAO,oCAAoC,CAAC;AAC5C,OAAO,iCAAiC,CAAC;AAEzC,OAAO,8BAA8B,CAAC;AACtC,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAqCzC,MAAM,OAAO,MAAO,SAAQ,UAAU;IAAtC;;QAGU,oBAAe,GAAG,EAAE,CAAC;QAErB,gBAAW,GAAG,CAAC,CAAC;QAEhB,yBAAoB,GAAgC,SAAS,CAAC;QAKtE,4BAAuB,GAAY,KAAK,CAAC;QAEb,iBAAY,GAAG,EAAE,CAAC;QAEV,YAAO,GAAa,EAAE,CAAC;QAEhC,SAAI,GAAU,EAAE,CAAC;QAEhB,qBAAgB,GAAG,oBAAoB,CAAC;QAExC,iBAAY,GAAG,EAAE,CAAC;QAElB,kBAAa,GAAG,EAAE,CAAC;QAElB,eAAU,GAAG,KAAK,CAAC;QAEQ,gBAAW,GAAG,KAAK,CAAC;QAEhD,aAAQ,GAAW,CAAC,CAAC;QAErB,SAAI,GAAG,IAAI,CAAC,WAAW,CAAC;QAExB,aAAQ,GAAG,IAAI,CAAC,eAAe,CAAC;QAEjC,cAAS,GAAa,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC,CAAC;QAEtC,gBAAW,GAAG,CAAC,CAAC;QAEhB,mBAAc,GAAuB,SAAS,CAAC;QAE9C,iBAAY,GAAG,IAAI,CAAC;QAEpB,kBAAa,GAAG,KAAK,CAAC;QAEtB,cAAS,GAAG,KAAK,CAAC;QAEpB,sBAAiB,GAC1C,EAAE,CAAC;QAEwD,mBAAc,GACzE,IAAI,CAAC;QAEsB,sBAAiB,GAAG,KAAK,CAAC;QAE1B,wCAAmC,GAC9D,IAAI,CAAC;QAEqB,kCAA6B,GAAW,GAAG,CAAC;QAE3C,sBAAiB,GAAG,KAAK,CAAC;QAEtC,YAAO,GAAa,EAAE,CAAC;QAE/B,wBAAmB,GAAG,KAAK,CAAC;QAE5B,eAAU,GAAG,KAAK,CAAC;QAEnB,mBAAc,GAAa,EAAE,CAAC;QAE/B,qBAAgB,GAAW,EAAE,CAAC;QAE9B,gBAAW,GAAG,KAAK,CAAC;QA6RpB,uBAAkB,GAAG,CAC3B,MAAc,EACd,KAAa,EACb,MAAc,EACd,EAAE;YACF,MAAM,aAAa,GAAG,QAAQ,CAAC;gBAC7B,MAAM,EAAE,IAAI;gBACZ,MAAM,EAAE,CAAC,CAAC,MAAM,CAAC,WAAW;gBAC5B,KAAK,EAAE,KAAK,KAAK,CAAC;gBAClB,IAAI,EAAE,KAAK,KAAK,MAAM,GAAG,CAAC;aAC3B,CAAC,CAAC;YAEH,OAAO,IAAI,CAAA;;iBAEE,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC;mBACnD,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC;gBACxD,aAAa;;qCAEQ,MAAM,CAAC,MAAM;UACxC,MAAM,CAAC,QAAQ;gBACf,CAAC,CAAC,IAAI,CAAA;iBACC,IAAI,CAAC,aAAa,KAAK,MAAM;oBAChC,IAAI,CAAC,YAAY,KAAK,MAAM,CAAC,IAAI;oBAC/B,CAAC,CAAC,cAAc;oBAChB,CAAC,CAAC,gBAAgB;cACpB;gBACJ,CAAC,CAAC,OAAO;;KAEd,CAAC;QACJ,CAAC,CAAC;QAuFM,mBAAc,GAAG,CACvB,MAAc,EACd,IAAiB,EACjB,aAAyB,EACzB,KAAU,EACV,EAAE;YACF;;;;;cAKE;YACF,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;YAEtB,MAAM,cAAc,GAAG,MAAM,CAAC,YAAY,CACxC,KAAK,CAAC,IAAI,EACV,KAAK,EACL,aAAa,CACd,CAAC;YAEF,MAAM,CAAC,cAAc,EAAE,IAAI,CAAC,CAAC;QAC/B,CAAC,CAAC;QAEM,iBAAY,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;QAG3B,IAAI,CAAC,WAAW;YAChB,CAAC,CAAC,OAAO;YACT,CAAC,CAAC,IAAI,CAAA;;yBAEW,IAAI,CAAC,eAAe;uCACN,SAAS,CAAC,IAAI,CAAC,sBAAsB,CAAC;8BAC/C,CAAC,CAAc,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC;gCAC9C,IAAI,CAAC,wBAAwB;yCACpB,IAAI,CAAC,uBAAuB;qDAChB,IAAI;iBACxC,mCAAmC;mCACjB,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE;;cAE/C,IAAI,CAAC,YAAY;gBACjB,CAAC,CAAC,IAAI,CAAA;2BACO,IAAI,CAAC,iBAAiB;mCACd,IAAI,CAAC,aAAa;0CACX;gBAC5B,CAAC,CAAC,OAAO;;yBAEE,IAAI,CAAC,cAAc;+CACG,IAAI;iBAClC,6BAA6B;mCACX,IAAI,CAAC,iBAAiB;2BAC9B,CAAC,CAAc,EAAE,EAAE;gBAC9B,IAAI,CAAC,OAAO,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;gBAChC,IAAI,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE;oBACtB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC;iBAC9B;gBACD,IAAI,CAAC,UAAU,EAAE,CAAC;YACpB,CAAC;;iBAEE;;;;;GAKd,CAAC;QAEM,2BAAsB,GAAG,GAAG,EAAE;YACpC,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO,OAAO,CAAC;YAEtD,OAAO,IAAI,CAAA;;;;mBAII,GAAG,EAAE;gBACZ,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC;YACrC,CAAC;;;YAGC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ;iCAC1B,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK;;;KAG9D,CAAC;QACJ,CAAC,CAAC;QAEM,6BAAwB,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;;gBAG/B,IAAI,CAAC,IAAI;oBACL,IAAI,CAAC,QAAQ;qBACZ,IAAI,CAAC,SAAS;uBACZ,IAAI,CAAC,WAAW;4BACX,CAAC,CAAc,EAAE,EAAE;YACrC,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC;YAC1B,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC;YAClC,IAAI,CAAC,UAAU,EAAE,CAAC;QACpB,CAAC;;;GAGN,CAAC;IAoFJ,CAAC;IArkBC,IAAI,aAAa;QACf,IAAI,IAAI,CAAC,cAAc;YAAE,OAAO,IAAI,CAAC;QAErC,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IAAI,WAAW;QACb,OAAO,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAc,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAC3D,CAAC;IAED,IAAI,sBAAsB;QACxB,IAAI,IAAI,CAAC,gBAAgB,KAAK,EAAE,EAAE;YAChC,MAAM,uBAAuB,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG;YAC9C,6DAA6D;YAC7D,CAAC,EAAE,YAAY,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE,CAAC,IAAI,CACpC,CAAC;YACF,MAAM,iBAAiB,GAAG,IAAI,CAAC,SAAS,CAAC,uBAAuB,CAAC,CAAC;YAElE,IAAI,IAAI,GAAG,CAAC,CAAC;YACb,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,iBAAiB,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;gBACpD,qHAAqH;gBACrH,sCAAsC;gBACtC,IAAI,GAAG,CAAC,IAAI,GAAG,EAAE,GAAG,iBAAiB,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;aAC5D;YAED,2CAA2C;YAC3C,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;SAC3C;QAED,OAAO,WAAW,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,gBAAgB,UAAU,CAAC;IAC3E,CAAC;IAED,IAAI,eAAe;QACjB,IAAI,gBAAgB,GAAa,EAAE,CAAC;QACpC,gBAAgB,GAAG,IAAI,CAAC,mCAAmC,EAAE,CAAC;QAE9D,IAAI,gBAAgB,CAAC,MAAM,KAAK,CAAC;YAAE,gBAAgB,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;QAExE,OAAO,gBAAgB;aACpB,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC;aAClB,GAAG,CAAC,CAAC,MAAc,EAAE,EAAE,CAAC,CAAC;YACxB,GAAG,MAAM;YACT,KAAK,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;SAChD,CAAC,CAAC,CAAC;IACR,CAAC;IAED,MAAM,CAAC,iBAAmC;QACxC,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YAChD,IAAI,CAAC,cAAc,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;YACxC,IAAI,CAAC,uBAAuB,EAAE,CAAC;YAC/B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;SACzB;QACD,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC;IAClC,CAAC;IAED,YAAY;QACV,IAAI,IAAI,CAAC,iBAAiB,EAAE;YAC1B,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YAC1C,MAAM,YAAY,GAAG,IAAI,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YACrD,MAAM,IAAI,GAAG,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YACtC,MAAM,KAAK,GAAG,YAAY,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;YACxC,MAAM,IAAI,GAAG,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YACtC,MAAM,IAAI,GAAG,YAAY,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YAEtC,IAAI,IAAI,IAAI,KAAK,EAAE;gBACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;gBACzB,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;aAC5B;YAED,IAAI,IAAI,EAAE;gBACR,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,IAAI,CAAC,WAAW,CAAC;aACpD;YAED,IAAI,IAAI,EAAE;gBACR,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,IAAI,CAAC,eAAe,CAAC;aAC5D;SACF;QAED,IAAI,CAAC,2BAA2B,EAAE,CAAC;IACrC,CAAC;IAEO,uBAAuB;QAC7B,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CACjC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,sBAAsB,CAAC,IAAI,IAAI,CAC1D,CAAC;YAEF,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;gBAC/B,IAAI,aAAa,GAAG,KAAK,CAAC;gBAE1B,gFAAgF;gBAChF,IAAI,gBAAgB,CAAC,MAAM,KAAK,IAAI,CAAC,OAAO,CAAC,MAAM;oBACjD,aAAa,GAAG,IAAI,CAAC;gBACvB,MAAM,mBAAmB,GACvB,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE,CAC1B,gBAAgB,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,KAAK,MAAM,CAAC,IAAI,CAAC,CACrD;oBACD,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC,EAAE,CAC1B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,KAAK,EAAE,CAAC,IAAI,CAAC,CACrD,CAAC;gBACJ,IAAI,CAAC,mBAAmB;oBAAE,aAAa,GAAG,IAAI,CAAC;gBAE/C,IAAI,aAAa,EAAE;oBACjB,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;iBAC7C;aACF;SACF;IACH,CAAC;IAED,qBAAqB;QACnB,MAAM,MAAM,GAAG,IAAI,eAAe,EAAE,CAAC;QAErC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAS,EAAE,EAAE;YACjC,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC,aAAa,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;QAChE,CAAC,CAAC,CAAC;QAEH,OAAO,MAAM,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;IACpC,CAAC;IAEO,mCAAmC;QACzC,IAAI,gBAAgB,GAAa,EAAE,CAAC;QACpC,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CACjC,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,sBAAsB,CAAC,IAAI,IAAI,CAC1D,CAAC;YAEF,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE;gBAC/B,gBAAgB;oBACd,IAAI,CAAC,+BAA+B,CAAC,gBAAgB,CAAC,CAAC;aAC1D;SACF;QAED,OAAO,gBAAgB,CAAC;IAC1B,CAAC;IAEO,+BAA+B,CACrC,gBAA0B;QAE1B,MAAM,YAAY,GAAG,IAAI,GAAG,CAAC,gBAAgB,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;QAE3E,MAAM,aAAa,GAAG,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,gBAAgB,CAAC,EAAE;YACxD,MAAM,eAAe,GAAG,YAAY,CAAC,GAAG,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;YAEhE,IAAI,CAAC,eAAe,EAAE;gBACpB,OAAO,EAAE,GAAG,gBAAgB,EAAE,CAAC;aAChC;YAED,OAAO;gBACL,GAAG,gBAAgB;gBACnB,MAAM,EAAE,eAAe,CAAC,MAAM;gBAC9B,WAAW,EAAE,eAAe,CAAC,WAAW;gBACxC,KAAK,EAAE,eAAe,CAAC,KAAK,IAAI,SAAS;aAC1C,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YAC1B,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC;YACtE,MAAM,MAAM,GAAG,gBAAgB,CAAC,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,CAAC,CAAC;YAEtE,IAAI,MAAM,KAAK,CAAC,CAAC,IAAI,MAAM,KAAK,CAAC,CAAC;gBAAE,OAAO,CAAC,CAAC;YAC7C,IAAI,MAAM,KAAK,CAAC,CAAC;gBAAE,OAAO,CAAC,CAAC;YAC5B,IAAI,MAAM,KAAK,CAAC,CAAC;gBAAE,OAAO,CAAC,CAAC,CAAC;YAE7B,OAAO,MAAM,GAAG,MAAM,CAAC;QACzB,CAAC,CAAC,CAAC;QAEH,OAAO,aAAa,CAAC;IACvB,CAAC;IAEO,2BAA2B;QACjC,MAAM,OAAO,GAAG,IAAI,CAAC,4BAA4B,CAC/C,WAAW,IAAI,CAAC,cAAc,GAAG,EACjC,UAAU,EACV,IAAI,CAAC,gBAAgB,CACtB,CAAC;QACF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,OAAO,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;YAC3C,YAAY,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;SACrC;IACH,CAAC;IAEO,4BAA4B,CAClC,MAAc,EACd,MAAc,EACd,qBAA6B;QAE7B,MAAM,YAAY,GAAa,EAAE,CAAC;QAClC,MAAM,UAAU,GAAG,MAAM,GAAG,qBAAqB,GAAG,MAAM,CAAC;QAE3D,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,YAAY,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;YAC/C,MAAM,GAAG,GAAG,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;YAChC,IACE,GAAG;gBACH,GAAG,CAAC,UAAU,CAAC,MAAM,CAAC;gBACtB,GAAG,CAAC,QAAQ,CAAC,MAAM,CAAC;gBACpB,GAAG,KAAK,UAAU,EAClB;gBACA,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;aACxB;SACF;QAED,OAAO,YAAY,CAAC;IACtB,CAAC;IAEO,KAAK,CAAC,UAAU,CAAC,gBAAgB,GAAG,IAAI;;QAC9C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CACjC,CAAC,aAAwC,EAAE,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE,CAAC,CAAC;YACrE,GAAG,aAAa;YAChB,CAAC,WAAW,CAAC,EAAE,KAAK;SACrB,CAAC,EACF,EAAE,CACH,CAAC;QAEF,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;YACxB,MAAM,EAAE;gBACN,UAAU,EAAE,IAAI,CAAC,YAAY;gBAC7B,SAAS,EAAE,IAAI,CAAC,aAAa;gBAC7B,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,OAAO;gBACP,gBAAgB,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,CAChC,CAAC,CAAS,EAAiB,EAAE,CAAC,CAAC;oBAC7B,WAAW,EAAE,CAAC,CAAC,WAAW;oBAC1B,QAAQ,EAAkB,CAAC,CAAC,aAAa;iBAC1C,CAAC,CACH;aACF;YACD,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;SACf,CAAC,CACH,CAAC;QAEF,IAAI,IAAI,CAAC,cAAc,IAAI,gBAAgB,EAAE;YAC3C,MAAM,SAAS,GAA8B;gBAC3C,IAAI,EAAE,IAAI,CAAC,YAAY;gBACvB,KAAK,EAAE,IAAI,CAAC,aAAa;gBACzB,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;gBAC1B,IAAI,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE;gBAC9B,GAAG,IAAI,CAAC,qBAAqB,EAAE;aAChC,CAAC;YAEF,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;YAC1C,MAAM,gBAAgB,GAAG,IAAI,eAAe,CAAC,SAAS,CAAC,CAAC;YAExD,IAAI,CAAC,IAAI,CAAC,oBAAoB,EAAE;gBAC9B,IAAI,CAAC,wBAAwB,CAAC,gBAAgB,CAAC,CAAC;aACjD;YAED,MAAM,cAAc,GAAG,IAAI,eAAe,CAAC;gBACzC,GAAG,CAAC,MAAA,IAAI,CAAC,oBAAoB,mCAAI,EAAE,CAAC;gBACpC,GAAG,gBAAgB;aACpB,CAAC,CAAC;YACH,GAAG,CAAC,MAAM,GAAG,cAAc,CAAC,QAAQ,EAAE,CAAC;YACvC,MAAM,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,EAAE,GAAG,CAAC,QAAQ,EAAE,CAAC,CAAC;SACvD;IACH,CAAC;IAED,wBAAwB,CAAC,gBAAiC;QACxD,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;QAC1C,MAAM,oBAAoB,GAAG,IAAI,eAAe,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;QAE7D,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAS,EAAE,EAAE;YACjC,oBAAoB,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,WAAW,IAAI,CAAC,CAAC,aAAa,EAAE,CAAC,CAAC;QACrE,CAAC,CAAC,CAAC;QAEH,gBAAgB,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;YACtC,oBAAoB,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;QACnC,CAAC,CAAC,CAAC;QAEH,IAAI,CAAC,oBAAoB,GAAG,oBAAoB,CAAC;IACnD,CAAC;IAED,UAAU,CAAC,SAAiB,EAAE;QAC5B,IAAI,IAAI,CAAC,YAAY,KAAK,MAAM,EAAE;YAChC,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;SAC5B;aAAM;YACL,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,KAAK,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC;SACpE;QACD,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC;QAE3B,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IAiCD,wBAAwB,CAAC,OAAiB;QACxC,IAAI,IAAI,CAAC,aAAa,EAAE;YACtB,YAAY,CAAC,OAAO,CAClB,IAAI,CAAC,sBAAsB,EAC3B,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CACxB,CAAC;SACH;IACH,CAAC;IAED,KAAK,CAAC,uBAAuB;;QAC3B,MAAM,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC;QAC1C,MAAM,cAAc,GAAG,OAAO,CAAC,MAAM,CACnC,CAAC,MAAc,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,KAAK,IAAI,CAC3C,CAAC;QACF,MAAM,aAAa,GAAG,OAAO,CAAC,MAAM,CAClC,CAAC,MAAc,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,KAAK,IAAI,CAC3C,CAAC;QACF,MAAM,aAAa,GAAG,OAAO,CAAC,MAAM,CAClC,CAAC,MAAc,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,KAAK,IAAI,CAChD,CAAC;QAEF,MAAM,UAAU,GAAG;YACjB,GAAG,cAAc,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,MAAK,IAAI,CAAC;YAChE,GAAG,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,MAAK,IAAI,CAAC;YAC/D,GAAG,aAAa;SACjB,CAAC;QAEF,qDAAqD;QACrD,MAAM,WAAW,GAAG,KAAK,CAAC,IAAI,CAC5B,CAAA,MAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,UAAU,0CAAE,gBAAgB,CAAC,IAAI,CAAC,KAAI,EAAE,CACpD,CAAC;QACF,IAAI,WAAW,CAAC,MAAM,EAAE;YACtB,MAAM,WAAW,GAAG,WAAW;iBAC5B,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,YAAY,EAAE,MAAM,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;iBAC/D,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,YAAY,GAAG,CAAC,CAAC,YAAY,CAAC;iBAC/C,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YAEpB,MAAM,uBAAuB,GAAG,WAAW,CAAC,KAAK,CAC/C,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAC5C,CAAC;YACF,IAAI,gBAAgB,GAAa,EAAE,CAAC;YACpC,IAAI,CAAC,uBAAuB,EAAE;gBAC5B,gBAAgB,GAAG,WAAW,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC;gBACzD,IAAI,CAAC,cAAc,GAAG;oBACpB,GAAG,gBAAgB,CAAC,MAAM,CACxB,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,KAAK,IAAI,IAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,MAAK,IAAI,CACjE;oBACD,GAAG,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,MAAK,IAAI,CAAC;oBAC/D,GAAG,aAAa;iBACjB,CAAC;gBAEF,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC;gBAChC,MAAM,IAAI,CAAC,cAAc,CAAC;gBAC1B,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;gBAEjC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;aACpD;SACF;IACH,CAAC;IAED,KAAK,CAAC,wBAAwB,CAAC,CAAc;QAC3C,IAAI,CAAC,cAAc,GAAG,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC;QACrD,IAAI,CAAC,wBAAwB,CAAC,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;QAExD,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC;QAChC,MAAM,IAAI,CAAC,cAAc,CAAC;QAC1B,IAAI,CAAC,mBAAmB,GAAG,KAAK,CAAC;IACnC,CAAC;IAED,oBAAoB,CAAC,CAAc;QACjC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAc,EAAE,EAAU,EAAE,EAAE;YACtD,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC;gBAAE,OAAO;YACrC,IAAI,CAAC,cAAc,CAAC,EAAE,CAAC,CAAC,MAAM,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,CAAC;QAClD,CAAC,CAAC,CAAC;QACH,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC;IAED,qBAAqB,CAAC,OAAe,EAAE,KAAoB;QACzD,IAAI,KAAK,GAAG,EAAE,CAAC;QACf,IAAI,KAAK,CAAC,IAAI,CAAC,QAAQ,EAAE;YACvB,KAAK,IAAI,mBAAmB,CAAC;SAC9B;QACD,OAAO,KAAK,CAAC;IACf,CAAC;IAsGD,aAAa;QACX,MAAM,uBAAuB,GAAG,CAAC,GAAG,IAAI,CAAC,eAAe,CAAC,CAAC;QAE1D,IAAI,uBAAuB,CAAC,MAAM,GAAG,CAAC,EAAE;YACtC,OAAO,IAAI,CAAA,GAAG,uBAAuB,CAAC,GAAG,CACvC,CAAC,MAAc,EAAE,EAAU,EAAE,EAAE;gBAC7B,IAAI,MAAM,CAAC,MAAM,KAAK,IAAI;oBAAE,OAAO,OAAO,CAAC;gBAE3C,OAAO,IAAI,CAAA;cACP,oBAAoB,CACpB,GAAG,EAAE,CACH,IAAI,CAAC,kBAAkB,CACrB,MAAM,EACN,EAAE,EACF,uBAAuB,CAAC,MAAM,CAC/B,EACH,IAAI,CAAC,aAAa,CACnB;wBACW,CACV,IAAiB,EACjB,aAAyB,EACzB,KAAU,EACV,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,IAAI,EAAE,aAAa,EAAE,KAAK,CAAC;;oBAEpD,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC;sBACrB,MAAM,CAAC,MAAM;6BACN,MAAM,CAAC,WAAW;mBAC5B,MAAM,CAAC,IAAI;0BACJ,MAAM,CAAC,SAAS;wBAClB,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC;iCACjB,CAAC;YAC1B,CAAC,CACF,EAAE,CAAC;SACL;QAED,OAAO,IAAI,CAAA,2CAA2C,CAAC;IACzD,CAAC;IAED,aAAa;QACX,OAAO,IAAI,CAAA;;wBAES,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM;;oCAEhB,IAAI;WAC7B,CAAC;IACV,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;gBAEC,kBACN,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EACpD,IAAI,IAAI,CAAC,YAAY,EAAE;;UAErB,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,EAAE;UAC/C,IAAI,CAAC,aAAa,EAAE;UACpB,CAAC,IAAI,CAAC,mBAAmB;YACzB,CAAC,CAAC,IAAI,CAAA;wBACQ,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE;yBAClD,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU;gBAC5C,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC;gBACnC,CAAC,CAAC,IAAI,CAAC,IAAI;;6CAEgB,IAAI,CAAC,uBAAuB;;yCAEhC,IAAI,CAAC,qBAAqB;2BACxC,IAAI,CAAC,uBAAuB;;kBAErC,IAAI,CAAC,aAAa,EAAE;;gBAEtB,IAAI,CAAC,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmB;gBACnD,CAAC,CAAC,IAAI,CAAA,8BAA8B;gBACpC,CAAC,CAAC,OAAO,EAAE;YACjB,CAAC,CAAC,OAAO;UACT,IAAI,CAAC,QAAQ,GAAG,CAAC;YACjB,CAAC,CAAC,IAAI,CAAC,sBAAsB,EAAE;YAC/B,CAAC,CAAC,IAAI,CAAC,wBAAwB,EAAE;;;;KAItC,CAAC;IACJ,CAAC;;AA9oBe,aAAM,GAAG,CAAC,gBAAgB,CAAC,CAAC;AAQtB;IAArB,KAAK,CAAC,aAAa,CAAC;oCAAoB;AAGzC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,2BAA2B,EAAE,CAAC;uDAC3B;AAEb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAmB;AAEnB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;uCAAiC;AAEhC;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;oCAAkB;AAEhB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAyC;AAExC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAoB;AAElB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CAAoB;AAEQ;IAAvD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;2CAAqB;AAEhD;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAsB;AAErB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oCAAyB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAiC;AAEjC;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;yCAAwC;AAEtC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAiB;AAEhB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAgD;AAE9C;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAqB;AAEpB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAuB;AAEtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;yCAAmB;AAEpB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;iDACrB;AAEwD;IAA5D,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,mBAAmB,EAAE,CAAC;8CACrD;AAEsB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAA2B;AAE1B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mEACrB;AAEqB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DAA6C;AAE3C;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAA2B;AAE9C;IAAR,KAAK,EAAE;uCAAgC;AAE/B;IAAR,KAAK,EAAE;mDAA6B;AAE5B;IAAR,KAAK,EAAE;0CAAoB;AAEnB;IAAR,KAAK,EAAE;8CAA+B","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport '@digital-realty/ix-progress/ix-progress.js';\nimport '@vaadin/grid';\nimport { GridItemModel } from '@vaadin/grid';\nimport { columnHeaderRenderer } from '@vaadin/grid/lit.js';\nimport { GridColumn } from '@vaadin/grid/src/vaadin-grid-column.js';\nimport { html, LitElement, nothing, render } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport './components/IxGridColumnFilter.js';\nimport './components/IxGridDownloadMenu.js';\nimport './components/IxGridRowFilter.js';\nimport type { Filter } from './components/IxGridRowFilter.js';\nimport './components/IxPagination.js';\nimport { IxGridViewStyles } from './grid-view-styles.js';\nimport { copy } from './ix-grid-copy.js';\nimport { IxGridDownloadMenuItemModel } from './models/IxGridDownloadMenuItemModel.js';\n\nexport interface Row {\n [key: string]: unknown;\n}\n\nexport type FilterOperator = 'equals' | 'contains';\n\nexport type DataType = 'string' | 'dateTime';\n\nexport type BodyRenderer = (\n item: any,\n model: GridItemModel<any>,\n column: GridColumn\n) => any;\n\nexport interface Column {\n name: string;\n header: string;\n bodyRenderer: BodyRenderer;\n width?: string;\n sortable?: boolean;\n filterable?: boolean;\n hidden?: boolean;\n frozenToEnd?: boolean;\n dataType?: DataType;\n filterOperators?: FilterOperator[];\n autoWidth?: boolean;\n flexGrow?: number;\n}\n\nexport interface FieldOperator {\n columnField: string;\n operator: FilterOperator;\n}\n\nexport class IxGrid extends LitElement {\n static readonly styles = [IxGridViewStyles];\n\n private defaultPageSize = 10;\n\n private defaultPage = 1;\n\n private originalSearchParams: URLSearchParams | undefined = undefined;\n\n @query('vaadin-grid') grid!: HTMLElement;\n\n @property({ type: Boolean, attribute: 'column-reordering-allowed' })\n columnReorderingAllowed: boolean = false;\n\n @property({ type: String }) variantClass = '';\n\n @property({ type: Array }) readonly columns: Column[] = [];\n\n @property({ type: Array }) rows: Row[] = [];\n\n @property({ type: String }) defaultEmptyText = 'No data to display';\n\n @property({ type: String }) sortedColumn = '';\n\n @property({ type: String }) sortDirection = '';\n\n @property({ type: Boolean }) hideHeader = false;\n\n @property({ type: Boolean, attribute: 'hide-filters' }) hideFilters = false;\n\n @property({ type: Number }) rowLimit: number = 0;\n\n @property({ type: Number }) page = this.defaultPage;\n\n @property({ type: Number }) pageSize = this.defaultPageSize;\n\n @property({ type: Array }) pageSizes: number[] = [5, 10, 25, 100];\n\n @property({ type: Number }) recordCount = 0;\n\n @property({ type: String }) localStorageID: string | undefined = undefined;\n\n @property({ type: Boolean }) showDownload = true;\n\n @property({ type: Boolean }) isDownloading = false;\n\n @property({ type: Boolean }) isLoading = false;\n\n @property({ type: Array }) downloadMenuItems: IxGridDownloadMenuItemModel[] =\n [];\n\n @property({ type: Boolean, attribute: 'add-params-to-url' }) addParamsToURL =\n true;\n\n @property({ type: Boolean }) readParamsFromURL = false;\n\n @property({ type: Boolean }) refreshDataOnColumnVisibilityChange: boolean =\n true;\n\n @property({ type: Number }) filterValueChangeDebounceTime: number = 300;\n\n @property({ type: Boolean }) hideColumnHeaders = false;\n\n @state() private filters: Filter[] = [];\n\n @state() isColumnsReordering = false;\n\n @state() isExpanded = false;\n\n @state() displayColumns: Column[] = [];\n\n private hashedTableState: string = '';\n\n private initialised = false;\n\n get isPersistable() {\n if (this.localStorageID) return true;\n\n return false;\n }\n\n get columnNames() {\n return this.columns.map((column: Column) => column.name);\n }\n\n get columnsLocalStorageKey() {\n if (this.hashedTableState === '') {\n const columnsWithoutFunctions = this.columns.map(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ bodyRenderer, ...rest }) => rest\n );\n const serializedColumns = JSON.stringify(columnsWithoutFunctions);\n\n let hash = 0;\n for (let i = 0; i < serializedColumns.length; i += 1) {\n // Update hash using prime number multiplier (31) for better distribution and ensure it doesn't exceed 32-bit integer\n // eslint-disable-next-line no-bitwise\n hash = (hash * 31 + serializedColumns.charCodeAt(i)) >>> 0;\n }\n\n // Convert the string to base36 for brevity\n this.hashedTableState = hash.toString(36);\n }\n\n return `ix-grid-${this.localStorageID}-${this.hashedTableState}-columns`;\n }\n\n get arrangedColumns() {\n let columnsToDisplay: Column[] = [];\n columnsToDisplay = this.getColumnsToDisplayFromLocalStorage();\n\n if (columnsToDisplay.length === 0) columnsToDisplay = [...this.columns];\n\n return columnsToDisplay\n .filter(col => col)\n .map((column: Column) => ({\n ...column,\n width: !column.width ? undefined : column.width,\n }));\n }\n\n update(changedProperties: Map<string, any>) {\n if (!this.initialised && this.columns.length > 0) {\n this.displayColumns = [...this.columns];\n this.checkLocalStorageUpdate();\n this.initialised = true;\n }\n super.update(changedProperties);\n }\n\n firstUpdated() {\n if (this.readParamsFromURL) {\n const url = new URL(window.location.href);\n const searchParams = new URLSearchParams(url.search);\n const sort = searchParams.get('sort');\n const order = searchParams.get('order');\n const page = searchParams.get('page');\n const size = searchParams.get('size');\n\n if (sort && order) {\n this.sortedColumn = sort;\n this.sortDirection = order;\n }\n\n if (page) {\n this.page = parseInt(page, 10) || this.defaultPage;\n }\n\n if (size) {\n this.pageSize = parseInt(size, 10) || this.defaultPageSize;\n }\n }\n\n this.removeOldLocalStorageValues();\n }\n\n private checkLocalStorageUpdate(): void {\n if (this.isPersistable) {\n const preservedColumns = JSON.parse(\n localStorage.getItem(this.columnsLocalStorageKey) || '[]'\n );\n\n if (preservedColumns.length > 0) {\n let updateStorage = false;\n\n // Scenarios where we should update appData with the latest display columns data\n if (preservedColumns.length !== this.columns.length)\n updateStorage = true;\n const allColumnNamesFound =\n this.columns.every(column =>\n preservedColumns.some(pc => pc.name === column.name)\n ) &&\n preservedColumns.every(pc =>\n this.columns.some(column => column.name === pc.name)\n );\n if (!allColumnNamesFound) updateStorage = true;\n\n if (updateStorage) {\n this.setColumnsToLocalStorage(this.columns);\n }\n }\n }\n }\n\n buildQueryFromFilters() {\n const params = new URLSearchParams();\n\n this.filters.forEach((f: Filter) => {\n params.append(`${f.columnField}_${f.operatorValue}`, f.value);\n });\n\n return Object.fromEntries(params);\n }\n\n private getColumnsToDisplayFromLocalStorage(): Column[] {\n let columnsToDisplay: Column[] = [];\n if (this.isPersistable) {\n const preservedColumns = JSON.parse(\n localStorage.getItem(this.columnsLocalStorageKey) || '[]'\n );\n\n if (preservedColumns.length > 0) {\n columnsToDisplay =\n this.mapColumnsWithPersistedSettings(preservedColumns);\n }\n }\n\n return columnsToDisplay;\n }\n\n private mapColumnsWithPersistedSettings(\n preservedColumns: Column[]\n ): Column[] {\n const preservedMap = new Map(preservedColumns.map(col => [col.name, col]));\n\n const mappedColumns = this.columns.map(configuredColumn => {\n const preservedColumn = preservedMap.get(configuredColumn.name);\n\n if (!preservedColumn) {\n return { ...configuredColumn };\n }\n\n return {\n ...configuredColumn,\n hidden: preservedColumn.hidden,\n frozenToEnd: preservedColumn.frozenToEnd,\n width: preservedColumn.width || undefined,\n };\n });\n\n mappedColumns.sort((a, b) => {\n const indexA = preservedColumns.findIndex(col => col.name === a.name);\n const indexB = preservedColumns.findIndex(col => col.name === b.name);\n\n if (indexA === -1 && indexB === -1) return 0;\n if (indexA === -1) return 1;\n if (indexB === -1) return -1;\n\n return indexA - indexB;\n });\n\n return mappedColumns;\n }\n\n private removeOldLocalStorageValues() {\n const oldKeys = this.findMatchingLocalStorageKeys(\n `ix-grid-${this.localStorageID}-`,\n '-columns',\n this.hashedTableState\n );\n for (let i = 0; i <= oldKeys.length; i += 1) {\n localStorage.removeItem(oldKeys[i]);\n }\n }\n\n private findMatchingLocalStorageKeys(\n prefix: string,\n suffix: string,\n currentTableStateHash: string\n ): string[] {\n const matchingKeys: string[] = [];\n const currentKey = prefix + currentTableStateHash + suffix;\n\n for (let i = 0; i < localStorage.length; i += 1) {\n const key = localStorage.key(i);\n if (\n key &&\n key.startsWith(prefix) &&\n key.endsWith(suffix) &&\n key !== currentKey\n ) {\n matchingKeys.push(key);\n }\n }\n\n return matchingKeys;\n }\n\n private async updatePage(refreshUrlParams = true) {\n const filters = this.filters.reduce(\n (columnFilters: { [key: string]: string }, { columnField, value }) => ({\n ...columnFilters,\n [columnField]: value,\n }),\n {}\n );\n\n this.dispatchEvent(\n new CustomEvent('change', {\n detail: {\n columnName: this.sortedColumn,\n sortOrder: this.sortDirection,\n page: this.page,\n pageSize: this.pageSize,\n filters,\n filtersOperators: this.filters.map(\n (f: Filter): FieldOperator => ({\n columnField: f.columnField,\n operator: <FilterOperator>f.operatorValue,\n })\n ),\n },\n bubbles: true,\n composed: true,\n })\n );\n\n if (this.addParamsToURL && refreshUrlParams) {\n const urlParams: { [key: string]: string } = {\n sort: this.sortedColumn,\n order: this.sortDirection,\n page: this.page.toString(),\n size: this.pageSize.toString(),\n ...this.buildQueryFromFilters(),\n };\n\n const url = new URL(window.location.href);\n const gridSearchParams = new URLSearchParams(urlParams);\n\n if (!this.originalSearchParams) {\n this.saveOriginalSearchParams(gridSearchParams);\n }\n\n const combinedParams = new URLSearchParams([\n ...(this.originalSearchParams ?? []),\n ...gridSearchParams,\n ]);\n url.search = combinedParams.toString();\n window.history.replaceState(null, '', url.toString());\n }\n }\n\n saveOriginalSearchParams(gridSearchParams: URLSearchParams) {\n const url = new URL(window.location.href);\n const originalSearchParams = new URLSearchParams(url.search);\n\n this.filters.forEach((f: Filter) => {\n originalSearchParams.delete(`${f.columnField}_${f.operatorValue}`);\n });\n\n gridSearchParams.forEach((value, key) => {\n originalSearchParams.delete(key);\n });\n\n this.originalSearchParams = originalSearchParams;\n }\n\n handleSort(column: string = '') {\n if (this.sortedColumn !== column) {\n this.sortDirection = 'asc';\n } else {\n this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';\n }\n this.sortedColumn = column;\n\n this.updatePage();\n }\n\n private renderColumnHeader = (\n column: Column,\n index: number,\n length: number\n ) => {\n const headerClasses = classMap({\n header: true,\n frozen: !!column.frozenToEnd,\n first: index === 0,\n last: index === length - 1,\n });\n\n return html`\n <div\n @click=${() => column.sortable && this.handleSort(column.name)}\n @keyDown=${() => column.sortable && this.handleSort(column.name)}\n class=${headerClasses}\n >\n <span class=\"header-label\">${column.header}</span>\n ${column.sortable\n ? html`<ix-icon title=\"Sort\" class=\"header-sort-icon\"\n >${this.sortDirection === 'desc' &&\n this.sortedColumn === column.name\n ? `arrow_upward`\n : `arrow_downward`}</ix-icon\n >`\n : nothing}\n </div>\n `;\n };\n\n setColumnsToLocalStorage(columns: Column[]) {\n if (this.isPersistable) {\n localStorage.setItem(\n this.columnsLocalStorageKey,\n JSON.stringify(columns)\n );\n }\n }\n\n async reorderColumnsFromTable() {\n const columns = [...this.arrangedColumns];\n const visibleColumns = columns.filter(\n (column: Column) => column.hidden !== true\n );\n const hiddenColumns = columns.filter(\n (column: Column) => column.hidden === true\n );\n const frozenColumns = columns.filter(\n (column: Column) => column.frozenToEnd === true\n );\n\n const allColumns = [\n ...visibleColumns.filter(column => column?.frozenToEnd !== true),\n ...hiddenColumns.filter(column => column?.frozenToEnd !== true),\n ...frozenColumns,\n ];\n\n // calulate column order from table header flex order\n const headerNodes = Array.from(\n this.grid?.shadowRoot?.querySelectorAll('th') || []\n );\n if (headerNodes.length) {\n const columnOrder = headerNodes\n .map((el, id) => ({ id, flexPosition: Number(el.style.order) }))\n .sort((a, b) => a.flexPosition - b.flexPosition)\n .map(el => el.id);\n\n const columnsCorrectlyOrdered = columnOrder.every(\n (x, i) => i === 0 || x > columnOrder[i - 1]\n );\n let reorderedColumns: Column[] = [];\n if (!columnsCorrectlyOrdered) {\n reorderedColumns = columnOrder.map(id => allColumns[id]);\n this.displayColumns = [\n ...reorderedColumns.filter(\n column => column.hidden !== true && column?.frozenToEnd !== true\n ),\n ...hiddenColumns.filter(column => column?.frozenToEnd !== true),\n ...frozenColumns,\n ];\n\n this.isColumnsReordering = true;\n await this.updateComplete;\n this.isColumnsReordering = false;\n\n this.setColumnsToLocalStorage(this.displayColumns);\n }\n }\n }\n\n async reorderColumnsFromFilter(e: CustomEvent) {\n this.displayColumns = [...e.detail.reorderedColumns];\n this.setColumnsToLocalStorage([...this.displayColumns]);\n\n this.isColumnsReordering = true;\n await this.updateComplete;\n this.isColumnsReordering = false;\n }\n\n handleOnColumnFilter(e: CustomEvent) {\n e.detail.columns.forEach((column: Column, id: number) => {\n if (!this.displayColumns[id]) return;\n this.displayColumns[id].hidden = column?.hidden;\n });\n this.updatePage(false);\n }\n\n cellPartNameGenerator(_column: Column, model: { item: Row }): string {\n let parts = '';\n if (model.item.disabled) {\n parts += ' ix-disabled-cell';\n }\n return parts;\n }\n\n private columnRenderer = (\n column: Column,\n root: HTMLElement,\n columnElement: GridColumn,\n model: any\n ) => {\n /*\n Due to a quirk of vaadin-grid, in order for the column cells to react to\n changes to bodyRenderer output, we must clear the contents of the cell\n before rendering the new content. Otherwise the new content will be\n appended to the existing content.\n */\n render(nothing, root);\n\n const templateResult = column.bodyRenderer(\n model.item,\n model,\n columnElement\n );\n\n render(templateResult, root);\n };\n\n private renderHeader = () => html`\n <div class=\"grid-header\">\n <slot name=\"header\"><div class=\"empty\"></div></slot>\n ${this.hideFilters\n ? nothing\n : html`<div class=\"grid-menu\">\n <ix-grid-column-filter\n .columns=${this.arrangedColumns}\n columnsLocalStorageKey=${ifDefined(this.columnsLocalStorageKey)}\n @columnFilter=${(e: CustomEvent) => this.handleOnColumnFilter(e)}\n @reorderColumns=${this.reorderColumnsFromFilter}\n .columnReorderingAllowed=${this.columnReorderingAllowed}\n .refreshDataOnColumnVisibilityChange=${this\n .refreshDataOnColumnVisibilityChange}\n .requestGridUpdate=${() => this.requestUpdate()}\n ></ix-grid-column-filter>\n ${this.showDownload\n ? html`<ix-grid-download-menu\n .items=${this.downloadMenuItems}\n .isDownloading=${this.isDownloading}\n ></ix-grid-download-menu>`\n : nothing}\n <ix-grid-row-filter\n .columns=${this.displayColumns}\n .filterValueChangeDebounceTime=${this\n .filterValueChangeDebounceTime}\n .readParamsFromURL=${this.readParamsFromURL}\n @rowFilter=${(e: CustomEvent) => {\n this.filters = e.detail.filters;\n if (e.detail.resetPage) {\n this.page = this.defaultPage;\n }\n this.updatePage();\n }}\n ></ix-grid-row-filter>\n </div>`}\n </div>\n <div class=\"touch-edge\">\n <slot name=\"under-header\"></slot>\n </div>\n `;\n\n private renderRowLimitControls = () => {\n if (this.rows.length <= this.rowLimit) return nothing;\n\n return html`\n <div class=\"row-controls row-limit\">\n <ix-button\n appearance=\"text\"\n @click=${() => {\n this.isExpanded = !this.isExpanded;\n }}\n has-icon\n >\n ${this.isExpanded ? copy.viewLess : copy.viewMore}\n <ix-icon slot=\"icon\">${this.isExpanded ? 'remove' : 'add'}</ix-icon>\n </ix-button>\n </div>\n `;\n };\n\n private renderPaginationControls = () => html`\n <div class=\"row-controls pagination\">\n <ix-pagination\n .page=${this.page}\n .pageSize=${this.pageSize}\n .pageSizes=${this.pageSizes}\n .recordCount=${this.recordCount}\n @updatePagination=${(e: CustomEvent) => {\n this.page = e.detail.page;\n this.pageSize = e.detail.pageSize;\n this.updatePage();\n }}\n ></ix-pagination>\n </div>\n `;\n\n renderColumns() {\n const arrangedColumnsInstance = [...this.arrangedColumns];\n\n if (arrangedColumnsInstance.length > 0) {\n return html`${arrangedColumnsInstance.map(\n (column: Column, id: number) => {\n if (column.hidden === true) return nothing;\n\n return html`<vaadin-grid-column\n ${columnHeaderRenderer(\n () =>\n this.renderColumnHeader(\n column,\n id,\n arrangedColumnsInstance.length\n ),\n this.sortDirection\n )}\n .renderer=${(\n root: HTMLElement,\n columnElement: GridColumn,\n model: any\n ) => this.columnRenderer(column, root, columnElement, model)}\n resizable\n width=${ifDefined(column.width)}\n ?hidden=${column.hidden}\n ?frozen-to-end=${column.frozenToEnd}\n path=${column.name}\n ?auto-width=${column.autoWidth}\n flex-grow=${ifDefined(column.flexGrow)}\n ></vaadin-grid-column>`;\n }\n )}`;\n }\n\n return html`<vaadin-grid-column></vaadin-grid-column>`;\n }\n\n renderLoading() {\n return html` <div\n class=\"progress-container\"\n style=\"display: ${this.isLoading ? '' : 'none'}\"\n >\n <ix-progress .indeterminate=${true}></ix-progress>\n </div>`;\n }\n\n render() {\n return html`\n <div\n class=${`grid-container ${\n this.isColumnsReordering ? 'columns-reordering' : ''\n } ${this.variantClass}`}\n >\n ${this.hideHeader ? nothing : this.renderHeader()}\n ${this.renderLoading()}\n ${!this.isColumnsReordering\n ? html`<vaadin-grid\n class=${this.hideColumnHeaders ? 'hide-column-headers' : ''}\n .items=${this.rowLimit > 0 && !this.isExpanded\n ? this.rows.slice(0, this.rowLimit)\n : this.rows}\n all-rows-visible\n ?column-reordering-allowed=${this.columnReorderingAllowed}\n theme=\"no-border\"\n .cellPartNameGenerator=${this.cellPartNameGenerator}\n @mouseup=${this.reorderColumnsFromTable}\n >\n ${this.renderColumns()}\n </vaadin-grid>\n ${this.rows.length === 0 && !this.isColumnsReordering\n ? html`<slot name=\"no-rows\"></slot>`\n : nothing}`\n : nothing}\n ${this.rowLimit > 0\n ? this.renderRowLimitControls()\n : this.renderPaginationControls()}\n\n <slot name=\"footer\"></slot>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"IxGrid.js","sourceRoot":"","sources":["../src/IxGrid.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport '@digital-realty/ix-progress/ix-progress.js';\nimport '@vaadin/grid';\nimport { GridItemModel } from '@vaadin/grid';\nimport { columnHeaderRenderer } from '@vaadin/grid/lit.js';\nimport { GridColumn } from '@vaadin/grid/src/vaadin-grid-column.js';\nimport { html, LitElement, nothing, render } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport './components/IxGridColumnFilter.js';\nimport './components/IxGridDownloadMenu.js';\nimport './components/IxGridRowFilter.js';\nimport type { Filter } from './components/IxGridRowFilter.js';\nimport './components/IxPagination.js';\nimport { IxGridViewStyles } from './grid-view-styles.js';\nimport { copy } from './ix-grid-copy.js';\nimport { IxGridDownloadMenuItemModel } from './models/IxGridDownloadMenuItemModel.js';\n\nexport interface Row {\n [key: string]: unknown;\n}\n\nexport type FilterOperator = 'equals' | 'contains';\n\nexport type DataType = 'string' | 'dateTime';\n\nexport type BodyRenderer = (\n item: any,\n model: GridItemModel<any>,\n column: GridColumn\n) => any;\n\nexport interface Column {\n name: string;\n header: string;\n bodyRenderer: BodyRenderer;\n width?: string;\n sortable?: boolean;\n filterable?: boolean;\n hidden?: boolean;\n frozenToEnd?: boolean;\n dataType?: DataType;\n filterOperators?: FilterOperator[];\n autoWidth?: boolean;\n flexGrow?: number;\n}\n\nexport interface FieldOperator {\n columnField: string;\n operator: FilterOperator;\n}\n\nexport class IxGrid extends LitElement {\n static readonly styles = [IxGridViewStyles];\n\n private defaultPageSize = 10;\n\n private defaultPage = 1;\n\n private originalSearchParams: URLSearchParams | undefined = undefined;\n\n @query('vaadin-grid') grid!: HTMLElement;\n\n @property({ type: Boolean, attribute: 'column-reordering-allowed' })\n columnReorderingAllowed: boolean = false;\n\n @property({ type: String }) variantClass = '';\n\n @property({ type: Array }) readonly columns: Column[] = [];\n\n @property({ type: Array }) rows: Row[] = [];\n\n @property({ type: String }) defaultEmptyText = 'No data to display';\n\n @property({ type: String }) sortedColumn = '';\n\n @property({ type: String }) sortDirection = '';\n\n @property({ type: Boolean }) hideHeader = false;\n\n @property({ type: Boolean, attribute: 'hide-filters' }) hideFilters = false;\n\n @property({ type: Number }) rowLimit: number = 0;\n\n @property({ type: Number }) page = this.defaultPage;\n\n @property({ type: Number }) pageSize = this.defaultPageSize;\n\n @property({ type: Array }) pageSizes: number[] = [5, 10, 25, 100];\n\n @property({ type: Number }) recordCount = 0;\n\n @property({ type: String }) localStorageID: string | undefined = undefined;\n\n @property({ type: Boolean }) showDownload = true;\n\n @property({ type: Boolean }) isDownloading = false;\n\n @property({ type: Boolean }) isLoading = false;\n\n @property({ type: Array }) downloadMenuItems: IxGridDownloadMenuItemModel[] =\n [];\n\n @property({ type: Boolean, attribute: 'add-params-to-url' }) addParamsToURL =\n true;\n\n @property({ type: Boolean }) readParamsFromURL = false;\n\n @property({ type: Boolean }) refreshDataOnColumnVisibilityChange: boolean =\n true;\n\n @property({ type: Number }) filterValueChangeDebounceTime: number = 300;\n\n @property({ type: Boolean }) hideColumnHeaders = false;\n\n @state() private filters: Filter[] = [];\n\n @state() isColumnsReordering = false;\n\n @state() isExpanded = false;\n\n @state() displayColumns: Column[] = [];\n\n private hashedTableState: string = '';\n\n private initialised = false;\n\n get isPersistable() {\n if (this.localStorageID) return true;\n\n return false;\n }\n\n get columnNames() {\n return this.columns.map((column: Column) => column.name);\n }\n\n get columnsLocalStorageKey() {\n if (this.hashedTableState === '') {\n const columnsWithoutFunctions = this.columns.map(\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n ({ bodyRenderer, ...rest }) => rest\n );\n const serializedColumns = JSON.stringify(columnsWithoutFunctions);\n\n let hash = 0;\n for (let i = 0; i < serializedColumns.length; i += 1) {\n // Update hash using prime number multiplier (31) for better distribution and ensure it doesn't exceed 32-bit integer\n // eslint-disable-next-line no-bitwise\n hash = (hash * 31 + serializedColumns.charCodeAt(i)) >>> 0;\n }\n\n // Convert the string to base36 for brevity\n this.hashedTableState = hash.toString(36);\n }\n\n return `ix-grid-${this.localStorageID}-${this.hashedTableState}-columns`;\n }\n\n get arrangedColumns() {\n let columnsToDisplay: Column[] = [];\n columnsToDisplay = this.getColumnsToDisplayFromLocalStorage();\n\n if (columnsToDisplay.length === 0) columnsToDisplay = [...this.columns];\n\n return columnsToDisplay\n .filter(col => col)\n .map((column: Column) => ({\n ...column,\n width: !column.width ? undefined : column.width,\n }));\n }\n\n update(changedProperties: Map<string, any>) {\n if (!this.initialised && this.columns.length > 0) {\n this.displayColumns = [...this.columns];\n this.checkLocalStorageUpdate();\n this.initialised = true;\n }\n super.update(changedProperties);\n }\n\n firstUpdated() {\n if (this.readParamsFromURL) {\n const url = new URL(window.location.href);\n const searchParams = new URLSearchParams(url.search);\n const sort = searchParams.get('sort');\n const order = searchParams.get('order');\n const page = searchParams.get('page');\n const size = searchParams.get('size');\n\n if (sort && order) {\n this.sortedColumn = sort;\n this.sortDirection = order;\n }\n\n if (page) {\n this.page = parseInt(page, 10) || this.defaultPage;\n }\n\n if (size) {\n this.pageSize = parseInt(size, 10) || this.defaultPageSize;\n }\n }\n\n this.removeOldLocalStorageValues();\n }\n\n private checkLocalStorageUpdate(): void {\n if (this.isPersistable) {\n const preservedColumns = JSON.parse(\n localStorage.getItem(this.columnsLocalStorageKey) || '[]'\n );\n\n if (preservedColumns.length > 0) {\n let updateStorage = false;\n\n // Scenarios where we should update appData with the latest display columns data\n if (preservedColumns.length !== this.columns.length)\n updateStorage = true;\n const allColumnNamesFound =\n this.columns.every(column =>\n preservedColumns.some(pc => pc.name === column.name)\n ) &&\n preservedColumns.every(pc =>\n this.columns.some(column => column.name === pc.name)\n );\n if (!allColumnNamesFound) updateStorage = true;\n\n if (updateStorage) {\n this.setColumnsToLocalStorage(this.columns);\n }\n }\n }\n }\n\n buildQueryFromFilters() {\n const params = new URLSearchParams();\n\n this.filters.forEach((f: Filter) => {\n params.append(`${f.columnField}_${f.operatorValue}`, f.value);\n });\n\n return Object.fromEntries(params);\n }\n\n private getColumnsToDisplayFromLocalStorage(): Column[] {\n let columnsToDisplay: Column[] = [];\n if (this.isPersistable) {\n const preservedColumns = JSON.parse(\n localStorage.getItem(this.columnsLocalStorageKey) || '[]'\n );\n\n if (preservedColumns.length > 0) {\n columnsToDisplay =\n this.mapColumnsWithPersistedSettings(preservedColumns);\n }\n }\n\n return columnsToDisplay;\n }\n\n private mapColumnsWithPersistedSettings(\n preservedColumns: Column[]\n ): Column[] {\n const preservedMap = new Map(preservedColumns.map(col => [col.name, col]));\n\n const mappedColumns = this.columns.map(configuredColumn => {\n const preservedColumn = preservedMap.get(configuredColumn.name);\n\n if (!preservedColumn) {\n return { ...configuredColumn };\n }\n\n return {\n ...configuredColumn,\n hidden: preservedColumn.hidden,\n frozenToEnd: preservedColumn.frozenToEnd,\n width: preservedColumn.width || undefined,\n };\n });\n\n mappedColumns.sort((a, b) => {\n const indexA = preservedColumns.findIndex(col => col.name === a.name);\n const indexB = preservedColumns.findIndex(col => col.name === b.name);\n\n if (indexA === -1 && indexB === -1) return 0;\n if (indexA === -1) return 1;\n if (indexB === -1) return -1;\n\n return indexA - indexB;\n });\n\n return mappedColumns;\n }\n\n private removeOldLocalStorageValues() {\n const oldKeys = this.findMatchingLocalStorageKeys(\n `ix-grid-${this.localStorageID}-`,\n '-columns',\n this.hashedTableState\n );\n for (let i = 0; i <= oldKeys.length; i += 1) {\n localStorage.removeItem(oldKeys[i]);\n }\n }\n\n private findMatchingLocalStorageKeys(\n prefix: string,\n suffix: string,\n currentTableStateHash: string\n ): string[] {\n const matchingKeys: string[] = [];\n const currentKey = prefix + currentTableStateHash + suffix;\n\n for (let i = 0; i < localStorage.length; i += 1) {\n const key = localStorage.key(i);\n if (\n key &&\n key.startsWith(prefix) &&\n key.endsWith(suffix) &&\n key !== currentKey\n ) {\n matchingKeys.push(key);\n }\n }\n\n return matchingKeys;\n }\n\n private async updatePage(refreshUrlParams = true) {\n const filters = this.filters.reduce(\n (columnFilters: { [key: string]: string }, { columnField, value }) => ({\n ...columnFilters,\n [columnField]: value,\n }),\n {}\n );\n\n this.dispatchEvent(\n new CustomEvent('change', {\n detail: {\n columnName: this.sortedColumn,\n sortOrder: this.sortDirection,\n page: this.page,\n pageSize: this.pageSize,\n filters,\n filtersOperators: this.filters.map(\n (f: Filter): FieldOperator => ({\n columnField: f.columnField,\n operator: <FilterOperator>f.operatorValue,\n })\n ),\n },\n bubbles: true,\n composed: true,\n })\n );\n\n if (this.addParamsToURL && refreshUrlParams) {\n const urlParams: { [key: string]: string } = {\n sort: this.sortedColumn,\n order: this.sortDirection,\n page: this.page.toString(),\n size: this.pageSize.toString(),\n ...this.buildQueryFromFilters(),\n };\n\n const url = new URL(window.location.href);\n const gridSearchParams = new URLSearchParams(urlParams);\n\n if (!this.originalSearchParams) {\n this.saveOriginalSearchParams(gridSearchParams);\n }\n\n const combinedParams = new URLSearchParams([\n ...(this.originalSearchParams ?? []),\n ...gridSearchParams,\n ]);\n url.search = combinedParams.toString();\n window.history.replaceState(null, '', url.toString());\n }\n }\n\n saveOriginalSearchParams(gridSearchParams: URLSearchParams) {\n const url = new URL(window.location.href);\n const originalSearchParams = new URLSearchParams(url.search);\n\n this.filters.forEach((f: Filter) => {\n originalSearchParams.delete(`${f.columnField}_${f.operatorValue}`);\n });\n\n gridSearchParams.forEach((value, key) => {\n originalSearchParams.delete(key);\n });\n\n this.originalSearchParams = originalSearchParams;\n }\n\n handleSort(column: string = '') {\n if (this.sortedColumn !== column) {\n this.sortDirection = 'asc';\n } else {\n this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';\n }\n this.sortedColumn = column;\n\n this.updatePage();\n }\n\n private renderColumnHeader = (\n column: Column,\n index: number,\n length: number\n ) => {\n const headerClasses = classMap({\n header: true,\n frozen: !!column.frozenToEnd,\n first: index === 0,\n last: index === length - 1,\n });\n\n return html`\n <div\n @click=${() => column.sortable && this.handleSort(column.name)}\n @keyDown=${() => column.sortable && this.handleSort(column.name)}\n class=${headerClasses}\n >\n <span class=\"header-label\">${column.header}</span>\n ${column.sortable\n ? html`<ix-icon title=\"Sort\" class=\"header-sort-icon\"\n >${this.sortDirection === 'desc' &&\n this.sortedColumn === column.name\n ? `arrow_upward`\n : `arrow_downward`}</ix-icon\n >`\n : nothing}\n </div>\n `;\n };\n\n setColumnsToLocalStorage(columns: Column[]) {\n if (this.isPersistable) {\n localStorage.setItem(\n this.columnsLocalStorageKey,\n JSON.stringify(columns)\n );\n }\n }\n\n async reorderColumnsFromTable() {\n const columns = [...this.arrangedColumns];\n const visibleColumns = columns.filter(\n (column: Column) => column.hidden !== true\n );\n const hiddenColumns = columns.filter(\n (column: Column) => column.hidden === true\n );\n const frozenColumns = columns.filter(\n (column: Column) => column.frozenToEnd === true\n );\n\n const allColumns = [\n ...visibleColumns.filter(column => column?.frozenToEnd !== true),\n ...hiddenColumns.filter(column => column?.frozenToEnd !== true),\n ...frozenColumns,\n ];\n\n // calulate column order from table header flex order\n const headerNodes = Array.from(\n this.grid?.shadowRoot?.querySelectorAll('th') || []\n );\n if (headerNodes.length) {\n const columnOrder = headerNodes\n .map((el, id) => ({ id, flexPosition: Number(el.style.order) }))\n .sort((a, b) => a.flexPosition - b.flexPosition)\n .map(el => el.id);\n\n const columnsCorrectlyOrdered = columnOrder.every(\n (x, i) => i === 0 || x > columnOrder[i - 1]\n );\n let reorderedColumns: Column[] = [];\n if (!columnsCorrectlyOrdered) {\n reorderedColumns = columnOrder.map(id => allColumns[id]);\n this.displayColumns = [\n ...reorderedColumns.filter(\n column => column.hidden !== true && column?.frozenToEnd !== true\n ),\n ...hiddenColumns.filter(column => column?.frozenToEnd !== true),\n ...frozenColumns,\n ];\n\n this.isColumnsReordering = true;\n await this.updateComplete;\n this.isColumnsReordering = false;\n\n this.setColumnsToLocalStorage(this.displayColumns);\n }\n }\n }\n\n async reorderColumnsFromFilter(e: CustomEvent) {\n this.displayColumns = [...e.detail.reorderedColumns];\n this.setColumnsToLocalStorage([...this.displayColumns]);\n\n this.isColumnsReordering = true;\n await this.updateComplete;\n this.isColumnsReordering = false;\n }\n\n handleOnColumnFilter(e: CustomEvent) {\n e.detail.columns.forEach((column: Column, id: number) => {\n if (!this.displayColumns[id]) return;\n this.displayColumns[id].hidden = column?.hidden;\n });\n this.displayColumns = [...this.displayColumns];\n this.updatePage(false);\n }\n\n cellPartNameGenerator(_column: Column, model: { item: Row }): string {\n let parts = '';\n if (model.item.disabled) {\n parts += ' ix-disabled-cell';\n }\n return parts;\n }\n\n private columnRenderer = (\n column: Column,\n root: HTMLElement,\n columnElement: GridColumn,\n model: any\n ) => {\n /*\n Due to a quirk of vaadin-grid, in order for the column cells to react to\n changes to bodyRenderer output, we must clear the contents of the cell\n before rendering the new content. Otherwise the new content will be\n appended to the existing content.\n */\n render(nothing, root);\n\n const templateResult = column.bodyRenderer(\n model.item,\n model,\n columnElement\n );\n\n render(templateResult, root);\n };\n\n private renderHeader = () => html`\n <div class=\"grid-header\">\n <slot name=\"header\"><div class=\"empty\"></div></slot>\n ${this.hideFilters\n ? nothing\n : html`<div class=\"grid-menu\">\n <ix-grid-column-filter\n .columns=${this.arrangedColumns}\n columnsLocalStorageKey=${ifDefined(this.columnsLocalStorageKey)}\n @columnFilter=${(e: CustomEvent) => this.handleOnColumnFilter(e)}\n @reorderColumns=${this.reorderColumnsFromFilter}\n .columnReorderingAllowed=${this.columnReorderingAllowed}\n .refreshDataOnColumnVisibilityChange=${this\n .refreshDataOnColumnVisibilityChange}\n .requestGridUpdate=${() => this.requestUpdate()}\n ></ix-grid-column-filter>\n ${this.showDownload\n ? html`<ix-grid-download-menu\n .items=${this.downloadMenuItems}\n .isDownloading=${this.isDownloading}\n ></ix-grid-download-menu>`\n : nothing}\n <ix-grid-row-filter\n .columns=${this.displayColumns}\n .filterValueChangeDebounceTime=${this\n .filterValueChangeDebounceTime}\n .readParamsFromURL=${this.readParamsFromURL}\n @rowFilter=${(e: CustomEvent) => {\n this.filters = e.detail.filters;\n if (e.detail.resetPage) {\n this.page = this.defaultPage;\n }\n this.updatePage();\n }}\n ></ix-grid-row-filter>\n </div>`}\n </div>\n <div class=\"touch-edge\">\n <slot name=\"under-header\"></slot>\n </div>\n `;\n\n private renderRowLimitControls = () => {\n if (this.rows.length <= this.rowLimit) return nothing;\n\n return html`\n <div class=\"row-controls row-limit\">\n <ix-button\n appearance=\"text\"\n @click=${() => {\n this.isExpanded = !this.isExpanded;\n }}\n has-icon\n >\n ${this.isExpanded ? copy.viewLess : copy.viewMore}\n <ix-icon slot=\"icon\">${this.isExpanded ? 'remove' : 'add'}</ix-icon>\n </ix-button>\n </div>\n `;\n };\n\n private renderPaginationControls = () => html`\n <div class=\"row-controls pagination\">\n <ix-pagination\n .page=${this.page}\n .pageSize=${this.pageSize}\n .pageSizes=${this.pageSizes}\n .recordCount=${this.recordCount}\n @updatePagination=${(e: CustomEvent) => {\n this.page = e.detail.page;\n this.pageSize = e.detail.pageSize;\n this.updatePage();\n }}\n ></ix-pagination>\n </div>\n `;\n\n renderColumns() {\n const arrangedColumnsInstance = [...this.arrangedColumns];\n\n if (arrangedColumnsInstance.length > 0) {\n return html`${arrangedColumnsInstance.map(\n (column: Column, id: number) => {\n if (column.hidden === true) return nothing;\n\n return html`<vaadin-grid-column\n ${columnHeaderRenderer(\n () =>\n this.renderColumnHeader(\n column,\n id,\n arrangedColumnsInstance.length\n ),\n this.sortDirection\n )}\n .renderer=${(\n root: HTMLElement,\n columnElement: GridColumn,\n model: any\n ) => this.columnRenderer(column, root, columnElement, model)}\n resizable\n width=${ifDefined(column.width)}\n ?hidden=${column.hidden}\n ?frozen-to-end=${column.frozenToEnd}\n path=${column.name}\n ?auto-width=${column.autoWidth}\n flex-grow=${ifDefined(column.flexGrow)}\n ></vaadin-grid-column>`;\n }\n )}`;\n }\n\n return html`<vaadin-grid-column></vaadin-grid-column>`;\n }\n\n renderLoading() {\n return html` <div\n class=\"progress-container\"\n style=\"display: ${this.isLoading ? '' : 'none'}\"\n >\n <ix-progress .indeterminate=${true}></ix-progress>\n </div>`;\n }\n\n renderGrid() {\n if (this.isColumnsReordering) {\n return nothing;\n }\n\n const columnDisplayed = this.displayColumns.find(\n (column: Column) => column.hidden !== true\n );\n\n if (this.rows.length === 0 || !columnDisplayed) {\n return html`<slot name=\"no-rows\"></slot>`;\n }\n\n return html`<vaadin-grid\n class=${this.hideColumnHeaders ? 'hide-column-headers' : ''}\n .items=${this.rowLimit > 0 && !this.isExpanded\n ? this.rows.slice(0, this.rowLimit)\n : this.rows}\n all-rows-visible\n ?column-reordering-allowed=${this.columnReorderingAllowed}\n theme=\"no-border\"\n .cellPartNameGenerator=${this.cellPartNameGenerator}\n @mouseup=${this.reorderColumnsFromTable}\n >\n ${this.renderColumns()}\n </vaadin-grid>`;\n }\n\n render() {\n return html`\n <div\n class=${`grid-container ${\n this.isColumnsReordering ? 'columns-reordering' : ''\n } ${this.variantClass}`}\n >\n ${this.hideHeader ? nothing : this.renderHeader()}\n ${this.renderLoading()} ${this.renderGrid()}\n ${this.rowLimit > 0\n ? this.renderRowLimitControls()\n : this.renderPaginationControls()}\n\n <slot name=\"footer\"></slot>\n </div>\n `;\n }\n}\n"]}
package/dist/components/IxGridColumnFilter.js CHANGED
@@ -96,10 +96,7 @@ let IxGridColumnFilter = class IxGridColumnFilter extends LitElement {
96
96
  if (this.columnsLocalStorageKey) {
97
97
  localStorage.setItem(this.columnsLocalStorageKey, JSON.stringify([...this.columns]));
98
98
  }
99
- if (this.refreshDataOnColumnVisibilityChange)
100
- this.dispatchUpdate();
101
- else
102
- this.requestGridUpdate();
99
+ this.dispatchUpdate();
103
100
  }
104
101
  dispatchUpdate(columns = this.columns) {
105
102
  this.dispatchEvent(new CustomEvent('columnFilter', {
@@ -198,7 +195,7 @@ let IxGridColumnFilter = class IxGridColumnFilter extends LitElement {
198
195
  ${repeat(this.columns.filter(c => c.filterable !== false), (col) => col.name, (col, id) => html `<div>
199
196
  <label
200
197
  class=${`ix-switch-label drag-target ${this.dragEvent.startId === id ? 'dragOrigin' : ''}`}
201
- draggable="true"
198
+ draggable=${this.columnReorderingAllowed}
202
199
  data-id=${id}
203
200
  >
204
201
  <ix-switch
@@ -207,7 +204,9 @@ let IxGridColumnFilter = class IxGridColumnFilter extends LitElement {
207
204
  >
208
205
  </ix-switch>
209
206
  <p>${col.header}</p>
210
- <div class="draggable">${handleIcon}</ix-div>
207
+ ${this.columnReorderingAllowed
208
+ ? html `<div class="draggable">${handleIcon}</div>`
209
+ : nothing}
211
210
  </label>
212
211
  </div>`)}
213
212
  </div>`
package/dist/components/IxGridColumnFilter.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IxGridColumnFilter.js","sourceRoot":"","sources":["../../src/components/IxGridColumnFilter.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html, nothing, svg } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport '@digital-realty/ix-switch/ix-switch.js';\nimport { IxGridViewStyles } from '../grid-view-styles.js';\nimport { IxGridColumnFilterStyles } from './grid-column-filter-styles.js';\nimport type { Column } from '../IxGrid.js';\n\nconst triggerKeys = [' ', 'Enter'];\n\nconst handleIcon = svg`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M9 4C7.9 4 7 4.9 7 6C7 7.1 7.9 8 9 8C10.1 8 11 7.1 11 6C11 4.9 10.1 4 9 4ZM7 12C7 10.9 7.9 10 9 10C10.1 10 11 10.9 11 12C11 13.1 10.1 14 9 14C7.9 14 7 13.1 7 12ZM9 20C10.1 20 11 19.1 11 18C11 16.9 10.1 16 9 16C7.9 16 7 16.9 7 18C7 19.1 7.9 20 9 20ZM17 6C17 7.1 16.1 8 15 8C13.9 8 13 7.1 13 6C13 4.9 13.9 4 15 4C16.1 4 17 4.9 17 6ZM15 10C13.9 10 13 10.9 13 12C13 13.1 13.9 14 15 14C16.1 14 17 13.1 17 12C17 10.9 16.1 10 15 10ZM13 18C13 16.9 13.9 16 15 16C16.1 16 17 16.9 17 18C17 19.1 16.1 20 15 20C13.9 20 13 19.1 13 18Z\" fill=\"#1456e0\" />\n</svg>`;\n\n@customElement('ix-grid-column-filter')\nexport class IxGridColumnFilter extends LitElement {\n static readonly styles = [IxGridViewStyles, IxGridColumnFilterStyles];\n\n @query('.dropdown-content') dropdown!: HTMLElement;\n\n @property({ type: Array }) columns: Column[] = [];\n\n @property({ type: String }) columnsLocalStorageKey: string | undefined =\n undefined;\n\n @property({ type: Boolean }) columnReorderingAllowed: boolean = false;\n\n @property({ type: Boolean }) refreshDataOnColumnVisibilityChange: boolean =\n true;\n\n @property({ attribute: false }) requestGridUpdate: any;\n\n @state() private isDropdownVisible: boolean = false;\n\n @state() disabledColumns: string[] = [];\n\n @state() dragEvent: {\n sourceEl: HTMLElement | null;\n startId: number;\n targetId: number;\n } = {\n sourceEl: null,\n startId: -1,\n targetId: -1,\n };\n\n connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this.outerInteraction);\n this.initializeLocalStorage();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('click', this.outerInteraction);\n }\n\n outerInteraction = (e: Event) => {\n if (!e.composedPath().includes(this)) {\n this.isDropdownVisible = false;\n }\n };\n\n get preservedColumns() {\n let preservedColumns: Column[] = [];\n\n if (this.columnsLocalStorageKey) {\n preservedColumns = JSON.parse(\n localStorage.getItem(this.columnsLocalStorageKey) || '[]'\n );\n }\n return preservedColumns;\n }\n\n initializeLocalStorage() {\n if (this.preservedColumns.length > 0) {\n this.disabledColumns = this.preservedColumns\n .filter(c => c.hidden && this.columns.some(col => col.name === c.name))\n .map(c => c.name);\n this.columns.forEach((column, id) => {\n if (this.disabledColumns.includes(column.name)) {\n this.columns[id].hidden = true;\n }\n });\n }\n this.dispatchUpdate();\n }\n\n protected update(changedProperties: PropertyValues): void {\n super.update(changedProperties);\n if (changedProperties.has('columnsLocalStorageKey')) {\n this.initializeLocalStorage();\n }\n }\n\n toggleColumn(id: number) {\n this.columns[id].hidden = !this.columns[id].hidden;\n\n this.disabledColumns = this.columns\n .filter((column: Column) => column.hidden)\n .map((column: Column) => column.name);\n\n if (this.columnsLocalStorageKey) {\n localStorage.setItem(\n this.columnsLocalStorageKey,\n JSON.stringify([...this.columns])\n );\n }\n\n this.dispatchUpdate();\n }\n\n updateColumn(e: Event, id: number) {\n const input = e.target as HTMLElement;\n const el = input.shadowRoot?.querySelector('input');\n\n if (this.columns[id].hidden !== !el?.checked) {\n this.dispatchEvent(\n new CustomEvent('columnVisibilityChange', {\n detail: {\n column: this.columns[id],\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n this.columns[id].hidden = !el?.checked;\n\n this.disabledColumns = this.columns\n .filter((column: Column) => column.hidden)\n .map((column: Column) => column.name);\n\n if (this.columnsLocalStorageKey) {\n localStorage.setItem(\n this.columnsLocalStorageKey,\n JSON.stringify([...this.columns])\n );\n }\n\n if (this.refreshDataOnColumnVisibilityChange) this.dispatchUpdate();\n else this.requestGridUpdate();\n }\n\n dispatchUpdate(columns = this.columns) {\n this.dispatchEvent(\n new CustomEvent('columnFilter', {\n detail: {\n columns,\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n dragstart(e: DragEvent) {\n if (this.columnReorderingAllowed) {\n const el = e.target as HTMLElement;\n this.dragEvent.sourceEl = el;\n el.style.opacity = '0.3';\n const id = Number(el.getAttribute('data-id') as string);\n this.dragEvent.startId = id;\n }\n }\n\n dragend() {\n if (this.columnReorderingAllowed) {\n if (this.dragEvent.startId !== this.dragEvent.targetId) {\n const reorderedColumns = [...this.columns];\n const el = reorderedColumns.splice(this.dragEvent.startId, 1)[0];\n reorderedColumns.splice(this.dragEvent.targetId, 0, el);\n this.dispatchEvent(\n new CustomEvent('reorderColumns', {\n detail: {\n reorderedColumns,\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n this.dragEvent.sourceEl?.style.removeProperty('opacity');\n this.dragEvent = {\n sourceEl: null,\n startId: -1,\n targetId: -1,\n };\n }\n }\n\n dragenter(e: DragEvent) {\n if (this.columnReorderingAllowed) {\n const el = e.target as HTMLElement;\n if (el.classList.contains('drag-target')) {\n const target = Number(el.getAttribute('data-id') as string);\n this.dragEvent.targetId = target;\n }\n }\n }\n\n handleDropdownToggle(e: Event | KeyboardEvent) {\n if (e instanceof KeyboardEvent && !triggerKeys.includes(e.key)) {\n return;\n }\n const dropdownListInteraction = e.composedPath().includes(this.dropdown);\n if (!dropdownListInteraction) {\n this.isDropdownVisible = !this.isDropdownVisible;\n }\n }\n\n render() {\n return html`<div class=\"grid-menu\">\n <span\n @click=${this.handleDropdownToggle}\n @keyDown=${this.handleDropdownToggle}\n class=\"list list-dropdown\"\n >\n <ix-icon-button appearance=\"default\">\n <svg\n slot=\"default\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 9H7V5H3V9ZM7 14H3V10H7V14ZM7 19H3V15H7V19ZM20 14H8V10H20V14ZM8 19H20V15H8V19ZM8 9V5H20V9H8Z\"\n fill=\"#1456E0\"\n />\n </svg>\n </ix-icon-button>\n ${this.disabledColumns.length > 0\n ? html`<div class=\"active\"></div>`\n : nothing}\n ${this.isDropdownVisible\n ? html` <div\n class=\"dropdown-content\"\n @dragover=${(e: DragEvent) => e.preventDefault()}\n @dragstart=${this.dragstart}\n @dragend=${this.dragend}\n @dragenter=${this.dragenter}\n >\n ${repeat(\n this.columns.filter(c => c.filterable !== false),\n (col: Column) => col.name,\n (col: Column, id: number) => html`<div>\n <label\n class=${`ix-switch-label drag-target ${\n this.dragEvent.startId === id ? 'dragOrigin' : ''\n }`}\n draggable=\"true\"\n data-id=${id}\n >\n <ix-switch\n .selected=${!col.hidden}\n @change=${(e: Event) => this.updateColumn(e, id)}\n >\n </ix-switch>\n <p>${col.header}</p>\n <div class=\"draggable\">${handleIcon}</ix-div>\n </label>\n </div>`\n )}\n </div>`\n : nothing}\n </span>\n </div>`;\n }\n}\n"]}
1
+ {"version":3,"file":"IxGridColumnFilter.js","sourceRoot":"","sources":["../../src/components/IxGridColumnFilter.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html, nothing, svg } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { repeat } from 'lit/directives/repeat.js';\nimport '@digital-realty/ix-icon-button/ix-icon-button.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\nimport '@digital-realty/ix-switch/ix-switch.js';\nimport { IxGridViewStyles } from '../grid-view-styles.js';\nimport { IxGridColumnFilterStyles } from './grid-column-filter-styles.js';\nimport type { Column } from '../IxGrid.js';\n\nconst triggerKeys = [' ', 'Enter'];\n\nconst handleIcon = svg`<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M9 4C7.9 4 7 4.9 7 6C7 7.1 7.9 8 9 8C10.1 8 11 7.1 11 6C11 4.9 10.1 4 9 4ZM7 12C7 10.9 7.9 10 9 10C10.1 10 11 10.9 11 12C11 13.1 10.1 14 9 14C7.9 14 7 13.1 7 12ZM9 20C10.1 20 11 19.1 11 18C11 16.9 10.1 16 9 16C7.9 16 7 16.9 7 18C7 19.1 7.9 20 9 20ZM17 6C17 7.1 16.1 8 15 8C13.9 8 13 7.1 13 6C13 4.9 13.9 4 15 4C16.1 4 17 4.9 17 6ZM15 10C13.9 10 13 10.9 13 12C13 13.1 13.9 14 15 14C16.1 14 17 13.1 17 12C17 10.9 16.1 10 15 10ZM13 18C13 16.9 13.9 16 15 16C16.1 16 17 16.9 17 18C17 19.1 16.1 20 15 20C13.9 20 13 19.1 13 18Z\" fill=\"#1456e0\" />\n</svg>`;\n\n@customElement('ix-grid-column-filter')\nexport class IxGridColumnFilter extends LitElement {\n static readonly styles = [IxGridViewStyles, IxGridColumnFilterStyles];\n\n @query('.dropdown-content') dropdown!: HTMLElement;\n\n @property({ type: Array }) columns: Column[] = [];\n\n @property({ type: String }) columnsLocalStorageKey: string | undefined =\n undefined;\n\n @property({ type: Boolean }) columnReorderingAllowed: boolean = false;\n\n @property({ type: Boolean }) refreshDataOnColumnVisibilityChange: boolean =\n true;\n\n @property({ attribute: false }) requestGridUpdate: any;\n\n @state() private isDropdownVisible: boolean = false;\n\n @state() disabledColumns: string[] = [];\n\n @state() dragEvent: {\n sourceEl: HTMLElement | null;\n startId: number;\n targetId: number;\n } = {\n sourceEl: null,\n startId: -1,\n targetId: -1,\n };\n\n connectedCallback() {\n super.connectedCallback();\n document.addEventListener('click', this.outerInteraction);\n this.initializeLocalStorage();\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n document.removeEventListener('click', this.outerInteraction);\n }\n\n outerInteraction = (e: Event) => {\n if (!e.composedPath().includes(this)) {\n this.isDropdownVisible = false;\n }\n };\n\n get preservedColumns() {\n let preservedColumns: Column[] = [];\n\n if (this.columnsLocalStorageKey) {\n preservedColumns = JSON.parse(\n localStorage.getItem(this.columnsLocalStorageKey) || '[]'\n );\n }\n return preservedColumns;\n }\n\n initializeLocalStorage() {\n if (this.preservedColumns.length > 0) {\n this.disabledColumns = this.preservedColumns\n .filter(c => c.hidden && this.columns.some(col => col.name === c.name))\n .map(c => c.name);\n this.columns.forEach((column, id) => {\n if (this.disabledColumns.includes(column.name)) {\n this.columns[id].hidden = true;\n }\n });\n }\n this.dispatchUpdate();\n }\n\n protected update(changedProperties: PropertyValues): void {\n super.update(changedProperties);\n if (changedProperties.has('columnsLocalStorageKey')) {\n this.initializeLocalStorage();\n }\n }\n\n toggleColumn(id: number) {\n this.columns[id].hidden = !this.columns[id].hidden;\n\n this.disabledColumns = this.columns\n .filter((column: Column) => column.hidden)\n .map((column: Column) => column.name);\n\n if (this.columnsLocalStorageKey) {\n localStorage.setItem(\n this.columnsLocalStorageKey,\n JSON.stringify([...this.columns])\n );\n }\n\n this.dispatchUpdate();\n }\n\n updateColumn(e: Event, id: number) {\n const input = e.target as HTMLElement;\n const el = input.shadowRoot?.querySelector('input');\n\n if (this.columns[id].hidden !== !el?.checked) {\n this.dispatchEvent(\n new CustomEvent('columnVisibilityChange', {\n detail: {\n column: this.columns[id],\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n this.columns[id].hidden = !el?.checked;\n\n this.disabledColumns = this.columns\n .filter((column: Column) => column.hidden)\n .map((column: Column) => column.name);\n\n if (this.columnsLocalStorageKey) {\n localStorage.setItem(\n this.columnsLocalStorageKey,\n JSON.stringify([...this.columns])\n );\n }\n\n this.dispatchUpdate();\n }\n\n dispatchUpdate(columns = this.columns) {\n this.dispatchEvent(\n new CustomEvent('columnFilter', {\n detail: {\n columns,\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n\n dragstart(e: DragEvent) {\n if (this.columnReorderingAllowed) {\n const el = e.target as HTMLElement;\n this.dragEvent.sourceEl = el;\n el.style.opacity = '0.3';\n const id = Number(el.getAttribute('data-id') as string);\n this.dragEvent.startId = id;\n }\n }\n\n dragend() {\n if (this.columnReorderingAllowed) {\n if (this.dragEvent.startId !== this.dragEvent.targetId) {\n const reorderedColumns = [...this.columns];\n const el = reorderedColumns.splice(this.dragEvent.startId, 1)[0];\n reorderedColumns.splice(this.dragEvent.targetId, 0, el);\n this.dispatchEvent(\n new CustomEvent('reorderColumns', {\n detail: {\n reorderedColumns,\n },\n bubbles: true,\n composed: true,\n })\n );\n }\n this.dragEvent.sourceEl?.style.removeProperty('opacity');\n this.dragEvent = {\n sourceEl: null,\n startId: -1,\n targetId: -1,\n };\n }\n }\n\n dragenter(e: DragEvent) {\n if (this.columnReorderingAllowed) {\n const el = e.target as HTMLElement;\n if (el.classList.contains('drag-target')) {\n const target = Number(el.getAttribute('data-id') as string);\n this.dragEvent.targetId = target;\n }\n }\n }\n\n handleDropdownToggle(e: Event | KeyboardEvent) {\n if (e instanceof KeyboardEvent && !triggerKeys.includes(e.key)) {\n return;\n }\n const dropdownListInteraction = e.composedPath().includes(this.dropdown);\n if (!dropdownListInteraction) {\n this.isDropdownVisible = !this.isDropdownVisible;\n }\n }\n\n render() {\n return html`<div class=\"grid-menu\">\n <span\n @click=${this.handleDropdownToggle}\n @keyDown=${this.handleDropdownToggle}\n class=\"list list-dropdown\"\n >\n <ix-icon-button appearance=\"default\">\n <svg\n slot=\"default\"\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M3 9H7V5H3V9ZM7 14H3V10H7V14ZM7 19H3V15H7V19ZM20 14H8V10H20V14ZM8 19H20V15H8V19ZM8 9V5H20V9H8Z\"\n fill=\"#1456E0\"\n />\n </svg>\n </ix-icon-button>\n ${this.disabledColumns.length > 0\n ? html`<div class=\"active\"></div>`\n : nothing}\n ${this.isDropdownVisible\n ? html` <div\n class=\"dropdown-content\"\n @dragover=${(e: DragEvent) => e.preventDefault()}\n @dragstart=${this.dragstart}\n @dragend=${this.dragend}\n @dragenter=${this.dragenter}\n >\n ${repeat(\n this.columns.filter(c => c.filterable !== false),\n (col: Column) => col.name,\n (col: Column, id: number) => html`<div>\n <label\n class=${`ix-switch-label drag-target ${\n this.dragEvent.startId === id ? 'dragOrigin' : ''\n }`}\n draggable=${this.columnReorderingAllowed}\n data-id=${id}\n >\n <ix-switch\n .selected=${!col.hidden}\n @change=${(e: Event) => this.updateColumn(e, id)}\n >\n </ix-switch>\n <p>${col.header}</p>\n ${this.columnReorderingAllowed\n ? html`<div class=\"draggable\">${handleIcon}</div>`\n : nothing}\n </label>\n </div>`\n )}\n </div>`\n : nothing}\n </span>\n </div>`;\n }\n}\n"]}
package/dist/components/IxGridNoRows.js CHANGED
@@ -26,7 +26,7 @@ IxGridNoRows.styles = css `
26
26
  align-items: center;
27
27
  flex-direction: column;
28
28
  text-align: center;
29
- padding: 3.125rem 0;
29
+ padding: 4.125rem 0 1.125rem 0;
30
30
  }
31
31
  .icon {
32
32
  user-select: none;
package/dist/components/IxGridNoRows.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IxGridNoRows.js","sourceRoot":"","sources":["../../src/components/IxGridNoRows.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,oCAAoC,CAAC;AAE5C,MAAM,OAAO,YAAa,SAAQ,UAAU;IAA5C;;QA2C8B,SAAI,GAAiC,OAAO,CAAC;QAE7C,SAAI,GAAW,OAAO,CAAC;QAEvB,YAAO,GAAW,oBAAoB,CAAC;QAEvC,iBAAY,GAAW,MAAM,CAAC;IAU5D,CAAC;IARC,MAAM;QACJ,OAAO,IAAI,CAAA;2DAC4C,IAAI,CAAC,YAAY;+BAC7C,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI;uCACf,IAAI,CAAC,OAAO;;KAE9C,CAAC;IACJ,CAAC;;AAzDM,mBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwClB,CAAC;AAE0B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAA8C;AAE7C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAwB;AAEvB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAwC;AAEvC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAA+B","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\n\nexport class IxGridNoRows extends LitElement {\n static styles = css`\n .container {\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n text-align: center;\n padding: 3.125rem 0;\n }\n .icon {\n user-select: none;\n display: inline-block;\n fill: currentcolor;\n flex-shrink: 0;\n font-size: 1.5rem;\n color: rgb(255, 152, 0);\n transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n .warning,\n .error {\n user-select: none;\n color: var(--clr-warning, #ff9800);\n }\n .critical {\n color: var(--clr-critical, #db0028);\n }\n h2 {\n font-family: var(--ix-font-family, 'Red Hat Display');\n }\n h2.dlr-text-heading {\n margin: 0.5rem 0 0;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-size: 1.5rem;\n line-height: 2rem;\n letter-spacing: 0em;\n color: rgb(9, 34, 65);\n text-align: center;\n font-weight: 700;\n }\n `;\n\n @property({ type: String }) type: 'warning' | 'info' | 'error' = 'error';\n\n @property({ type: String }) icon: string = 'error';\n\n @property({ type: String }) message: string = 'No data to display';\n\n @property({ type: String }) iconFontSize: string = '3rem';\n\n render() {\n return html`\n <div class=\"container\" style=\"--ix-icon-font-size: ${this.iconFontSize};\">\n <ix-icon class=\"icon ${this.type}\">${this.icon}</ix-icon>\n <h2 class=\"dlr-text-heading\">${this.message}</h2>\n </div>\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"IxGridNoRows.js","sourceRoot":"","sources":["../../src/components/IxGridNoRows.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,oCAAoC,CAAC;AAE5C,MAAM,OAAO,YAAa,SAAQ,UAAU;IAA5C;;QA2C8B,SAAI,GAAiC,OAAO,CAAC;QAE7C,SAAI,GAAW,OAAO,CAAC;QAEvB,YAAO,GAAW,oBAAoB,CAAC;QAEvC,iBAAY,GAAW,MAAM,CAAC;IAU5D,CAAC;IARC,MAAM;QACJ,OAAO,IAAI,CAAA;2DAC4C,IAAI,CAAC,YAAY;+BAC7C,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI;uCACf,IAAI,CAAC,OAAO;;KAE9C,CAAC;IACJ,CAAC;;AAzDM,mBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwClB,CAAC;AAE0B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAA8C;AAE7C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAwB;AAEvB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAwC;AAEvC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAA+B","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport '@digital-realty/ix-icon/ix-icon.js';\n\nexport class IxGridNoRows extends LitElement {\n static styles = css`\n .container {\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n text-align: center;\n padding: 4.125rem 0 1.125rem 0;\n }\n .icon {\n user-select: none;\n display: inline-block;\n fill: currentcolor;\n flex-shrink: 0;\n font-size: 1.5rem;\n color: rgb(255, 152, 0);\n transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1);\n }\n .warning,\n .error {\n user-select: none;\n color: var(--clr-warning, #ff9800);\n }\n .critical {\n color: var(--clr-critical, #db0028);\n }\n h2 {\n font-family: var(--ix-font-family, 'Red Hat Display');\n }\n h2.dlr-text-heading {\n margin: 0.5rem 0 0;\n font-family: 'Red Hat Display', sans-serif;\n font-style: normal;\n font-size: 1.5rem;\n line-height: 2rem;\n letter-spacing: 0em;\n color: rgb(9, 34, 65);\n text-align: center;\n font-weight: 700;\n }\n `;\n\n @property({ type: String }) type: 'warning' | 'info' | 'error' = 'error';\n\n @property({ type: String }) icon: string = 'error';\n\n @property({ type: String }) message: string = 'No data to display';\n\n @property({ type: String }) iconFontSize: string = '3rem';\n\n render() {\n return html`\n <div class=\"container\" style=\"--ix-icon-font-size: ${this.iconFontSize};\">\n <ix-icon class=\"icon ${this.type}\">${this.icon}</ix-icon>\n <h2 class=\"dlr-text-heading\">${this.message}</h2>\n </div>\n `;\n }\n}\n"]}
package/dist/components/grid-column-filter-styles.js CHANGED
@@ -5,7 +5,7 @@ export const IxGridColumnFilterStyles = css `
5
5
  background-color: var(--clr-surface-container-lowest, #fff);
6
6
  min-width: 160px;
7
7
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
8
- z-index: 1;
8
+ z-index: 9;
9
9
  -webkit-box-align: center;
10
10
  align-items: center;
11
11
  cursor: pointer;
package/dist/components/grid-column-filter-styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"grid-column-filter-styles.js","sourceRoot":"","sources":["../../src/components/grid-column-filter-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,wBAAwB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuF1C,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxGridColumnFilterStyles = css`\n .dropdown-content {\n position: absolute;\n background-color: var(--clr-surface-container-lowest, #fff);\n min-width: 160px;\n box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);\n z-index: 1;\n -webkit-box-align: center;\n align-items: center;\n cursor: pointer;\n vertical-align: middle;\n -webkit-tap-highlight-color: transparent;\n padding: 10px;\n width: 247px;\n left: -100px;\n border-radius: 16px;\n }\n\n .dropdown-content > div {\n margin: 0px;\n color: var(--clr-on-surface, #092241);\n font-family: var(--text-small-font, sans-serif);\n font-size: var(--text-small-size, 0.875rem);\n letter-spacing: var(--text-small-letter-spacing, 0.0275em);\n line-height: var(--text-small-line-height, 1.42857143em);\n font-weight: var(--text-small-weight, normal);\n text-decoration: var(--text-small-decoration, none);\n text-transform: var(--text-small-transform, none);\n display: block;\n cursor: pointer;\n }\n\n .dropdown-content span:hover {\n background-color: #f1f1f1;\n }\n\n .dropdown-content label {\n display: flex;\n align-items: center;\n }\n\n .dropdown-content label.dragOrigin {\n background: #ff000017;\n outline: 1px #ff9d9d dashed;\n }\n\n .dropdown-content label p {\n width: 158px;\n }\n\n .dropdown-content label .draggable {\n font-size: 24px;\n cursor: move; /* fallback if grab cursor is unsupported */\n cursor: grab;\n cursor: -moz-grab;\n cursor: -webkit-grab;\n }\n\n .dropdown-content label .draggable path {\n fill: var(--clr-primary, #1456e0);\n }\n\n .active {\n position: absolute;\n right: 0;\n top: 0;\n height: 8px;\n width: 8px;\n background-color: var(--clr-critical, #db0028);\n border-radius: 50%;\n }\n\n ix-switch {\n padding: 0 0 0 6px;\n display: flex;\n width: 48px;\n }\n\n .list {\n position: relative;\n }\n\n @media only screen and (max-width: 840px) {\n .dropdown-content {\n left: 0;\n }\n } \n`;\n"]}
1
+ {"version":3,"file":"grid-column-filter-styles.js","sourceRoot":"","sources":["../../src/components/grid-column-filter-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,wBAAwB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuF1C,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxGridColumnFilterStyles = css`\n .dropdown-content {\n position: absolute;\n background-color: var(--clr-surface-container-lowest, #fff);\n min-width: 160px;\n box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);\n z-index: 9;\n -webkit-box-align: center;\n align-items: center;\n cursor: pointer;\n vertical-align: middle;\n -webkit-tap-highlight-color: transparent;\n padding: 10px;\n width: 247px;\n left: -100px;\n border-radius: 16px;\n }\n\n .dropdown-content > div {\n margin: 0px;\n color: var(--clr-on-surface, #092241);\n font-family: var(--text-small-font, sans-serif);\n font-size: var(--text-small-size, 0.875rem);\n letter-spacing: var(--text-small-letter-spacing, 0.0275em);\n line-height: var(--text-small-line-height, 1.42857143em);\n font-weight: var(--text-small-weight, normal);\n text-decoration: var(--text-small-decoration, none);\n text-transform: var(--text-small-transform, none);\n display: block;\n cursor: pointer;\n }\n\n .dropdown-content span:hover {\n background-color: #f1f1f1;\n }\n\n .dropdown-content label {\n display: flex;\n align-items: center;\n }\n\n .dropdown-content label.dragOrigin {\n background: #ff000017;\n outline: 1px #ff9d9d dashed;\n }\n\n .dropdown-content label p {\n width: 158px;\n }\n\n .dropdown-content label .draggable {\n font-size: 24px;\n cursor: move; /* fallback if grab cursor is unsupported */\n cursor: grab;\n cursor: -moz-grab;\n cursor: -webkit-grab;\n }\n\n .dropdown-content label .draggable path {\n fill: var(--clr-primary, #1456e0);\n }\n\n .active {\n position: absolute;\n right: 0;\n top: 0;\n height: 8px;\n width: 8px;\n background-color: var(--clr-critical, #db0028);\n border-radius: 50%;\n }\n\n ix-switch {\n padding: 0 0 0 6px;\n display: flex;\n width: 48px;\n }\n\n .list {\n position: relative;\n }\n\n @media only screen and (max-width: 840px) {\n .dropdown-content {\n left: 0;\n }\n } \n`;\n"]}
package/dist/grid-view-styles.js CHANGED
@@ -181,6 +181,11 @@ export const IxGridViewStyles = css `
181
181
  --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);
182
182
  }
183
183
 
184
+ vaadin-grid-cell-content > div {
185
+ overflow: hidden;
186
+ text-overflow: ellipsis;
187
+ }
188
+
184
189
  .row-controls {
185
190
  border-top: solid 1px var(--clr-border-outline, #0922411f);
186
191
  }
package/dist/grid-view-styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"grid-view-styles.js","sourceRoot":"","sources":["../src/grid-view-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyPlC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxGridViewStyles = css`\n :host {\n --_ix-grid-cell-padding: var(--ix-grid-cell-padding, 1rem);\n --lumo-primary-color-50pct: transparent;\n }\n\n * {\n font-family: inherit;\n }\n\n vaadin-grid::part(cell) {\n cursor: var(--ix-grid-cell-pointer, pointer);\n }\n\n vaadin-grid::part(header-cell) {\n cursor: default;\n --vaadin-grid-cell-background: #fff;\n }\n\n vaadin-grid::part(row):hover {\n --vaadin-grid-cell-background: #f5f5f5;\n }\n\n vaadin-grid-cell-content {\n font-size: 14px;\n --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);\n }\n\n .hide-column-headers::part(header-cell) {\n display: none;\n }\n\n vaadin-grid::part(ix-disabled-cell) {\n cursor: default;\n color: var(--cp-neutral-blue-60p);\n --vaadin-grid-cell-background: var(--cp-neutral-blue-12p);\n }\n\n ix-grid-download-menu {\n width: 38px;\n margin-right: 2px;\n }\n\n ix-grid-column-filter {\n width: 36px;\n }\n\n .grid-container {\n background-color: var(--clr-surface-container-lowest, #ffffff);\n border-radius: 8px;\n box-shadow: rgba(0, 0, 0, 0.12) 0px 12px 20px -12px,\n #e1e4e8 0px 0px 0px 1px inset;\n box-sizing: border-box;\n padding: 2px;\n }\n\n .touch-edge {\n margin: 0 -3px;\n }\n\n .grid-header {\n display: flex;\n -webkit-box-pack: justify;\n place-content: space-between;\n -webkit-box-align: center;\n align-items: center;\n padding: 16px 24px;\n flex-wrap: wrap;\n gap: 18px;\n /* offset table margin */\n margin: -3px 0 0 -3px;\n }\n\n .grid-menu {\n display: flex;\n align-items: center;\n margin-left: auto;\n }\n\n .grid-menu ix-button {\n --md-text-button-leading-space: 4px;\n --md-text-button-trailing-space: 4px;\n }\n\n .grid-menu span {\n color: var(--clr-primary, #1456e0);\n cursor: pointer;\n }\n\n .header {\n font-weight: bold;\n display: flex;\n user-select: none;\n align-items: center;\n padding-right: calc(var(--_ix-grid-cell-padding) / 2);\n position: relative;\n\n &:not(.frozen):not(.last)::after {\n content: '';\n display: block;\n position: absolute;\n border: 0;\n border-right-width: var(--ix-grid-header-border-width, 2px);\n border-color: var(\n --ix-grid-header-border-color,\n var(--clr-outline, #0922411f)\n );\n border-style: solid;\n margin-right: 0;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n }\n\n .header-label {\n position: relative;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n z-index: 2;\n }\n }\n\n .header .header-sort-icon {\n background: #fff;\n display: none;\n padding-left: 5px;\n font-size: 17px;\n color: rgba(0, 0, 0, 0.54);\n cursor: pointer;\n height: 18px;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n z-index: 3;\n }\n\n .header:hover .header-sort-icon {\n display: block;\n }\n\n .columns-reordering {\n opacity: 0.25;\n }\n\n .progress-container {\n position: relative;\n top: 60px;\n z-index: 1;\n }\n\n span .disabled {\n color: var(--clr-on-surface-variant, rgba(9, 34, 65, 0.7));\n }\n\n .disable-cursor {\n cursor: default !important;\n }\n\n .accounts {\n display: flex;\n align-items: center;\n }\n\n .account-name {\n margin: 0 8px 0 3px;\n }\n\n vaadin-grid-cell-content {\n font-family: var(--text-small-font, sans-serif);\n font-size: var(--text-small-size, 0.875rem);\n letter-spacing: var(--text-small-letter-spacing, 0.0275em);\n line-height: var(--text-small-line-height, 1.42857143em);\n font-weight: var(--text-small-weight, normal);\n text-decoration: var(--text-small-decoration, none);\n text-transform: var(--text-small-transform, none);\n --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);\n }\n\n .row-controls {\n border-top: solid 1px var(--clr-border-outline, #0922411f);\n }\n\n .row-limit {\n display: flex;\n padding: 8px;\n }\n\n /* launchpad variant */\n .launchpad vaadin-grid {\n --_lumo-grid-border-width: 0;\n --lumo-size-xl: auto;\n }\n\n .launchpad vaadin-grid-cell-content {\n padding: 11px 24px;\n border-bottom: 0;\n }\n\n .launchpad vaadin-grid::part(body-row) {\n border-bottom: 1px solid var(--clr-border-outline, rgba(9, 34, 65, 0.12));\n }\n\n .launchpad .grid-header {\n padding: 0.5rem 18px 0;\n }\n\n .launchpad .header {\n font-family: var(--text-caption-font, sans-serif);\n font-size: var(--text-caption-size, 0.75rem);\n letter-spacing: var(--text-caption-letter-spacing, 0.03333333em);\n line-height: var(--text-caption-line-height, 1.33333333em);\n font-weight: var(--text-caption-weight, normal);\n text-transform: var(--text-caption-transform, none);\n text-decoration: var(--text-caption-decoration, none);\n }\n\n .launchpad .grid-header h2 {\n font-family: var(--text-page-title-font, sans-serif);\n font-size: var(--text-page-title-size, 2.125rem);\n letter-spacing: var(--text-page-title-letter-spacing, 0.01029412em);\n line-height: var(--text-page-title-line-height, 1.17647059em);\n font-weight: var(--text-page-title-weight, bold);\n text-decoration: var(--text-page-title-decoration, none);\n text-transform: var(--text-page-title-transform, none);\n }\n\n @media only screen and (max-width: 840px) {\n .grid-header {\n display: flex;\n flex-direction: column;\n padding: 1em 1em 0 1em;\n place-content: flex-start;\n -webkit-box-align: flex-start;\n align-items: flex-start;\n gap: 0.75em;\n }\n .grid-menu {\n padding-left: 0;\n margin-left: -4px;\n }\n .grid-container {\n border-radius: 0;\n box-shadow: none;\n } \n } \n`;\n"]}
1
+ {"version":3,"file":"grid-view-styles.js","sourceRoot":"","sources":["../src/grid-view-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8PlC,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const IxGridViewStyles = css`\n :host {\n --_ix-grid-cell-padding: var(--ix-grid-cell-padding, 1rem);\n --lumo-primary-color-50pct: transparent;\n }\n\n * {\n font-family: inherit;\n }\n\n vaadin-grid::part(cell) {\n cursor: var(--ix-grid-cell-pointer, pointer);\n }\n\n vaadin-grid::part(header-cell) {\n cursor: default;\n --vaadin-grid-cell-background: #fff;\n }\n\n vaadin-grid::part(row):hover {\n --vaadin-grid-cell-background: #f5f5f5;\n }\n\n vaadin-grid-cell-content {\n font-size: 14px;\n --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);\n }\n\n .hide-column-headers::part(header-cell) {\n display: none;\n }\n\n vaadin-grid::part(ix-disabled-cell) {\n cursor: default;\n color: var(--cp-neutral-blue-60p);\n --vaadin-grid-cell-background: var(--cp-neutral-blue-12p);\n }\n\n ix-grid-download-menu {\n width: 38px;\n margin-right: 2px;\n }\n\n ix-grid-column-filter {\n width: 36px;\n }\n\n .grid-container {\n background-color: var(--clr-surface-container-lowest, #ffffff);\n border-radius: 8px;\n box-shadow: rgba(0, 0, 0, 0.12) 0px 12px 20px -12px,\n #e1e4e8 0px 0px 0px 1px inset;\n box-sizing: border-box;\n padding: 2px;\n }\n\n .touch-edge {\n margin: 0 -3px;\n }\n\n .grid-header {\n display: flex;\n -webkit-box-pack: justify;\n place-content: space-between;\n -webkit-box-align: center;\n align-items: center;\n padding: 16px 24px;\n flex-wrap: wrap;\n gap: 18px;\n /* offset table margin */\n margin: -3px 0 0 -3px;\n }\n\n .grid-menu {\n display: flex;\n align-items: center;\n margin-left: auto;\n }\n\n .grid-menu ix-button {\n --md-text-button-leading-space: 4px;\n --md-text-button-trailing-space: 4px;\n }\n\n .grid-menu span {\n color: var(--clr-primary, #1456e0);\n cursor: pointer;\n }\n\n .header {\n font-weight: bold;\n display: flex;\n user-select: none;\n align-items: center;\n padding-right: calc(var(--_ix-grid-cell-padding) / 2);\n position: relative;\n\n &:not(.frozen):not(.last)::after {\n content: '';\n display: block;\n position: absolute;\n border: 0;\n border-right-width: var(--ix-grid-header-border-width, 2px);\n border-color: var(\n --ix-grid-header-border-color,\n var(--clr-outline, #0922411f)\n );\n border-style: solid;\n margin-right: 0;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 1;\n }\n\n .header-label {\n position: relative;\n text-overflow: ellipsis;\n overflow: hidden;\n flex-grow: 1;\n z-index: 2;\n }\n }\n\n .header .header-sort-icon {\n background: #fff;\n display: none;\n padding-left: 5px;\n font-size: 17px;\n color: rgba(0, 0, 0, 0.54);\n cursor: pointer;\n height: 18px;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n z-index: 3;\n }\n\n .header:hover .header-sort-icon {\n display: block;\n }\n\n .columns-reordering {\n opacity: 0.25;\n }\n\n .progress-container {\n position: relative;\n top: 60px;\n z-index: 1;\n }\n\n span .disabled {\n color: var(--clr-on-surface-variant, rgba(9, 34, 65, 0.7));\n }\n\n .disable-cursor {\n cursor: default !important;\n }\n\n .accounts {\n display: flex;\n align-items: center;\n }\n\n .account-name {\n margin: 0 8px 0 3px;\n }\n\n vaadin-grid-cell-content {\n font-family: var(--text-small-font, sans-serif);\n font-size: var(--text-small-size, 0.875rem);\n letter-spacing: var(--text-small-letter-spacing, 0.0275em);\n line-height: var(--text-small-line-height, 1.42857143em);\n font-weight: var(--text-small-weight, normal);\n text-decoration: var(--text-small-decoration, none);\n text-transform: var(--text-small-transform, none);\n --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);\n }\n\n vaadin-grid-cell-content > div {\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .row-controls {\n border-top: solid 1px var(--clr-border-outline, #0922411f);\n }\n\n .row-limit {\n display: flex;\n padding: 8px;\n }\n\n /* launchpad variant */\n .launchpad vaadin-grid {\n --_lumo-grid-border-width: 0;\n --lumo-size-xl: auto;\n }\n\n .launchpad vaadin-grid-cell-content {\n padding: 11px 24px;\n border-bottom: 0;\n }\n\n .launchpad vaadin-grid::part(body-row) {\n border-bottom: 1px solid var(--clr-border-outline, rgba(9, 34, 65, 0.12));\n }\n\n .launchpad .grid-header {\n padding: 0.5rem 18px 0;\n }\n\n .launchpad .header {\n font-family: var(--text-caption-font, sans-serif);\n font-size: var(--text-caption-size, 0.75rem);\n letter-spacing: var(--text-caption-letter-spacing, 0.03333333em);\n line-height: var(--text-caption-line-height, 1.33333333em);\n font-weight: var(--text-caption-weight, normal);\n text-transform: var(--text-caption-transform, none);\n text-decoration: var(--text-caption-decoration, none);\n }\n\n .launchpad .grid-header h2 {\n font-family: var(--text-page-title-font, sans-serif);\n font-size: var(--text-page-title-size, 2.125rem);\n letter-spacing: var(--text-page-title-letter-spacing, 0.01029412em);\n line-height: var(--text-page-title-line-height, 1.17647059em);\n font-weight: var(--text-page-title-weight, bold);\n text-decoration: var(--text-page-title-decoration, none);\n text-transform: var(--text-page-title-transform, none);\n }\n\n @media only screen and (max-width: 840px) {\n .grid-header {\n display: flex;\n flex-direction: column;\n padding: 1em 1em 0 1em;\n place-content: flex-start;\n -webkit-box-align: flex-start;\n align-items: flex-start;\n gap: 0.75em;\n }\n .grid-menu {\n padding-left: 0;\n margin-left: -4px;\n }\n .grid-container {\n border-radius: 0;\n box-shadow: none;\n } \n } \n`;\n"]}
package/dist/ix-grid.min.js CHANGED
@@ -1,4 +1,4 @@
1
- import{__decorate}from"tslib";import"@digital-realty/ix-icon-button/ix-icon-button.js";import"@digital-realty/ix-icon/ix-icon.js";import"@digital-realty/ix-progress/ix-progress.js";import"@vaadin/grid";import{columnHeaderRenderer}from"@vaadin/grid/lit.js";import{css,svg,LitElement,nothing,html,render}from"lit";import{query,property,state,customElement}from"lit/decorators.js";import{classMap}from"lit/directives/class-map.js";import{ifDefined}from"lit/directives/if-defined.js";import{repeat}from"lit/directives/repeat.js";import"@digital-realty/ix-switch/ix-switch.js";import"@digital-realty/ix-menu/ix-menu.js";import"@digital-realty/ix-menu/ix-menu-item.js";import"@digital-realty/ix-button/ix-button.js";import"@digital-realty/ix-date/ix-date.js";import"@digital-realty/ix-select/ix-select.js";import{formatDate}from"date-fns/format.js";let IxGridViewStyles=css`:host{--_ix-grid-cell-padding:var(--ix-grid-cell-padding, 1rem);--lumo-primary-color-50pct:transparent}*{font-family:inherit}vaadin-grid::part(cell){cursor:var(--ix-grid-cell-pointer,pointer)}vaadin-grid::part(header-cell){cursor:default;--vaadin-grid-cell-background:#fff}vaadin-grid::part(row):hover{--vaadin-grid-cell-background:#f5f5f5}vaadin-grid-cell-content{font-size:14px;--_cell-padding:var(--ix-grid-cell-padding, 14px 10px)}.hide-column-headers::part(header-cell){display:none}vaadin-grid::part(ix-disabled-cell){cursor:default;color:var(--cp-neutral-blue-60p);--vaadin-grid-cell-background:var(--cp-neutral-blue-12p)}ix-grid-download-menu{width:38px;margin-right:2px}ix-grid-column-filter{width:36px}.grid-container{background-color:var(--clr-surface-container-lowest,#fff);border-radius:8px;box-shadow:rgba(0,0,0,.12) 0 12px 20px -12px,#e1e4e8 0 0 0 1px inset;box-sizing:border-box;padding:2px}.touch-edge{margin:0 -3px}.grid-header{display:flex;-webkit-box-pack:justify;place-content:space-between;-webkit-box-align:center;align-items:center;padding:16px 24px;flex-wrap:wrap;gap:18px;margin:-3px 0 0 -3px}.grid-menu{display:flex;align-items:center;margin-left:auto}.grid-menu ix-button{--md-text-button-leading-space:4px;--md-text-button-trailing-space:4px}.grid-menu span{color:var(--clr-primary,#1456e0);cursor:pointer}.header{font-weight:700;display:flex;user-select:none;align-items:center;padding-right:calc(var(--_ix-grid-cell-padding)/ 2);position:relative;text-overflow:ellipsis;overflow:hidden;flex-grow:1;z-index:2}.header:hover .header-sort-icon{display:block}.columns-reordering{opacity:.25}.progress-container{position:relative;top:60px;z-index:1}span .disabled{color:var(--clr-on-surface-variant,rgba(9,34,65,.7))}.disable-cursor{cursor:default!important}.accounts{display:flex;align-items:center}.account-name{margin:0 8px 0 3px}vaadin-grid-cell-content{font-family:var(--text-small-font,sans-serif);font-size:var(--text-small-size,.875rem);letter-spacing:var(--text-small-letter-spacing,.0275em);line-height:var(--text-small-line-height,1.42857143em);font-weight:var(--text-small-weight,normal);text-decoration:var(--text-small-decoration,none);text-transform:var(--text-small-transform,none);--_cell-padding:var(--ix-grid-cell-padding, 14px 10px)}.row-controls{border-top:solid 1px var(--clr-border-outline,#0922411f)}.row-limit{display:flex;padding:8px}.launchpad vaadin-grid{--_lumo-grid-border-width:0;--lumo-size-xl:auto}.launchpad vaadin-grid-cell-content{padding:11px 24px;border-bottom:0}.launchpad vaadin-grid::part(body-row){border-bottom:1px solid var(--clr-border-outline,rgba(9,34,65,.12))}.launchpad .grid-header{padding:.5rem 18px 0}.launchpad .header{font-family:var(--text-caption-font,sans-serif);font-size:var(--text-caption-size,.75rem);letter-spacing:var(--text-caption-letter-spacing,.03333333em);line-height:var(--text-caption-line-height,1.33333333em);font-weight:var(--text-caption-weight,normal);text-transform:var(--text-caption-transform,none);text-decoration:var(--text-caption-decoration,none)}.launchpad .grid-header h2{font-family:var(--text-page-title-font,sans-serif);font-size:var(--text-page-title-size,2.125rem);letter-spacing:var(--text-page-title-letter-spacing,.01029412em);line-height:var(--text-page-title-line-height,1.17647059em);font-weight:var(--text-page-title-weight,bold);text-decoration:var(--text-page-title-decoration,none);text-transform:var(--text-page-title-transform,none)}@media only screen and (max-width:840px){.grid-header{display:flex;flex-direction:column;padding:1em 1em 0 1em;place-content:flex-start;-webkit-box-align:flex-start;align-items:flex-start;gap:.75em}.grid-menu{padding-left:0;margin-left:-4px}.grid-container{border-radius:0;box-shadow:none}}`,IxGridColumnFilterStyles=css`.dropdown-content{position:absolute;background-color:var(--clr-surface-container-lowest,#fff);min-width:160px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1;-webkit-box-align:center;align-items:center;cursor:pointer;vertical-align:middle;-webkit-tap-highlight-color:transparent;padding:10px;width:247px;left:-100px;border-radius:16px}.dropdown-content>div{margin:0;color:var(--clr-on-surface,#092241);font-family:var(--text-small-font,sans-serif);font-size:var(--text-small-size,.875rem);letter-spacing:var(--text-small-letter-spacing,.0275em);line-height:var(--text-small-line-height,1.42857143em);font-weight:var(--text-small-weight,normal);text-decoration:var(--text-small-decoration,none);text-transform:var(--text-small-transform,none);display:block;cursor:pointer}.dropdown-content span:hover{background-color:#f1f1f1}.dropdown-content label{display:flex;align-items:center}.dropdown-content label.dragOrigin{background:#ff000017;outline:1px #ff9d9d dashed}.dropdown-content label p{width:158px}.dropdown-content label .draggable{font-size:24px;cursor:move;cursor:grab;cursor:-moz-grab;cursor:-webkit-grab}.dropdown-content label .draggable path{fill:var(--clr-primary,#1456e0)}.active{position:absolute;right:0;top:0;height:8px;width:8px;background-color:var(--clr-critical,#db0028);border-radius:50%}ix-switch{padding:0 0 0 6px;display:flex;width:48px}.list{position:relative}@media only screen and (max-width:840px){.dropdown-content{left:0}}`,triggerKeys=[" ","Enter"],handleIcon=svg`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M9 4C7.9 4 7 4.9 7 6C7 7.1 7.9 8 9 8C10.1 8 11 7.1 11 6C11 4.9 10.1 4 9 4ZM7 12C7 10.9 7.9 10 9 10C10.1 10 11 10.9 11 12C11 13.1 10.1 14 9 14C7.9 14 7 13.1 7 12ZM9 20C10.1 20 11 19.1 11 18C11 16.9 10.1 16 9 16C7.9 16 7 16.9 7 18C7 19.1 7.9 20 9 20ZM17 6C17 7.1 16.1 8 15 8C13.9 8 13 7.1 13 6C13 4.9 13.9 4 15 4C16.1 4 17 4.9 17 6ZM15 10C13.9 10 13 10.9 13 12C13 13.1 13.9 14 15 14C16.1 14 17 13.1 17 12C17 10.9 16.1 10 15 10ZM13 18C13 16.9 13.9 16 15 16C16.1 16 17 16.9 17 18C17 19.1 16.1 20 15 20C13.9 20 13 19.1 13 18Z" fill="#1456e0"/></svg>`,IxGridColumnFilter=class extends LitElement{constructor(){super(...arguments),this.columns=[],this.columnsLocalStorageKey=void 0,this.columnReorderingAllowed=!1,this.refreshDataOnColumnVisibilityChange=!0,this.isDropdownVisible=!1,this.disabledColumns=[],this.dragEvent={sourceEl:null,startId:-1,targetId:-1},this.outerInteraction=e=>{e.composedPath().includes(this)||(this.isDropdownVisible=!1)}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.outerInteraction),this.initializeLocalStorage()}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.outerInteraction)}get preservedColumns(){let e=[];return e=this.columnsLocalStorageKey?JSON.parse(localStorage.getItem(this.columnsLocalStorageKey)||"[]"):e}initializeLocalStorage(){0<this.preservedColumns.length&&(this.disabledColumns=this.preservedColumns.filter(t=>t.hidden&&this.columns.some(e=>e.name===t.name)).map(e=>e.name),this.columns.forEach((e,t)=>{this.disabledColumns.includes(e.name)&&(this.columns[t].hidden=!0)})),this.dispatchUpdate()}update(e){super.update(e),e.has("columnsLocalStorageKey")&&this.initializeLocalStorage()}toggleColumn(e){this.columns[e].hidden=!this.columns[e].hidden,this.disabledColumns=this.columns.filter(e=>e.hidden).map(e=>e.name),this.columnsLocalStorageKey&&localStorage.setItem(this.columnsLocalStorageKey,JSON.stringify([...this.columns])),this.dispatchUpdate()}updateColumn(e,t){e=null==(e=e.target.shadowRoot)?void 0:e.querySelector("input");this.columns[t].hidden!==!(null!=e&&e.checked)&&this.dispatchEvent(new CustomEvent("columnVisibilityChange",{detail:{column:this.columns[t]},bubbles:!0,composed:!0})),this.columns[t].hidden=!(null!=e&&e.checked),this.disabledColumns=this.columns.filter(e=>e.hidden).map(e=>e.name),this.columnsLocalStorageKey&&localStorage.setItem(this.columnsLocalStorageKey,JSON.stringify([...this.columns])),this.refreshDataOnColumnVisibilityChange?this.dispatchUpdate():this.requestGridUpdate()}dispatchUpdate(e=this.columns){this.dispatchEvent(new CustomEvent("columnFilter",{detail:{columns:e},bubbles:!0,composed:!0}))}dragstart(e){this.columnReorderingAllowed&&(e=e.target,(this.dragEvent.sourceEl=e).style.opacity="0.3",e=Number(e.getAttribute("data-id")),this.dragEvent.startId=e)}dragend(){var e,t;this.columnReorderingAllowed&&(this.dragEvent.startId!==this.dragEvent.targetId&&(t=(e=[...this.columns]).splice(this.dragEvent.startId,1)[0],e.splice(this.dragEvent.targetId,0,t),this.dispatchEvent(new CustomEvent("reorderColumns",{detail:{reorderedColumns:e},bubbles:!0,composed:!0}))),null!=(t=this.dragEvent.sourceEl)&&t.style.removeProperty("opacity"),this.dragEvent={sourceEl:null,startId:-1,targetId:-1})}dragenter(e){this.columnReorderingAllowed&&(e=e.target).classList.contains("drag-target")&&(e=Number(e.getAttribute("data-id")),this.dragEvent.targetId=e)}handleDropdownToggle(e){e instanceof KeyboardEvent&&!triggerKeys.includes(e.key)||e.composedPath().includes(this.dropdown)||(this.isDropdownVisible=!this.isDropdownVisible)}render(){return html`<div class="grid-menu"><span @click="${this.handleDropdownToggle}" @keyDown="${this.handleDropdownToggle}" class="list list-dropdown"><ix-icon-button appearance="default"><svg slot="default" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M3 9H7V5H3V9ZM7 14H3V10H7V14ZM7 19H3V15H7V19ZM20 14H8V10H20V14ZM8 19H20V15H8V19ZM8 9V5H20V9H8Z" fill="#1456E0"/></svg></ix-icon-button>${0<this.disabledColumns.length?html`<div class="active"></div>`:nothing} ${this.isDropdownVisible?html`<div class="dropdown-content" @dragover="${e=>e.preventDefault()}" @dragstart="${this.dragstart}" @dragend="${this.dragend}" @dragenter="${this.dragenter}">${repeat(this.columns.filter(e=>!1!==e.filterable),e=>e.name,(e,t)=>html`<div><label class="${"ix-switch-label drag-target "+(this.dragEvent.startId===t?"dragOrigin":"")}" draggable="true" data-id="${t}"><ix-switch .selected="${!e.hidden}" @change="${e=>this.updateColumn(e,t)}"></ix-switch><p>${e.header}</p><div class="draggable">${handleIcon}</div></label></div>`)}</div>`:nothing}</span></div>`}},IxGridDownloadMenu=(IxGridColumnFilter.styles=[IxGridViewStyles,IxGridColumnFilterStyles],__decorate([query(".dropdown-content")],IxGridColumnFilter.prototype,"dropdown",void 0),__decorate([property({type:Array})],IxGridColumnFilter.prototype,"columns",void 0),__decorate([property({type:String})],IxGridColumnFilter.prototype,"columnsLocalStorageKey",void 0),__decorate([property({type:Boolean})],IxGridColumnFilter.prototype,"columnReorderingAllowed",void 0),__decorate([property({type:Boolean})],IxGridColumnFilter.prototype,"refreshDataOnColumnVisibilityChange",void 0),__decorate([property({attribute:!1})],IxGridColumnFilter.prototype,"requestGridUpdate",void 0),__decorate([state()],IxGridColumnFilter.prototype,"isDropdownVisible",void 0),__decorate([state()],IxGridColumnFilter.prototype,"disabledColumns",void 0),__decorate([state()],IxGridColumnFilter.prototype,"dragEvent",void 0),IxGridColumnFilter=__decorate([customElement("ix-grid-column-filter")],IxGridColumnFilter),class extends LitElement{constructor(){super(...arguments),this.items=[],this.isDownloading=!1}toggleMenu(){this.downloadMenu.open=!this.downloadMenu.open}renderMenuItems(){var e;return 0===(null==(e=this.items)?void 0:e.length)?html`<ix-menu-item @click="${()=>this.dispatchEvent(new CustomEvent("download",{detail:"all",bubbles:!0,composed:!0}))}"><div slot="headline">Download All Records</div></ix-menu-item><ix-menu-item @click="${()=>this.dispatchEvent(new CustomEvent("download",{detail:"filter",bubbles:!0,composed:!0}))}"><div slot="headline">Download Current Filter</div></ix-menu-item>`:this.items.filter(e=>!e.hidden).map(e=>html`<ix-menu-item .disabled="${e.disabled}" @click="${()=>e.onClick(e.name)}"><div slot="headline">${e.label}</div></ix-menu-item>`)}render(){return this.isDownloading?html`<ix-progress .indeterminate="${!0}" .linear="${!1}" style="--md-circular-progress-size:1.75REM;text-align:center"></ix-progress>`:html`<div style="position:relative"><ix-icon-button id="anchor" @click="${this.toggleMenu}"><svg slot="default" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M15 9H19L12 16L5 9H9V3H15V9ZM5 20V18H19V20H5Z" fill="#1456E0"/></svg></ix-icon-button><ix-menu id="menu" anchor="anchor" has-overflow>${this.renderMenuItems()}</ix-menu></div>`}}),copy=(IxGridDownloadMenu.styles=[IxGridViewStyles],__decorate([query("#menu")],IxGridDownloadMenu.prototype,"downloadMenu",void 0),__decorate([query("#anchor")],IxGridDownloadMenu.prototype,"downloadMenuAnchor",void 0),__decorate([property({type:Array})],IxGridDownloadMenu.prototype,"items",void 0),__decorate([property({type:Boolean})],IxGridDownloadMenu.prototype,"isDownloading",void 0),IxGridDownloadMenu=__decorate([customElement("ix-grid-download-menu")],IxGridDownloadMenu),{activeFilter:"active filter",filters:"Filters",hideFilters:"Hide Filters",showFilters:"Show Filters",rowsPerPage:"Rows per page",viewMore:"VIEW MORE",viewLess:"VIEW LESS"}),IxGridRowFilterStyles=css`.slot-wrap{display:flex}.slot-wrap ix-icon{--ix-icon-font-size:24px;color:var(--clr-primary,#1456e0);margin-right:5px}.grid-menu ix-button .filter{margin-top:2px}.filter-form{white-space:nowrap;padding:9px;color:var(--clr-on-surface-variant,#092241b3)}.filter-form-column{display:inline-block;vertical-align:middle}.filter-remove span{margin-right:0;color:var(--clr-on-surface-variant,#092241b3)}.filter-dropdown-content{position:absolute;display:inline;right:0;top:78%;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:3;transition:box-shadow .3s cubic-bezier(.4,0,.2,1) 0s;border-radius:12px;box-shadow:rgba(0,0,0,.2) 0 5px 5px -3px,rgba(0,0,0,.14) 0 8px 10px 1px,rgba(0,0,0,.12) 0 3px 14px 2px;background-color:#fff;z-index:10}.filter-form input,.filter-form option,.filter-form select{font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);border-radius:0;cursor:pointer;box-sizing:content-box;background:0 0;height:1.4375em;margin:0;animation-name:mui-auto-fill-cancel;animation-duration:10ms;border:none;border-image:initial;box-sizing:border-box;cursor:text;user-select:none;color:currentcolor;-webkit-tap-highlight-color:transparent;display:block;min-width:0;width:100%;height:25px;border-bottom:1px solid #000}.filter-form option{-webkit-tap-highlight-color:#9ca6b2}.filter-form input:hover,.filter-form select:hover{outline:0!important;border-bottom:2px solid #000}.filter-form input:focus,.filter-form select:focus{outline:0!important;border-bottom:2px solid #1456e0}.filter-form select:focus{background-color:rgba(0,0,0,.05)}.form-group{display:flex;flex-direction:column;align-items:baseline;height:54px;justify-content:flex-end;font-family:var(--text-default-font,sans-serif)}.form-group label{font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);padding:0;color:#092241;display:block;transform-origin:left top;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:133%;transform:translate(0,-1.5px) scale(.75);transition:color .2s cubic-bezier(0,0,.2,1) 0s,transform .2s cubic-bezier(0,0,.2,1) 0s,max-width .2s cubic-bezier(0,0,.2,1) 0s}.filter-form-group label span{font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);padding:0;color:#092241;display:block;transform-origin:left top;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:133%;transform:translate(0,-1.5px) scale(.75);transition:color .2s cubic-bezier(0,0,.2,1) 0s,transform .2s cubic-bezier(0,0,.2,1) 0s,max-width .2s cubic-bezier(0,0,.2,1) 0s}.filter-form-group label:focus-within span{color:#1456e0}.filter-form-group{display:flex;flex-direction:column;align-items:baseline;height:54px;justify-content:flex-end;font-family:var(--text-default-font,sans-serif)}option{font-weight:400;display:block;min-height:1.2em;padding:0 2px 1px;white-space:nowrap}.filter-footer{padding:9px;display:flex;justify-content:space-between}.no-display{display:none}.filter-local-operator-empty{width:54px;border:none}.grid-menu span.filter-superscript{position:absolute;top:6px;left:14px;z-index:1;display:flex;align-items:center;justify-content:center;font-family:var(--text-caption-font,sans-serif);font-size:var(--text-caption-size,.75rem);letter-spacing:var(--text-caption-letter-spacing,.03333333em);line-height:var(--text-caption-line-height,1.33333333em);font-weight:var(--text-caption-weight,normal);text-transform:var(--text-caption-transform,none);text-decoration:var(--text-caption-decoration,none);padding:0;height:16px;width:16px;border-radius:50%;background-color:var(--clr-primary,#1456e0);color:var(--clr-on-primary,#fff)}.filterlist{width:40px}.filterColumnField{width:150px}.filterValueField{width:190px}.filterOperatorField{width:120px}.form-group-operator-label{width:100%}.filter-form .filterOperatorInput{min-width:96px}select:hover{cursor:pointer}input:hover{cursor:text}.tooltip-container{position:relative;display:inline-block}.tool-tip{color:var(--clr-on-secondary,#fff);overflow-wrap:break-word;border-radius:3px;background-color:var(--clr-secondary,#071454);padding:5px 8px;font-family:var(--text-caption-font,sans-serif);font-size:var(--text-caption-size,.75rem);letter-spacing:var(--text-caption-letter-spacing,.03333333em);line-height:var(--text-caption-line-height,1.33333333em);font-weight:var(--text-caption-weight,normal);text-transform:var(--text-caption-transform,none);text-decoration:var(--text-caption-decoration,none);position:absolute;top:42px;right:0;z-index:3;white-space:nowrap;display:none}.filter-button:hover~.tool-tip{display:block}.tool-tip li{margin-left:-21px;overflow-wrap:break-word;border-radius:3px;max-width:250px;min-width:200px;white-space:wrap}.tool-tip p{margin:0;padding:0}.grid-menu ix-button{align-items:center;display:flex}@media only screen and (max-width:840px){.filter-dropdown-content{right:inherit;top:0}}`,IxGridRowFilter=class extends LitElement{constructor(){super(...arguments),this.columns=[],this.filterValueChangeDebounceTime=300,this.readParamsFromURL=!1,this.isDropdownVisible=!1,this.filters=[],this.filterableColumns=[],this.filterColumns=[],this.activeFilters=[],this.mapSelect=!1,this.maxDate=formatDate(new Date,"yyyy-MM-dd"),this.fromDateErrorText="",this.debouncedOnFilterValueChange=()=>{},this.closeOnOuterClick=e=>{e.composedPath().includes(this)||(this.isDropdownVisible=!1)}}updateActiveFilters(){this.activeFilters=this.filters.filter(e=>0<e.value.length)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.closeOnOuterClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.closeOnOuterClick)}firstUpdated(){this.filterableColumns=this.columns.filter(e=>e.filterable),this.filterColumns=this.filterableColumns.map(e=>e.name),this.readParamsFromURL&&(this.filters=this.parseFilterQueryString()),this.filters.length||this.addFilter(),this.updateActiveFilters(),this.dispatchUpdate(!1),this.debouncedOnFilterValueChange=(e,t)=>{clearTimeout(this.debounceEvent),this.debounceEvent=setTimeout(()=>this.onfilterValueChange.bind(this)(e,t),this.filterValueChangeDebounceTime)}}get filterNames(){return this.filters.map(e=>e.columnField)}get unselectedFilters(){return this.filterColumns.filter(e=>!this.filterNames.includes(e))}parseFilterQueryString(){let r=new URLSearchParams(window.location.search),o=[];return this.filterableColumns.forEach(i=>{var e;null!=(e=i.filterOperators)&&e.forEach(e=>{var t=i.name+"_"+e;r.has(t)&&o.push({columnField:i.name,operatorValue:e,dataType:i.dataType,value:null!=(e=r.get(t))?e:""})})}),o}dispatchUpdate(e=!0){this.dispatchEvent(new CustomEvent("rowFilter",{detail:{filters:this.filters.filter(e=>3<=e.value.length),resetPage:e},bubbles:!0,composed:!0}))}addFilter(){let e,t,i=this.filterColumns.find(e=>!this.filterNames.includes(e))||"";var r=(null==(e=this.filterableColumns.find(e=>e.name===i))?void 0:e.filterOperators)||["contains"],o=(null==(t=this.filterableColumns.find(e=>e.name===i))?void 0:t.dataType)||"string";this.filters=[...this.filters,{columnField:i,operatorValue:r[0],dataType:o,value:""}],this.updateActiveFilters()}clearFilters(){this.filters=[],this.addFilter(),this.dispatchUpdate()}removeFilter(i){this.filters=this.filters.filter((e,t)=>t!==i),this.dispatchUpdate(),0===this.filters.length&&(this.isDropdownVisible=!1,this.addFilter()),this.updateActiveFilters()}onfilterColumnChange(e,t){let i,r=t.target.value;t=this.filterableColumns.find(e=>e.name===r);this.filters[e].columnField=r,this.filters[e].dataType=null==t?void 0:t.dataType,this.filters[e].operatorValue=(null==(i=null==t?void 0:t.filterOperators)?void 0:i[0])||"contains",this.filters=[...this.filters],3<=this.filters[e].value.length&&this.dispatchUpdate()}onfilterOperatorChange(e,t){t=t.target.value;this.filters[e].operatorValue=t,this.filters=[...this.filters],3<=this.filters[e].value.length&&this.dispatchUpdate()}onDatefilterValueChange(e,t){this.filters[e].value=t,this.dispatchUpdate(),this.updateActiveFilters()}onfilterValueChange(e,t){var i=this.filters[e].value.length,t=t.value,t=(this.filters[e].value=t,this.filters[e].value.length);0<this.filters[e].columnField.length&&(3<=t||t<i)&&this.dispatchUpdate(),this.updateActiveFilters()}formatCamelCaseToEnglish(e){e=e.replace(/([A-Z])/g," $1").toLowerCase();return e.charAt(0).toUpperCase()+e.slice(1)}renderToolTip(){return this.isDropdownVisible?copy.hideFilters:this.activeFilters.length?html`<p>${this.activeFilters.length} ${copy.activeFilter}</p><ul>${this.activeFilters.map(e=>html`<li>${this.formatCamelCaseToEnglish(e.columnField)} ${e.operatorValue} ${e.value}</li>`)}</ul>`:copy.showFilters}renderStringInput(e,t){return html`<label class="form-group-operator-label"><span>Value</span> <input data-testid="${"filterValueInput-"+t}" placeholder="Filter value" @input="${e=>this.debouncedOnFilterValueChange(t,e.target)}" .value="${e.value}"></label>`}renderDateInput(e,t){return html`<ix-date data-testid="${"filterValueInput-"+t}" .value="${e.value}" max="${this.maxDate}" name="${e.columnField}-valueDate" .errorText="${this.fromDateErrorText}" .onChanged="${e=>this.onDatefilterValueChange(t,e)}"></ix-date>`}renderFilterInputControl(e,t){switch(e.dataType){case"string":case void 0:return this.renderStringInput(e,t);case"dateTime":return this.renderDateInput(e,t);default:return nothing}}renderFilterInput(t,i){let e,r,o=[t.columnField,...this.unselectedFilters];var a=this.filterableColumns.filter(e=>o.includes(e.name));return html`<div class="filter-form"><div class="filter-remove filter-form-column"><div class="form-group"><ix-icon-button icon="close" data-testid="clearFilterButton" @click="${()=>this.removeFilter(i)}" @keyDown="${e=>{" "!==e.key&&"Enter"!==e.key||this.removeFilter(i)}}"></ix-icon-button></div></div>${this.mapSelect?html`<div class="filter-form-column filter-form-column-border filterColumnField"><div class="form-group"><label class="form-group-column-label" title="select: ${t.columnField}, options: ${a.map(e=>`value=${e.name}, selected=${e.name===t.columnField}, ${e.header}
1
+ import{__decorate}from"tslib";import"@digital-realty/ix-icon-button/ix-icon-button.js";import"@digital-realty/ix-icon/ix-icon.js";import"@digital-realty/ix-progress/ix-progress.js";import"@vaadin/grid";import{columnHeaderRenderer}from"@vaadin/grid/lit.js";import{css,svg,LitElement,nothing,html,render}from"lit";import{query,property,state,customElement}from"lit/decorators.js";import{classMap}from"lit/directives/class-map.js";import{ifDefined}from"lit/directives/if-defined.js";import{repeat}from"lit/directives/repeat.js";import"@digital-realty/ix-switch/ix-switch.js";import"@digital-realty/ix-menu/ix-menu.js";import"@digital-realty/ix-menu/ix-menu-item.js";import"@digital-realty/ix-button/ix-button.js";import"@digital-realty/ix-date/ix-date.js";import"@digital-realty/ix-select/ix-select.js";import{formatDate}from"date-fns/format.js";let IxGridViewStyles=css`:host{--_ix-grid-cell-padding:var(--ix-grid-cell-padding, 1rem);--lumo-primary-color-50pct:transparent}*{font-family:inherit}vaadin-grid::part(cell){cursor:var(--ix-grid-cell-pointer,pointer)}vaadin-grid::part(header-cell){cursor:default;--vaadin-grid-cell-background:#fff}vaadin-grid::part(row):hover{--vaadin-grid-cell-background:#f5f5f5}vaadin-grid-cell-content{font-size:14px;--_cell-padding:var(--ix-grid-cell-padding, 14px 10px)}.hide-column-headers::part(header-cell){display:none}vaadin-grid::part(ix-disabled-cell){cursor:default;color:var(--cp-neutral-blue-60p);--vaadin-grid-cell-background:var(--cp-neutral-blue-12p)}ix-grid-download-menu{width:38px;margin-right:2px}ix-grid-column-filter{width:36px}.grid-container{background-color:var(--clr-surface-container-lowest,#fff);border-radius:8px;box-shadow:rgba(0,0,0,.12) 0 12px 20px -12px,#e1e4e8 0 0 0 1px inset;box-sizing:border-box;padding:2px}.touch-edge{margin:0 -3px}.grid-header{display:flex;-webkit-box-pack:justify;place-content:space-between;-webkit-box-align:center;align-items:center;padding:16px 24px;flex-wrap:wrap;gap:18px;margin:-3px 0 0 -3px}.grid-menu{display:flex;align-items:center;margin-left:auto}.grid-menu ix-button{--md-text-button-leading-space:4px;--md-text-button-trailing-space:4px}.grid-menu span{color:var(--clr-primary,#1456e0);cursor:pointer}.header{font-weight:700;display:flex;user-select:none;align-items:center;padding-right:calc(var(--_ix-grid-cell-padding)/ 2);position:relative;text-overflow:ellipsis;overflow:hidden;flex-grow:1;z-index:2}.header:hover .header-sort-icon{display:block}.columns-reordering{opacity:.25}.progress-container{position:relative;top:60px;z-index:1}span .disabled{color:var(--clr-on-surface-variant,rgba(9,34,65,.7))}.disable-cursor{cursor:default!important}.accounts{display:flex;align-items:center}.account-name{margin:0 8px 0 3px}vaadin-grid-cell-content{font-family:var(--text-small-font,sans-serif);font-size:var(--text-small-size,.875rem);letter-spacing:var(--text-small-letter-spacing,.0275em);line-height:var(--text-small-line-height,1.42857143em);font-weight:var(--text-small-weight,normal);text-decoration:var(--text-small-decoration,none);text-transform:var(--text-small-transform,none);--_cell-padding:var(--ix-grid-cell-padding, 14px 10px)}vaadin-grid-cell-content>div{overflow:hidden;text-overflow:ellipsis}.row-controls{border-top:solid 1px var(--clr-border-outline,#0922411f)}.row-limit{display:flex;padding:8px}.launchpad vaadin-grid{--_lumo-grid-border-width:0;--lumo-size-xl:auto}.launchpad vaadin-grid-cell-content{padding:11px 24px;border-bottom:0}.launchpad vaadin-grid::part(body-row){border-bottom:1px solid var(--clr-border-outline,rgba(9,34,65,.12))}.launchpad .grid-header{padding:.5rem 18px 0}.launchpad .header{font-family:var(--text-caption-font,sans-serif);font-size:var(--text-caption-size,.75rem);letter-spacing:var(--text-caption-letter-spacing,.03333333em);line-height:var(--text-caption-line-height,1.33333333em);font-weight:var(--text-caption-weight,normal);text-transform:var(--text-caption-transform,none);text-decoration:var(--text-caption-decoration,none)}.launchpad .grid-header h2{font-family:var(--text-page-title-font,sans-serif);font-size:var(--text-page-title-size,2.125rem);letter-spacing:var(--text-page-title-letter-spacing,.01029412em);line-height:var(--text-page-title-line-height,1.17647059em);font-weight:var(--text-page-title-weight,bold);text-decoration:var(--text-page-title-decoration,none);text-transform:var(--text-page-title-transform,none)}@media only screen and (max-width:840px){.grid-header{display:flex;flex-direction:column;padding:1em 1em 0 1em;place-content:flex-start;-webkit-box-align:flex-start;align-items:flex-start;gap:.75em}.grid-menu{padding-left:0;margin-left:-4px}.grid-container{border-radius:0;box-shadow:none}}`,IxGridColumnFilterStyles=css`.dropdown-content{position:absolute;background-color:var(--clr-surface-container-lowest,#fff);min-width:160px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:9;-webkit-box-align:center;align-items:center;cursor:pointer;vertical-align:middle;-webkit-tap-highlight-color:transparent;padding:10px;width:247px;left:-100px;border-radius:16px}.dropdown-content>div{margin:0;color:var(--clr-on-surface,#092241);font-family:var(--text-small-font,sans-serif);font-size:var(--text-small-size,.875rem);letter-spacing:var(--text-small-letter-spacing,.0275em);line-height:var(--text-small-line-height,1.42857143em);font-weight:var(--text-small-weight,normal);text-decoration:var(--text-small-decoration,none);text-transform:var(--text-small-transform,none);display:block;cursor:pointer}.dropdown-content span:hover{background-color:#f1f1f1}.dropdown-content label{display:flex;align-items:center}.dropdown-content label.dragOrigin{background:#ff000017;outline:1px #ff9d9d dashed}.dropdown-content label p{width:158px}.dropdown-content label .draggable{font-size:24px;cursor:move;cursor:grab;cursor:-moz-grab;cursor:-webkit-grab}.dropdown-content label .draggable path{fill:var(--clr-primary,#1456e0)}.active{position:absolute;right:0;top:0;height:8px;width:8px;background-color:var(--clr-critical,#db0028);border-radius:50%}ix-switch{padding:0 0 0 6px;display:flex;width:48px}.list{position:relative}@media only screen and (max-width:840px){.dropdown-content{left:0}}`,triggerKeys=[" ","Enter"],handleIcon=svg`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M9 4C7.9 4 7 4.9 7 6C7 7.1 7.9 8 9 8C10.1 8 11 7.1 11 6C11 4.9 10.1 4 9 4ZM7 12C7 10.9 7.9 10 9 10C10.1 10 11 10.9 11 12C11 13.1 10.1 14 9 14C7.9 14 7 13.1 7 12ZM9 20C10.1 20 11 19.1 11 18C11 16.9 10.1 16 9 16C7.9 16 7 16.9 7 18C7 19.1 7.9 20 9 20ZM17 6C17 7.1 16.1 8 15 8C13.9 8 13 7.1 13 6C13 4.9 13.9 4 15 4C16.1 4 17 4.9 17 6ZM15 10C13.9 10 13 10.9 13 12C13 13.1 13.9 14 15 14C16.1 14 17 13.1 17 12C17 10.9 16.1 10 15 10ZM13 18C13 16.9 13.9 16 15 16C16.1 16 17 16.9 17 18C17 19.1 16.1 20 15 20C13.9 20 13 19.1 13 18Z" fill="#1456e0"/></svg>`,IxGridColumnFilter=class extends LitElement{constructor(){super(...arguments),this.columns=[],this.columnsLocalStorageKey=void 0,this.columnReorderingAllowed=!1,this.refreshDataOnColumnVisibilityChange=!0,this.isDropdownVisible=!1,this.disabledColumns=[],this.dragEvent={sourceEl:null,startId:-1,targetId:-1},this.outerInteraction=e=>{e.composedPath().includes(this)||(this.isDropdownVisible=!1)}}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.outerInteraction),this.initializeLocalStorage()}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.outerInteraction)}get preservedColumns(){let e=[];return e=this.columnsLocalStorageKey?JSON.parse(localStorage.getItem(this.columnsLocalStorageKey)||"[]"):e}initializeLocalStorage(){0<this.preservedColumns.length&&(this.disabledColumns=this.preservedColumns.filter(t=>t.hidden&&this.columns.some(e=>e.name===t.name)).map(e=>e.name),this.columns.forEach((e,t)=>{this.disabledColumns.includes(e.name)&&(this.columns[t].hidden=!0)})),this.dispatchUpdate()}update(e){super.update(e),e.has("columnsLocalStorageKey")&&this.initializeLocalStorage()}toggleColumn(e){this.columns[e].hidden=!this.columns[e].hidden,this.disabledColumns=this.columns.filter(e=>e.hidden).map(e=>e.name),this.columnsLocalStorageKey&&localStorage.setItem(this.columnsLocalStorageKey,JSON.stringify([...this.columns])),this.dispatchUpdate()}updateColumn(e,t){e=null==(e=e.target.shadowRoot)?void 0:e.querySelector("input");this.columns[t].hidden!==!(null!=e&&e.checked)&&this.dispatchEvent(new CustomEvent("columnVisibilityChange",{detail:{column:this.columns[t]},bubbles:!0,composed:!0})),this.columns[t].hidden=!(null!=e&&e.checked),this.disabledColumns=this.columns.filter(e=>e.hidden).map(e=>e.name),this.columnsLocalStorageKey&&localStorage.setItem(this.columnsLocalStorageKey,JSON.stringify([...this.columns])),this.dispatchUpdate()}dispatchUpdate(e=this.columns){this.dispatchEvent(new CustomEvent("columnFilter",{detail:{columns:e},bubbles:!0,composed:!0}))}dragstart(e){this.columnReorderingAllowed&&(e=e.target,(this.dragEvent.sourceEl=e).style.opacity="0.3",e=Number(e.getAttribute("data-id")),this.dragEvent.startId=e)}dragend(){var e,t;this.columnReorderingAllowed&&(this.dragEvent.startId!==this.dragEvent.targetId&&(t=(e=[...this.columns]).splice(this.dragEvent.startId,1)[0],e.splice(this.dragEvent.targetId,0,t),this.dispatchEvent(new CustomEvent("reorderColumns",{detail:{reorderedColumns:e},bubbles:!0,composed:!0}))),null!=(t=this.dragEvent.sourceEl)&&t.style.removeProperty("opacity"),this.dragEvent={sourceEl:null,startId:-1,targetId:-1})}dragenter(e){this.columnReorderingAllowed&&(e=e.target).classList.contains("drag-target")&&(e=Number(e.getAttribute("data-id")),this.dragEvent.targetId=e)}handleDropdownToggle(e){e instanceof KeyboardEvent&&!triggerKeys.includes(e.key)||e.composedPath().includes(this.dropdown)||(this.isDropdownVisible=!this.isDropdownVisible)}render(){return html`<div class="grid-menu"><span @click="${this.handleDropdownToggle}" @keyDown="${this.handleDropdownToggle}" class="list list-dropdown"><ix-icon-button appearance="default"><svg slot="default" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M3 9H7V5H3V9ZM7 14H3V10H7V14ZM7 19H3V15H7V19ZM20 14H8V10H20V14ZM8 19H20V15H8V19ZM8 9V5H20V9H8Z" fill="#1456E0"/></svg></ix-icon-button>${0<this.disabledColumns.length?html`<div class="active"></div>`:nothing} ${this.isDropdownVisible?html`<div class="dropdown-content" @dragover="${e=>e.preventDefault()}" @dragstart="${this.dragstart}" @dragend="${this.dragend}" @dragenter="${this.dragenter}">${repeat(this.columns.filter(e=>!1!==e.filterable),e=>e.name,(e,t)=>html`<div><label class="${"ix-switch-label drag-target "+(this.dragEvent.startId===t?"dragOrigin":"")}" draggable="${this.columnReorderingAllowed}" data-id="${t}"><ix-switch .selected="${!e.hidden}" @change="${e=>this.updateColumn(e,t)}"></ix-switch><p>${e.header}</p>${this.columnReorderingAllowed?html`<div class="draggable">${handleIcon}</div>`:nothing}</label></div>`)}</div>`:nothing}</span></div>`}},IxGridDownloadMenu=(IxGridColumnFilter.styles=[IxGridViewStyles,IxGridColumnFilterStyles],__decorate([query(".dropdown-content")],IxGridColumnFilter.prototype,"dropdown",void 0),__decorate([property({type:Array})],IxGridColumnFilter.prototype,"columns",void 0),__decorate([property({type:String})],IxGridColumnFilter.prototype,"columnsLocalStorageKey",void 0),__decorate([property({type:Boolean})],IxGridColumnFilter.prototype,"columnReorderingAllowed",void 0),__decorate([property({type:Boolean})],IxGridColumnFilter.prototype,"refreshDataOnColumnVisibilityChange",void 0),__decorate([property({attribute:!1})],IxGridColumnFilter.prototype,"requestGridUpdate",void 0),__decorate([state()],IxGridColumnFilter.prototype,"isDropdownVisible",void 0),__decorate([state()],IxGridColumnFilter.prototype,"disabledColumns",void 0),__decorate([state()],IxGridColumnFilter.prototype,"dragEvent",void 0),IxGridColumnFilter=__decorate([customElement("ix-grid-column-filter")],IxGridColumnFilter),class extends LitElement{constructor(){super(...arguments),this.items=[],this.isDownloading=!1}toggleMenu(){this.downloadMenu.open=!this.downloadMenu.open}renderMenuItems(){var e;return 0===(null==(e=this.items)?void 0:e.length)?html`<ix-menu-item @click="${()=>this.dispatchEvent(new CustomEvent("download",{detail:"all",bubbles:!0,composed:!0}))}"><div slot="headline">Download All Records</div></ix-menu-item><ix-menu-item @click="${()=>this.dispatchEvent(new CustomEvent("download",{detail:"filter",bubbles:!0,composed:!0}))}"><div slot="headline">Download Current Filter</div></ix-menu-item>`:this.items.filter(e=>!e.hidden).map(e=>html`<ix-menu-item .disabled="${e.disabled}" @click="${()=>e.onClick(e.name)}"><div slot="headline">${e.label}</div></ix-menu-item>`)}render(){return this.isDownloading?html`<ix-progress .indeterminate="${!0}" .linear="${!1}" style="--md-circular-progress-size:1.75REM;text-align:center"></ix-progress>`:html`<div style="position:relative"><ix-icon-button id="anchor" @click="${this.toggleMenu}"><svg slot="default" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill-rule="evenodd" clip-rule="evenodd" d="M15 9H19L12 16L5 9H9V3H15V9ZM5 20V18H19V20H5Z" fill="#1456E0"/></svg></ix-icon-button><ix-menu id="menu" anchor="anchor" has-overflow>${this.renderMenuItems()}</ix-menu></div>`}}),copy=(IxGridDownloadMenu.styles=[IxGridViewStyles],__decorate([query("#menu")],IxGridDownloadMenu.prototype,"downloadMenu",void 0),__decorate([query("#anchor")],IxGridDownloadMenu.prototype,"downloadMenuAnchor",void 0),__decorate([property({type:Array})],IxGridDownloadMenu.prototype,"items",void 0),__decorate([property({type:Boolean})],IxGridDownloadMenu.prototype,"isDownloading",void 0),IxGridDownloadMenu=__decorate([customElement("ix-grid-download-menu")],IxGridDownloadMenu),{activeFilter:"active filter",filters:"Filters",hideFilters:"Hide Filters",showFilters:"Show Filters",rowsPerPage:"Rows per page",viewMore:"VIEW MORE",viewLess:"VIEW LESS"}),IxGridRowFilterStyles=css`.slot-wrap{display:flex}.slot-wrap ix-icon{--ix-icon-font-size:24px;color:var(--clr-primary,#1456e0);margin-right:5px}.grid-menu ix-button .filter{margin-top:2px}.filter-form{white-space:nowrap;padding:9px;color:var(--clr-on-surface-variant,#092241b3)}.filter-form-column{display:inline-block;vertical-align:middle}.filter-remove span{margin-right:0;color:var(--clr-on-surface-variant,#092241b3)}.filter-dropdown-content{position:absolute;display:inline;right:0;top:78%;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:3;transition:box-shadow .3s cubic-bezier(.4,0,.2,1) 0s;border-radius:12px;box-shadow:rgba(0,0,0,.2) 0 5px 5px -3px,rgba(0,0,0,.14) 0 8px 10px 1px,rgba(0,0,0,.12) 0 3px 14px 2px;background-color:#fff;z-index:10}.filter-form input,.filter-form option,.filter-form select{font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);border-radius:0;cursor:pointer;box-sizing:content-box;background:0 0;height:1.4375em;margin:0;animation-name:mui-auto-fill-cancel;animation-duration:10ms;border:none;border-image:initial;box-sizing:border-box;cursor:text;user-select:none;color:currentcolor;-webkit-tap-highlight-color:transparent;display:block;min-width:0;width:100%;height:25px;border-bottom:1px solid #000}.filter-form option{-webkit-tap-highlight-color:#9ca6b2}.filter-form input:hover,.filter-form select:hover{outline:0!important;border-bottom:2px solid #000}.filter-form input:focus,.filter-form select:focus{outline:0!important;border-bottom:2px solid #1456e0}.filter-form select:focus{background-color:rgba(0,0,0,.05)}.form-group{display:flex;flex-direction:column;align-items:baseline;height:54px;justify-content:flex-end;font-family:var(--text-default-font,sans-serif)}.form-group label{font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);padding:0;color:#092241;display:block;transform-origin:left top;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:133%;transform:translate(0,-1.5px) scale(.75);transition:color .2s cubic-bezier(0,0,.2,1) 0s,transform .2s cubic-bezier(0,0,.2,1) 0s,max-width .2s cubic-bezier(0,0,.2,1) 0s}.filter-form-group label span{font-family:var(--text-default-font,sans-serif);font-size:var(--text-default-size,16px);letter-spacing:var(--text-default-letter-spacing,.0275em);line-height:var(--text-default-line-height,1.75em);font-weight:var(--text-default-weight,normal);text-transform:var(--text-default-decoration,none);text-decoration:var(--text-default-transform,none);padding:0;color:#092241;display:block;transform-origin:left top;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:133%;transform:translate(0,-1.5px) scale(.75);transition:color .2s cubic-bezier(0,0,.2,1) 0s,transform .2s cubic-bezier(0,0,.2,1) 0s,max-width .2s cubic-bezier(0,0,.2,1) 0s}.filter-form-group label:focus-within span{color:#1456e0}.filter-form-group{display:flex;flex-direction:column;align-items:baseline;height:54px;justify-content:flex-end;font-family:var(--text-default-font,sans-serif)}option{font-weight:400;display:block;min-height:1.2em;padding:0 2px 1px;white-space:nowrap}.filter-footer{padding:9px;display:flex;justify-content:space-between}.no-display{display:none}.filter-local-operator-empty{width:54px;border:none}.grid-menu span.filter-superscript{position:absolute;top:6px;left:14px;z-index:1;display:flex;align-items:center;justify-content:center;font-family:var(--text-caption-font,sans-serif);font-size:var(--text-caption-size,.75rem);letter-spacing:var(--text-caption-letter-spacing,.03333333em);line-height:var(--text-caption-line-height,1.33333333em);font-weight:var(--text-caption-weight,normal);text-transform:var(--text-caption-transform,none);text-decoration:var(--text-caption-decoration,none);padding:0;height:16px;width:16px;border-radius:50%;background-color:var(--clr-primary,#1456e0);color:var(--clr-on-primary,#fff)}.filterlist{width:40px}.filterColumnField{width:150px}.filterValueField{width:190px}.filterOperatorField{width:120px}.form-group-operator-label{width:100%}.filter-form .filterOperatorInput{min-width:96px}select:hover{cursor:pointer}input:hover{cursor:text}.tooltip-container{position:relative;display:inline-block}.tool-tip{color:var(--clr-on-secondary,#fff);overflow-wrap:break-word;border-radius:3px;background-color:var(--clr-secondary,#071454);padding:5px 8px;font-family:var(--text-caption-font,sans-serif);font-size:var(--text-caption-size,.75rem);letter-spacing:var(--text-caption-letter-spacing,.03333333em);line-height:var(--text-caption-line-height,1.33333333em);font-weight:var(--text-caption-weight,normal);text-transform:var(--text-caption-transform,none);text-decoration:var(--text-caption-decoration,none);position:absolute;top:42px;right:0;z-index:3;white-space:nowrap;display:none}.filter-button:hover~.tool-tip{display:block}.tool-tip li{margin-left:-21px;overflow-wrap:break-word;border-radius:3px;max-width:250px;min-width:200px;white-space:wrap}.tool-tip p{margin:0;padding:0}.grid-menu ix-button{align-items:center;display:flex}@media only screen and (max-width:840px){.filter-dropdown-content{right:inherit;top:0}}`,IxGridRowFilter=class extends LitElement{constructor(){super(...arguments),this.columns=[],this.filterValueChangeDebounceTime=300,this.readParamsFromURL=!1,this.isDropdownVisible=!1,this.filters=[],this.filterableColumns=[],this.filterColumns=[],this.activeFilters=[],this.mapSelect=!1,this.maxDate=formatDate(new Date,"yyyy-MM-dd"),this.fromDateErrorText="",this.debouncedOnFilterValueChange=()=>{},this.closeOnOuterClick=e=>{e.composedPath().includes(this)||(this.isDropdownVisible=!1)}}updateActiveFilters(){this.activeFilters=this.filters.filter(e=>0<e.value.length)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.closeOnOuterClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.closeOnOuterClick)}firstUpdated(){this.filterableColumns=this.columns.filter(e=>e.filterable),this.filterColumns=this.filterableColumns.map(e=>e.name),this.readParamsFromURL&&(this.filters=this.parseFilterQueryString()),this.filters.length||this.addFilter(),this.updateActiveFilters(),this.dispatchUpdate(!1),this.debouncedOnFilterValueChange=(e,t)=>{clearTimeout(this.debounceEvent),this.debounceEvent=setTimeout(()=>this.onfilterValueChange.bind(this)(e,t),this.filterValueChangeDebounceTime)}}get filterNames(){return this.filters.map(e=>e.columnField)}get unselectedFilters(){return this.filterColumns.filter(e=>!this.filterNames.includes(e))}parseFilterQueryString(){let r=new URLSearchParams(window.location.search),o=[];return this.filterableColumns.forEach(i=>{var e;null!=(e=i.filterOperators)&&e.forEach(e=>{var t=i.name+"_"+e;r.has(t)&&o.push({columnField:i.name,operatorValue:e,dataType:i.dataType,value:null!=(e=r.get(t))?e:""})})}),o}dispatchUpdate(e=!0){this.dispatchEvent(new CustomEvent("rowFilter",{detail:{filters:this.filters.filter(e=>3<=e.value.length),resetPage:e},bubbles:!0,composed:!0}))}addFilter(){let e,t,i=this.filterColumns.find(e=>!this.filterNames.includes(e))||"";var r=(null==(e=this.filterableColumns.find(e=>e.name===i))?void 0:e.filterOperators)||["contains"],o=(null==(t=this.filterableColumns.find(e=>e.name===i))?void 0:t.dataType)||"string";this.filters=[...this.filters,{columnField:i,operatorValue:r[0],dataType:o,value:""}],this.updateActiveFilters()}clearFilters(){this.filters=[],this.addFilter(),this.dispatchUpdate()}removeFilter(i){this.filters=this.filters.filter((e,t)=>t!==i),this.dispatchUpdate(),0===this.filters.length&&(this.isDropdownVisible=!1,this.addFilter()),this.updateActiveFilters()}onfilterColumnChange(e,t){let i,r=t.target.value;t=this.filterableColumns.find(e=>e.name===r);this.filters[e].columnField=r,this.filters[e].dataType=null==t?void 0:t.dataType,this.filters[e].operatorValue=(null==(i=null==t?void 0:t.filterOperators)?void 0:i[0])||"contains",this.filters=[...this.filters],3<=this.filters[e].value.length&&this.dispatchUpdate()}onfilterOperatorChange(e,t){t=t.target.value;this.filters[e].operatorValue=t,this.filters=[...this.filters],3<=this.filters[e].value.length&&this.dispatchUpdate()}onDatefilterValueChange(e,t){this.filters[e].value=t,this.dispatchUpdate(),this.updateActiveFilters()}onfilterValueChange(e,t){var i=this.filters[e].value.length,t=t.value,t=(this.filters[e].value=t,this.filters[e].value.length);0<this.filters[e].columnField.length&&(3<=t||t<i)&&this.dispatchUpdate(),this.updateActiveFilters()}formatCamelCaseToEnglish(e){e=e.replace(/([A-Z])/g," $1").toLowerCase();return e.charAt(0).toUpperCase()+e.slice(1)}renderToolTip(){return this.isDropdownVisible?copy.hideFilters:this.activeFilters.length?html`<p>${this.activeFilters.length} ${copy.activeFilter}</p><ul>${this.activeFilters.map(e=>html`<li>${this.formatCamelCaseToEnglish(e.columnField)} ${e.operatorValue} ${e.value}</li>`)}</ul>`:copy.showFilters}renderStringInput(e,t){return html`<label class="form-group-operator-label"><span>Value</span> <input data-testid="${"filterValueInput-"+t}" placeholder="Filter value" @input="${e=>this.debouncedOnFilterValueChange(t,e.target)}" .value="${e.value}"></label>`}renderDateInput(e,t){return html`<ix-date data-testid="${"filterValueInput-"+t}" .value="${e.value}" max="${this.maxDate}" name="${e.columnField}-valueDate" .errorText="${this.fromDateErrorText}" .onChanged="${e=>this.onDatefilterValueChange(t,e)}"></ix-date>`}renderFilterInputControl(e,t){switch(e.dataType){case"string":case void 0:return this.renderStringInput(e,t);case"dateTime":return this.renderDateInput(e,t);default:return nothing}}renderFilterInput(t,i){let e,r,o=[t.columnField,...this.unselectedFilters];var a=this.filterableColumns.filter(e=>o.includes(e.name));return html`<div class="filter-form"><div class="filter-remove filter-form-column"><div class="form-group"><ix-icon-button icon="close" data-testid="clearFilterButton" @click="${()=>this.removeFilter(i)}" @keyDown="${e=>{" "!==e.key&&"Enter"!==e.key||this.removeFilter(i)}}"></ix-icon-button></div></div>${this.mapSelect?html`<div class="filter-form-column filter-form-column-border filterColumnField"><div class="form-group"><label class="form-group-column-label" title="select: ${t.columnField}, options: ${a.map(e=>`value=${e.name}, selected=${e.name===t.columnField}, ${e.header}
2
2
  `)}">Columns</label> <select @change="${e=>this.onfilterColumnChange(i,e)}" .value="${t.columnField}" data-v="${t.columnField}">${a.map(e=>html`<option value="${e.name}" ?selected="${e.name===t.columnField}">${e.header}</option>`)}</select></div></div>`:nothing}<div class="filter-form-column filter-form-column-border filterColumnField"><div class="filter-form-group"><label class="form-group-column-label" title="select: ${t.columnField}, options: ${a.map(e=>`value=${e.name}, selected=${e.name===t.columnField}, ${e.header}
3
3
  `)}"><span>Columns</span> <select data-testid="${"filterColumnInput-"+i}" @change="${e=>this.onfilterColumnChange(i,e)}" .value="${t.columnField}" data-v="${t.columnField}">${repeat(a,e=>e.name,e=>html`<option value="${e.name}" ?selected="${e.name===t.columnField}">${e.header}</option>`)}</select></label></div></div><div class="filter-form-column filter-form-column-border filterOperatorField"><div class="filter-form-group"><label class="form-group-operator-label"><span>Operator</span> <select data-testid="${"filterOperatorInput-"+i}" class="filterOperatorInput" @change="${e=>this.onfilterOperatorChange(i,e)}" .value="${t.operatorValue}" data-v="${t.operatorValue}">${repeat(null!=(r=null==(e=a.find(e=>e.name===t.columnField))?void 0:e.filterOperators)?r:["contains"],e=>html`<option value="${e}" ?selected="${e===t.operatorValue}">${e}</option>`)}</select></label></div></div><div class="filter-form-column filter-form-column-border filterValueField"><div class="filter-form-group">${this.renderFilterInputControl(t,i)}</div></div></div>`}renderDropdown(){var e=this.filters.length>=this.filterColumns.length||this.activeFilters.length<this.filters.length;return html`<div class="filter-dropdown-content"><div class="filter-body">${this.filters.map((e,t)=>this.renderFilterInput(e,t))}</div><div class="filter-footer"><ix-button data-testid="addFilterButton" class="add-filter-button" @click="${()=>this.addFilter()}" ?disabled="${e}" appearance="text"><ix-icon slot="icon">add</ix-icon>Add filter</ix-button><ix-button data-testid="clearAllFiltersButton" @click="${()=>this.clearFilters()}" ?disabled="${0===this.activeFilters.length}" appearance="text">Clear all</ix-button></div></div>`}render(){return html`<div class="grid-menu"><div class="filter-container tooltip-container">${0<this.activeFilters.length?html`<span class="filter-superscript">${this.activeFilters.length}</span>`:nothing}<ix-button data-testid="showFiltersButton" appearance="text" class="filter_list filter-button" @click="${()=>{this.isDropdownVisible=!this.isDropdownVisible}}" @keyDown="${()=>{this.isDropdownVisible=!this.isDropdownVisible}}"><div class="slot-wrap"><ix-icon appearance="default" class="filter-icon">filter_list</ix-icon><span class="filter">${copy.filters}</span></div></ix-button><div class="tool-tip">${this.renderToolTip()}</div>${this.isDropdownVisible?this.renderDropdown():nothing}</div></div>`}},PaginationStyles=(IxGridRowFilter.styles=[IxGridViewStyles,IxGridRowFilterStyles],__decorate([property({type:Array})],IxGridRowFilter.prototype,"columns",void 0),__decorate([property({type:Number})],IxGridRowFilter.prototype,"filterValueChangeDebounceTime",void 0),__decorate([property({type:Boolean})],IxGridRowFilter.prototype,"readParamsFromURL",void 0),__decorate([state()],IxGridRowFilter.prototype,"isDropdownVisible",void 0),__decorate([state()],IxGridRowFilter.prototype,"filters",void 0),__decorate([state()],IxGridRowFilter.prototype,"filterableColumns",void 0),__decorate([state()],IxGridRowFilter.prototype,"filterColumns",void 0),__decorate([state()],IxGridRowFilter.prototype,"activeFilters",void 0),__decorate([state()],IxGridRowFilter.prototype,"mapSelect",void 0),__decorate([state()],IxGridRowFilter.prototype,"maxDate",void 0),__decorate([state()],IxGridRowFilter.prototype,"fromDateErrorText",void 0),IxGridRowFilter=__decorate([customElement("ix-grid-row-filter")],IxGridRowFilter),css`:host{--md-filled-select-text-field-input-text-size:var(
4
4
  --ix-filled-select-text-field-input-text-size,
@@ -11,4 +11,4 @@ import{__decorate}from"tslib";import"@digital-realty/ix-icon-button/ix-icon-butt
11
11
  #1456e0
12
12
  );--md-filled-select-text-field-focus-active-indicator-color:var(
13
13
  --md-filled-select-text-field-focus-trailing-icon-color
14
- )}ix-select-option{--md-menu-item-selected-container-color:rgba(20, 86, 224, 0.1)}`),IxPagination=class extends LitElement{constructor(){super(...arguments),this.recordCount=0,this.page=1,this.pageSize=10,this.pageSizes=[5,10,25,100]}changePage(e){this.page+=e,this.updatePagination()}updatePagination(e=this.page,t=this.pageSize){this.dispatchEvent(new CustomEvent("updatePagination",{detail:{page:e,pageSize:t},bubbles:!0,composed:!0}))}render(){let e=1<this.page,t=this.recordCount>this.page*this.pageSize;return html`<div class="pagination"><p class="rows-per-page">${copy.rowsPerPage}:</p><ix-select wide-menu menu-positioning="fixed" class="pagination__select-input" @request-selection="${e=>{e=e.target;this.pageSize=Number(e.value),this.updatePagination()}}" selected-index="${this.pageSizes.indexOf(this.pageSize)}" filled>${this.pageSizes.map(e=>html`<ix-select-option class="select-option" value="${e}" ?selected="${e===this.pageSize}"><div slot="headline">${e}</div></ix-select-option>`)}</ix-select><p>${0<this.recordCount?(this.page-1)*this.pageSize+1:0} - ${this.page*this.pageSize>this.recordCount?html`${this.recordCount}`:html`${this.page*this.pageSize}`} of ${0<this.recordCount?this.recordCount:0}</p><div class="pagination-nav"><ix-icon-button ?disabled="${!e}" @click="${()=>e&&this.changePage(-1)}" icon="chevron_left" data-testid="ix-pagination-prev"></ix-icon-button><ix-icon-button ?disabled="${!t}" @click="${()=>t&&this.changePage(1)}" icon="chevron_right" data-testid="ix-pagination-next"></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);class IxGrid extends LitElement{constructor(){super(...arguments),this.defaultPageSize=10,this.defaultPage=1,this.originalSearchParams=void 0,this.columnReorderingAllowed=!1,this.variantClass="",this.columns=[],this.rows=[],this.defaultEmptyText="No data to display",this.sortedColumn="",this.sortDirection="",this.hideHeader=!1,this.hideFilters=!1,this.rowLimit=0,this.page=this.defaultPage,this.pageSize=this.defaultPageSize,this.pageSizes=[5,10,25,100],this.recordCount=0,this.localStorageID=void 0,this.showDownload=!0,this.isDownloading=!1,this.isLoading=!1,this.downloadMenuItems=[],this.addParamsToURL=!0,this.readParamsFromURL=!1,this.refreshDataOnColumnVisibilityChange=!0,this.filterValueChangeDebounceTime=300,this.hideColumnHeaders=!1,this.filters=[],this.isColumnsReordering=!1,this.isExpanded=!1,this.displayColumns=[],this.hashedTableState="",this.initialised=!1,this.renderColumnHeader=(e,t,i)=>{t=classMap({header:!0,frozen:!!e.frozenToEnd,first:0===t,last:t===i-1});return html`<div @click="${()=>e.sortable&&this.handleSort(e.name)}" @keyDown="${()=>e.sortable&&this.handleSort(e.name)}" class="${t}"><span class="header-label">${e.header}</span> ${e.sortable?html`<ix-icon title="Sort" class="header-sort-icon">${"desc"===this.sortDirection&&this.sortedColumn===e.name?"arrow_upward":"arrow_downward"}</ix-icon>`:nothing}</div>`},this.columnRenderer=(e,t,i,r)=>{render(nothing,t);e=e.bodyRenderer(r.item,r,i);render(e,t)},this.renderHeader=()=>html`<div class="grid-header"><slot name="header"><div class="empty"></div></slot>${this.hideFilters?nothing:html`<div class="grid-menu"><ix-grid-column-filter .columns="${this.arrangedColumns}" columnsLocalStorageKey="${ifDefined(this.columnsLocalStorageKey)}" @columnFilter="${e=>this.handleOnColumnFilter(e)}" @reorderColumns="${this.reorderColumnsFromFilter}" .columnReorderingAllowed="${this.columnReorderingAllowed}" .refreshDataOnColumnVisibilityChange="${this.refreshDataOnColumnVisibilityChange}" .requestGridUpdate="${()=>this.requestUpdate()}"></ix-grid-column-filter>${this.showDownload?html`<ix-grid-download-menu .items="${this.downloadMenuItems}" .isDownloading="${this.isDownloading}"></ix-grid-download-menu>`:nothing}<ix-grid-row-filter .columns="${this.displayColumns}" .filterValueChangeDebounceTime="${this.filterValueChangeDebounceTime}" .readParamsFromURL="${this.readParamsFromURL}" @rowFilter="${e=>{this.filters=e.detail.filters,e.detail.resetPage&&(this.page=this.defaultPage),this.updatePage()}}"></ix-grid-row-filter></div>`}</div><div class="touch-edge"><slot name="under-header"></slot></div>`,this.renderRowLimitControls=()=>this.rows.length<=this.rowLimit?nothing:html`<div class="row-controls row-limit"><ix-button appearance="text" @click="${()=>{this.isExpanded=!this.isExpanded}}" has-icon>${this.isExpanded?copy.viewLess:copy.viewMore}<ix-icon slot="icon">${this.isExpanded?"remove":"add"}</ix-icon></ix-button></div>`,this.renderPaginationControls=()=>html`<div class="row-controls pagination"><ix-pagination .page="${this.page}" .pageSize="${this.pageSize}" .pageSizes="${this.pageSizes}" .recordCount="${this.recordCount}" @updatePagination="${e=>{this.page=e.detail.page,this.pageSize=e.detail.pageSize,this.updatePage()}}"></ix-pagination></div>`}get isPersistable(){return!!this.localStorageID}get columnNames(){return this.columns.map(e=>e.name)}get columnsLocalStorageKey(){if(""===this.hashedTableState){var e=this.columns.map(({bodyRenderer:e,...t})=>t),i=JSON.stringify(e);let t=0;for(let e=0;e<i.length;e+=1)t=31*t+i.charCodeAt(e)>>>0;this.hashedTableState=t.toString(36)}return`ix-grid-${this.localStorageID}-${this.hashedTableState}-columns`}get arrangedColumns(){let e=[];return(e=0===(e=this.getColumnsToDisplayFromLocalStorage()).length?[...this.columns]:e).filter(e=>e).map(e=>({...e,width:e.width||void 0}))}update(e){!this.initialised&&0<this.columns.length&&(this.displayColumns=[...this.columns],this.checkLocalStorageUpdate(),this.initialised=!0),super.update(e)}firstUpdated(){var e,t,i,r;this.readParamsFromURL&&(r=new URL(window.location.href),e=(r=new URLSearchParams(r.search)).get("sort"),t=r.get("order"),i=r.get("page"),r=r.get("size"),e&&t&&(this.sortedColumn=e,this.sortDirection=t),i&&(this.page=parseInt(i,10)||this.defaultPage),r)&&(this.pageSize=parseInt(r,10)||this.defaultPageSize),this.removeOldLocalStorageValues()}checkLocalStorageUpdate(){if(this.isPersistable){let i=JSON.parse(localStorage.getItem(this.columnsLocalStorageKey)||"[]");if(0<i.length){let e=!1;i.length!==this.columns.length&&(e=!0);var t=this.columns.every(t=>i.some(e=>e.name===t.name))&&i.every(t=>this.columns.some(e=>e.name===t.name));(e=t?e:!0)&&this.setColumnsToLocalStorage(this.columns)}}}buildQueryFromFilters(){let t=new URLSearchParams;return this.filters.forEach(e=>{t.append(e.columnField+"_"+e.operatorValue,e.value)}),Object.fromEntries(t)}getColumnsToDisplayFromLocalStorage(){let e=[];var t;return e=this.isPersistable&&0<(t=JSON.parse(localStorage.getItem(this.columnsLocalStorageKey)||"[]")).length?this.mapColumnsWithPersistedSettings(t):e}mapColumnsWithPersistedSettings(o){let i=new Map(o.map(e=>[e.name,e]));var e=this.columns.map(e=>{var t=i.get(e.name);return t?{...e,hidden:t.hidden,frozenToEnd:t.frozenToEnd,width:t.width||void 0}:{...e}});return e.sort((t,i)=>{var e=o.findIndex(e=>e.name===t.name),r=o.findIndex(e=>e.name===i.name);return-1===e&&-1===r?0:-1===e?1:-1===r?-1:e-r}),e}removeOldLocalStorageValues(){var t=this.findMatchingLocalStorageKeys(`ix-grid-${this.localStorageID}-`,"-columns",this.hashedTableState);for(let e=0;e<=t.length;e+=1)localStorage.removeItem(t[e])}findMatchingLocalStorageKeys(t,i,e){var r=[],o=t+e+i;for(let e=0;e<localStorage.length;e+=1){var a=localStorage.key(e);a&&a.startsWith(t)&&a.endsWith(i)&&a!==o&&r.push(a)}return r}async updatePage(e=!0){var t,i=this.filters.reduce((e,{columnField:t,value:i})=>({...e,[t]:i}),{});this.dispatchEvent(new CustomEvent("change",{detail:{columnName:this.sortedColumn,sortOrder:this.sortDirection,page:this.page,pageSize:this.pageSize,filters:i,filtersOperators:this.filters.map(e=>({columnField:e.columnField,operator:e.operatorValue}))},bubbles:!0,composed:!0})),this.addParamsToURL&&e&&(i={sort:this.sortedColumn,order:this.sortDirection,page:this.page.toString(),size:this.pageSize.toString(),...this.buildQueryFromFilters()},e=new URL(window.location.href),i=new URLSearchParams(i),this.originalSearchParams||this.saveOriginalSearchParams(i),t=new URLSearchParams([...null!=(t=this.originalSearchParams)?t:[],...i]),e.search=t.toString(),window.history.replaceState(null,"",e.toString()))}saveOriginalSearchParams(e){var t=new URL(window.location.href);let i=new URLSearchParams(t.search);this.filters.forEach(e=>{i.delete(e.columnField+"_"+e.operatorValue)}),e.forEach((e,t)=>{i.delete(t)}),this.originalSearchParams=i}handleSort(e=""){this.sortedColumn!==e?this.sortDirection="asc":this.sortDirection="asc"===this.sortDirection?"desc":"asc",this.sortedColumn=e,this.updatePage()}setColumnsToLocalStorage(e){this.isPersistable&&localStorage.setItem(this.columnsLocalStorageKey,JSON.stringify(e))}async reorderColumnsFromTable(){var e=[...this.arrangedColumns],t=e.filter(e=>!0!==e.hidden),r=e.filter(e=>!0===e.hidden),e=e.filter(e=>!0===e.frozenToEnd);let o=[...t.filter(e=>!0!==(null==e?void 0:e.frozenToEnd)),...r.filter(e=>!0!==(null==e?void 0:e.frozenToEnd)),...e];t=Array.from((null==(t=null==(t=this.grid)?void 0:t.shadowRoot)?void 0:t.querySelectorAll("th"))||[]);if(t.length){let i=t.map((e,t)=>({id:t,flexPosition:Number(e.style.order)})).sort((e,t)=>e.flexPosition-t.flexPosition).map(e=>e.id);t=[];i.every((e,t)=>0===t||e>i[t-1])||(t=i.map(e=>o[e]),this.displayColumns=[...t.filter(e=>!0!==e.hidden&&!0!==(null==e?void 0:e.frozenToEnd)),...r.filter(e=>!0!==(null==e?void 0:e.frozenToEnd)),...e],this.isColumnsReordering=!0,await this.updateComplete,this.isColumnsReordering=!1,this.setColumnsToLocalStorage(this.displayColumns))}}async reorderColumnsFromFilter(e){this.displayColumns=[...e.detail.reorderedColumns],this.setColumnsToLocalStorage([...this.displayColumns]),this.isColumnsReordering=!0,await this.updateComplete,this.isColumnsReordering=!1}handleOnColumnFilter(e){e.detail.columns.forEach((e,t)=>{this.displayColumns[t]&&(this.displayColumns[t].hidden=null==e?void 0:e.hidden)}),this.updatePage(!1)}cellPartNameGenerator(e,t){let i="";return t.item.disabled&&(i+=" ix-disabled-cell"),i}renderColumns(){let t=[...this.arrangedColumns];return 0<t.length?html`${t.map((r,e)=>!0===r.hidden?nothing:html`<vaadin-grid-column ${columnHeaderRenderer(()=>this.renderColumnHeader(r,e,t.length),this.sortDirection)} .renderer="${(e,t,i)=>this.columnRenderer(r,e,t,i)}" resizable width="${ifDefined(r.width)}" ?hidden="${r.hidden}" ?frozen-to-end="${r.frozenToEnd}" path="${r.name}" ?auto-width="${r.autoWidth}" flex-grow="${ifDefined(r.flexGrow)}"></vaadin-grid-column>`)}`:html`<vaadin-grid-column></vaadin-grid-column>`}renderLoading(){return html`<div class="progress-container" style="display:${this.isLoading?"":"none"}"><ix-progress .indeterminate="${!0}"></ix-progress></div>`}render(){return html`<div class="${`grid-container ${this.isColumnsReordering?"columns-reordering":""} `+this.variantClass}">${this.hideHeader?nothing:this.renderHeader()} ${this.renderLoading()} ${this.isColumnsReordering?nothing:html`<vaadin-grid class="${this.hideColumnHeaders?"hide-column-headers":""}" .items="${0<this.rowLimit&&!this.isExpanded?this.rows.slice(0,this.rowLimit):this.rows}" all-rows-visible ?column-reordering-allowed="${this.columnReorderingAllowed}" theme="no-border" .cellPartNameGenerator="${this.cellPartNameGenerator}" @mouseup="${this.reorderColumnsFromTable}">${this.renderColumns()}</vaadin-grid>${0!==this.rows.length||this.isColumnsReordering?nothing:html`<slot name="no-rows"></slot>`}`} ${0<this.rowLimit?this.renderRowLimitControls():this.renderPaginationControls()}<slot name="footer"></slot></div>`}}IxGrid.styles=[IxGridViewStyles],__decorate([query("vaadin-grid")],IxGrid.prototype,"grid",void 0),__decorate([property({type:Boolean,attribute:"column-reordering-allowed"})],IxGrid.prototype,"columnReorderingAllowed",void 0),__decorate([property({type:String})],IxGrid.prototype,"variantClass",void 0),__decorate([property({type:Array})],IxGrid.prototype,"columns",void 0),__decorate([property({type:Array})],IxGrid.prototype,"rows",void 0),__decorate([property({type:String})],IxGrid.prototype,"defaultEmptyText",void 0),__decorate([property({type:String})],IxGrid.prototype,"sortedColumn",void 0),__decorate([property({type:String})],IxGrid.prototype,"sortDirection",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"hideHeader",void 0),__decorate([property({type:Boolean,attribute:"hide-filters"})],IxGrid.prototype,"hideFilters",void 0),__decorate([property({type:Number})],IxGrid.prototype,"rowLimit",void 0),__decorate([property({type:Number})],IxGrid.prototype,"page",void 0),__decorate([property({type:Number})],IxGrid.prototype,"pageSize",void 0),__decorate([property({type:Array})],IxGrid.prototype,"pageSizes",void 0),__decorate([property({type:Number})],IxGrid.prototype,"recordCount",void 0),__decorate([property({type:String})],IxGrid.prototype,"localStorageID",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"showDownload",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"isDownloading",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"isLoading",void 0),__decorate([property({type:Array})],IxGrid.prototype,"downloadMenuItems",void 0),__decorate([property({type:Boolean,attribute:"add-params-to-url"})],IxGrid.prototype,"addParamsToURL",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"readParamsFromURL",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"refreshDataOnColumnVisibilityChange",void 0),__decorate([property({type:Number})],IxGrid.prototype,"filterValueChangeDebounceTime",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"hideColumnHeaders",void 0),__decorate([state()],IxGrid.prototype,"filters",void 0),__decorate([state()],IxGrid.prototype,"isColumnsReordering",void 0),__decorate([state()],IxGrid.prototype,"isExpanded",void 0),__decorate([state()],IxGrid.prototype,"displayColumns",void 0),window.customElements.define("ix-grid",IxGrid);
14
+ )}ix-select-option{--md-menu-item-selected-container-color:rgba(20, 86, 224, 0.1)}`),IxPagination=class extends LitElement{constructor(){super(...arguments),this.recordCount=0,this.page=1,this.pageSize=10,this.pageSizes=[5,10,25,100]}changePage(e){this.page+=e,this.updatePagination()}updatePagination(e=this.page,t=this.pageSize){this.dispatchEvent(new CustomEvent("updatePagination",{detail:{page:e,pageSize:t},bubbles:!0,composed:!0}))}render(){let e=1<this.page,t=this.recordCount>this.page*this.pageSize;return html`<div class="pagination"><p class="rows-per-page">${copy.rowsPerPage}:</p><ix-select wide-menu menu-positioning="fixed" class="pagination__select-input" @request-selection="${e=>{e=e.target;this.pageSize=Number(e.value),this.updatePagination()}}" selected-index="${this.pageSizes.indexOf(this.pageSize)}" filled>${this.pageSizes.map(e=>html`<ix-select-option class="select-option" value="${e}" ?selected="${e===this.pageSize}"><div slot="headline">${e}</div></ix-select-option>`)}</ix-select><p>${0<this.recordCount?(this.page-1)*this.pageSize+1:0} - ${this.page*this.pageSize>this.recordCount?html`${this.recordCount}`:html`${this.page*this.pageSize}`} of ${0<this.recordCount?this.recordCount:0}</p><div class="pagination-nav"><ix-icon-button ?disabled="${!e}" @click="${()=>e&&this.changePage(-1)}" icon="chevron_left" data-testid="ix-pagination-prev"></ix-icon-button><ix-icon-button ?disabled="${!t}" @click="${()=>t&&this.changePage(1)}" icon="chevron_right" data-testid="ix-pagination-next"></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);class IxGrid extends LitElement{constructor(){super(...arguments),this.defaultPageSize=10,this.defaultPage=1,this.originalSearchParams=void 0,this.columnReorderingAllowed=!1,this.variantClass="",this.columns=[],this.rows=[],this.defaultEmptyText="No data to display",this.sortedColumn="",this.sortDirection="",this.hideHeader=!1,this.hideFilters=!1,this.rowLimit=0,this.page=this.defaultPage,this.pageSize=this.defaultPageSize,this.pageSizes=[5,10,25,100],this.recordCount=0,this.localStorageID=void 0,this.showDownload=!0,this.isDownloading=!1,this.isLoading=!1,this.downloadMenuItems=[],this.addParamsToURL=!0,this.readParamsFromURL=!1,this.refreshDataOnColumnVisibilityChange=!0,this.filterValueChangeDebounceTime=300,this.hideColumnHeaders=!1,this.filters=[],this.isColumnsReordering=!1,this.isExpanded=!1,this.displayColumns=[],this.hashedTableState="",this.initialised=!1,this.renderColumnHeader=(e,t,i)=>{t=classMap({header:!0,frozen:!!e.frozenToEnd,first:0===t,last:t===i-1});return html`<div @click="${()=>e.sortable&&this.handleSort(e.name)}" @keyDown="${()=>e.sortable&&this.handleSort(e.name)}" class="${t}"><span class="header-label">${e.header}</span> ${e.sortable?html`<ix-icon title="Sort" class="header-sort-icon">${"desc"===this.sortDirection&&this.sortedColumn===e.name?"arrow_upward":"arrow_downward"}</ix-icon>`:nothing}</div>`},this.columnRenderer=(e,t,i,r)=>{render(nothing,t);e=e.bodyRenderer(r.item,r,i);render(e,t)},this.renderHeader=()=>html`<div class="grid-header"><slot name="header"><div class="empty"></div></slot>${this.hideFilters?nothing:html`<div class="grid-menu"><ix-grid-column-filter .columns="${this.arrangedColumns}" columnsLocalStorageKey="${ifDefined(this.columnsLocalStorageKey)}" @columnFilter="${e=>this.handleOnColumnFilter(e)}" @reorderColumns="${this.reorderColumnsFromFilter}" .columnReorderingAllowed="${this.columnReorderingAllowed}" .refreshDataOnColumnVisibilityChange="${this.refreshDataOnColumnVisibilityChange}" .requestGridUpdate="${()=>this.requestUpdate()}"></ix-grid-column-filter>${this.showDownload?html`<ix-grid-download-menu .items="${this.downloadMenuItems}" .isDownloading="${this.isDownloading}"></ix-grid-download-menu>`:nothing}<ix-grid-row-filter .columns="${this.displayColumns}" .filterValueChangeDebounceTime="${this.filterValueChangeDebounceTime}" .readParamsFromURL="${this.readParamsFromURL}" @rowFilter="${e=>{this.filters=e.detail.filters,e.detail.resetPage&&(this.page=this.defaultPage),this.updatePage()}}"></ix-grid-row-filter></div>`}</div><div class="touch-edge"><slot name="under-header"></slot></div>`,this.renderRowLimitControls=()=>this.rows.length<=this.rowLimit?nothing:html`<div class="row-controls row-limit"><ix-button appearance="text" @click="${()=>{this.isExpanded=!this.isExpanded}}" has-icon>${this.isExpanded?copy.viewLess:copy.viewMore}<ix-icon slot="icon">${this.isExpanded?"remove":"add"}</ix-icon></ix-button></div>`,this.renderPaginationControls=()=>html`<div class="row-controls pagination"><ix-pagination .page="${this.page}" .pageSize="${this.pageSize}" .pageSizes="${this.pageSizes}" .recordCount="${this.recordCount}" @updatePagination="${e=>{this.page=e.detail.page,this.pageSize=e.detail.pageSize,this.updatePage()}}"></ix-pagination></div>`}get isPersistable(){return!!this.localStorageID}get columnNames(){return this.columns.map(e=>e.name)}get columnsLocalStorageKey(){if(""===this.hashedTableState){var e=this.columns.map(({bodyRenderer:e,...t})=>t),i=JSON.stringify(e);let t=0;for(let e=0;e<i.length;e+=1)t=31*t+i.charCodeAt(e)>>>0;this.hashedTableState=t.toString(36)}return`ix-grid-${this.localStorageID}-${this.hashedTableState}-columns`}get arrangedColumns(){let e=[];return(e=0===(e=this.getColumnsToDisplayFromLocalStorage()).length?[...this.columns]:e).filter(e=>e).map(e=>({...e,width:e.width||void 0}))}update(e){!this.initialised&&0<this.columns.length&&(this.displayColumns=[...this.columns],this.checkLocalStorageUpdate(),this.initialised=!0),super.update(e)}firstUpdated(){var e,t,i,r;this.readParamsFromURL&&(r=new URL(window.location.href),e=(r=new URLSearchParams(r.search)).get("sort"),t=r.get("order"),i=r.get("page"),r=r.get("size"),e&&t&&(this.sortedColumn=e,this.sortDirection=t),i&&(this.page=parseInt(i,10)||this.defaultPage),r)&&(this.pageSize=parseInt(r,10)||this.defaultPageSize),this.removeOldLocalStorageValues()}checkLocalStorageUpdate(){if(this.isPersistable){let i=JSON.parse(localStorage.getItem(this.columnsLocalStorageKey)||"[]");if(0<i.length){let e=!1;i.length!==this.columns.length&&(e=!0);var t=this.columns.every(t=>i.some(e=>e.name===t.name))&&i.every(t=>this.columns.some(e=>e.name===t.name));(e=t?e:!0)&&this.setColumnsToLocalStorage(this.columns)}}}buildQueryFromFilters(){let t=new URLSearchParams;return this.filters.forEach(e=>{t.append(e.columnField+"_"+e.operatorValue,e.value)}),Object.fromEntries(t)}getColumnsToDisplayFromLocalStorage(){let e=[];var t;return e=this.isPersistable&&0<(t=JSON.parse(localStorage.getItem(this.columnsLocalStorageKey)||"[]")).length?this.mapColumnsWithPersistedSettings(t):e}mapColumnsWithPersistedSettings(o){let i=new Map(o.map(e=>[e.name,e]));var e=this.columns.map(e=>{var t=i.get(e.name);return t?{...e,hidden:t.hidden,frozenToEnd:t.frozenToEnd,width:t.width||void 0}:{...e}});return e.sort((t,i)=>{var e=o.findIndex(e=>e.name===t.name),r=o.findIndex(e=>e.name===i.name);return-1===e&&-1===r?0:-1===e?1:-1===r?-1:e-r}),e}removeOldLocalStorageValues(){var t=this.findMatchingLocalStorageKeys(`ix-grid-${this.localStorageID}-`,"-columns",this.hashedTableState);for(let e=0;e<=t.length;e+=1)localStorage.removeItem(t[e])}findMatchingLocalStorageKeys(t,i,e){var r=[],o=t+e+i;for(let e=0;e<localStorage.length;e+=1){var a=localStorage.key(e);a&&a.startsWith(t)&&a.endsWith(i)&&a!==o&&r.push(a)}return r}async updatePage(e=!0){var t,i=this.filters.reduce((e,{columnField:t,value:i})=>({...e,[t]:i}),{});this.dispatchEvent(new CustomEvent("change",{detail:{columnName:this.sortedColumn,sortOrder:this.sortDirection,page:this.page,pageSize:this.pageSize,filters:i,filtersOperators:this.filters.map(e=>({columnField:e.columnField,operator:e.operatorValue}))},bubbles:!0,composed:!0})),this.addParamsToURL&&e&&(i={sort:this.sortedColumn,order:this.sortDirection,page:this.page.toString(),size:this.pageSize.toString(),...this.buildQueryFromFilters()},e=new URL(window.location.href),i=new URLSearchParams(i),this.originalSearchParams||this.saveOriginalSearchParams(i),t=new URLSearchParams([...null!=(t=this.originalSearchParams)?t:[],...i]),e.search=t.toString(),window.history.replaceState(null,"",e.toString()))}saveOriginalSearchParams(e){var t=new URL(window.location.href);let i=new URLSearchParams(t.search);this.filters.forEach(e=>{i.delete(e.columnField+"_"+e.operatorValue)}),e.forEach((e,t)=>{i.delete(t)}),this.originalSearchParams=i}handleSort(e=""){this.sortedColumn!==e?this.sortDirection="asc":this.sortDirection="asc"===this.sortDirection?"desc":"asc",this.sortedColumn=e,this.updatePage()}setColumnsToLocalStorage(e){this.isPersistable&&localStorage.setItem(this.columnsLocalStorageKey,JSON.stringify(e))}async reorderColumnsFromTable(){var e=[...this.arrangedColumns],t=e.filter(e=>!0!==e.hidden),r=e.filter(e=>!0===e.hidden),e=e.filter(e=>!0===e.frozenToEnd);let o=[...t.filter(e=>!0!==(null==e?void 0:e.frozenToEnd)),...r.filter(e=>!0!==(null==e?void 0:e.frozenToEnd)),...e];t=Array.from((null==(t=null==(t=this.grid)?void 0:t.shadowRoot)?void 0:t.querySelectorAll("th"))||[]);if(t.length){let i=t.map((e,t)=>({id:t,flexPosition:Number(e.style.order)})).sort((e,t)=>e.flexPosition-t.flexPosition).map(e=>e.id);t=[];i.every((e,t)=>0===t||e>i[t-1])||(t=i.map(e=>o[e]),this.displayColumns=[...t.filter(e=>!0!==e.hidden&&!0!==(null==e?void 0:e.frozenToEnd)),...r.filter(e=>!0!==(null==e?void 0:e.frozenToEnd)),...e],this.isColumnsReordering=!0,await this.updateComplete,this.isColumnsReordering=!1,this.setColumnsToLocalStorage(this.displayColumns))}}async reorderColumnsFromFilter(e){this.displayColumns=[...e.detail.reorderedColumns],this.setColumnsToLocalStorage([...this.displayColumns]),this.isColumnsReordering=!0,await this.updateComplete,this.isColumnsReordering=!1}handleOnColumnFilter(e){e.detail.columns.forEach((e,t)=>{this.displayColumns[t]&&(this.displayColumns[t].hidden=null==e?void 0:e.hidden)}),this.displayColumns=[...this.displayColumns],this.updatePage(!1)}cellPartNameGenerator(e,t){let i="";return t.item.disabled&&(i+=" ix-disabled-cell"),i}renderColumns(){let t=[...this.arrangedColumns];return 0<t.length?html`${t.map((r,e)=>!0===r.hidden?nothing:html`<vaadin-grid-column ${columnHeaderRenderer(()=>this.renderColumnHeader(r,e,t.length),this.sortDirection)} .renderer="${(e,t,i)=>this.columnRenderer(r,e,t,i)}" resizable width="${ifDefined(r.width)}" ?hidden="${r.hidden}" ?frozen-to-end="${r.frozenToEnd}" path="${r.name}" ?auto-width="${r.autoWidth}" flex-grow="${ifDefined(r.flexGrow)}"></vaadin-grid-column>`)}`:html`<vaadin-grid-column></vaadin-grid-column>`}renderLoading(){return html`<div class="progress-container" style="display:${this.isLoading?"":"none"}"><ix-progress .indeterminate="${!0}"></ix-progress></div>`}renderGrid(){var e;return this.isColumnsReordering?nothing:(e=this.displayColumns.find(e=>!0!==e.hidden),0!==this.rows.length&&e?html`<vaadin-grid class="${this.hideColumnHeaders?"hide-column-headers":""}" .items="${0<this.rowLimit&&!this.isExpanded?this.rows.slice(0,this.rowLimit):this.rows}" all-rows-visible ?column-reordering-allowed="${this.columnReorderingAllowed}" theme="no-border" .cellPartNameGenerator="${this.cellPartNameGenerator}" @mouseup="${this.reorderColumnsFromTable}">${this.renderColumns()}</vaadin-grid>`:html`<slot name="no-rows"></slot>`)}render(){return html`<div class="${`grid-container ${this.isColumnsReordering?"columns-reordering":""} `+this.variantClass}">${this.hideHeader?nothing:this.renderHeader()} ${this.renderLoading()} ${this.renderGrid()} ${0<this.rowLimit?this.renderRowLimitControls():this.renderPaginationControls()}<slot name="footer"></slot></div>`}}IxGrid.styles=[IxGridViewStyles],__decorate([query("vaadin-grid")],IxGrid.prototype,"grid",void 0),__decorate([property({type:Boolean,attribute:"column-reordering-allowed"})],IxGrid.prototype,"columnReorderingAllowed",void 0),__decorate([property({type:String})],IxGrid.prototype,"variantClass",void 0),__decorate([property({type:Array})],IxGrid.prototype,"columns",void 0),__decorate([property({type:Array})],IxGrid.prototype,"rows",void 0),__decorate([property({type:String})],IxGrid.prototype,"defaultEmptyText",void 0),__decorate([property({type:String})],IxGrid.prototype,"sortedColumn",void 0),__decorate([property({type:String})],IxGrid.prototype,"sortDirection",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"hideHeader",void 0),__decorate([property({type:Boolean,attribute:"hide-filters"})],IxGrid.prototype,"hideFilters",void 0),__decorate([property({type:Number})],IxGrid.prototype,"rowLimit",void 0),__decorate([property({type:Number})],IxGrid.prototype,"page",void 0),__decorate([property({type:Number})],IxGrid.prototype,"pageSize",void 0),__decorate([property({type:Array})],IxGrid.prototype,"pageSizes",void 0),__decorate([property({type:Number})],IxGrid.prototype,"recordCount",void 0),__decorate([property({type:String})],IxGrid.prototype,"localStorageID",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"showDownload",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"isDownloading",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"isLoading",void 0),__decorate([property({type:Array})],IxGrid.prototype,"downloadMenuItems",void 0),__decorate([property({type:Boolean,attribute:"add-params-to-url"})],IxGrid.prototype,"addParamsToURL",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"readParamsFromURL",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"refreshDataOnColumnVisibilityChange",void 0),__decorate([property({type:Number})],IxGrid.prototype,"filterValueChangeDebounceTime",void 0),__decorate([property({type:Boolean})],IxGrid.prototype,"hideColumnHeaders",void 0),__decorate([state()],IxGrid.prototype,"filters",void 0),__decorate([state()],IxGrid.prototype,"isColumnsReordering",void 0),__decorate([state()],IxGrid.prototype,"isExpanded",void 0),__decorate([state()],IxGrid.prototype,"displayColumns",void 0),window.customElements.define("ix-grid",IxGrid);
package/dist/test/ix-grid.test.js CHANGED
@@ -219,7 +219,11 @@ describe('IxGrid', () => {
219
219
  });
220
220
  it('should reorder columns based on table header flex order', async () => {
221
221
  var _a;
222
- const el = await fixture(html `<ix-grid .columns=${columns} localStorageID="testGrid"></ix-grid>`);
222
+ const el = await fixture(html `<ix-grid
223
+ .columns=${columns}
224
+ .rows=${rows}
225
+ localStorageID="testGrid"
226
+ ></ix-grid>`);
223
227
  await el.updateComplete;
224
228
  const headerCells = (_a = el.grid.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('th');
225
229
  if (!headerCells || headerCells.length !== columns.length) {
package/dist/test/ix-grid.test.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ix-grid.test.js","sourceRoot":"","sources":["../../src/test/ix-grid.test.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-restricted-globals */\nimport { html } from 'lit';\nimport { fixture, expect } from '@open-wc/testing';\nimport { IxGrid } from '../IxGrid.js';\nimport '../ix-grid-no-rows.js';\nimport '../ix-grid.js';\nimport { IxGridRowFilter } from '../components/IxGridRowFilter.js';\n\nconst rows = [\n {\n name: 'one',\n },\n {\n name: 'two',\n },\n {\n name: 'three',\n },\n];\n\nconst columns = [\n {\n name: 'one',\n header: 'one',\n bodyRenderer: row => html` <span>${row.name}</span>`,\n filterable: true,\n filterOperators: ['equals'],\n },\n {\n name: 'two',\n header: 'one',\n bodyRenderer: row => html` <span>${row.name}</span>`,\n filterable: true,\n filterOperators: ['equals', 'contains'],\n },\n {\n name: 'three',\n header: 'one',\n bodyRenderer: row => html` <span>${row.name}</span>`,\n filterable: true,\n filterOperators: ['equals', 'contains'],\n },\n];\n\ndescribe('IxGrid', () => {\n it('renders a grid', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid></ix-grid>`);\n\n expect(el).to.not.be.null;\n });\n\n it('renders the correct number of rows', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n ></ix-grid>`);\n\n expect(rows.length).to.equal(3);\n\n expect(el).to.not.be.null;\n });\n\n it('renders no rows component state', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${[]}\n ><ix-grid-no-rows slot=\"no-rows\"></ix-grid-no-rows\n ></ix-grid>`);\n\n const noRows = el.shadowRoot?.querySelector('slot[name=\"no-rows\"]');\n expect(noRows).to.not.be.null;\n });\n\n it('renders an ix-grid-row-filter', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n .filterValueChangeDebounceTime=${1000}\n ></ix-grid>`);\n\n const rowFilter = el.shadowRoot?.querySelector('ix-grid-row-filter');\n expect(rowFilter).to.be.instanceOf(IxGridRowFilter);\n expect((<IxGridRowFilter>rowFilter).filterValueChangeDebounceTime).to.equal(\n 1000\n );\n });\n\n it('resets pagination upon filter change', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n ></ix-grid>`);\n\n const pagination = el.shadowRoot?.querySelector('ix-pagination');\n pagination!.dispatchEvent(\n new CustomEvent('updatePagination', {\n detail: {\n page: 2,\n pageSize: 10,\n },\n bubbles: true,\n composed: true,\n })\n );\n expect(el.page).to.equal(2);\n\n const rowFilter = el.shadowRoot?.querySelector('ix-grid-row-filter');\n rowFilter!.dispatchEvent(\n new CustomEvent('rowFilter', {\n detail: {\n resetPage: true,\n },\n bubbles: true,\n composed: true,\n })\n );\n expect(el.page).to.equal(1);\n });\n\n it('should read and set sort, order, page and page size from URL if readParamsFromURL is set to true', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n .readParamsFromURL=${true}\n ></ix-grid>`);\n\n const url = '?sort=lastName&order=asc&page=2&size=5';\n\n history.pushState(null, '', `${location.pathname}${url}`);\n el.firstUpdated();\n\n expect(el.page).to.be.eq(2);\n expect(el.pageSize).to.be.eq(5);\n expect(el.sortedColumn).to.be.eq('lastName');\n expect(el.sortDirection).to.be.eq('asc');\n });\n\n it('should set sort, order, page, page size and filters in the URL when addParamsToURL is set to true', async () => {\n const columnsWithFilters = [\n {\n name: 'firstName',\n header: 'First name',\n filterable: true,\n dataType: 'string',\n filterOperators: ['contains', 'equals'],\n },\n {\n name: 'lastName',\n header: 'Last Name',\n filterable: true,\n dataType: 'string',\n filterOperators: ['equals'],\n },\n {\n name: 'createdDate',\n header: 'Created Date',\n filterable: true,\n dataType: 'dateTime',\n filterOperators: ['equals'],\n },\n ];\n\n const existingSearchParams = '?realUsername=Earl&userAge=30';\n history.pushState(null, '', `${location.pathname}${existingSearchParams}`);\n\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columnsWithFilters}\n .addParamsToURL=${true}\n ></ix-grid>`);\n\n const rowFilter = el.shadowRoot?.querySelector('ix-grid-row-filter');\n rowFilter!.dispatchEvent(\n new CustomEvent('rowFilter', {\n detail: {\n filters: [\n {\n columnField: 'firstName',\n operatorValue: 'contains',\n value: 'test',\n },\n {\n columnField: 'createdDate',\n operatorValue: 'equals',\n value: '2024-10-10',\n },\n ],\n },\n bubbles: true,\n composed: true,\n })\n );\n\n el.sortedColumn = 'firstName';\n el.sortDirection = 'desc';\n\n const pagination = el.shadowRoot?.querySelector('ix-pagination');\n pagination!.dispatchEvent(\n new CustomEvent('updatePagination', {\n detail: {\n page: 3,\n pageSize: 5,\n },\n bubbles: true,\n composed: true,\n })\n );\n\n expect(location.search).to.be.eq(\n `${existingSearchParams}&sort=firstName&order=desc&page=3&size=5&firstName_contains=test&createdDate_equals=2024-10-10`\n );\n });\n\n describe('IxGrid LocalStorage Persistence', () => {\n beforeEach(() => {\n localStorage.clear();\n });\n\n it('should reset localStorage value if columns length does not match', async () => {\n const tempEl = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n const localStorageKey = tempEl.columnsLocalStorageKey;\n\n // Simulating a user fully deleting and adding a fake column to their local storage\n localStorage.setItem(\n localStorageKey,\n JSON.stringify([{ name: 'six', header: 'six' }])\n );\n\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n expect(storedColumns.length).to.equal(columns.length);\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n columns.map(c => c.name)\n );\n });\n\n it('should reset localStorage value if it contains a column that does not exist in the provided columns', async () => {\n const tempEl = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n const localStorageKey = tempEl.columnsLocalStorageKey;\n\n // Simulating a user adding an additional column to local storage\n localStorage.setItem(\n localStorageKey,\n JSON.stringify([\n ...columns,\n { name: 'nonexistent', header: 'Nonexistent' },\n ])\n );\n\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n expect(storedColumns.length).to.equal(columns.length);\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n columns.map(c => c.name)\n );\n });\n\n it('should delete localStorage if a provided column does not exist in localStorage and not create new local storage', async () => {\n const initialColumns = columns.slice(0, -1);\n\n const tempEl = await fixture<IxGrid>(\n html`<ix-grid\n .columns=${initialColumns}\n localStorageID=\"testGrid\"\n ></ix-grid>`\n );\n const localStorageKey = tempEl.columnsLocalStorageKey;\n\n // Simulating a user deleting most columns from local storage\n localStorage.setItem(localStorageKey, JSON.stringify(initialColumns));\n\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n expect(localStorage.getItem(el.columnsLocalStorageKey)).to.equal(null);\n });\n\n it('should reorder columns based on table header flex order', async () => {\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n const headerCells = el.grid.shadowRoot?.querySelectorAll('th');\n if (!headerCells || headerCells.length !== columns.length) {\n throw new Error(\n 'Table headers not found or do not match expected count'\n );\n }\n\n const orderMap = [2, 0, 1];\n headerCells.forEach((th, index) => {\n const thElement = th as HTMLElement;\n thElement.style.order = orderMap[index].toString();\n });\n\n await el.updateComplete;\n await el.reorderColumnsFromTable();\n\n const reorderedColumns = [columns[1], columns[2], columns[0]];\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n reorderedColumns.map(c => c.name)\n );\n });\n\n it('should reorder columns when a filter reorder event is triggered', async () => {\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n const reorderedColumns = [columns[2], columns[0], columns[1]];\n const event = new CustomEvent('columnFilter', {\n detail: { reorderedColumns },\n bubbles: true,\n composed: true,\n });\n\n el.reorderColumnsFromFilter(event);\n await el.updateComplete;\n\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n expect(el.displayColumns.map(c => c.name)).to.deep.equal(\n reorderedColumns.map(c => c.name)\n );\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n reorderedColumns.map(c => c.name)\n );\n });\n });\n});\n"]}
1
+ {"version":3,"file":"ix-grid.test.js","sourceRoot":"","sources":["../../src/test/ix-grid.test.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable no-restricted-globals */\nimport { html } from 'lit';\nimport { fixture, expect } from '@open-wc/testing';\nimport { IxGrid } from '../IxGrid.js';\nimport '../ix-grid-no-rows.js';\nimport '../ix-grid.js';\nimport { IxGridRowFilter } from '../components/IxGridRowFilter.js';\n\nconst rows = [\n {\n name: 'one',\n },\n {\n name: 'two',\n },\n {\n name: 'three',\n },\n];\n\nconst columns = [\n {\n name: 'one',\n header: 'one',\n bodyRenderer: row => html` <span>${row.name}</span>`,\n filterable: true,\n filterOperators: ['equals'],\n },\n {\n name: 'two',\n header: 'one',\n bodyRenderer: row => html` <span>${row.name}</span>`,\n filterable: true,\n filterOperators: ['equals', 'contains'],\n },\n {\n name: 'three',\n header: 'one',\n bodyRenderer: row => html` <span>${row.name}</span>`,\n filterable: true,\n filterOperators: ['equals', 'contains'],\n },\n];\n\ndescribe('IxGrid', () => {\n it('renders a grid', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid></ix-grid>`);\n\n expect(el).to.not.be.null;\n });\n\n it('renders the correct number of rows', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n ></ix-grid>`);\n\n expect(rows.length).to.equal(3);\n\n expect(el).to.not.be.null;\n });\n\n it('renders no rows component state', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${[]}\n ><ix-grid-no-rows slot=\"no-rows\"></ix-grid-no-rows\n ></ix-grid>`);\n\n const noRows = el.shadowRoot?.querySelector('slot[name=\"no-rows\"]');\n expect(noRows).to.not.be.null;\n });\n\n it('renders an ix-grid-row-filter', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n .filterValueChangeDebounceTime=${1000}\n ></ix-grid>`);\n\n const rowFilter = el.shadowRoot?.querySelector('ix-grid-row-filter');\n expect(rowFilter).to.be.instanceOf(IxGridRowFilter);\n expect((<IxGridRowFilter>rowFilter).filterValueChangeDebounceTime).to.equal(\n 1000\n );\n });\n\n it('resets pagination upon filter change', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n ></ix-grid>`);\n\n const pagination = el.shadowRoot?.querySelector('ix-pagination');\n pagination!.dispatchEvent(\n new CustomEvent('updatePagination', {\n detail: {\n page: 2,\n pageSize: 10,\n },\n bubbles: true,\n composed: true,\n })\n );\n expect(el.page).to.equal(2);\n\n const rowFilter = el.shadowRoot?.querySelector('ix-grid-row-filter');\n rowFilter!.dispatchEvent(\n new CustomEvent('rowFilter', {\n detail: {\n resetPage: true,\n },\n bubbles: true,\n composed: true,\n })\n );\n expect(el.page).to.equal(1);\n });\n\n it('should read and set sort, order, page and page size from URL if readParamsFromURL is set to true', async () => {\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n .readParamsFromURL=${true}\n ></ix-grid>`);\n\n const url = '?sort=lastName&order=asc&page=2&size=5';\n\n history.pushState(null, '', `${location.pathname}${url}`);\n el.firstUpdated();\n\n expect(el.page).to.be.eq(2);\n expect(el.pageSize).to.be.eq(5);\n expect(el.sortedColumn).to.be.eq('lastName');\n expect(el.sortDirection).to.be.eq('asc');\n });\n\n it('should set sort, order, page, page size and filters in the URL when addParamsToURL is set to true', async () => {\n const columnsWithFilters = [\n {\n name: 'firstName',\n header: 'First name',\n filterable: true,\n dataType: 'string',\n filterOperators: ['contains', 'equals'],\n },\n {\n name: 'lastName',\n header: 'Last Name',\n filterable: true,\n dataType: 'string',\n filterOperators: ['equals'],\n },\n {\n name: 'createdDate',\n header: 'Created Date',\n filterable: true,\n dataType: 'dateTime',\n filterOperators: ['equals'],\n },\n ];\n\n const existingSearchParams = '?realUsername=Earl&userAge=30';\n history.pushState(null, '', `${location.pathname}${existingSearchParams}`);\n\n const el = await fixture<IxGrid>(html`<ix-grid\n .columns=${columnsWithFilters}\n .addParamsToURL=${true}\n ></ix-grid>`);\n\n const rowFilter = el.shadowRoot?.querySelector('ix-grid-row-filter');\n rowFilter!.dispatchEvent(\n new CustomEvent('rowFilter', {\n detail: {\n filters: [\n {\n columnField: 'firstName',\n operatorValue: 'contains',\n value: 'test',\n },\n {\n columnField: 'createdDate',\n operatorValue: 'equals',\n value: '2024-10-10',\n },\n ],\n },\n bubbles: true,\n composed: true,\n })\n );\n\n el.sortedColumn = 'firstName';\n el.sortDirection = 'desc';\n\n const pagination = el.shadowRoot?.querySelector('ix-pagination');\n pagination!.dispatchEvent(\n new CustomEvent('updatePagination', {\n detail: {\n page: 3,\n pageSize: 5,\n },\n bubbles: true,\n composed: true,\n })\n );\n\n expect(location.search).to.be.eq(\n `${existingSearchParams}&sort=firstName&order=desc&page=3&size=5&firstName_contains=test&createdDate_equals=2024-10-10`\n );\n });\n\n describe('IxGrid LocalStorage Persistence', () => {\n beforeEach(() => {\n localStorage.clear();\n });\n\n it('should reset localStorage value if columns length does not match', async () => {\n const tempEl = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n const localStorageKey = tempEl.columnsLocalStorageKey;\n\n // Simulating a user fully deleting and adding a fake column to their local storage\n localStorage.setItem(\n localStorageKey,\n JSON.stringify([{ name: 'six', header: 'six' }])\n );\n\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n expect(storedColumns.length).to.equal(columns.length);\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n columns.map(c => c.name)\n );\n });\n\n it('should reset localStorage value if it contains a column that does not exist in the provided columns', async () => {\n const tempEl = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n const localStorageKey = tempEl.columnsLocalStorageKey;\n\n // Simulating a user adding an additional column to local storage\n localStorage.setItem(\n localStorageKey,\n JSON.stringify([\n ...columns,\n { name: 'nonexistent', header: 'Nonexistent' },\n ])\n );\n\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n expect(storedColumns.length).to.equal(columns.length);\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n columns.map(c => c.name)\n );\n });\n\n it('should delete localStorage if a provided column does not exist in localStorage and not create new local storage', async () => {\n const initialColumns = columns.slice(0, -1);\n\n const tempEl = await fixture<IxGrid>(\n html`<ix-grid\n .columns=${initialColumns}\n localStorageID=\"testGrid\"\n ></ix-grid>`\n );\n const localStorageKey = tempEl.columnsLocalStorageKey;\n\n // Simulating a user deleting most columns from local storage\n localStorage.setItem(localStorageKey, JSON.stringify(initialColumns));\n\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n expect(localStorage.getItem(el.columnsLocalStorageKey)).to.equal(null);\n });\n\n it('should reorder columns based on table header flex order', async () => {\n const el = await fixture<IxGrid>(\n html`<ix-grid\n .columns=${columns}\n .rows=${rows}\n localStorageID=\"testGrid\"\n ></ix-grid>`\n );\n await el.updateComplete;\n\n const headerCells = el.grid.shadowRoot?.querySelectorAll('th');\n if (!headerCells || headerCells.length !== columns.length) {\n throw new Error(\n 'Table headers not found or do not match expected count'\n );\n }\n\n const orderMap = [2, 0, 1];\n headerCells.forEach((th, index) => {\n const thElement = th as HTMLElement;\n thElement.style.order = orderMap[index].toString();\n });\n\n await el.updateComplete;\n await el.reorderColumnsFromTable();\n\n const reorderedColumns = [columns[1], columns[2], columns[0]];\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n reorderedColumns.map(c => c.name)\n );\n });\n\n it('should reorder columns when a filter reorder event is triggered', async () => {\n const el = await fixture<IxGrid>(\n html`<ix-grid .columns=${columns} localStorageID=\"testGrid\"></ix-grid>`\n );\n await el.updateComplete;\n\n const reorderedColumns = [columns[2], columns[0], columns[1]];\n const event = new CustomEvent('columnFilter', {\n detail: { reorderedColumns },\n bubbles: true,\n composed: true,\n });\n\n el.reorderColumnsFromFilter(event);\n await el.updateComplete;\n\n const storedColumns = JSON.parse(\n localStorage.getItem(el.columnsLocalStorageKey) || '[]'\n );\n expect(el.displayColumns.map(c => c.name)).to.deep.equal(\n reorderedColumns.map(c => c.name)\n );\n expect(storedColumns.map(c => c.name)).to.deep.equal(\n reorderedColumns.map(c => c.name)\n );\n });\n });\n});\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "Webcomponent ix-grid following open-wc recommendations",
4
4
  "license": "MIT",
5
5
  "author": "Digital Realty",
6
- "version": "1.2.6",
6
+ "version": "1.2.7",
7
7
  "type": "module",
8
8
  "main": "dist/index.js",
9
9
  "module": "dist/index.js",
@@ -111,5 +111,5 @@
111
111
  "prettier --write"
112
112
  ]
113
113
  },
114
- "gitHead": "e9bc0871e614aa8fecc33e39269e3370074cb1b6"
114
+ "gitHead": "93bc03f9cc5f88fa567d500e580403c74a989409"
115
115
  }
package/src/IxGrid.ts CHANGED
@@ -516,6 +516,7 @@ export class IxGrid extends LitElement {
516
516
  if (!this.displayColumns[id]) return;
517
517
  this.displayColumns[id].hidden = column?.hidden;
518
518
  });
519
+ this.displayColumns = [...this.displayColumns];
519
520
  this.updatePage(false);
520
521
  }
521
522
 
@@ -674,6 +675,34 @@ export class IxGrid extends LitElement {
674
675
  </div>`;
675
676
  }
676
677
 
678
+ renderGrid() {
679
+ if (this.isColumnsReordering) {
680
+ return nothing;
681
+ }
682
+
683
+ const columnDisplayed = this.displayColumns.find(
684
+ (column: Column) => column.hidden !== true
685
+ );
686
+
687
+ if (this.rows.length === 0 || !columnDisplayed) {
688
+ return html`<slot name="no-rows"></slot>`;
689
+ }
690
+
691
+ return html`<vaadin-grid
692
+ class=${this.hideColumnHeaders ? 'hide-column-headers' : ''}
693
+ .items=${this.rowLimit > 0 && !this.isExpanded
694
+ ? this.rows.slice(0, this.rowLimit)
695
+ : this.rows}
696
+ all-rows-visible
697
+ ?column-reordering-allowed=${this.columnReorderingAllowed}
698
+ theme="no-border"
699
+ .cellPartNameGenerator=${this.cellPartNameGenerator}
700
+ @mouseup=${this.reorderColumnsFromTable}
701
+ >
702
+ ${this.renderColumns()}
703
+ </vaadin-grid>`;
704
+ }
705
+
677
706
  render() {
678
707
  return html`
679
708
  <div
@@ -682,25 +711,7 @@ export class IxGrid extends LitElement {
682
711
  } ${this.variantClass}`}
683
712
  >
684
713
  ${this.hideHeader ? nothing : this.renderHeader()}
685
- ${this.renderLoading()}
686
- ${!this.isColumnsReordering
687
- ? html`<vaadin-grid
688
- class=${this.hideColumnHeaders ? 'hide-column-headers' : ''}
689
- .items=${this.rowLimit > 0 && !this.isExpanded
690
- ? this.rows.slice(0, this.rowLimit)
691
- : this.rows}
692
- all-rows-visible
693
- ?column-reordering-allowed=${this.columnReorderingAllowed}
694
- theme="no-border"
695
- .cellPartNameGenerator=${this.cellPartNameGenerator}
696
- @mouseup=${this.reorderColumnsFromTable}
697
- >
698
- ${this.renderColumns()}
699
- </vaadin-grid>
700
- ${this.rows.length === 0 && !this.isColumnsReordering
701
- ? html`<slot name="no-rows"></slot>`
702
- : nothing}`
703
- : nothing}
714
+ ${this.renderLoading()} ${this.renderGrid()}
704
715
  ${this.rowLimit > 0
705
716
  ? this.renderRowLimitControls()
706
717
  : this.renderPaginationControls()}
package/src/components/IxGridColumnFilter.ts CHANGED
@@ -141,8 +141,7 @@ export class IxGridColumnFilter extends LitElement {
141
141
  );
142
142
  }
143
143
 
144
- if (this.refreshDataOnColumnVisibilityChange) this.dispatchUpdate();
145
- else this.requestGridUpdate();
144
+ this.dispatchUpdate();
146
145
  }
147
146
 
148
147
  dispatchUpdate(columns = this.columns) {
@@ -255,7 +254,7 @@ export class IxGridColumnFilter extends LitElement {
255
254
  class=${`ix-switch-label drag-target ${
256
255
  this.dragEvent.startId === id ? 'dragOrigin' : ''
257
256
  }`}
258
- draggable="true"
257
+ draggable=${this.columnReorderingAllowed}
259
258
  data-id=${id}
260
259
  >
261
260
  <ix-switch
@@ -264,7 +263,9 @@ export class IxGridColumnFilter extends LitElement {
264
263
  >
265
264
  </ix-switch>
266
265
  <p>${col.header}</p>
267
- <div class="draggable">${handleIcon}</ix-div>
266
+ ${this.columnReorderingAllowed
267
+ ? html`<div class="draggable">${handleIcon}</div>`
268
+ : nothing}
268
269
  </label>
269
270
  </div>`
270
271
  )}
package/src/components/IxGridNoRows.ts CHANGED
@@ -10,7 +10,7 @@ export class IxGridNoRows extends LitElement {
10
10
  align-items: center;
11
11
  flex-direction: column;
12
12
  text-align: center;
13
- padding: 3.125rem 0;
13
+ padding: 4.125rem 0 1.125rem 0;
14
14
  }
15
15
  .icon {
16
16
  user-select: none;
package/src/components/grid-column-filter-styles.ts CHANGED
@@ -6,7 +6,7 @@ export const IxGridColumnFilterStyles = css`
6
6
  background-color: var(--clr-surface-container-lowest, #fff);
7
7
  min-width: 160px;
8
8
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
9
- z-index: 1;
9
+ z-index: 9;
10
10
  -webkit-box-align: center;
11
11
  align-items: center;
12
12
  cursor: pointer;
package/src/grid-view-styles.ts CHANGED
@@ -182,6 +182,11 @@ export const IxGridViewStyles = css`
182
182
  --_cell-padding: var(--ix-grid-cell-padding, 14px 10px);
183
183
  }
184
184
 
185
+ vaadin-grid-cell-content > div {
186
+ overflow: hidden;
187
+ text-overflow: ellipsis;
188
+ }
189
+
185
190
  .row-controls {
186
191
  border-top: solid 1px var(--clr-border-outline, #0922411f);
187
192
  }
package/src/test/ix-grid.test.ts CHANGED
@@ -294,7 +294,11 @@ describe('IxGrid', () => {
294
294
 
295
295
  it('should reorder columns based on table header flex order', async () => {
296
296
  const el = await fixture<IxGrid>(
297
- html`<ix-grid .columns=${columns} localStorageID="testGrid"></ix-grid>`
297
+ html`<ix-grid
298
+ .columns=${columns}
299
+ .rows=${rows}
300
+ localStorageID="testGrid"
301
+ ></ix-grid>`
298
302
  );
299
303
  await el.updateComplete;
300
304