@olenbetong/appframe-ds 1.6.0 → 1.7.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 (154) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/package.json +3 -3
  3. package/scripts/copyAssets.mjs +27 -27
  4. package/src/autocomplete/Autocomplete.css +253 -253
  5. package/src/autocomplete/Autocomplete.tsx +320 -320
  6. package/src/autocomplete/AutocompleteFrame.tsx +168 -168
  7. package/src/autocomplete/Combobox.tsx +286 -286
  8. package/src/autocomplete/index.ts +4 -4
  9. package/src/autocomplete/types.ts +204 -204
  10. package/src/autocomplete/utils.ts +183 -183
  11. package/src/binding/BoundNumberInput.tsx +42 -42
  12. package/src/binding/BoundNumericTextField.tsx +102 -102
  13. package/src/binding/BoundTextField.tsx +49 -49
  14. package/src/binding/CancelButton.tsx +30 -30
  15. package/src/binding/CancelIconButton.tsx +30 -30
  16. package/src/binding/DataEditToolbar.css +23 -23
  17. package/src/binding/DataEditToolbar.tsx +84 -84
  18. package/src/binding/DeleteButton.tsx +35 -35
  19. package/src/binding/DeleteIconButton.tsx +35 -35
  20. package/src/binding/RefreshButton.tsx +31 -31
  21. package/src/binding/RefreshIconButton.tsx +33 -33
  22. package/src/binding/RefreshRowIconButton.tsx +33 -33
  23. package/src/binding/SaveButton.tsx +37 -37
  24. package/src/binding/SaveIconButton.tsx +38 -38
  25. package/src/binding/index.ts +20 -20
  26. package/src/container/Container.tsx +50 -50
  27. package/src/container/index.ts +1 -1
  28. package/src/cutoff/CutOffPicker.css +12 -12
  29. package/src/cutoff/CutOffPicker.tsx +165 -165
  30. package/src/cutoff/context.tsx +194 -194
  31. package/src/cutoff/dsCutOffDates.ts +21 -21
  32. package/src/cutoff/index.ts +4 -4
  33. package/src/cutoff/utils.test.ts +59 -59
  34. package/src/cutoff/utils.ts +276 -276
  35. package/src/filter/ChipListInput.tsx +79 -79
  36. package/src/filter/FieldFilterPanel.css +150 -150
  37. package/src/filter/FieldFilterPanel.tsx +309 -309
  38. package/src/filter/FilterBuilder.css +152 -152
  39. package/src/filter/FilterBuilder.test.tsx +153 -153
  40. package/src/filter/FilterBuilder.tsx +435 -435
  41. package/src/filter/FilterEditor.css +231 -231
  42. package/src/filter/FilterEditor.test.tsx +285 -285
  43. package/src/filter/FilterEditor.tsx +75 -75
  44. package/src/filter/FilterGroupEditor.tsx +160 -160
  45. package/src/filter/FilterNameDialog.css +22 -22
  46. package/src/filter/FilterNameDialog.tsx +81 -81
  47. package/src/filter/FilterRow.tsx +117 -117
  48. package/src/filter/FilterShareDialog.css +28 -28
  49. package/src/filter/FilterShareDialog.tsx +201 -201
  50. package/src/filter/FilterStringField.tsx +78 -78
  51. package/src/filter/FilterValueEditor.tsx +239 -239
  52. package/src/filter/SavedFilterTree.css +107 -107
  53. package/src/filter/SavedFilterTree.test.tsx +94 -94
  54. package/src/filter/SavedFilterTree.tsx +218 -218
  55. package/src/filter/fieldFilter.test.ts +158 -158
  56. package/src/filter/fieldFilter.ts +139 -139
  57. package/src/filter/index.ts +27 -27
  58. package/src/filter/types.ts +38 -38
  59. package/src/filter/useDistinctValues.test.ts +102 -102
  60. package/src/filter/useDistinctValues.ts +230 -230
  61. package/src/global.d.ts +11 -11
  62. package/src/grid/formatters.ts +23 -0
  63. package/src/grid/index.css +8 -2
  64. package/src/grid/index.tsx +73 -3
  65. package/src/grid/useAfColumns.tsx +28 -4
  66. package/src/grid/useAfGridApi.ts +3 -0
  67. package/src/grid/utcDate.test.ts +25 -0
  68. package/src/grid/utcDate.ts +28 -0
  69. package/src/grid/utcDateEditing.tsx +11 -0
  70. package/src/i18n.ts +13 -13
  71. package/src/index.ts +14 -14
  72. package/src/input/InputAdornments.css +80 -80
  73. package/src/input/InputAdornments.tsx +102 -102
  74. package/src/input/NumberInput.css +9 -9
  75. package/src/input/NumberInput.test.tsx +212 -212
  76. package/src/input/NumberInput.tsx +268 -268
  77. package/src/input/index.ts +3 -3
  78. package/src/input/numberFormat.test.ts +79 -79
  79. package/src/input/numberFormat.ts +94 -94
  80. package/src/layout/AppMenu.tsx +74 -74
  81. package/src/layout/AppMenuDrawer.css +71 -71
  82. package/src/layout/AppMenuDrawer.tsx +122 -122
  83. package/src/layout/AppMenuItem.css +6 -2
  84. package/src/layout/DialogMotion.css +79 -79
  85. package/src/layout/ErrorBoundary.tsx +162 -162
  86. package/src/layout/PageContainer.css +48 -48
  87. package/src/layout/PageContainer.tsx +41 -41
  88. package/src/layout/ResponsiveDialog.css +86 -86
  89. package/src/layout/ResponsiveDialog.tsx +55 -55
  90. package/src/layout/index.tsx +70 -70
  91. package/src/link/Link.tsx +23 -23
  92. package/src/link/index.ts +1 -1
  93. package/src/mdi/Mdi.css +8 -8
  94. package/src/mdi/Mdi.test.tsx +91 -91
  95. package/src/mdi/Mdi.tsx +141 -141
  96. package/src/mdi/MdiConfirmCloseDialog.tsx +47 -47
  97. package/src/mdi/MdiContext.tsx +59 -59
  98. package/src/mdi/MdiDocumentContext.tsx +60 -60
  99. package/src/mdi/MdiPanel.tsx +61 -61
  100. package/src/mdi/MdiRestore.test.tsx +86 -86
  101. package/src/mdi/MdiTab.tsx +30 -30
  102. package/src/mdi/controller.test.ts +382 -382
  103. package/src/mdi/controller.ts +656 -656
  104. package/src/mdi/dockviewHost.ts +132 -132
  105. package/src/mdi/fakeHost.ts +200 -200
  106. package/src/mdi/host.ts +44 -44
  107. package/src/mdi/ids.test.ts +20 -20
  108. package/src/mdi/ids.ts +18 -18
  109. package/src/mdi/index.ts +31 -31
  110. package/src/mdi/layoutRestore.test.ts +156 -156
  111. package/src/mdi/layoutRestore.ts +311 -311
  112. package/src/mdi/layoutSpec.test.ts +143 -143
  113. package/src/mdi/layoutSpec.ts +214 -214
  114. package/src/mdi/layoutStore.test.ts +93 -93
  115. package/src/mdi/layoutStore.ts +99 -99
  116. package/src/mdi/memorySettingsStore.ts +21 -21
  117. package/src/mdi/registry.ts +34 -34
  118. package/src/mdi/testTypes.ts +37 -37
  119. package/src/mdi/theme.ts +22 -22
  120. package/src/mdi/types.ts +214 -214
  121. package/src/page/Page.css +57 -57
  122. package/src/page/PageBlock.css +64 -64
  123. package/src/page/PageBlock.tsx +93 -93
  124. package/src/page/PageHeader.css +88 -88
  125. package/src/page/PageHeader.tsx +115 -115
  126. package/src/page/PageTitle.css +5 -5
  127. package/src/page/PageTitle.tsx +21 -21
  128. package/src/page/index.ts +4 -4
  129. package/src/paper/Paper.tsx +52 -52
  130. package/src/progress/LinearProgress.css +121 -121
  131. package/src/progress/LinearProgress.tsx +106 -106
  132. package/src/progress/index.ts +1 -1
  133. package/src/report-downloader/ReportDownloader.css +67 -67
  134. package/src/report-downloader/components/StatusItem.tsx +87 -87
  135. package/src/report-downloader/components/StatusList.tsx +28 -28
  136. package/src/report-downloader/index.ts +41 -41
  137. package/src/report-downloader/status.tsx +92 -92
  138. package/src/sortable/DropIndicator.css +51 -51
  139. package/src/sortable/DropIndicator.tsx +27 -27
  140. package/src/sortable/SortableItemList.css +21 -21
  141. package/src/sortable/SortableItemList.tsx +264 -264
  142. package/src/sortable/index.ts +8 -8
  143. package/src/sortable/reorderSortOrder.ts +126 -126
  144. package/src/sortable/sortOrder.ts +101 -101
  145. package/src/sortable/types.ts +9 -9
  146. package/src/sortable/useSortableContainer.ts +53 -53
  147. package/src/sortable/useSortableItem.ts +95 -95
  148. package/src/sortable/useSortableList.ts +117 -117
  149. package/src/test/happy-dom-document-class.ts +24 -24
  150. package/src/test/setup.ts +27 -27
  151. package/src/theme/useDsColorScheme.ts +53 -53
  152. package/tsconfig.build.json +9 -9
  153. package/tsconfig.json +8 -8
  154. package/vitest.config.ts +10 -10
