@rt-tools/ui-kit-v2 0.39.0 → 0.39.2

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 (88) hide show
  1. package/fesm2022/rt-tools-ui-kit-v2-aside.mjs +4 -4
  2. package/fesm2022/rt-tools-ui-kit-v2-aside.mjs.map +1 -1
  3. package/fesm2022/rt-tools-ui-kit-v2-autocomplete.mjs +2 -2
  4. package/fesm2022/rt-tools-ui-kit-v2-autocomplete.mjs.map +1 -1
  5. package/fesm2022/rt-tools-ui-kit-v2-core.mjs +14 -0
  6. package/fesm2022/rt-tools-ui-kit-v2-core.mjs.map +1 -1
  7. package/fesm2022/rt-tools-ui-kit-v2-data-list.mjs +5 -5
  8. package/fesm2022/rt-tools-ui-kit-v2-data-list.mjs.map +1 -1
  9. package/fesm2022/rt-tools-ui-kit-v2-data-table.mjs +48 -45
  10. package/fesm2022/rt-tools-ui-kit-v2-data-table.mjs.map +1 -1
  11. package/fesm2022/rt-tools-ui-kit-v2-date-picker.mjs +62 -9
  12. package/fesm2022/rt-tools-ui-kit-v2-date-picker.mjs.map +1 -1
  13. package/fesm2022/rt-tools-ui-kit-v2-date-range.mjs +93 -12
  14. package/fesm2022/rt-tools-ui-kit-v2-date-range.mjs.map +1 -1
  15. package/fesm2022/rt-tools-ui-kit-v2-detail-list.mjs +2 -2
  16. package/fesm2022/rt-tools-ui-kit-v2-detail-list.mjs.map +1 -1
  17. package/fesm2022/rt-tools-ui-kit-v2-field.mjs +2 -2
  18. package/fesm2022/rt-tools-ui-kit-v2-field.mjs.map +1 -1
  19. package/fesm2022/rt-tools-ui-kit-v2-form-control.mjs +4 -1
  20. package/fesm2022/rt-tools-ui-kit-v2-form-control.mjs.map +1 -1
  21. package/fesm2022/rt-tools-ui-kit-v2-icon.mjs +10 -0
  22. package/fesm2022/rt-tools-ui-kit-v2-icon.mjs.map +1 -1
  23. package/fesm2022/rt-tools-ui-kit-v2-input-number.mjs +76 -5
  24. package/fesm2022/rt-tools-ui-kit-v2-input-number.mjs.map +1 -1
  25. package/fesm2022/rt-tools-ui-kit-v2-input.mjs +2 -2
  26. package/fesm2022/rt-tools-ui-kit-v2-message.mjs +3 -3
  27. package/fesm2022/rt-tools-ui-kit-v2-message.mjs.map +1 -1
  28. package/fesm2022/rt-tools-ui-kit-v2-multiselect.mjs +4 -4
  29. package/fesm2022/rt-tools-ui-kit-v2-multiselect.mjs.map +1 -1
  30. package/fesm2022/rt-tools-ui-kit-v2-stat-tile.mjs +37 -16
  31. package/fesm2022/rt-tools-ui-kit-v2-stat-tile.mjs.map +1 -1
  32. package/fesm2022/rt-tools-ui-kit-v2-table-core.mjs +101 -0
  33. package/fesm2022/rt-tools-ui-kit-v2-table-core.mjs.map +1 -0
  34. package/fesm2022/rt-tools-ui-kit-v2-table.mjs +130 -42
  35. package/fesm2022/rt-tools-ui-kit-v2-table.mjs.map +1 -1
  36. package/fesm2022/rt-tools-ui-kit-v2-tabs.mjs +41 -4
  37. package/fesm2022/rt-tools-ui-kit-v2-tabs.mjs.map +1 -1
  38. package/fesm2022/rt-tools-ui-kit-v2-workspace-details.mjs +2 -0
  39. package/fesm2022/rt-tools-ui-kit-v2-workspace-details.mjs.map +1 -1
  40. package/package.json +5 -1
  41. package/src/assets/icons-material/bookmark.fill.svg +5 -0
  42. package/src/assets/icons-material/bookmark.svg +5 -0
  43. package/src/assets/icons-material/flag.fill.svg +3 -0
  44. package/src/assets/icons-material/flag.svg +5 -0
  45. package/src/lib/components/aside/footer/CONTEXT.md +27 -0
  46. package/src/lib/components/aside/footer/rt-aside-footer.component.scss +8 -3
  47. package/src/lib/components/aside/header/rt-aside-header.component.scss +11 -3
  48. package/src/lib/components/button/rt-button.directive.scss +5 -1
  49. package/src/lib/components/data-table/CONTEXT.md +8 -2
  50. package/src/lib/components/date-picker/panel/rt-date-panel.component.scss +51 -2
  51. package/src/lib/components/date-range/panel/rt-date-range-panel.component.scss +95 -2
  52. package/src/lib/components/detail-list/CONTEXT.md +3 -0
  53. package/src/lib/components/detail-list/rt-detail-row.component.scss +1 -0
  54. package/src/lib/components/field/CONTEXT.md +4 -2
  55. package/src/lib/components/field/rt-field.component.scss +14 -0
  56. package/src/lib/components/form-control/CONTEXT.md +13 -8
  57. package/src/lib/components/input/rt-input.component.scss +4 -0
  58. package/src/lib/components/input-number/CONTEXT.md +8 -0
  59. package/src/lib/components/input-number/rt-input-number.component.scss +50 -0
  60. package/src/lib/components/message/CONTEXT.md +1 -1
  61. package/src/lib/components/message/rt-message.component.scss +2 -1
  62. package/src/lib/components/multiselect/rt-multiselect.component.scss +21 -0
  63. package/src/lib/components/service-block/stories/component/test-service-block-panel.component.scss +29 -0
  64. package/src/lib/components/stat-tile/CONTEXT.md +11 -6
  65. package/src/lib/components/stat-tile/rt-stat-tile.component.scss +21 -0
  66. package/src/lib/components/stat-tile/stories/component/test-stat-tile-matrix.component.scss +15 -0
  67. package/src/lib/components/table/CONTEXT.md +23 -0
  68. package/src/lib/components/table/copy-cell/CONTEXT.md +32 -0
  69. package/src/lib/components/table/copy-cell/rt-copy-cell.component.scss +26 -0
  70. package/src/lib/components/table/rt-table.component.scss +77 -22
  71. package/src/lib/components/table/stories/component/test-table-pinned.component.scss +76 -0
  72. package/src/lib/components/tabs/CONTEXT.md +18 -16
  73. package/src/lib/components/tabs/rt-tabs.component.scss +25 -1
  74. package/src/styles/_form.scss +10 -0
  75. package/src/styles/_primitives.scss +2 -0
  76. package/src/styles/_semantic.scss +11 -1
  77. package/src/styles/_theme-dark.scss +2 -0
  78. package/styles/tokens.css +95 -9
  79. package/types/rt-tools-ui-kit-v2-core.d.ts +28 -5
  80. package/types/rt-tools-ui-kit-v2-data-table.d.ts +23 -9
  81. package/types/rt-tools-ui-kit-v2-date-picker.d.ts +14 -0
  82. package/types/rt-tools-ui-kit-v2-form-control.d.ts +2 -2
  83. package/types/rt-tools-ui-kit-v2-input-number.d.ts +30 -2
  84. package/types/rt-tools-ui-kit-v2-message.d.ts +1 -1
  85. package/types/rt-tools-ui-kit-v2-stat-tile.d.ts +29 -6
  86. package/types/rt-tools-ui-kit-v2-table-core.d.ts +76 -0
  87. package/types/rt-tools-ui-kit-v2-table.d.ts +52 -18
  88. package/types/rt-tools-ui-kit-v2-tabs.d.ts +26 -0
