@operato/data-grist 2.0.0-alpha.0 → 2.0.0-alpha.11

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 (100) hide show
  1. package/CHANGELOG.md +95 -0
  2. package/dist/src/accumulator/accumulator.js +4 -4
  3. package/dist/src/accumulator/accumulator.js.map +1 -1
  4. package/dist/src/configure/column-builder.js +5 -5
  5. package/dist/src/configure/column-builder.js.map +1 -1
  6. package/dist/src/configure/zero-config.js +3 -1
  7. package/dist/src/configure/zero-config.js.map +1 -1
  8. package/dist/src/data-card/data-card-field.js +1 -1
  9. package/dist/src/data-card/data-card-field.js.map +1 -1
  10. package/dist/src/data-grid/data-grid-accum-field.d.ts +1 -0
  11. package/dist/src/data-grid/data-grid-accum-field.js +8 -0
  12. package/dist/src/data-grid/data-grid-accum-field.js.map +1 -1
  13. package/dist/src/data-grid/data-grid-body.js +24 -3
  14. package/dist/src/data-grid/data-grid-body.js.map +1 -1
  15. package/dist/src/data-grid/data-grid-field.d.ts +1 -0
  16. package/dist/src/data-grid/data-grid-field.js +5 -0
  17. package/dist/src/data-grid/data-grid-field.js.map +1 -1
  18. package/dist/src/data-grid/data-grid-header.d.ts +1 -0
  19. package/dist/src/data-grid/data-grid-header.js +16 -14
  20. package/dist/src/data-grid/data-grid-header.js.map +1 -1
  21. package/dist/src/data-grid/event-handlers/data-grid-body-click-handler.js +2 -2
  22. package/dist/src/data-grid/event-handlers/data-grid-body-click-handler.js.map +1 -1
  23. package/dist/src/data-grid/event-handlers/data-grid-body-contextmenu-handler.d.ts +7 -0
  24. package/dist/src/data-grid/event-handlers/data-grid-body-contextmenu-handler.js +25 -0
  25. package/dist/src/data-grid/event-handlers/data-grid-body-contextmenu-handler.js.map +1 -0
  26. package/dist/src/data-grid/event-handlers/data-grid-body-dblclick-handler.js +2 -2
  27. package/dist/src/data-grid/event-handlers/data-grid-body-dblclick-handler.js.map +1 -1
  28. package/dist/src/data-grid/event-handlers/data-grid-body-focus-change-handler.js +2 -2
  29. package/dist/src/data-grid/event-handlers/data-grid-body-focus-change-handler.js.map +1 -1
  30. package/dist/src/data-grist.d.ts +225 -3
  31. package/dist/src/data-grist.js +195 -3
  32. package/dist/src/data-grist.js.map +1 -1
  33. package/dist/src/data-list/data-list-field.js +1 -1
  34. package/dist/src/data-list/data-list-field.js.map +1 -1
  35. package/dist/src/data-manipulator.d.ts +7 -3
  36. package/dist/src/data-manipulator.js +103 -20
  37. package/dist/src/data-manipulator.js.map +1 -1
  38. package/dist/src/editors/ox-grist-editor-tree.d.ts +6 -0
  39. package/dist/src/editors/ox-grist-editor-tree.js +27 -0
  40. package/dist/src/editors/ox-grist-editor-tree.js.map +1 -0
  41. package/dist/src/editors/ox-grist-editor.d.ts +1 -0
  42. package/dist/src/editors/ox-grist-editor.js +3 -0
  43. package/dist/src/editors/ox-grist-editor.js.map +1 -1
  44. package/dist/src/editors/ox-input-tree.d.ts +20 -0
  45. package/dist/src/editors/ox-input-tree.js +221 -0
  46. package/dist/src/editors/ox-input-tree.js.map +1 -0
  47. package/dist/src/editors/registry.js +3 -1
  48. package/dist/src/editors/registry.js.map +1 -1
  49. package/dist/src/filters/filters-form.js +1 -1
  50. package/dist/src/filters/filters-form.js.map +1 -1
  51. package/dist/src/handlers/contextmenu-tree-mutation.d.ts +3 -0
  52. package/dist/src/handlers/contextmenu-tree-mutation.js +82 -0
  53. package/dist/src/handlers/contextmenu-tree-mutation.js.map +1 -0
  54. package/dist/src/handlers/registry.js +3 -1
  55. package/dist/src/handlers/registry.js.map +1 -1
  56. package/dist/src/renderers/ox-grist-renderer-tree.d.ts +1 -0
  57. package/dist/src/renderers/ox-grist-renderer-tree.js +6 -3
  58. package/dist/src/renderers/ox-grist-renderer-tree.js.map +1 -1
  59. package/dist/src/types.d.ts +437 -6
  60. package/dist/src/types.js +9 -0
  61. package/dist/src/types.js.map +1 -1
  62. package/dist/stories/accumulator.stories.js +2 -1
  63. package/dist/stories/accumulator.stories.js.map +1 -1
  64. package/dist/stories/fixed-column.stories.js +3 -3
  65. package/dist/stories/fixed-column.stories.js.map +1 -1
  66. package/dist/stories/tree-column-with-checkbox.stories.js +8 -3
  67. package/dist/stories/tree-column-with-checkbox.stories.js.map +1 -1
  68. package/dist/stories/tree-column.stories.js +8 -3
  69. package/dist/stories/tree-column.stories.js.map +1 -1
  70. package/dist/tsconfig.tsbuildinfo +1 -1
  71. package/docs/gutter/gutter.md +7 -0
  72. package/package.json +5 -5
  73. package/src/accumulator/accumulator.ts +4 -4
  74. package/src/configure/column-builder.ts +4 -4
  75. package/src/configure/zero-config.ts +3 -1
  76. package/src/data-card/data-card-field.ts +1 -1
  77. package/src/data-grid/data-grid-accum-field.ts +7 -0
  78. package/src/data-grid/data-grid-body.ts +30 -3
  79. package/src/data-grid/data-grid-field.ts +6 -0
  80. package/src/data-grid/data-grid-header.ts +22 -18
  81. package/src/data-grid/event-handlers/data-grid-body-click-handler.ts +2 -2
  82. package/src/data-grid/event-handlers/data-grid-body-contextmenu-handler.ts +32 -0
  83. package/src/data-grid/event-handlers/data-grid-body-dblclick-handler.ts +2 -2
  84. package/src/data-grid/event-handlers/data-grid-body-focus-change-handler.ts +2 -2
  85. package/src/data-grist.ts +250 -3
  86. package/src/data-list/data-list-field.ts +1 -1
  87. package/src/data-manipulator.ts +130 -22
  88. package/src/editors/ox-grist-editor-tree.ts +27 -0
  89. package/src/editors/ox-grist-editor.ts +4 -0
  90. package/src/editors/ox-input-tree.ts +226 -0
  91. package/src/editors/registry.ts +3 -1
  92. package/src/filters/filters-form.ts +1 -1
  93. package/src/handlers/contextmenu-tree-mutation.ts +98 -0
  94. package/src/handlers/registry.ts +3 -1
  95. package/src/renderers/ox-grist-renderer-tree.ts +7 -3
  96. package/src/types.ts +446 -6
  97. package/stories/accumulator.stories.ts +2 -1
  98. package/stories/fixed-column.stories.ts +3 -3
  99. package/stories/tree-column-with-checkbox.stories.ts +8 -3
  100. package/stories/tree-column.stories.ts +8 -3