@@ -1,143 +1,143 @@
1
- import { describe, expect, it } from "vitest";
2
-
3
- import { layoutSpecToLayout, listSpecDocuments, specDocumentId } from "./layoutSpec.js";
4
- import { testSpec, testTypes } from "./testTypes.js";
5
- import type { MdiLayoutSpec } from "./types.js";
6
-
7
- describe("layoutSpecToLayout", () => {
8
- it("builds the documents map with resolved titles and closable flags", () => {
9
- let layout = layoutSpecToLayout(testSpec, testTypes, 1);
10
-
11
- expect(layout.format).toBe(1);
12
- expect(layout.layoutVersion).toBe(1);
13
- expect(Object.keys(layout.documents)).toEqual(["explorer", "editor:a", "editor:b", "properties"]);
14
- expect(layout.documents["explorer"]).toEqual({
15
- type: "explorer",
16
- key: undefined,
17
- params: {},
18
- title: "Explorer",
19
- closable: false,
20
- });
21
- expect(layout.documents["editor:a"]).toMatchObject({
22
- key: "a",
23
- params: { name: "A" },
24
- title: "Editor A",
25
- closable: true,
26
- });
27
- });
28
-
29
- it("registers every panel on the shared mdi renderer", () => {
30
- let layout = layoutSpecToLayout(testSpec, testTypes, 1);
31
-
32
- for (let [id, panel] of Object.entries(layout.dockview.panels)) {
33
- expect(panel).toEqual({ id, contentComponent: "mdi", tabComponent: "mdi", title: layout.documents[id]!.title });
34
- }
35
- });
36
-
37
- it("mirrors the split tree with proportional sizes and alternating orientation", () => {
38
- let { dockview } = layoutSpecToLayout(testSpec, testTypes, 1);
39
- let root = dockview.grid.root;
40
-
41
- expect(dockview.grid.orientation).toBe("HORIZONTAL");
42
- expect(root.type).toBe("branch");
43
-
44
- let [explorer, right] = root.data as { type: string; size?: number; data: unknown }[];
45
- expect(explorer!.type).toBe("leaf");
46
- expect(explorer!.size).toBe(250);
47
- expect(right!.type).toBe("branch");
48
- expect(right!.size).toBe(750);
49
-
50
- let [editors, properties] = right!.data as { type: string; size?: number; data: { views: string[] } }[];
51
- expect(editors!.size).toBe(750);
52
- expect(properties!.size).toBe(250);
53
- expect(editors!.data.views).toEqual(["editor:a", "editor:b"]);
54
- });
55
-
56
- it("carries group options and the active tab", () => {
57
- let { dockview } = layoutSpecToLayout(testSpec, testTypes, 1);
58
- let [explorer, right] = dockview.grid.root.data as { data: unknown }[];
59
- let explorerGroup = explorer!.data as { id: string; locked?: unknown; hideHeader?: boolean; activeView?: string };
60
- let editorsGroup = (right!.data as { data: { activeView?: string } }[])[0]!.data;
61
-
62
- expect(explorerGroup).toMatchObject({
63
- id: "mdi-g1",
64
- locked: true,
65
- hideHeader: true,
66
- activeView: "explorer",
67
- });
68
- expect(editorsGroup.activeView).toBe("editor:b");
69
- expect(dockview.activeGroup).toBe("mdi-g1");
70
- });
71
-
72
- it("locks a group without a tab bar unless the spec says otherwise", () => {
73
- let spec: MdiLayoutSpec = {
74
- root: {
75
- direction: "horizontal",
76
- children: [
77
- { tabs: [{ type: "explorer" }], hideHeader: true },
78
- { tabs: [{ type: "properties" }], hideHeader: true, locked: false },
79
- { tabs: [{ type: "settings" }], locked: "no-drop-target" },
80
- ],
81
- },
82
- };
83
- let { dockview } = layoutSpecToLayout(spec, testTypes, 1);
84
- let groups = (dockview.grid.root.data as { data: { locked?: unknown } }[]).map((leaf) => leaf.data.locked);
85
-
86
- expect(groups).toEqual([true, undefined, "no-drop-target"]);
87
- });
88
-
89
- it("wraps a root group in a branch", () => {
90
- let layout = layoutSpecToLayout({ root: { tabs: [{ type: "settings" }] } }, testTypes, 0);
91
-
92
- expect(layout.dockview.grid.root.type).toBe("branch");
93
- expect((layout.dockview.grid.root.data as unknown[]).length).toBe(1);
94
- });
95
-
96
- it("inlines nested splits with the same direction", () => {
97
- let spec: MdiLayoutSpec = {
98
- root: {
99
- direction: "horizontal",
100
- children: [
101
- { tabs: [{ type: "explorer" }], size: 2 },
102
- {
103
- direction: "horizontal",
104
- size: 2,
105
- children: [{ tabs: [{ type: "settings" }] }, { tabs: [{ type: "properties" }] }],
106
- },
107
- ],
108
- },
109
- };
110
- let { dockview } = layoutSpecToLayout(spec, testTypes, 0);
111
- let children = dockview.grid.root.data as { type: string; size?: number }[];
112
-
113
- expect(children.map((child) => child.type)).toEqual(["leaf", "leaf", "leaf"]);
114
- expect(children.map((child) => child.size)).toEqual([500, 250, 250]);
115
- });
116
-
117
- it("rejects duplicate documents, unknown types and empty groups", () => {
118
- expect(() =>
119
- layoutSpecToLayout({ root: { tabs: [{ type: "settings" }, { type: "settings" }] } }, testTypes, 0),
120
- ).toThrow(/more than once/);
121
- expect(() => layoutSpecToLayout({ root: { tabs: [{ type: "nope" }] } }, testTypes, 0)).toThrow(
122
- /unknown document type/,
123
- );
124
- expect(() => layoutSpecToLayout({ root: { tabs: [] } }, testTypes, 0)).toThrow(/at least one tab/);
125
- });
126
-
127
- it("rejects an active tab that is not in the group", () => {
128
- expect(() =>
129
- layoutSpecToLayout({ root: { tabs: [{ type: "settings" }], active: "editor:a" } }, testTypes, 0),
130
- ).toThrow(/not part of its group/);
131
- });
132
- });
133
-
134
- describe("spec helpers", () => {
135
- it("ignores the key of singleton types", () => {
136
- expect(specDocumentId(testTypes, { type: "explorer", key: "ignored" })).toBe("explorer");
137
- expect(specDocumentId(testTypes, { type: "editor", key: "x" })).toBe("editor:x");
138
- });
139
-
140
- it("lists every document in the spec", () => {
141
- expect(listSpecDocuments(testSpec).map((tab) => tab.type)).toEqual(["explorer", "editor", "editor", "properties"]);
142
- });
143
- });
1
+ import { describe, expect, it } from "vitest";
2
+
3
+ import { layoutSpecToLayout, listSpecDocuments, specDocumentId } from "./layoutSpec.js";
4
+ import { testSpec, testTypes } from "./testTypes.js";
5
+ import type { MdiLayoutSpec } from "./types.js";
6
+
7
+ describe("layoutSpecToLayout", () => {
8
+ it("builds the documents map with resolved titles and closable flags", () => {
9
+ let layout = layoutSpecToLayout(testSpec, testTypes, 1);
10
+
11
+ expect(layout.format).toBe(1);
12
+ expect(layout.layoutVersion).toBe(1);
13
+ expect(Object.keys(layout.documents)).toEqual(["explorer", "editor:a", "editor:b", "properties"]);
14
+ expect(layout.documents["explorer"]).toEqual({
15
+ type: "explorer",
16
+ key: undefined,
17
+ params: {},
18
+ title: "Explorer",
19
+ closable: false,
20
+ });
21
+ expect(layout.documents["editor:a"]).toMatchObject({
22
+ key: "a",
23
+ params: { name: "A" },
24
+ title: "Editor A",
25
+ closable: true,
26
+ });
27
+ });
28
+
29
+ it("registers every panel on the shared mdi renderer", () => {
30
+ let layout = layoutSpecToLayout(testSpec, testTypes, 1);
31
+
32
+ for (let [id, panel] of Object.entries(layout.dockview.panels)) {
33
+ expect(panel).toEqual({ id, contentComponent: "mdi", tabComponent: "mdi", title: layout.documents[id]!.title });
34
+ }
35
+ });
36
+
37
+ it("mirrors the split tree with proportional sizes and alternating orientation", () => {
38
+ let { dockview } = layoutSpecToLayout(testSpec, testTypes, 1);
39
+ let root = dockview.grid.root;
40
+
41
+ expect(dockview.grid.orientation).toBe("HORIZONTAL");
42
+ expect(root.type).toBe("branch");
43
+
44
+ let [explorer, right] = root.data as { type: string; size?: number; data: unknown }[];
45
+ expect(explorer!.type).toBe("leaf");
46
+ expect(explorer!.size).toBe(250);
47
+ expect(right!.type).toBe("branch");
48
+ expect(right!.size).toBe(750);
49
+
50
+ let [editors, properties] = right!.data as { type: string; size?: number; data: { views: string[] } }[];
51
+ expect(editors!.size).toBe(750);
52
+ expect(properties!.size).toBe(250);
53
+ expect(editors!.data.views).toEqual(["editor:a", "editor:b"]);
54
+ });
55
+
56
+ it("carries group options and the active tab", () => {
57
+ let { dockview } = layoutSpecToLayout(testSpec, testTypes, 1);
58
+ let [explorer, right] = dockview.grid.root.data as { data: unknown }[];
59
+ let explorerGroup = explorer!.data as { id: string; locked?: unknown; hideHeader?: boolean; activeView?: string };
60
+ let editorsGroup = (right!.data as { data: { activeView?: string } }[])[0]!.data;
61
+
62
+ expect(explorerGroup).toMatchObject({
63
+ id: "mdi-g1",
64
+ locked: true,
65
+ hideHeader: true,
66
+ activeView: "explorer",
67
+ });
68
+ expect(editorsGroup.activeView).toBe("editor:b");
69
+ expect(dockview.activeGroup).toBe("mdi-g1");
70
+ });
71
+
72
+ it("locks a group without a tab bar unless the spec says otherwise", () => {
73
+ let spec: MdiLayoutSpec = {
74
+ root: {
75
+ direction: "horizontal",
76
+ children: [
77
+ { tabs: [{ type: "explorer" }], hideHeader: true },
78
+ { tabs: [{ type: "properties" }], hideHeader: true, locked: false },
79
+ { tabs: [{ type: "settings" }], locked: "no-drop-target" },
80
+ ],
81
+ },
82
+ };
83
+ let { dockview } = layoutSpecToLayout(spec, testTypes, 1);
84
+ let groups = (dockview.grid.root.data as { data: { locked?: unknown } }[]).map((leaf) => leaf.data.locked);
85
+
86
+ expect(groups).toEqual([true, undefined, "no-drop-target"]);
87
+ });
88
+
89
+ it("wraps a root group in a branch", () => {
90
+ let layout = layoutSpecToLayout({ root: { tabs: [{ type: "settings" }] } }, testTypes, 0);
91
+
92
+ expect(layout.dockview.grid.root.type).toBe("branch");
93
+ expect((layout.dockview.grid.root.data as unknown[]).length).toBe(1);
94
+ });
95
+
96
+ it("inlines nested splits with the same direction", () => {
97
+ let spec: MdiLayoutSpec = {
98
+ root: {
99
+ direction: "horizontal",
100
+ children: [
101
+ { tabs: [{ type: "explorer" }], size: 2 },
102
+ {
103
+ direction: "horizontal",
104
+ size: 2,
105
+ children: [{ tabs: [{ type: "settings" }] }, { tabs: [{ type: "properties" }] }],
106
+ },
107
+ ],
108
+ },
109
+ };
110
+ let { dockview } = layoutSpecToLayout(spec, testTypes, 0);
111
+ let children = dockview.grid.root.data as { type: string; size?: number }[];
112
+
113
+ expect(children.map((child) => child.type)).toEqual(["leaf", "leaf", "leaf"]);
114
+ expect(children.map((child) => child.size)).toEqual([500, 250, 250]);
115
+ });
116
+
117
+ it("rejects duplicate documents, unknown types and empty groups", () => {
118
+ expect(() =>
119
+ layoutSpecToLayout({ root: { tabs: [{ type: "settings" }, { type: "settings" }] } }, testTypes, 0),
120
+ ).toThrow(/more than once/);
121
+ expect(() => layoutSpecToLayout({ root: { tabs: [{ type: "nope" }] } }, testTypes, 0)).toThrow(
122
+ /unknown document type/,
123
+ );
124
+ expect(() => layoutSpecToLayout({ root: { tabs: [] } }, testTypes, 0)).toThrow(/at least one tab/);
125
+ });
126
+
127
+ it("rejects an active tab that is not in the group", () => {
128
+ expect(() =>
129
+ layoutSpecToLayout({ root: { tabs: [{ type: "settings" }], active: "editor:a" } }, testTypes, 0),
130
+ ).toThrow(/not part of its group/);
131
+ });
132
+ });
133
+
134
+ describe("spec helpers", () => {
135
+ it("ignores the key of singleton types", () => {
136
+ expect(specDocumentId(testTypes, { type: "explorer", key: "ignored" })).toBe("explorer");
137
+ expect(specDocumentId(testTypes, { type: "editor", key: "x" })).toBe("editor:x");
138
+ });
139
+
140
+ it("lists every document in the spec", () => {
141
+ expect(listSpecDocuments(testSpec).map((tab) => tab.type)).toEqual(["explorer", "editor", "editor", "properties"]);
142
+ });
143
+ });