@@ -3,15 +3,16 @@ import { RtIconComponent, iconMaterialMap } from "@rt-tools/ui-kit-v2/icon";
3
3
  import * as i0 from "@angular/core";
4
4
  import { ChangeDetectionStrategy, Component, DestroyRef, Directive, ElementRef, Injectable, InjectionToken, Injector, TemplateRef, ViewEncapsulation, booleanAttribute, computed, contentChild, effect, forwardRef, inject, input, linkedSignal, output, signal, untracked, viewChild } from "@angular/core";
5
5
  import { takeUntilDestroyed, toObservable } from "@angular/core/rxjs-interop";
6
- import { Subject } from "rxjs";
7
- import { concatMap, filter, map, switchMap, take, takeUntil } from "rxjs/operators";
6
+ import { Subject, of } from "rxjs";
7
+ import { concatMap, filter, map, switchMap, take, takeUntil, tap } from "rxjs/operators";
8
8
  import { BlockDirective, ConcatClassesPipe, ElemDirective, EmptyToDashPipe, IDBStorageService, ModDirective, PlatformService } from "@rt-tools/core";
9
+ import { BreakpointsService, ERtDataTableColumnType, ERtDataTableFilterType, ERtStorageKeys, RT_DATA_TABLE_PRESET_FROM_HOST, RT_KIT_TRANSLATOR, RT_PRESET_MATERIAL_CLASS, rtKitDefault, rtKitLabel } from "@rt-tools/ui-kit-v2/core";
9
10
  import { Clipboard } from "@angular/cdk/clipboard";