@@ -10,6 +10,18 @@ import { DataReportField } from './data-report/data-report-field';
10
10
  import { OxGristEditor } from './editors';
11
11
  import { QueryFilter } from './filters';
12
12
  import { OxGristRenderer } from './renderers/ox-grist-renderer';
13
+ /**
14
+ * Configuration object for defining the structure and behavior of a Grist table.
15
+ *
16
+ * @typedef {Object} GristConfig
17
+ * @property {ColumnConfig[]} columns - An array of column configurations.
18
+ * @property {RowsConfig} rows - Configuration for rows and their behavior.
19
+ * @property {ListConfig} list - Configuration for the list view.
20
+ * @property {TreeConfig} tree - Configuration for tree-related settings.
21
+ * @property {PaginationConfig} [pagination] - Configuration for pagination settings (optional).
22
+ * @property {SortersConfig} [sorters] - Configuration for sorting settings (optional).
23
+ * @property {FiltersConfig} [filters] - Configuration for filtering settings (optional).
24
+ */
13
25
  export type GristConfig = {
14
26
  columns: ColumnConfig[];
15
27
  rows: RowsConfig;
@@ -19,12 +31,41 @@ export type GristConfig = {
19
31
  sorters?: SortersConfig;
20
32
  filters?: FiltersConfig;
21
33
  };
34
+ /**
35
+ * Configuration object for specifying sorting options.
36
+ *
37
+ * @typedef {Object} SorterConfig
38
+ * @property {string} name - The name of the sorting option.
39
+ * @property {boolean} [desc] - Optional. Indicates whether the sorting is in descending order (optional).
40
+ */
22
41
  export type SorterConfig = {
23
42
  name: string;
24
43
  desc?: boolean;
25
44
  };
45
+ /**
46
+ * Configuration array for specifying multiple sorting options.
47
+ *
48
+ * @typedef {SorterConfig[]} SortersConfig
49
+ */
26
50
  export type SortersConfig = SorterConfig[];
51
+ /**
52
+ * Enumeration of filter operators used to define filter conditions.
53
+ *
54
+ * @typedef {'search' | 'eq' | 'between' | 'gte' | 'lte' | 'is_not_true' | 'in' | 'like' | 'i_like' | 'noteq' |
55
+ * 'is_empty_num_id' | 'is_blank' | 'is_present' | 'is_not_false' | 'is_true' | 'is_false' | 'is_not_null' |
56
+ * 'is_null' | 'notin_with_null' | 'notin' | 'gt' | 'lt' | 'i_nlike' | 'nlike'} FilterOperator
57
+ */
27
58
  export type FilterOperator = 'search' | 'eq' | 'between' | 'gte' | 'lte' | 'is_not_true' | 'in' | 'like' | 'i_like' | 'noteq' | 'is_empty_num_id' | 'is_blank' | 'is_present' | 'is_not_false' | 'is_true' | 'is_false' | 'is_not_null' | 'is_null' | 'notin_with_null' | 'notin' | 'gt' | 'lt' | 'i_nlike' | 'nlike';
59
+ /**
60
+ * Configuration object for specifying filter conditions.
61
+ *
62
+ * @typedef {Object} FilterConfigObject
63
+ * @property {string} type - The type of the filter condition.
64
+ * @property {FilterOperator} [operator] - The filter operator used to compare values (optional).
65
+ * @property {Object} [options] - Additional options or parameters for the filter condition (optional).
66
+ * @property {string|number|boolean|string[]|number[]|undefined} [value] - The value to compare with in the filter condition (optional).
67
+ * @property {string} [label] - The label to display for the filter condition (optional).
68
+ */
28
69
  export type FilterConfigObject = {
29
70
  type: string;
30
71
  operator?: FilterOperator;
@@ -34,7 +75,29 @@ export type FilterConfigObject = {
34
75
  value?: string | number | boolean | string[] | number[] | undefined;
35
76
  label?: string;
36
77
  };
78
+ /**
79
+ * Configuration option for specifying filter conditions.
80
+ *
81
+ * The `FilterConfig` type can take one of the following forms:
82
+ * - A `FilterConfigObject` representing a specific filter condition.
83
+ * - A `FilterOperator` representing a predefined filter operator.
84
+ * - A boolean value to enable or disable filtering for a specific column.
85
+ *
86
+ * @typedef {Object|FilterOperator|boolean} FilterConfig
87
+ */
37
88
  export type FilterConfig = FilterConfigObject | FilterOperator | boolean;
89
+ /**
90
+ * Represents a filter condition with the following properties:
91
+ *
92
+ * - `name`: The name of the column or field being filtered.
93
+ * - `operator`: The filter operator used for comparison.
94
+ * - `value`: The value or values to compare against.
95
+ *
96
+ * @typedef {Object} FilterValue
97
+ * @property {string} name - The name of the column or field.
98
+ * @property {FilterOperator} operator - The filter operator.
99
+ * @property {string|number|boolean|string[]|number[]|undefined} value - The value(s) to compare.
100
+ */
38
101
  export type FilterValue = {
39
102
  name: string;
40
103
  operator: FilterOperator;
@@ -42,24 +105,54 @@ export type FilterValue = {
42
105
  };
43
106
  /**
44
107
  * Configuration options for filters.
108
+ *
109
+ * @typedef {Object} FiltersConfig
110
+ * @property {boolean} [header] - Specifies whether to provide filtering functionality in the header.
45
111
  */
46
112
  export type FiltersConfig = {
47
- /**
48
- * Specifies whether to provide filtering functionality in the header.
49
- */
50
113
  header?: boolean;
51
114
  };
115
+ /**
116
+ * Configuration options for pagination.
117
+ *
118
+ * @typedef {Object} PaginationConfig
119
+ * @property {number} [page] - The current page number.
120
+ * @property {number} [limit] - The maximum number of records to display per page.
121
+ * @property {number[]} [pages] - An array of available page numbers.
122
+ * @property {boolean} [infinite] - Specifies whether to use infinite scrolling for pagination.
123
+ */
52
124
  export type PaginationConfig = {
53
125
  page?: number;
54
126
  limit?: number;
55
127
  pages?: number[];
56
128
  infinite?: boolean;
57
129
  };
130
+ /**
131
+ * Option to specify the inheritance behavior for including data from parent domains.
132
+ *
133
+ * - 'None': Do not include data from the parent domain.
134
+ * - 'Include': Include data from the parent domain along with current domain data.
135
+ * - 'Only': Include data only from the parent domain, excluding current domain data.
136
+ *
137
+ * @enum {string}
138
+ */
58
139
  export declare enum InheritedValueType {
59
140
  None = "None",
60
141
  Include = "Include",
61
142
  Only = "Only"
62
143
  }
144
+ /**
145
+ * Configuration options for fetching data from a data source.
146
+ *
147
+ * @typedef {Object} FetchOption
148
+ * @property {number} [page] - The page number to retrieve.
149
+ * @property {number} [limit] - The maximum number of records to retrieve per page.
150
+ * @property {SortersConfig} [sorters] - An array of sorting configurations for data. Only one of these options needs to be set.
151
+ * @property {SortersConfig} [sortings] - An array of sorting configurations for data. Only one of these options needs to be set.
152
+ * @property {QueryFilter[]} [filters] - An array of filtering criteria.
153
+ * @property {InheritedValueType} [inherited] - Specifies the inheritance behavior for including data from parent domains.
154
+ * @property {object} [options] - Additional options for customizing data fetching behavior.
155
+ */
63
156
  export type FetchOption = {
64
157
  page?: number;
65
158
  limit?: number;
@@ -69,23 +162,115 @@ export type FetchOption = {
69
162
  inherited?: InheritedValueType;
70
163
  options?: object;
71
164
  };
165
+ /**
166
+ * Represents the result of a data fetching operation.
167
+ *
168
+ * @typedef {Object} FetchResult
169
+ * @property {number} [page] - The page number of the fetched data.
170
+ * @property {number} [limit] - The maximum number of records per page.
171
+ * @property {number} total - The total number of records in the data source.
172
+ * @property {GristRecord[]} records - An array of fetched data records.
173
+ */
72
174
  export type FetchResult = {
73
175
  page?: number;
74
176
  limit?: number;
75
177
  total: number;
76
178
  records: GristRecord[];
77
179
  } | void;
180
+ /**
181
+ * A function that handles data fetching operations.
182
+ *
183
+ * @param param - The fetch options specifying how data should be retrieved.
184
+ * @returns A promise that resolves to a `FetchResult`.
185
+ */
78
186
  export type FetchHandler = (param: FetchOption) => Promise<FetchResult>;
79
- export type GristEventHandler = (columns: ColumnConfig[], data?: GristData, column?: ColumnConfig, record?: GristRecord, rowIndex?: number, target?: any) => void;
187
+ /**
188
+ * Represents a Grist event handler function.
189
+ *
190
+ * @typedef {Function} GristEventHandler
191
+ * @param {ColumnConfig[]} columns - An array of column configurations.
192
+ * @param {GristData} [data] - The Grist data associated with the event.
193
+ * @param {ColumnConfig} [column] - The column configuration related to the event (if applicable).
194
+ * @param {GristRecord} [record] - The Grist record related to the event (if applicable).
195
+ * @param {number} [rowIndex] - The index of the row related to the event (if applicable).
196
+ * @param {any} [target] - The target element or object related to the event (if applicable).
197
+ * @param {Event} [e] - The event object (if applicable).
198
+ * @returns {void}
199
+ */
200
+ export type GristEventHandler = (columns: ColumnConfig[], data?: GristData, column?: ColumnConfig, record?: GristRecord, rowIndex?: number, target?: any, e?: Event) => void;
201
+ /**
202
+ * Represents an accumulator function for data aggregation and accumulation.
203
+ *
204
+ * @typedef {string|'sum'|'avg'|'count'|'min'|'max'|Function} AccumulatorFunc
205
+ * @param {GristData} data - The Grist data for aggregation.
206
+ * @param {ColumnConfig} column - The column configuration for aggregation.
207
+ * @returns {string|number} - The aggregated result.
208
+ */
80
209
  export type AccumulatorFunc = 'sum' | 'avg' | 'count' | 'min' | 'max' | ((data: GristData, column: ColumnConfig) => string | number);
210
+ /**
211
+ * Type representing an accumulator function or configuration object.
212
+ *
213
+ * An accumulator is used for data aggregation and accumulation purposes. It can be either
214
+ * a predefined accumulator function (e.g., 'sum', 'avg', 'count', etc.) or a configuration
215
+ * object specifying the type of accumulator and labeling options.
216
+ *
217
+ * @typedef {AccumulatorFunc|{type: AccumulatorFunc, tag?: boolean}} AccumulatorObject
218
+ * @property {AccumulatorFunc} [type] - The type of accumulator function or predefined function name.
219
+ * @property {boolean} [tag] - An option for adding a label to represent the result of an aggregation function. This label is added in front of the aggregated value.
220
+ *
221
+ * @example
222
+ * // Using a predefined accumulator function:
223
+ * const accumulator: AccumulatorObject = 'sum'; // Represents a 'sum' accumulator.
224
+ *
225
+ * // Using an accumulator configuration object:
226
+ * const accumulatorConfig: AccumulatorObject = {
227
+ * type: 'avg', // Specifies the type of accumulator ('avg' for average).
228
+ * tag: true, // Option for adding a label to represent the result of an aggregation function. This label is added in front of the aggregated value.
229
+ * };
230
+ */
81
231
  export type AccumulatorObject = AccumulatorFunc | {
82
232
  type: AccumulatorFunc;
83
233
  tag?: boolean;
84
234
  };
235
+ /**
236
+ * Type representing column configuration information.
237
+ *
238
+ * @typedef {object} ColumnConfig
239
+ * @property {string} type - Represents the data type of the column (e.g., 'text', 'number', 'date', 'gutter', etc.).
240
+ * @property {string} name - Represents the name of the column.
241
+ * @property {('button'|'sequence'|'row-selector'|'dirty')} [gutterName] - If the column type is 'gutter', specifies the name of one of the registered gutters (only set when the type is 'gutter').
242
+ * @property {boolean} [fixed] - In case of a grid type column, specifies whether the column's position should be fixed and unaffected by horizontal scrolling (optional).
243
+ * @property {HeaderConfig} header - Object representing the header configuration of the column.
244
+ * @property {RecordConfig} record - Object representing the record configuration of the column.
245
+ * @property {GristEventHandlerSet} handlers - Object representing the Grist event handler settings.
246
+ * @property {LabelConfig} label - Object representing the label configuration of the column. This property is used to represent the label of the column's information in list mode, card mode, and when displaying the column in a filter form (ox-filters-form).
247
+ * @property {boolean} [hidden] - Indicates whether the column is hidden or not (optional).
248
+ * @property {boolean} [sortable] - Indicates whether the column is sortable or not (optional). If this setting is true, the header provides the ability to toggle the sorting direction.
249
+ * @property {boolean} [resizable] - Indicates whether the column is resizable or not (optional). This setting determines whether the column's width can be adjusted.
250
+ * @property {(number|string|ColumnWidthCallback)} [width] - Represents the width of the column (e.g., 100, '50%', or a callback function to calculate width).
251
+ * @property {boolean} [forList] - Indicates whether the column is intended for display in list mode (optional, applicable only to gutter type columns).
252
+ * @property {boolean} [forCard] - Indicates whether the column is intended for display in card mode (optional, applicable only to gutter type columns).
253
+ * @property {ValidationCallback} [validation] - Callback function for column validation (optional). This function validates whether the value of the column is valid when edited.
254
+ * @property {AccumulatorObject} [accumulator] - Object used for accumulating values of the column (optional, applicable only in grid mode). It specifies a function to automatically aggregate the values of the column for all records. The aggregated result is displayed in a row below the last record (accumulation record).
255
+ * @property {FilterConfig} [filter] - Object representing the filter configuration of the column.
256
+ * @property {(ImexConfig|boolean)} [imex] - Object or boolean value representing the configuration for importing and exporting column data.
257
+ * @property {boolean} [multiple] - Indicates whether the column allows multiple selections or not (optional).
258
+ * @property {boolean} [rowCount] - Indicates whether the column shows the row count or not (optional).
259
+ */
85
260
  export type ColumnConfig = {
86
261
  type: string;
87
262
  name: string;
88
- gutterName?: string;
263
+ /**
264
+ * "gutter" 타입의 컬럼인 경우, 등록된 gutter들 중의 하나의 이름을 명시합니다(type이 gutter인 경우에만 설정합니다).
265
+ * (e.g., 'button', 'sequence', 'row-selector', 'dirty', etc)
266
+ *
267
+ * "Gutter"는 테이블 형태에서 각 행의 왼쪽 또는 오른쪽에 위치한 추가적인 열(column)을 가리킵니다.
268
+ * 이 열은 주로 각 행(row)을 식별하거나 특정 작업을 수행하기 위한 버튼 또는 링크와 같은 요소를 표시하는 데 사용됩니다.
269
+ * Gutter 열은 주로 데이터 행에 대한 조작 또는 행의 상태를 나타내는 데 사용됩니다.
270
+ * 예를 들어, 테이블에서 각 행이 특정 작업을 수행하는 버튼을 포함할 때, 이러한 버튼이 Gutter 열에 배치될 수 있습니다.
271
+ * 또한 Gutter 열은 행을 선택하거나 행의 상태를 나타내는 체크박스를 포함할 수도 있습니다.
272
+ */
273
+ gutterName?: 'button' | 'sequence' | 'row-selector' | 'dirty';
89
274
  fixed?: boolean;
90
275
  header: HeaderConfig;
91
276
  record: RecordConfig;
@@ -96,6 +281,7 @@ export type ColumnConfig = {
96
281
  resizable?: boolean;
97
282
  width?: number | string | ColumnWidthCallback;
98
283
  forList?: boolean;
284
+ forCard?: boolean;
99
285
  validation?: ValidationCallback;
100
286
  accumulator?: AccumulatorObject;
101
287
  filter?: FilterConfig;
@@ -103,20 +289,99 @@ export type ColumnConfig = {
103
289
  multiple?: boolean;
104
290
  rowCount?: boolean;
105
291
  };
292
+ /**
293
+ * Callback function type for column validation.
294
+ *
295
+ * This function is used to validate whether the value of a column is valid when edited.
296
+ *
297
+ * @callback ValidationCallback
298
+ * @param {any} after - The new value of the column after editing.
299
+ * @param {any} before - The previous value of the column before editing.
300
+ * @param {GristRecord} record - The record being edited.
301
+ * @param {ColumnConfig} column - The configuration of the column being edited.
302
+ * @returns {boolean} - Returns `true` if the value is valid, `false` otherwise.
303
+ */
106
304
  export type ValidationCallback = (after: any, before: any, record: GristRecord, column: ColumnConfig) => boolean;
305
+ /**
306
+ * Configuration options for column labels.
307
+ *
308
+ * The label for a column can be customized using various options.
309
+ *
310
+ * @typedef {string|boolean|Object} LabelConfig
311
+ * @property {LabelRenderer} [renderer] - A custom renderer function for the column label.
312
+ *
313
+ * @example
314
+ * // Using a string as a label:
315
+ * const label: LabelConfig = "Column Label"; // Sets the label as "Column Label".
316
+ *
317
+ * // Using a boolean to determine label visibility:
318
+ * const label: LabelConfig = true; // Shows the default label based on the header configuration.
319
+ *
320
+ * // Using a custom renderer function for the label:
321
+ * const label: LabelConfig = {
322
+ * renderer: customLabelRenderer, // Specifies a custom renderer function.
323
+ * };
324
+ */
107
325
  export type LabelConfig = string | boolean | {
108
326
  renderer: LabelRenderer;
109
327
  };
110
- export type LabelRenderer = () => void;
328
+ /**
329
+ * Custom label renderer function for generating column labels.
330
+ *
331
+ * @callback LabelRenderer
332
+ * @param {ColumnConfig} column - The column configuration object for which the label is being generated.
333
+ * @returns {void}
334
+ */
335
+ export type LabelRenderer = (column: ColumnConfig) => void;
336
+ /**
337
+ * Custom callback function for calculating column width.
338
+ *
339
+ * @callback ColumnWidthCallback
340
+ * @param {ColumnConfig} column - The column configuration object for which the width is being calculated.
341
+ * @returns {string} - The calculated width as a string (e.g., '100', '50%').
342
+ */
111
343
  export type ColumnWidthCallback = (column: ColumnConfig) => string;
344
+ /**
345
+ * Configuration for defining the header of a column.
346
+ *
347
+ * @typedef {Object} HeaderConfig
348
+ * @property {HeaderRenderer} renderer - The function used to render the column header.
349
+ * @property {string} [style] - Optional CSS style for the column header.
350
+ * @property {string} [group] - Optional group identifier for the column header.
351
+ * @property {string} [groupStyle] - Optional CSS style for the header group.
352
+ */
112
353
  export type HeaderConfig = {
113
354
  renderer: HeaderRenderer;
114
355
  style?: string;
115
356
  group?: string;
116
357
  groupStyle?: string;
117
358
  };
359
+ /**
360
+ * Function type for rendering column headers.
361
+ *
362
+ * @callback HeaderRenderer
363
+ * @param {ColumnConfig} column - The column configuration object.
364
+ * @returns {*} - The rendered header content.
365
+ */
118
366
  export type HeaderRenderer = (column: ColumnConfig) => any;
367
+ /**
368
+ * Function type for generating values.
369
+ *
370
+ * @callback ValueGeneratorFn
371
+ * @param {...any} args - The arguments used for generating a value.
372
+ * @returns {*} - The generated value.
373
+ */
119
374
  export type ValueGeneratorFn = (...args: any[]) => any;
375
+ /**
376
+ * Configuration for specifying default values for fields in a record.
377
+ * Default values can be set using predefined value generator functions or custom user-defined functions.
378
+ * This configuration allows you to define the default value generation method and any additional parameters.
379
+ *
380
+ * @typedef {Object|Function} DefaultValueFnConfig
381
+ * @property {string} [name] - The name of the default value function to be used for the column.
382
+ * @property {any[]} [params] - The parameters to be passed to the default value function.
383
+ * @property {Function} [Function] - A custom user-defined function for generating default values.
384
+ */
120
385
  export type DefaultValueFnConfig = {
121
386
  /**
122
387
  * The name of the default value function to be used for the column.
@@ -127,6 +392,24 @@ export type DefaultValueFnConfig = {
127
392
  */
128
393
  params?: any[];
129
394
  } | Function;
395
+ /**
396
+ * Configuration for defining fields within a record.
397
+ * Each field can have various settings such as rendering, editing, alignment, etc.
398
+ * The 'defaultValue' property is used to specify the default value generation method and parameters.
399
+ *
400
+ * @typedef {Object} RecordConfig
401
+ * @property {FieldRenderer} renderer - The rendering function for the field.
402
+ * @property {FieldEditor|undefined} [editor] - The editing function for the field (optional).
403
+ * @property {boolean|Function} [editable] - Specifies if the field is editable. It can be a boolean or a function (optional).
404
+ * @property {boolean} [mandatory] - Specifies if the field is mandatory (optional).
405
+ * @property {GristClassifier} classifier - A classifier function for the field.
406
+ * @property {'left'|'right'|'center'} [align] - The alignment of the field's content (optional).
407
+ * @property {*} options - Additional options for the field.
408
+ * @property {string|undefined} [rowOptionField] - The name of a field for row-level options associated with this field (optional).
409
+ * @property {DefaultValueFnConfig|undefined} [defaultValue] - Configuration for specifying the default value for the field.
410
+ * It can be a predefined value generator function or a custom user-defined function (optional).
411
+ * @property {Object.<string, *>|undefined} [extended] - Additional extended properties that can be added as needed for specific field configurations (optional).
412
+ */
130
413
  export type RecordConfig = {
131
414
  renderer: FieldRenderer;
132
415
  editor?: FieldEditor;
@@ -139,29 +422,107 @@ export type RecordConfig = {
139
422
  defaultValue?: DefaultValueFnConfig;
140
423
  [extended: string]: any;
141
424
  };
425
+ /**
426
+ * A function type used for rendering the content of a field in various components.
427
+ *
428
+ * @callback FieldRenderer
429
+ * @param {*} value - The value of the field to be rendered.
430
+ * @param {ColumnConfig} column - The configuration of the column to which the field belongs.
431
+ * @param {GristRecord} record - The record object containing the field's data.
432
+ * @param {number} rowIndex - The index of the row to which the field belongs.
433
+ * @param {DataGridField|RecordCard|DataCardGutter|DataCardField|DataListGutter|DataListField|RecordPartial|DataReportField|Element} owner - The component or element that owns the field.
434
+ * @returns {OxGristRenderer|TemplateResult|string|void} - The rendered content, which can be of different types depending on the implementation.
435
+ */
142
436
  export type FieldRenderer = (value: any, column: ColumnConfig, record: GristRecord, rowIndex: number, owner: DataGridField | RecordCard | DataCardGutter | DataCardField | DataListGutter | DataListField | RecordPartial | DataReportField | Element) => OxGristRenderer | TemplateResult | string | void;
437
+ /**
438
+ * A function type used for defining a custom editor for a field in a data grid.
439
+ *
440
+ * @callback FieldEditor
441
+ * @param {*} value - The current value of the field.
442
+ * @param {ColumnConfig} column - The configuration of the column to which the field belongs.
443
+ * @param {GristRecord} record - The record object containing the field's data.
444
+ * @param {number} rowIndex - The index of the row to which the field belongs.
445
+ * @param {DataGridField} field - The data grid field that owns the editor.
446
+ * @returns {OxGristEditor} - The custom editor component.
447
+ */
143
448
  export type FieldEditor = (value: any, column: ColumnConfig, record: GristRecord, rowIndex: number, field: DataGridField) => OxGristEditor;
449
+ /**
450
+ * A function type used for rendering the filter select options in a filter form.
451
+ *
452
+ * @callback FilterSelectRenderer
453
+ * @param {ColumnConfig} column - The configuration of the column for which the filter is being rendered.
454
+ * @param {(string|number|boolean|string[]|number[]|any|undefined)} value - The current value of the filter.
455
+ * @param {Element} owner - The DOM element that owns the filter select renderer.
456
+ * @returns {(TemplateResult|string|void)} - The rendered filter select options as a Lit HTML template result, a string, or nothing.
457
+ */
144
458
  export type FilterSelectRenderer = (column: ColumnConfig, value: string | number | boolean | string[] | number[] | any | undefined, owner: Element) => TemplateResult | string | void;
459
+ /**
460
+ * An object representing a set of event handler functions for various events in Grist.
461
+ *
462
+ * @typedef {Object} GristEventHandlerSet
463
+ * @property {GristEventHandler} [click] - The click event handler function.
464
+ * @property {GristEventHandler} [dblclick] - The double-click event handler function.
465
+ * @property {GristEventHandler} [focus] - The focus event handler function.
466
+ * @property {GristEventHandler} [contextmenu] - The context menu event handler function.
467
+ */
145
468
  export type GristEventHandlerSet = {
146
469
  click?: GristEventHandler;
147
470
  dblclick?: GristEventHandler;
148
471
  focus?: GristEventHandler;
472
+ contextmenu?: GristEventHandler;
149
473
  };
474
+ /**
475
+ * Configuration options for defining how records are displayed in list mode in a Grist.
476
+ *
477
+ * @typedef {Object} ListConfig
478
+ * @property {string} [thumbnail] - The name of the field to use as a thumbnail image for records in list mode.
479
+ * @property {string[]} fields - An array of field names to display in the list mode.
480
+ * @property {string[]} details - An array of field names to display as additional details in the list mode.
481
+ */
150
482
  export type ListConfig = {
151
483
  thumbnail?: string;
152
484
  fields: string[];
153
485
  details: string[];
154
486
  };
487
+ /**
488
+ * Configuration options for managing tree-like structures in a Grist table.
489
+ *
490
+ * @typedef {Object} TreeConfig
491
+ * @property {string} [childrenProperty] - The property name that specifies the children of a record.
492
+ * @property {boolean | Function} [expanded] - Specifies whether tree nodes are initially expanded or a function to determine the initial expansion state for a given record.
493
+ */
155
494
  export type TreeConfig = {
156
495
  childrenProperty?: string;
157
496
  expanded?: boolean | ((x: GristRecord) => boolean);
158
497
  };
498
+ /**
499
+ * Configuration options for importing and exporting column data.
500
+ *
501
+ * @typedef {Object} ImexConfig
502
+ * @property {string} header - The header text for the column in import/export settings.
503
+ * @property {string} key - The key or identifier for the column in import/export settings.
504
+ * @property {number} width - The width of the column in import/export settings.
505
+ * @property {string} type - The data type of the column in import/export settings.
506
+ */
159
507
  export type ImexConfig = {
160
508
  header: string;
161
509
  key: string;
162
510
  width: number;
163
511
  type: string;
164
512
  };
513
+ /**
514
+ * Configuration options for defining rows within a Grist table or view.
515
+ *
516
+ * @typedef {Object} RowsConfig
517
+ * @property {boolean} [accumulator] - Specifies whether an accumulator row should be displayed.
518
+ * @property {boolean} appendable - Indicates whether new rows can be appended to the table.
519
+ * @property {boolean} insertable - Indicates whether new rows can be inserted into the table.
520
+ * @property {RowSelectableConfig} [selectable] - Configuration for row selection options.
521
+ * @property {GroupConfig[]} groups - An array of group configuration options.
522
+ * @property {string[]} totals - An array of field names for which totals should be calculated and displayed.
523
+ * @property {GristClassifier} classifier - A function that classifies rows based on their attributes.
524
+ * @property {GristEventHandlerSet} handlers - An object containing event handler functions for various row-level events.
525
+ */
165
526
  export type RowsConfig = {
166
527
  accumulator?: boolean;
167
528
  appendable: boolean;
@@ -172,10 +533,37 @@ export type RowsConfig = {
172
533
  classifier: GristClassifier;
173
534
  handlers: GristEventHandlerSet;
174
535
  };
536
+ /**
537
+ * A function used to classify and style individual records in a Grist table.
538
+ *
539
+ * @typedef {Function} GristClassifier
540
+ *
541
+ * @param {GristRecord} record - The record to be classified.
542
+ * @param {number} rowIndex - The index of the row in the table.
543
+ *
544
+ * @returns {Object|void} An object containing classification properties or `void`.
545
+ * - `emphasized` (optional): A boolean, string, or array of strings indicating the emphasis style.
546
+ * - Additional properties can be added as needed for custom styling.
547
+ */
175
548
  export type GristClassifier = (record: GristRecord, rowIndex: number) => {
176
549
  emphasized?: boolean | string | string[];
177
550
  [key: string]: any;
178
551
  } | void;
552
+ /**
553
+ * Configuration options for defining group headers in a Grist table.
554
+ *
555
+ * @typedef {Object} GroupConfig
556
+ *
557
+ * @property {string} align - The alignment of the group header ('left', 'center', or 'right').
558
+ * @property {ColumnConfig} [titleColumn] - The column configuration used as the title of the group (optional).
559
+ * @property {string} title - The title of the group.
560
+ * @property {string} [value] - A value associated with the group (optional).
561
+ * @property {string} [groupName] - The name of the group (optional).
562
+ * @property {number} [row] - The row index where the group header should appear (optional).
563
+ * @property {string|number} column - The column name or index where the group header should appear.
564
+ * @property {number} rowspan - The number of rows the group header should span.
565
+ * @property {number} [colspan] - The number of columns the group header should span (optional).
566
+ */
179
567
  export type GroupConfig = {
180
568
  align: string;
181
569
  titleColumn?: ColumnConfig;
@@ -187,9 +575,35 @@ export type GroupConfig = {
187
575
  rowspan: number;
188
576
  colspan?: number;
189
577
  };
578
+ /**
579
+ * Configuration options for specifying row selectability in a Grist table.
580
+ *
581
+ * @typedef {Object} RowSelectableConfig
582
+ *
583
+ * @property {boolean} [multiple] - Indicates whether multiple rows can be selected (optional).
584
+ */
190
585
  export type RowSelectableConfig = {
191
586
  multiple?: boolean;
192
587
  };
588
+ /**
589
+ * Represents a data record in Grist.
590
+ *
591
+ * @typedef {Object} GristRecord
592
+ * @property {string} [id] - The unique identifier for the record.
593
+ * @property {string} [name] - The name or label associated with the record.
594
+ * @property {GristRecord[]} [children] - An array of child records, if applicable.
595
+ * @property {number} [__seq__] - A numeric sequence identifier for the record.
596
+ * @property {string} [__dirty__] - Indicates if the record is dirty (changed).
597
+ * @property {boolean} [__selected__] - Indicates if the record is selected.
598
+ * @property {object[]} [__changes__] - An array of changes made to the record.
599
+ * @property {object} [__dirtyfields__] - An object representing dirty (changed) fields in the record.
600
+ * @property {any} [__origin__] - The original data or source of the record.
601
+ * @property {boolean} [__collapsed__] - Indicates if the record is collapsed (e.g., in a tree view).
602
+ * @property {number} [__depth__] - The depth or level of the record in a hierarchical structure.
603
+ * @property {'checked' | 'half-checked' | 'unchecked'} [__check_in_tree__] - Indicates the check state of the record in a tree view.
604
+ * @property {GristRecord[]} [__children__] - An array of child records in a tree view.
605
+ * @property {any} [key] - Additional custom properties specific to the record.
606
+ */
193
607
  export type GristRecord = {
194
608
  id?: string;
195
609
  name?: string;
@@ -208,10 +622,27 @@ export type GristRecord = {
208
622
  __children__?: GristRecord[];
209
623
  [key: string]: any;
210
624
  };
625
+ /**
626
+ * Represents a set of data retrieved from a Grist table.
627
+ *
628
+ * @typedef {Object} GristData
629
+ *
630
+ * @property {number} [page] - The page number of the retrieved data (optional).
631
+ * @property {number} [total] - The total number of records in the data source (optional).
632
+ * @property {number} [limit] - The maximum number of records per page (optional).
633
+ * @property {GristRecord[]} records - An array of fetched data records.
634
+ */
211
635
  export type GristData = {
212
636
  page?: number;
213
637
  total?: number;
214
638
  limit?: number;
215
639
  records: GristRecord[];
216
640
  };
641
+ /**
642
+ * A function that determines whether a Grist record should be selected or not.
643
+ *
644
+ * @callback GristSelectFunction
645
+ * @param {GristRecord} record - The Grist record to evaluate.
646
+ * @returns {boolean} - `true` if the record should be selected, `false` otherwise.
647
+ */
217
648
  export type GristSelectFunction = (record: GristRecord) => boolean;
package/dist/src/types.js CHANGED
@@ -1,3 +1,12 @@
1
+ /**
2
+ * Option to specify the inheritance behavior for including data from parent domains.
3
+ *
4
+ * - 'None': Do not include data from the parent domain.
5
+ * - 'Include': Include data from the parent domain along with current domain data.
6
+ * - 'Only': Include data only from the parent domain, excluding current domain data.
7
+ *
8
+ * @enum {string}
9
+ */
1
10
  export var InheritedValueType;
2
11
  (function (InheritedValueType) {
3
12
  InheritedValueType["None"] = "None";