@3mo/data-grid 0.9.6 → 0.9.8-preview.0

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 (30) hide show
  1. package/dist/CsvGenerator.d.ts.map +1 -1
  2. package/dist/CsvGenerator.js +10 -1
  3. package/dist/DataGridColumn.d.ts +1 -0
  4. package/dist/DataGridColumn.d.ts.map +1 -1
  5. package/dist/DataGridColumn.js +3 -0
  6. package/dist/DataGridContextMenuController.d.ts.map +1 -1
  7. package/dist/DataGridContextMenuController.js +2 -1
  8. package/dist/DataGridFooter.d.ts.map +1 -1
  9. package/dist/DataGridFooter.js +13 -7
  10. package/dist/columns/DataGridColumnBoolean.d.ts +1 -0
  11. package/dist/columns/DataGridColumnBoolean.d.ts.map +1 -1
  12. package/dist/columns/DataGridColumnBoolean.js +3 -0
  13. package/dist/columns/DataGridColumnComponent.d.ts +1 -0
  14. package/dist/columns/DataGridColumnComponent.d.ts.map +1 -1
  15. package/dist/columns/DataGridColumnComponent.js +5 -0
  16. package/dist/columns/date-time/DataGridColumnDate.d.ts +1 -0
  17. package/dist/columns/date-time/DataGridColumnDate.d.ts.map +1 -1
  18. package/dist/columns/date-time/DataGridColumnDate.js +4 -0
  19. package/dist/columns/date-time/DataGridColumnDateTime.d.ts +1 -0
  20. package/dist/columns/date-time/DataGridColumnDateTime.d.ts.map +1 -1
  21. package/dist/columns/date-time/DataGridColumnDateTime.js +12 -0
  22. package/dist/columns/number/DataGridColumnCurrency.d.ts +1 -0
  23. package/dist/columns/number/DataGridColumnCurrency.d.ts.map +1 -1
  24. package/dist/columns/number/DataGridColumnCurrency.js +9 -0
  25. package/dist/columns/number/DataGridColumnPercent.d.ts +1 -0
  26. package/dist/columns/number/DataGridColumnPercent.d.ts.map +1 -1
  27. package/dist/columns/number/DataGridColumnPercent.js +10 -0
  28. package/dist/custom-elements.json +7 -4647
  29. package/dist/tsconfig.tsbuildinfo +1 -1
  30. package/package.json +1 -1