10
11
  import { NgTemplateOutlet, TitleCasePipe } from "@angular/common";
11
12
  import { DomSanitizer } from "@angular/platform-browser";
12
- import { BreakpointsService, ERtDataTableColumnType, ERtDataTableFilterType, RT_DATA_TABLE_PRESET_FROM_HOST, RT_KIT_TRANSLATOR, RT_PRESET_MATERIAL_CLASS, rtKitDefault, rtKitLabel } from "@rt-tools/ui-kit-v2/core";
13
13
  import { RtIconButtonComponent } from "@rt-tools/ui-kit-v2/icon-button";
14
14
  import { RtTooltipDirective } from "@rt-tools/ui-kit-v2/tooltip";
15
+ import { rtAllOnPage, rtAnyOnPage, rtAriaSortOf, rtFilterOf, rtFiltersWithOperator, rtFiltersWithValue, rtIsSortedBy, rtKeysOf, rtNextSort, rtPresetEntities, rtWithEntity, rtWithPageEntities, rtWithoutPageEntities } from "@rt-tools/ui-kit-v2/table-core";
15
16
  import * as i1 from "@angular/forms";
16
17
  import { FormsModule } from "@angular/forms";
17
18
  import { RtDatePickerComponent } from "@rt-tools/ui-kit-v2/date-picker";
@@ -37,6 +38,9 @@ function dataTableCopyButtonSide(column) {
37
38
  function dataTableIconName(glyph) {
38
39
  return iconMaterialMap.find((entry) => entry.from === glyph)?.to ?? null;
39
40
  }
41
+ function dataTableConfigKeyOf(storageKey) {
42
+ return `${ERtStorageKeys.DataTableConfigPrefix}${storageKey}`;
43
+ }
40
44
  function comparePropNames(a, b) {
41
45
  return String(a).localeCompare(String(b));
42
46
  }
@@ -59,7 +63,7 @@ var RtDataTableConfigService = class RtDataTableConfigService {
59
63
  columns: []
60
64
  }, ...ngDevMode ? [{ debugName: "#tableConfig" }] : /* istanbul ignore next */ []);
61
65
  this.tableConfig = this.#tableConfig.asReadonly();
62
- this.#readSource.pipe(switchMap((read) => this.#iDBStorageService.get(read.storageKey).pipe(take(1), takeUntil(this.#updatedSource), map((savedConfig) => this.#configOf(read.config, savedConfig)))), takeUntilDestroyed(this.#destroyRef)).subscribe((config) => {
66
+ this.#readSource.pipe(switchMap((read) => this.#savedOf(read.storageKey).pipe(takeUntil(this.#updatedSource), map((savedConfig) => this.#configOf(read.config, savedConfig)))), takeUntilDestroyed(this.#destroyRef)).subscribe((config) => {
63
67
  this.#tableConfig.set(config);
64
68
  });
65
69
  this.#writeSource.pipe(concatMap((write) => this.#writeOf(write).pipe(take(1))), takeUntilDestroyed(this.#destroyRef)).subscribe();
@@ -74,19 +78,35 @@ var RtDataTableConfigService = class RtDataTableConfigService {
74
78
  this.#updatedSource.next();
75
79
  this.#writeSource.next({
76
80
  kind: "set",
77
- storageKey,
81
+ storageKey: dataTableConfigKeyOf(storageKey),
78
82
  config
79
83
  });
80
84
  this.#tableConfig.set(config);
81
85
  }
82
86
  deleteConfig(storageKey) {
87
+ this.#updatedSource.next();
88
+ this.#writeSource.next({
89
+ kind: "remove",
90
+ storageKey: dataTableConfigKeyOf(storageKey)
91
+ });
83
92
  this.#writeSource.next({
84
93
  kind: "remove",
85
94
  storageKey
86
95
  });
87
96
  }
97
+ #savedOf(storageKey) {
98
+ const kitKey = dataTableConfigKeyOf(storageKey);
99
+ return this.#iDBStorageService.get(kitKey).pipe(take(1), switchMap((saved) => saved ? of(saved) : this.#iDBStorageService.get(storageKey).pipe(take(1), tap((old) => {
100
+ if (old) this.#writeSource.next({
101
+ kind: "copy",
102
+ storageKey: kitKey,
103
+ stored: old
104
+ });
105
+ }))));
106
+ }
88
107
  #writeOf(write) {
89
108
  if (write.kind === "remove") return this.#iDBStorageService.remove(write.storageKey);
109
+ if (write.kind === "copy") return this.#iDBStorageService.set(write.storageKey, write.stored);
90
110
  const storedColumns = write.config.columns.map((el) => ({
91
111
  displayName: el.header.label ?? el.propName.toString(),
92
112
  propName: el.propName,
@@ -637,18 +657,14 @@ i0.ɵɵngDeclareClassMetadata({
637
657
  }]
638
658
  }
639
659
  });
640
- function dataTableNextSortOrder(current) {
641
- return current?.sortDirection?.toLowerCase() === EListSortOrder.ASC ? EListSortOrder.DESC : EListSortOrder.ASC;
660
+ function dataTableNextSortOrder(current, propertyName) {
661
+ return rtNextSort(current, propertyName ?? current?.propertyName ?? "", "repeats")?.sortDirection ?? EListSortOrder.ASC;
642
662
  }
643
663
  function dataTableSortActive(sort, current) {
644
- return !!current?.propertyName && !!sort?.propertyName && current.propertyName === sort.propertyName;
664
+ return rtIsSortedBy(current, sort?.propertyName);
645
665
  }
646
666
  function dataTableAriaSort(sort, current) {
647
- if (!sort?.propertyName) return null;
648
- if (!dataTableSortActive(sort, current)) return "none";
649
- const direction = current?.sortDirection?.toLowerCase();
650
- if (direction === EListSortOrder.ASC) return "ascending";
651
- return direction === EListSortOrder.DESC ? "descending" : "none";
667
+ return sort?.propertyName ? rtAriaSortOf(current, sort.propertyName) : null;
652
668
  }
653
669
  const BEM_BLOCK$2 = "rt-data-table-header-cell";
654
670
  var RtDataTableHeaderCellComponent = class RtDataTableHeaderCellComponent {
@@ -701,7 +717,7 @@ var RtDataTableHeaderCellComponent = class RtDataTableHeaderCellComponent {
701
717
  const propertyName = this.sortModel()?.propertyName;
702
718
  if (propertyName) this.sortChange.emit({
703
719
  propertyName,
704
- sortDirection: dataTableNextSortOrder(this.currentSortModel())
720
+ sortDirection: dataTableNextSortOrder(this.currentSortModel(), propertyName)
705
721
  });
706
722
  }
707
723
  static {
@@ -923,6 +939,7 @@ i0.ɵɵngDeclareClassMetadata({
923
939
  }]
924
940
  }
925
941
  });