package/dist/CsvGenerator.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"CsvGenerator.d.ts","sourceRoot":"","sources":["../CsvGenerator.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAE7C,qBAAa,YAAY;IACxB,MAAM,CAAC,QAAQ,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC;CA0BrD"}
1
+ {"version":3,"file":"CsvGenerator.d.ts","sourceRoot":"","sources":["../CsvGenerator.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAE7C,qBAAa,YAAY;IACxB,MAAM,CAAC,QAAQ,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC;CAqCrD"}
package/dist/CsvGenerator.js CHANGED
@@ -9,7 +9,16 @@ export class CsvGenerator {
9
9
  ...flattenedData.map(d => {
10
10
  const nestedPadding = Array.from({ length: d.level }).fill('');
11
11
  const childrenPadding = Array.from({ length: maxLevel - d.level }).fill('');
12
- const [first, ...rest] = dataGrid.visibleColumns.flatMap(column => getValueByKeyPath(d.data, column.dataSelector));
12
+ const [first, ...rest] = dataGrid.visibleColumns.flatMap(column => {
13
+ let value = String(column.format(d.data));
14
+ if (value.includes(',')) {
15
+ if (value.includes('"')) {
16
+ value = value.replaceAll('"', '""');
17
+ }
18
+ value = `"${value}"`;
19
+ }
20
+ return value;
21
+ });
13
22
  return [
14
23
  ...nestedPadding,
15
24
  first,
package/dist/DataGridColumn.d.ts CHANGED
@@ -32,5 +32,6 @@ export declare class DataGridColumn<TData, TValue = unknown> {
32
32
  get sortingDefinition(): import("./DataGridSortingController.js").DataGridRankedSortDefinition<TData> | undefined;
33
33
  get sumTemplate(): HTMLTemplateResult | undefined;
34
34
  get stickyColumnInsetInline(): string;
35
+ format: (data: TData) => string;
35
36
  }
36
37
  //# sourceMappingURL=DataGridColumn.d.ts.map
package/dist/DataGridColumn.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridColumn.d.ts","sourceRoot":"","sources":["../DataGridColumn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAChE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAC1C,OAAO,KAAK,KAAK,GAAG,MAAM,SAAS,CAAA;AAEnC,MAAM,MAAM,uBAAuB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;AAEhE,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,MAAM,GAAG,KAAK,CAAA;AAE3D,qBAAa,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAClD,QAAQ,CAAC,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA;IAC/B,YAAY,EAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAE/B,OAAO,EAAG,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IAGpB,KAAK,EAAE,GAAG,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,MAAM,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,CAAgB;IAEnE,SAAS,EAAE,uBAAuB,CAAU;IAC5C,MAAM,UAAQ;IAEd,QAAQ,UAAO;IAEf,MAAM,CAAC,EAAE,oBAAoB,CAAA;IAE7B,OAAO,CAAC,iBAAiB,CAAC,CAAkB;IAC5C,IAAI,gBAAgB,+/CAAyD;IAC7E,IAAI,gBAAgB,CAAC,KAAK,4/CAAA,EAAoC;IAE9D,kBAAkB,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IAEnE,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAQ;IAC5C,sBAAsB,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IAEvE,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,CAAC,GAAG,EAAE,MAAM,GAAG,kBAAkB;gBAEpC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAI1D,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,OAAO;IAMlD,OAAO,CAAC,cAAc,CAAC,CAAQ;IAC/B,IAAI,aAAa,WAAsC;IACvD,IAAI,aAAa,CAAC,KAAK,QAAA,EAGtB;IAED,OAAO,CAAC,aAAa,CAAQ;IAC7B,IAAI,YAAY,YAAgC;IAChD,IAAI,YAAY,CAAC,KAAK,SAAA,EAGrB;IAED,IAAI,iBAAiB,6FAIpB;IAED,IAAI,WAAW,mCAkBd;IAED,IAAI,uBAAuB,WA2B1B;CACD"}
1
+ {"version":3,"file":"DataGridColumn.d.ts","sourceRoot":"","sources":["../DataGridColumn.ts"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AAChE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAC1C,OAAO,KAAK,KAAK,GAAG,MAAM,SAAS,CAAA;AAEnC,MAAM,MAAM,uBAAuB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;AAEhE,MAAM,MAAM,oBAAoB,GAAG,OAAO,GAAG,MAAM,GAAG,KAAK,CAAA;AAE3D,qBAAa,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAClD,QAAQ,CAAC,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA;IAC/B,YAAY,EAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAE/B,OAAO,EAAG,MAAM,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IAGpB,KAAK,EAAE,GAAG,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,MAAM,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,CAAgB;IAEnE,SAAS,EAAE,uBAAuB,CAAU;IAC5C,MAAM,UAAQ;IAEd,QAAQ,UAAO;IAEf,MAAM,CAAC,EAAE,oBAAoB,CAAA;IAE7B,OAAO,CAAC,iBAAiB,CAAC,CAAkB;IAC5C,IAAI,gBAAgB,+/CAAyD;IAC7E,IAAI,gBAAgB,CAAC,KAAK,4/CAAA,EAAoC;IAE9D,kBAAkB,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IAEnE,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAQ;IAC5C,sBAAsB,CAAC,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IAEvE,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,cAAc,CAAC,CAAC,GAAG,EAAE,MAAM,GAAG,kBAAkB;gBAEpC,MAAM,EAAE,OAAO,CAAC,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;IAI1D,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,OAAO;IAMlD,OAAO,CAAC,cAAc,CAAC,CAAQ;IAC/B,IAAI,aAAa,WAAsC;IACvD,IAAI,aAAa,CAAC,KAAK,QAAA,EAGtB;IAED,OAAO,CAAC,aAAa,CAAQ;IAC7B,IAAI,YAAY,YAAgC;IAChD,IAAI,YAAY,CAAC,KAAK,SAAA,EAGrB;IAED,IAAI,iBAAiB,6FAIpB;IAED,IAAI,WAAW,mCAkBd;IAED,IAAI,uBAAuB,WA2B1B;IAED,MAAM,SAAU,KAAK,KAAG,MAAM,CAE7B;CACD"}
package/dist/DataGridColumn.js CHANGED
@@ -10,6 +10,9 @@ export class DataGridColumn {
10
10
  this.sortable = true;
11
11
  this.editable = false;
12
12
  this._intersecting = false;
13
+ this.format = (data) => {
14
+ return String(getValueByKeyPath(data, this.dataSelector));
15
+ };
13
16
  Object.assign(this, column);
14
17
  }
15
18
  equals(other) {
package/dist/DataGridContextMenuController.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridContextMenuController.d.ts","sourceRoot":"","sources":["../DataGridContextMenuController.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAe,MAAM,WAAW,CAAA;AAEnD,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAA;AAM1C,qBAAa,6BAA6B,CAAC,KAAK,CAAE,SAAQ,UAAU;aAoBrC,IAAI,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC;IAnBxD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAKhC;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAUrC;gBAE6B,IAAI,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC;IAIxD,IAAI,cAAc,YAEjB;IAED,sBAAsB,CAAC,IAAI,UAAyB;CAYpD"}
1
+ {"version":3,"file":"DataGridContextMenuController.d.ts","sourceRoot":"","sources":["../DataGridContextMenuController.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAe,MAAM,WAAW,CAAA;AAEnD,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAA;AAM1C,qBAAa,6BAA6B,CAAC,KAAK,CAAE,SAAQ,UAAU;aAqBrC,IAAI,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC;IApBxD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAKhC;IAED,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAWrC;gBAE6B,IAAI,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC;IAIxD,IAAI,cAAc,YAEjB;IAED,sBAAsB,CAAC,IAAI,UAAyB;CAYpD"}
package/dist/DataGridContextMenuController.js CHANGED
@@ -25,7 +25,7 @@ export class DataGridContextMenuController extends Controller {
25
25
  }
26
26
  }
27
27
  DataGridContextMenuController.infoStyle = {
28
- padding: '12px 8px',
28
+ padding: '10px 16px',
29
29
  color: 'var(--mo-color-gray)',
30
30
  pointerEvents: 'none',
31
31
  fontSize: 'small',
@@ -39,5 +39,6 @@ DataGridContextMenuController.infoCountStyle = {
39
39
  color: 'var(--mo-color-on-accent)',
40
40
  background: 'var(--mo-color-accent)',
41
41
  padding: '2px 4px',
42
+ marginInlineEnd: '4px',
42
43
  borderRadius: '100px',
43
44
  };
package/dist/DataGridFooter.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridFooter.d.ts","sourceRoot":"","sources":["../DataGridFooter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,SAAS,EAAkC,MAAM,WAAW,CAAA;AAI1F,OAAO,EAAE,KAAK,QAAQ,EAA2B,MAAM,YAAY,CAAA;AAcnE;;;;GAIG;AACH,qBACa,cAAc,CAAC,KAAK,CAAE,SAAQ,SAAS;IACnD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAAoE;IAEzE,QAAQ,EAAG,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA;IAE/B,IAAI,SAAI;IAWjC,OAAO,CAAC,gBAAgB,CAAQ;IAET,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAc;IAExE,WAAoB,MAAM,kCAiEzB;IAED,cAAuB,QAAQ,0CAe9B;IAED,OAAO,KAAK,kBAAkB,GA0C7B;IAED,OAAO,KAAK,sBAAsB,GAuBjC;IAED,OAAO,CAAC,sBAAsB;IAO9B,OAAO,CAAC,sBAAsB;IAS9B,OAAO,KAAK,cAAc,GAwBzB;IAED,OAAO,CAAC,OAAO;CAaf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;KAC9C;CACD"}
1
+ {"version":3,"file":"DataGridFooter.d.ts","sourceRoot":"","sources":["../DataGridFooter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,SAAS,EAAkC,MAAM,WAAW,CAAA;AAI1F,OAAO,EAAE,KAAK,QAAQ,EAA2B,MAAM,YAAY,CAAA;AAcnE;;;;GAIG;AACH,qBACa,cAAc,CAAC,KAAK,CAAE,SAAQ,SAAS;IACnD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,SAAS,CAAoE;IAEzE,QAAQ,EAAG,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA;IAE/B,IAAI,SAAI;IAWjC,OAAO,CAAC,gBAAgB,CAAQ;IAET,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAc;IAExE,WAAoB,MAAM,kCAiEzB;IAED,cAAuB,QAAQ,0CAe9B;IAED,OAAO,KAAK,kBAAkB,GA0C7B;IAED,OAAO,KAAK,sBAAsB,GA6BjC;IAED,OAAO,CAAC,sBAAsB;IAO9B,OAAO,CAAC,sBAAsB;IAS9B,OAAO,KAAK,cAAc,GAwBzB;IAED,OAAO,CAAC,OAAO;CAaf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,qBAAqB,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;KAC9C;CACD"}
package/dist/DataGridFooter.js CHANGED
@@ -111,7 +111,7 @@ let DataGridFooter = DataGridFooter_1 = class DataGridFooter extends Component {
111
111
  const hasUnknownDataLength = this.dataGrid.maxPage === undefined;
112
112
  const pageText = hasUnknownDataLength ? this.page : t('${page:number} of ${maxPage:number}', { page: this.page, maxPage: this.dataGrid.maxPage ?? 0 });
113
113
  return !this.dataGrid.hasPagination ? html.nothing : html `
114
- <mo-flex direction='horizontal' alignItems='center' gap='2vw'>
114
+ <mo-flex direction='horizontal' alignItems='center' gap='3vw'>
115
115
  <mo-flex direction='horizontal' gap='4px' alignItems='center' justifyContent='center'>
116
116
  <mo-icon-button dense icon=${isRtl ? 'last_page' : 'first_page'}
117
117
  ?disabled=${this.page === 1}
@@ -156,12 +156,18 @@ let DataGridFooter = DataGridFooter_1 = class DataGridFooter extends Component {
156
156
  const dataLengthText = this.dataGrid.maxPage === undefined ? undefined : this.dataGrid.dataLength.format();
157
157
  return html `
158
158
  <mo-popover-container id='page-info' placement='block-start' fixed>
159
- ${this.dataGrid.selectedData.length ? html `
160
- <span id='selected-length'>${this.dataGrid.selectedData.length.format()}</span>
161
- ` : html `
162
- <span id='range' tabindex='0'>${rangeText}</span>
163
- `}
164
- <span id='length'>${dataLengthText}</span>
159
+ <mo-flex alignItems='center' gap='6px' direction='horizontal' style='cursor: pointer'>
160
+ <mo-flex direction='horizontal' alignItems='center'>
161
+ ${this.dataGrid.selectedData.length ? html `
162
+ <span id='selected-length'>${this.dataGrid.selectedData.length.format()}</span>
163
+ ` : html `
164
+ <span id='range' tabindex='0'>${rangeText}</span>
165
+ `}
166
+ <span id='length'>${dataLengthText}</span>
167
+ </mo-flex>
168
+
169
+ <mo-icon icon='keyboard_arrow_up' style='font-size: 20px'></mo-icon>
170
+ </mo-flex>
165
171
  <mo-menu slot='popover'>
166
172
  ${!this.dataGrid?.supportsDynamicPageSize ? html.nothing : html `
167
173
  <mo-menu-item icon='done' ?selected=${this.dataGrid.pagination === 'auto'} value='auto' @click=${() => this.handlePaginationChange('auto')}>${t('Auto')}</mo-menu-item>
package/dist/columns/DataGridColumnBoolean.d.ts CHANGED
@@ -15,6 +15,7 @@ export declare class DataGridColumnBoolean<TData> extends DataGridColumnComponen
15
15
  falseIconColor: string;
16
16
  getContentTemplate(value: boolean | undefined, _data: TData): import("lit-html").HTMLTemplateResult;
17
17
  getEditContentTemplate(value: boolean | undefined, data: TData): import("lit-html").HTMLTemplateResult;
18
+ format: (data: TData) => "Yes" | "No";
18
19
  }
19
20
  declare global {
20
21
  interface HTMLElementTagNameMap {
package/dist/columns/DataGridColumnBoolean.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridColumnBoolean.d.ts","sourceRoot":"","sources":["../../columns/DataGridColumnBoolean.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAA;AAEtE;;;;;;;GAOG;AACH,qBACa,qBAAqB,CAAC,KAAK,CAAE,SAAQ,uBAAuB,CAAC,KAAK,EAAE,OAAO,CAAC;IAC5E,QAAQ,EAAE,YAAY,CAAS;IAC/B,SAAS,EAAE,YAAY,CAAU;IAEjC,aAAa,SAA2B;IACxC,cAAc,SAAyB;IAGnD,kBAAkB,CAAC,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,KAAK,EAAE,KAAK;IAQ3D,sBAAsB,CAAC,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;CAQ9D;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,6BAA6B,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;KAC7D;CACD"}
1
+ {"version":3,"file":"DataGridColumnBoolean.d.ts","sourceRoot":"","sources":["../../columns/DataGridColumnBoolean.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAA;AAEtE;;;;;;;GAOG;AACH,qBACa,qBAAqB,CAAC,KAAK,CAAE,SAAQ,uBAAuB,CAAC,KAAK,EAAE,OAAO,CAAC;IAC5E,QAAQ,EAAE,YAAY,CAAS;IAC/B,SAAS,EAAE,YAAY,CAAU;IAEjC,aAAa,SAA2B;IACxC,cAAc,SAAyB;IAGnD,kBAAkB,CAAC,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,KAAK,EAAE,KAAK;IAQ3D,sBAAsB,CAAC,KAAK,EAAE,OAAO,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IASrD,MAAM,SAAU,KAAK,kBAE7B;CACD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,6BAA6B,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;KAC7D;CACD"}
package/dist/columns/DataGridColumnBoolean.js CHANGED
@@ -16,6 +16,9 @@ let DataGridColumnBoolean = class DataGridColumnBoolean extends DataGridColumnCo
16
16
  this.falseIcon = 'clear';
17
17
  this.trueIconColor = 'var(--mo-color-accent)';
18
18
  this.falseIconColor = 'var(--mo-color-gray)';
19
+ this.format = (data) => {
20
+ return getValueByKeyPath(data, this.dataSelector) ? 'Yes' : 'No';
21
+ };
19
22
  }
20
23
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
21
24
  getContentTemplate(value, _data) {
package/dist/columns/DataGridColumnComponent.d.ts CHANGED
@@ -31,5 +31,6 @@ export declare abstract class DataGridColumnComponent<TData, TValue> extends Com
31
31
  protected handleEdit(value: TValue | undefined, data: TData): void;
32
32
  connectedCallback(): void;
33
33
  protected updated(): void;
34
+ format: (data: TData) => string;
34
35
  }
35
36
  //# sourceMappingURL=DataGridColumnComponent.d.ts.map
package/dist/columns/DataGridColumnComponent.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridColumnComponent.d.ts","sourceRoot":"","sources":["../../columns/DataGridColumnComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAY,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,cAAc,EAAE,KAAK,uBAAuB,EAAE,KAAK,oBAAoB,EAAE,MAAM,sBAAsB,CAAA;AAE9G;;;;;;;;;;;GAWG;AACH,8BAAsB,uBAAuB,CAAC,KAAK,EAAE,MAAM,CAAE,SAAQ,SAAS;IACjD,QAAQ,CAAC,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,SAAS,CAAA;IAE3D,KAAK,SAAgB;IACK,MAAM,UAAQ;IACxC,MAAM,CAAC,EAAE,oBAAoB,CAAA;IACZ,OAAO,SAAK;IACZ,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,EAAE,uBAAuB,CAAU;IAC5C,YAAY,EAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAC/B,gBAAgB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAA;IACpB,WAAW,UAAQ;IAO5D,WAAW,EAAE,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAQ;IAElD,IAAI,MAAM,IAAI,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,CAgB1C;IAED,QAAQ,CAAC,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IACvF,QAAQ,CAAC,sBAAsB,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IAE5F,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAIlD,iBAAiB;cAOP,OAAO;CAI1B"}
1
+ {"version":3,"file":"DataGridColumnComponent.d.ts","sourceRoot":"","sources":["../../columns/DataGridColumnComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAY,KAAK,kBAAkB,EAAE,MAAM,WAAW,CAAA;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AACzC,OAAO,EAAE,cAAc,EAAE,KAAK,uBAAuB,EAAE,KAAK,oBAAoB,EAAE,MAAM,sBAAsB,CAAA;AAE9G;;;;;;;;;;;GAWG;AACH,8BAAsB,uBAAuB,CAAC,KAAK,EAAE,MAAM,CAAE,SAAQ,SAAS;IACjD,QAAQ,CAAC,EAAE,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,SAAS,CAAA;IAE3D,KAAK,SAAgB;IACK,MAAM,UAAQ;IACxC,MAAM,CAAC,EAAE,oBAAoB,CAAA;IACZ,OAAO,SAAK;IACZ,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,EAAE,uBAAuB,CAAU;IAC5C,YAAY,EAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAC/B,gBAAgB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAA;IACpB,WAAW,UAAQ;IAO5D,WAAW,EAAE,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAQ;IAElD,IAAI,MAAM,IAAI,cAAc,CAAC,KAAK,EAAE,MAAM,CAAC,CAiB1C;IAED,QAAQ,CAAC,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IACvF,QAAQ,CAAC,sBAAsB,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK,GAAG,kBAAkB;IAE5F,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAIlD,iBAAiB;cAOP,OAAO;IAK1B,MAAM,SAAU,KAAK,YAGpB;CACD"}
package/dist/columns/DataGridColumnComponent.js CHANGED
@@ -23,6 +23,10 @@ export class DataGridColumnComponent extends Component {
23
23
  this.textAlign = 'start';
24
24
  this.nonSortable = false;
25
25
  this.nonEditable = false;
26
+ this.format = (data) => {
27
+ const value = getValueByKeyPath(data, this.dataSelector);
28
+ return value === undefined ? '' : String(value);
29
+ };
26
30
  }
27
31
  get column() {
28
32
  const nonEditable = this.nonEditable;
@@ -36,6 +40,7 @@ export class DataGridColumnComponent extends Component {
36
40
  sticky: this.sticky,
37
41
  width: this.width,
38
42
  sortable: !this.nonSortable,
43
+ format: this.format,
39
44
  editable: this.getEditContentTemplate !== undefined && (typeof nonEditable !== 'function' ? !nonEditable : x => !nonEditable(x)),
40
45
  getContentTemplate: this.getContentTemplate.bind(this),
41
46
  getEditContentTemplate: this.getEditContentTemplate?.bind(this),
package/dist/columns/date-time/DataGridColumnDate.d.ts CHANGED
@@ -3,6 +3,7 @@ import { DataGridColumnDateTimeBase } from './DataGridColumnDateTimeBase.js';
3
3
  export declare class DataGridColumnDate<TData> extends DataGridColumnDateTimeBase<TData, Date> {
4
4
  getContentTemplate(value: Date | undefined, data: TData): import("lit-html").HTMLTemplateResult;
5
5
  readonly fieldTag: import("lit-html/static.js").StaticValue;
6
+ format: (data: TData) => string;
6
7
  }
7
8
  declare global {
8
9
  interface HTMLElementTagNameMap {
package/dist/columns/date-time/DataGridColumnDate.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridColumnDate.d.ts","sourceRoot":"","sources":["../../../columns/date-time/DataGridColumnDate.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAA;AAE5E,wCAAwC;AACxC,qBACa,kBAAkB,CAAC,KAAK,CAAE,SAAQ,0BAA0B,CAAC,KAAK,EAAE,IAAI,CAAC;IACrF,kBAAkB,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAKvD,SAAkB,QAAQ,2CAAyB;CACnD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,0BAA0B,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAA;KACvD;CACD"}
1
+ {"version":3,"file":"DataGridColumnDate.d.ts","sourceRoot":"","sources":["../../../columns/date-time/DataGridColumnDate.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAA;AAE5E,wCAAwC;AACxC,qBACa,kBAAkB,CAAC,KAAK,CAAE,SAAQ,0BAA0B,CAAC,KAAK,EAAE,IAAI,CAAC;IACrF,kBAAkB,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAKvD,SAAkB,QAAQ,2CAAyB;IAE1C,MAAM,SAAU,KAAK,YAG7B;CACD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,0BAA0B,EAAE,kBAAkB,CAAC,OAAO,CAAC,CAAA;KACvD;CACD"}
package/dist/columns/date-time/DataGridColumnDate.js CHANGED
@@ -6,6 +6,10 @@ let DataGridColumnDate = class DataGridColumnDate extends DataGridColumnDateTime
6
6
  constructor() {
7
7
  super(...arguments);
8
8
  this.fieldTag = literal `mo-field-date`;
9
+ this.format = (data) => {
10
+ const value = getValueByKeyPath(data, this.dataSelector);
11
+ return !value ? '' : value.formatAsDate() ?? '';
12
+ };
9
13
  }
10
14
  getContentTemplate(value, data) {
11
15
  data;
package/dist/columns/date-time/DataGridColumnDateTime.d.ts CHANGED
@@ -3,6 +3,7 @@ import { DataGridColumnDateTimeBase } from './DataGridColumnDateTimeBase.js';
3
3
  export declare class DataGridColumnDateTime<TData> extends DataGridColumnDateTimeBase<TData, Date> {
4
4
  getContentTemplate(value: Date | undefined, data: TData): import("lit-html").HTMLTemplateResult;
5
5
  readonly fieldTag: import("lit-html/static.js").StaticValue;
6
+ format: (data: TData) => string;
6
7
  }
7
8
  declare global {
8
9
  interface HTMLElementTagNameMap {
package/dist/columns/date-time/DataGridColumnDateTime.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridColumnDateTime.d.ts","sourceRoot":"","sources":["../../../columns/date-time/DataGridColumnDateTime.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAA;AAE5E,6CAA6C;AAC7C,qBACa,sBAAsB,CAAC,KAAK,CAAE,SAAQ,0BAA0B,CAAC,KAAK,EAAE,IAAI,CAAC;IACzF,kBAAkB,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAKvD,SAAkB,QAAQ,2CAA8B;CACxD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,+BAA+B,EAAE,sBAAsB,CAAC,OAAO,CAAC,CAAA;KAChE;CACD"}
1
+ {"version":3,"file":"DataGridColumnDateTime.d.ts","sourceRoot":"","sources":["../../../columns/date-time/DataGridColumnDateTime.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,0BAA0B,EAAE,MAAM,iCAAiC,CAAA;AAE5E,6CAA6C;AAC7C,qBACa,sBAAsB,CAAC,KAAK,CAAE,SAAQ,0BAA0B,CAAC,KAAK,EAAE,IAAI,CAAC;IACzF,kBAAkB,CAAC,KAAK,EAAE,IAAI,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAKvD,SAAkB,QAAQ,2CAA8B;IAE/C,MAAM,SAAU,KAAK,YAW7B;CACD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,+BAA+B,EAAE,sBAAsB,CAAC,OAAO,CAAC,CAAA;KAChE;CACD"}
package/dist/columns/date-time/DataGridColumnDateTime.js CHANGED
@@ -6,6 +6,18 @@ let DataGridColumnDateTime = class DataGridColumnDateTime extends DataGridColumn
6
6
  constructor() {
7
7
  super(...arguments);
8
8
  this.fieldTag = literal `mo-field-date-time`;
9
+ this.format = (data) => {
10
+ const value = getValueByKeyPath(data, this.dataSelector);
11
+ return !value ? '' : [
12
+ value.formatAsDate(),
13
+ value.formatAsTime({
14
+ hour: '2-digit',
15
+ minute: '2-digit',
16
+ second: '2-digit',
17
+ hourCycle: 'h23',
18
+ }),
19
+ ].filter(Boolean).join(' ') ?? '';
20
+ };
9
21
  }
10
22
  getContentTemplate(value, data) {
11
23
  data;
package/dist/columns/number/DataGridColumnCurrency.d.ts CHANGED
@@ -14,6 +14,7 @@ export declare class DataGridColumnCurrency<TData> extends DataGridColumnNumberB
14
14
  getContentTemplate(value: number | undefined, data: TData): import("lit-html").HTMLTemplateResult;
15
15
  getEditContentTemplate(value: number | undefined, data: TData): import("lit-html").HTMLTemplateResult;
16
16
  getSumTemplate(sum: number): import("lit-html").HTMLTemplateResult;
17
+ format: (data: TData) => string;
17
18
  }
18
19
  declare global {
19
20
  interface HTMLElementTagNameMap {
package/dist/columns/number/DataGridColumnCurrency.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridColumnCurrency.d.ts","sourceRoot":"","sources":["../../../columns/number/DataGridColumnCurrency.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAqB,MAAM,mBAAmB,CAAA;AAE/D,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAA;AAExE;;;;;EAKE;AACF,qBACa,sBAAsB,CAAC,KAAK,CAAE,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACjF,MAAM,CAAC,eAAe,CAAC,EAAE,QAAQ,CAAA;IAEuC,QAAQ,CAAC,EAAE,QAAQ,CAAA;IAC/E,oBAAoB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAA;IAEnD,OAAO,CAAC,WAAW;IAMnB,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAIzD,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAU7D,cAAc,CAAC,GAAG,EAAE,MAAM;CAK1B;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,8BAA8B,EAAE,sBAAsB,CAAC,OAAO,CAAC,CAAA;KAC/D;CACD"}
1
+ {"version":3,"file":"DataGridColumnCurrency.d.ts","sourceRoot":"","sources":["../../../columns/number/DataGridColumnCurrency.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAqB,MAAM,mBAAmB,CAAA;AAE/D,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAA;AAExE;;;;;EAKE;AACF,qBACa,sBAAsB,CAAC,KAAK,CAAE,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IACjF,MAAM,CAAC,eAAe,CAAC,EAAE,QAAQ,CAAA;IAEuC,QAAQ,CAAC,EAAE,QAAQ,CAAA;IAC/E,oBAAoB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAA;IAEnD,OAAO,CAAC,WAAW;IAMnB,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAIzD,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAU7D,cAAc,CAAC,GAAG,EAAE,MAAM;IAMjB,MAAM,SAAU,KAAK,YAK7B;CACD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,8BAA8B,EAAE,sBAAsB,CAAC,OAAO,CAAC,CAAA;KAC/D;CACD"}
package/dist/columns/number/DataGridColumnCurrency.js CHANGED
@@ -11,6 +11,15 @@ import { DataGridColumnNumberBase } from './DataGridColumnNumberBase.js';
11
11
  * @attr currencyDataSelector - The key path to the currency of the values.
12
12
  */
13
13
  let DataGridColumnCurrency = DataGridColumnCurrency_1 = class DataGridColumnCurrency extends DataGridColumnNumberBase {
14
+ constructor() {
15
+ super(...arguments);
16
+ this.format = (data) => {
17
+ const value = this.getNumber(getValueByKeyPath(data, this.dataSelector));
18
+ return value === undefined ? '' : value.formatAsCurrency(this.getCurrency(data), {
19
+ useGrouping: false,
20
+ });
21
+ };
22
+ }
14
23
  getCurrency(data) {
15
24
  return (this.currencyDataSelector ? Currency[getValueByKeyPath(data, this.currencyDataSelector)] : undefined)
16
25
  ?? this.currency
package/dist/columns/number/DataGridColumnPercent.d.ts CHANGED
@@ -4,6 +4,7 @@ export declare class DataGridColumnPercent<TData> extends DataGridColumnNumberBa
4
4
  getContentTemplate(value: number | undefined, _data: TData): import("lit-html").HTMLTemplateResult;
5
5
  getEditContentTemplate(value: number | undefined, data: TData): import("lit-html").HTMLTemplateResult;
6
6
  getSumTemplate(sum: number): import("lit-html").HTMLTemplateResult;
7
+ format: (data: TData) => string;
7
8
  }
8
9
  declare global {
9
10
  interface HTMLElementTagNameMap {
package/dist/columns/number/DataGridColumnPercent.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"DataGridColumnPercent.d.ts","sourceRoot":"","sources":["../../../columns/number/DataGridColumnPercent.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAA;AAExE,2CAA2C;AAC3C,qBACa,qBAAqB,CAAC,KAAK,CAAE,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IAEhF,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,KAAK,EAAE,KAAK;IAI1D,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAS7D,cAAc,CAAC,GAAG,EAAE,MAAM;CAG1B;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,6BAA6B,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;KAC7D;CACD"}
1
+ {"version":3,"file":"DataGridColumnPercent.d.ts","sourceRoot":"","sources":["../../../columns/number/DataGridColumnPercent.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAA;AAExE,2CAA2C;AAC3C,qBACa,qBAAqB,CAAC,KAAK,CAAE,SAAQ,wBAAwB,CAAC,KAAK,CAAC;IAEhF,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,KAAK,EAAE,KAAK;IAI1D,sBAAsB,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,KAAK;IAS7D,cAAc,CAAC,GAAG,EAAE,MAAM;IAIjB,MAAM,SAAU,KAAK,YAM7B;CACD;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,6BAA6B,EAAE,qBAAqB,CAAC,OAAO,CAAC,CAAA;KAC7D;CACD"}
package/dist/columns/number/DataGridColumnPercent.js CHANGED
@@ -3,6 +3,16 @@ import { component, html, ifDefined } from '@a11d/lit';
3
3
  import { DataGridColumnNumberBase } from './DataGridColumnNumberBase.js';
4
4
  /** @element mo-data-grid-column-percent */
5
5
  let DataGridColumnPercent = class DataGridColumnPercent extends DataGridColumnNumberBase {
6
+ constructor() {
7
+ super(...arguments);
8
+ this.format = (data) => {
9
+ const value = this.getNumber(getValueByKeyPath(data, this.dataSelector));
10
+ return value === undefined ? '' : value.format({
11
+ minimumFractionDigits: 0,
12
+ maximumFractionDigits: 2,
13
+ });
14
+ };
15
+ }
6
16
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
7
17
  getContentTemplate(value, _data) {
8
18
  return html `${this.getNumber(value)?.formatAsPercent() ?? html.nothing}`;