942
+ const DATA_TABLE_EMPTY_MODE = "falsy";
926
943
  const DATA_TABLE_FILTER_OPERATOR_GLYPHS = {
927
944
  [EFilterOperatorType.EQUALS]: "drag_handle",
928
945
  [EFilterOperatorType.NOT_EQUALS]: "block",
@@ -943,33 +960,20 @@ function dataTableDefaultOperator(operator) {
943
960
  return operator && FILTER_OPERATORS.includes(operator) ? operator : EFilterOperatorType.EQUALS;
944
961
  }
945
962
  function dataTableColumnFilter(filters, propertyName, defaultOperator) {
946
- return filters.find((filter) => filter.propertyName === propertyName) ?? {
963
+ return rtFilterOf(filters, propertyName) ?? {
947
964
  propertyName,
948
965
  operatorType: defaultOperator,
949
966
  value: ""
950
967
  };
951
968
  }
969
+ function changedOrNull(before, after) {
970
+ return after === before ? null : [...after];
971
+ }
952
972
  function dataTableFiltersWithValue(filters, current, value) {
953
- if (filters.some((filter) => filter.propertyName === current.propertyName)) return value ? filters.map((filter) => filter.propertyName === current.propertyName ? {
954
- ...filter,
955
- value
956
- } : filter) : filters.filter((filter) => filter.propertyName !== current.propertyName);
957
- return value ? [...filters, {
958
- propertyName: current.propertyName,
959
- operatorType: current.operatorType,
960
- value
961
- }] : null;
973
+ return changedOrNull(filters, rtFiltersWithValue(filters, current.propertyName, current.operatorType, value, DATA_TABLE_EMPTY_MODE));
962
974
  }
963
975
  function dataTableFiltersWithOperator(filters, current, operatorType) {
964
- if (filters.some((filter) => filter.propertyName === current.propertyName)) return filters.map((filter) => filter.propertyName === current.propertyName ? {
965
- ...filter,
966
- operatorType
967
- } : filter);
968
- return current.value ? [...filters, {
969
- operatorType,
970
- propertyName: current.propertyName,
971
- value: current.value
972
- }] : null;
976
+ return changedOrNull(filters, rtFiltersWithOperator(filters, current.propertyName, operatorType, current.value, DATA_TABLE_EMPTY_MODE));
973
977
  }
974
978
  function dataTableDayToIso(day) {
975
979
  const [year, month, date] = day.split("-").map(Number);
@@ -1254,7 +1258,9 @@ var RtDataTableFilterCellComponent = class RtDataTableFilterCellComponent {
1254
1258
  "max",
1255
1259
  "minFractionDigits",
1256
1260
  "maxFractionDigits",
1257
- "grouped"
1261
+ "grouped",
1262
+ "step",
1263
+ "stepper"
1258
1264
  ]
1259
1265
  },
1260
1266
  {
@@ -1563,28 +1569,25 @@ i0.ɵɵngDeclareClassMetadata({
1563
1569
  }]
1564
1570
  });
1565
1571
  function dataTableKeysOf(entities, keyExp) {
1566
- return entities.map((entity) => entity[keyExp]);
1572
+ return rtKeysOf(entities, keyExp);
1567
1573
  }
1568
1574
  function dataTableWithPageEntities(selected, page, keyExp) {
1569
- const keys = dataTableKeysOf(selected, keyExp);
1570
- return [...selected, ...page.filter((entity) => !keys.includes(entity[keyExp]))];
1575
+ return rtWithPageEntities(selected, page, keyExp);
1571
1576
  }
1572
1577
  function dataTableWithoutPageEntities(selected, page, keyExp) {
1573
- const keys = dataTableKeysOf(page, keyExp);
1574
- return selected.filter((entity) => !keys.includes(entity[keyExp]));
1578
+ return rtWithoutPageEntities(selected, page, keyExp);
1575
1579
  }
1576
1580
  function dataTableWithEntity(selected, entity, checked, keyExp) {
1577
- const without = selected.filter((el) => el[keyExp] !== entity[keyExp]);
1578
- return checked ? [...without, entity] : without;
1581
+ return rtWithEntity(selected, entity, checked, keyExp);
1579
1582
  }
1580
1583
  function dataTableAnyOnPage(page, selectedKeys, keyExp) {
1581
- return page.some((entity) => selectedKeys.includes(entity[keyExp]));
1584
+ return rtAnyOnPage(page, selectedKeys, keyExp);
1582
1585
  }
1583
1586
  function dataTableAllOnPage(page, selectedKeys, keyExp) {
1584
- return page.every((entity) => selectedKeys.includes(entity[keyExp]));
1587
+ return rtAllOnPage(page, selectedKeys, keyExp);
1585
1588
  }
1586
1589
  function dataTablePresetEntities(entities, keys, keyExp) {
1587
- return entities.filter((entity) => keys.includes(entity[keyExp]));
1590
+ return rtPresetEntities(entities, keys, keyExp);
1588
1591
  }
1589
1592
  const BEM_BLOCK = "rt-data-table";
1590
1593
  var RtDataTableComponent = class RtDataTableComponent {
@@ -2315,6 +2318,6 @@ i0.ɵɵngDeclareClassMetadata({
2315
2318
  }]
2316
2319
  }
2317
2320
  });
2318
- export { DATA_TABLE_FILTER_MENU_OPERATORS, DATA_TABLE_FILTER_OPERATOR_GLYPHS, RT_DATA_TABLE_ROW_HOST, RT_DATA_TABLE_STOP_ROW_CLICK_ATTRIBUTE, RtDataTableAdditionalRowActionsDirective, RtDataTableCellComponent, RtDataTableComponent, RtDataTableConfigService, RtDataTableCustomCellsDirective, RtDataTableFilterCellComponent, RtDataTableHeaderCellComponent, RtDataTableIconDirective, RtDataTableRowActionsDirective, RtDataTableRowClickDirective, RtDataTableSelectorsDirective, RtDataTableStopRowClickDirective, comparePropNames, dataTableAllOnPage, dataTableAnyOnPage, dataTableAriaSort, dataTableCellText, dataTableCellValue, dataTableColumnFilter, dataTableCopyButtonSide, dataTableDayToIso, dataTableDefaultOperator, dataTableFiltersWithOperator, dataTableFiltersWithValue, dataTableIconName, dataTableIsoToDay, dataTableKeysOf, dataTableNextSortOrder, dataTablePresetEntities, dataTableSortActive, dataTableWithEntity, dataTableWithPageEntities, dataTableWithoutPageEntities };
2321
+ export { DATA_TABLE_FILTER_MENU_OPERATORS, DATA_TABLE_FILTER_OPERATOR_GLYPHS, RT_DATA_TABLE_ROW_HOST, RT_DATA_TABLE_STOP_ROW_CLICK_ATTRIBUTE, RtDataTableAdditionalRowActionsDirective, RtDataTableCellComponent, RtDataTableComponent, RtDataTableConfigService, RtDataTableCustomCellsDirective, RtDataTableFilterCellComponent, RtDataTableHeaderCellComponent, RtDataTableIconDirective, RtDataTableRowActionsDirective, RtDataTableRowClickDirective, RtDataTableSelectorsDirective, RtDataTableStopRowClickDirective, comparePropNames, dataTableAllOnPage, dataTableAnyOnPage, dataTableAriaSort, dataTableCellText, dataTableCellValue, dataTableColumnFilter, dataTableConfigKeyOf, dataTableCopyButtonSide, dataTableDayToIso, dataTableDefaultOperator, dataTableFiltersWithOperator, dataTableFiltersWithValue, dataTableIconName, dataTableIsoToDay, dataTableKeysOf, dataTableNextSortOrder, dataTablePresetEntities, dataTableSortActive, dataTableWithEntity, dataTableWithPageEntities, dataTableWithoutPageEntities };
2319
2322
 
2320
2323
  //# sourceMappingURL=rt-tools-ui-kit-v2-data-table.mjs.map