@gtkx/components 2.0.0-beta.10 → 2.0.0-beta.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 (75) hide show
  1. package/README.md +8 -168
  2. package/dist/column-view.d.ts.map +1 -1
  3. package/dist/column-view.js +19 -9
  4. package/dist/column-view.js.map +1 -1
  5. package/dist/index.d.ts +3 -2
  6. package/dist/index.d.ts.map +1 -1
  7. package/dist/index.js +2 -1
  8. package/dist/index.js.map +1 -1
  9. package/dist/internal/cells.d.ts +8 -1
  10. package/dist/internal/cells.d.ts.map +1 -1
  11. package/dist/internal/cells.js +84 -19
  12. package/dist/internal/cells.js.map +1 -1
  13. package/dist/internal/collection-index.d.ts +3 -2
  14. package/dist/internal/collection-index.d.ts.map +1 -1
  15. package/dist/internal/collection-index.js +3 -3
  16. package/dist/internal/collection-index.js.map +1 -1
  17. package/dist/internal/collection-model.d.ts +23 -2
  18. package/dist/internal/collection-model.d.ts.map +1 -1
  19. package/dist/internal/collection-model.js +118 -98
  20. package/dist/internal/collection-model.js.map +1 -1
  21. package/dist/internal/collection.d.ts +5 -4
  22. package/dist/internal/collection.d.ts.map +1 -1
  23. package/dist/internal/collection.js +20 -21
  24. package/dist/internal/collection.js.map +1 -1
  25. package/dist/internal/controlled-sync.d.ts +6 -8
  26. package/dist/internal/controlled-sync.d.ts.map +1 -1
  27. package/dist/internal/controlled-sync.js +3 -3
  28. package/dist/internal/controlled-sync.js.map +1 -1
  29. package/dist/internal/drop-down.d.ts.map +1 -1
  30. package/dist/internal/drop-down.js +43 -44
  31. package/dist/internal/drop-down.js.map +1 -1
  32. package/dist/internal/expansion.js +4 -4
  33. package/dist/internal/expansion.js.map +1 -1
  34. package/dist/internal/selection.d.ts +1 -0
  35. package/dist/internal/selection.d.ts.map +1 -1
  36. package/dist/internal/selection.js +6 -6
  37. package/dist/internal/selection.js.map +1 -1
  38. package/dist/internal/tree-expansion.d.ts.map +1 -1
  39. package/dist/internal/tree-expansion.js +2 -11
  40. package/dist/internal/tree-expansion.js.map +1 -1
  41. package/dist/internal/tree-order.d.ts.map +1 -1
  42. package/dist/internal/tree-order.js +32 -76
  43. package/dist/internal/tree-order.js.map +1 -1
  44. package/dist/internal/use-collection.d.ts +5 -1
  45. package/dist/internal/use-collection.d.ts.map +1 -1
  46. package/dist/internal/use-collection.js +21 -7
  47. package/dist/internal/use-collection.js.map +1 -1
  48. package/dist/list-item-factory.d.ts +10 -0
  49. package/dist/list-item-factory.d.ts.map +1 -0
  50. package/dist/list-item-factory.js +14 -0
  51. package/dist/list-item-factory.js.map +1 -0
  52. package/dist/toast.d.ts +3 -5
  53. package/dist/toast.d.ts.map +1 -1
  54. package/dist/toast.js +3 -12
  55. package/dist/toast.js.map +1 -1
  56. package/dist/types.d.ts +33 -50
  57. package/dist/types.d.ts.map +1 -1
  58. package/dist/types.js.map +1 -1
  59. package/package.json +12 -10
  60. package/src/column-view.tsx +23 -12
  61. package/src/index.ts +3 -2
  62. package/src/internal/cells.tsx +137 -20
  63. package/src/internal/collection-index.ts +8 -6
  64. package/src/internal/collection-model.ts +156 -134
  65. package/src/internal/collection.ts +28 -24
  66. package/src/internal/controlled-sync.ts +9 -12
  67. package/src/internal/drop-down.tsx +64 -60
  68. package/src/internal/expansion.ts +4 -4
  69. package/src/internal/selection.tsx +8 -8
  70. package/src/internal/tree-expansion.ts +2 -14
  71. package/src/internal/tree-order.ts +33 -121
  72. package/src/internal/use-collection.tsx +29 -8
  73. package/src/list-item-factory.tsx +27 -0
  74. package/src/toast.tsx +4 -18
  75. package/src/types.ts +35 -51
package/src/types.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import type * as Adw from "@gtkx/gi/adw";
2
+ import type * as GObject from "@gtkx/gi/gobject";
2
3
  import type * as Gtk from "@gtkx/gi/gtk";
3
4
  import type { AdwComboRowProps, AdwToastProps } from "@gtkx/jsx/adw";
4
5
  import type {
@@ -8,6 +9,7 @@ import type {
8
9
  GtkGridViewProps,
9
10
  GtkListViewProps,
10
11
  } from "@gtkx/jsx/gtk";
12
+ import type { Primitive } from "@gtkx/utils";
11
13
  import type { ReactNode, RefObject } from "react";
12
14
 
13
15
  /**
@@ -15,11 +17,11 @@ import type { ReactNode, RefObject } from "react";
15
17
  * arbitrary value. Nested items form a tree.
16
18
  */
17
19
  type ListItem<T = unknown> = {
18
- /** Stable identifier used to track the item across updates and selection, naming every row that carries it. */
20
+ /** Stable identifier, unique across the collection, used to preserve identity across updates and selection. */
19
21
  id: string;
20
22
  /** Payload handed to the cell renderer as `ListItemRenderArgs.item`. */
21
23
  value: T;
22
- /** Child items nested under this one, which turn a plain item list into a tree, read only as rows are drawn. */
24
+ /** Child items in an acyclic tree, read only as rows are drawn. */
23
25
  children?: ListItem<T>[] | undefined;
24
26
  /** Hides the tree expander arrow even when the item has children, through `hide-expander`. */
25
27
  shouldHideExpander?: boolean | undefined;
@@ -31,7 +33,7 @@ type ListItem<T = unknown> = {
31
33
 
32
34
  /** A group of items rendered under a shared section header. */
33
35
  type ListSection<S = unknown, T = unknown> = {
34
- /** Stable identifier used to track the section across updates. */
36
+ /** Stable identifier, unique among sections, used to track the section across updates. */
35
37
  id: string;
36
38
  /** Payload handed to the section header renderer as `ListSectionRenderArgs.section`. */
37
39
  value: S;
@@ -90,6 +92,10 @@ type ItemSizeProps = {
90
92
  estimatedItemWidth?: number | undefined;
91
93
  };
92
94
 
95
+ type ListItemFactoryProps<T extends GObject.Object> = ItemSizeProps & {
96
+ renderItem: ListItemRenderer<T>;
97
+ };
98
+
93
99
  /** The flat-collection hint shared by {@link ListView} and {@link ColumnView}. */
94
100
  type FlatnessProps = {
95
101
  /**
@@ -104,8 +110,7 @@ type FlatnessProps = {
104
110
  type SelectionProps = {
105
111
  /**
106
112
  * Ids of the items to keep selected; omitting it keeps nothing selected, and `onSelectionChanged` is how a
107
- * user's selection is adopted into it. An id repeated in several branches of a tree names every matching row,
108
- * and a single-selection view takes the first of them.
113
+ * user's selection is adopted into it.
109
114
  */
110
115
  selectedIds?: string[] | null | undefined;
111
116
  /** Called with one id per selected row whenever the selection changes, and once on mount. */
@@ -130,9 +135,7 @@ type ExpanderDescriptions = {
130
135
  type ExpansionProps = {
131
136
  /**
132
137
  * Ids of the items to keep expanded; omitting it keeps every row collapsed, and `onExpandedChange` is how a
133
- * user's expansion is adopted into it. An id repeated in several branches names every matching row, so all of
134
- * them expand together. An item whose children lead back to itself expands one level at a time, since a row
135
- * repeating an item already expanded above it stays collapsed.
138
+ * user's expansion is adopted into it.
136
139
  */
137
140
  expandedIds?: string[] | null | undefined;
138
141
  /** Called with one id per expanded row, in visible order, whenever expansion changes. */
@@ -156,12 +159,15 @@ type SortProps = {
156
159
  };
157
160
 
158
161
  /** The data a collection view renders, either as a plain item list or grouped into sections. */
159
- type SourceProps<T, S> = {
160
- /** Items to render, nesting through `ListItem.children` for a tree; ignored once `sections` is given. */
162
+ type SourceProps<T, S> = ({
163
+ /** Items to render, nesting through `ListItem.children` for a tree. */
161
164
  items?: ListItem<T>[] | undefined;
162
- /** Items grouped under section headers, rendered in place of `items`. */
163
- sections?: ListSection<S, T>[] | undefined;
164
- };
165
+ } & Partial<Record<"sections", undefined>> & Partial<Record<"renderHeader", null | undefined>>) | ({
166
+ /** Items grouped under section headers. */
167
+ sections: ListSection<S, T>[];
168
+ /** Renders the header shown above each section. */
169
+ renderHeader?: ListSectionRenderer<S> | null | undefined;
170
+ } & Partial<Record<"items", undefined>>);
165
171
 
166
172
  /** One column of a {@link ColumnView}, pairing Gtk.ColumnViewColumn props with a cell renderer. */
167
173
  type ColumnViewColumn<T = unknown> = Omit<GtkColumnViewColumnProps, "factory" | "sorter" | "id" | "title"> & {
@@ -186,36 +192,29 @@ type ColumnViewOwnProps<T, S> = SelectionProps &
186
192
  Omit<ItemSizeProps, "estimatedItemWidth"> & {
187
193
  /** Columns to render, in order; each carries its own cell renderer. */
188
194
  columns: ColumnViewColumn<T>[];
189
- /** Renders the header shown above each section. */
190
- renderHeader?: ListSectionRenderer<S> | null | undefined;
191
195
  /** Resolves the props of the row carrying one item's cells, such as its screen-reader label. */
192
196
  rowProps?: ListRowPropsResolver<T> | null | undefined;
193
197
  };
194
198
 
195
199
  /**
196
- * Props for {@link ColumnView}. Combines the underlying Gtk.ColumnView props with
197
- * declarative collection props: flat items or grouped sections, controlled selection
198
- * and expansion, sorting (sortColumn, sortOrder, onSortChanged), an optional section
199
- * header renderer, per-row props, and the columns to render.
200
+ * Native `Gtk.ColumnView` props with declarative columns and collections, controlled selection, expansion, and sorting.
200
201
  */
201
202
  type ColumnViewProps<T = unknown, S = unknown> = Omit<
202
203
  GtkColumnViewProps,
203
- "columns" | "model" | "headerFactory" | "rowFactory" | keyof ColumnViewOwnProps<T, S>
204
+ "children" | "columns" | "model" | "headerFactory" | "rowFactory" | keyof ColumnViewOwnProps<T, S>
204
205
  > &
205
206
  ColumnViewOwnProps<T, S>;
206
207
 
207
208
  /** The declarative collection props {@link DropDown} and `ComboRow` add on top of their widget's own. */
208
209
  type DropDownOwnProps<T, S> = SourceProps<T, S> & {
209
210
  /** Id of the currently selected item, making the selection controlled. */
210
- selectedId?: string | null | undefined;
211
- /** Called with the id of the item that became selected. */
212
- onSelectionChanged?: ((id: string) => void) | null | undefined;
213
- /** Renders the collapsed display, and the popup rows too unless `renderListItem` is given. */
211
+ selectedId?: string | undefined;
212
+ /** Called with the selected id, or `null` when the model becomes empty. */
213
+ onSelectionChanged?: ((id: string | null) => void) | null | undefined;
214
+ /** Renders the collapsed display and, unless overridden, the popup rows. Required for non-primitive values. */
214
215
  renderItem?: ListItemRenderer<T> | null | undefined;
215
216
  /** Renderer for items in the open popup list, falling back to renderItem when omitted. */
216
217
  renderListItem?: ListItemRenderer<T> | null | undefined;
217
- /** Renderer for section headers in the popup list. */
218
- renderHeader?: ListSectionRenderer<S> | null | undefined;
219
218
  };
220
219
 
221
220
  /** A drop-down-shaped widget's props with its model and factories swapped for the declarative collection props. */
@@ -223,12 +222,11 @@ type DropDownWidgetProps<Widget, T, S> = Omit<
223
222
  Widget,
224
223
  "model" | "factory" | "listFactory" | "headerFactory" | keyof DropDownOwnProps<T, S>
225
224
  > &
226
- DropDownOwnProps<T, S>;
225
+ DropDownOwnProps<T, S> &
226
+ (SourceProps<T & Primitive, S> | Record<"renderItem", ListItemRenderer<T>>);
227
227
 
228
228
  /**
229
- * Props for {@link DropDown}. Combines the underlying Gtk.DropDown props with the declarative
230
- * collection props: flat items or grouped sections, controlled single selection, and renderers
231
- * for the collapsed display, popup rows, and popup section headers.
229
+ * Native `Gtk.DropDown` props with declarative collections, controlled selection, and display/popup renderers.
232
230
  */
233
231
  type DropDownProps<T = unknown, S = unknown> = DropDownWidgetProps<GtkDropDownProps, T, S>;
234
232
 
@@ -242,9 +240,7 @@ type GridViewOwnProps<T> = ItemSizeProps &
242
240
  };
243
241
 
244
242
  /**
245
- * Props for {@link GridView}. Combines the underlying Gtk.GridView props with
246
- * declarative collection props: items, a per-cell renderItem, controlled selection,
247
- * and estimated item sizing.
243
+ * Native `Gtk.GridView` props with declarative cells, controlled selection, and estimated sizing.
248
244
  */
249
245
  type GridViewProps<T = unknown> = Omit<GtkGridViewProps, "model" | "factory" | keyof GridViewOwnProps<T>> &
250
246
  GridViewOwnProps<T>;
@@ -257,15 +253,11 @@ type ListViewOwnProps<T, S> = ItemSizeProps &
257
253
  FlatnessProps & {
258
254
  /** Renders the contents of one row. */
259
255
  renderItem: ListItemRenderer<T>;
260
- /** Renders the header shown above each section. */
261
- renderHeader?: ListSectionRenderer<S> | null | undefined;
262
256
  };
263
257
 
264
258
  /**
265
- * Props for {@link ListView}. Combines the underlying Gtk.ListView props with
266
- * declarative collection props: flat items or grouped sections, a per-row renderItem,
267
- * an optional section header renderer, controlled selection and expansion, and
268
- * estimated item sizing.
259
+ * Native `Gtk.ListView` props with declarative rows and sections, controlled selection and expansion,
260
+ * and estimated sizing.
269
261
  */
270
262
  type ListViewProps<T = unknown, S = unknown> = Omit<
271
263
  GtkListViewProps,
@@ -274,9 +266,7 @@ type ListViewProps<T = unknown, S = unknown> = Omit<
274
266
  ListViewOwnProps<T, S>;
275
267
 
276
268
  /**
277
- * Props for {@link ComboRow}. Combines the underlying Adw.ComboRow props with the declarative
278
- * collection props: flat items or grouped sections, controlled single selection, and renderers
279
- * for the row display, popup rows, and popup section headers.
269
+ * Native `Adw.ComboRow` props with declarative collections, controlled selection, and display/popup renderers.
280
270
  */
281
271
  type ComboRowProps<T = unknown, S = unknown> = DropDownWidgetProps<AdwComboRowProps, T, S>;
282
272
  /**
@@ -285,16 +275,10 @@ type ComboRowProps<T = unknown, S = unknown> = DropDownWidgetProps<AdwComboRowPr
285
275
  */
286
276
  type ToastOptions = Adw.ToastConstructorProps & Pick<AdwToastProps, "onButtonClicked" | "onDismissed">;
287
277
 
288
- /** Imperative controls for individual toasts, returned by {@link useToast}. */
278
+ /** Imperative controls for toasts, returned by {@link useToast}. */
289
279
  type ToastController = {
290
280
  /** Builds a toast, shows it through the overlay, and returns it. */
291
281
  show: (options?: ToastOptions) => Adw.Toast;
292
- /** Dismisses a single toast, typically one returned by `ToastController.show`. */
293
- dismiss: (toast: Adw.Toast) => void;
294
- };
295
-
296
- /** Imperative controls for the overlay as a whole, returned by {@link useToastOverlay}. */
297
- type ToastOverlayController = {
298
282
  /** Dismisses the shown toast and every queued one. */
299
283
  dismissAll: () => void;
300
284
  };
@@ -303,7 +287,7 @@ type ToastOverlayController = {
303
287
  type ToastProviderProps = {
304
288
  /** Ref also given to the `AdwToastOverlay` the toasts appear over. */
305
289
  overlayRef: RefObject<Adw.ToastOverlay | null>;
306
- /** Subtree whose `useToast` and `useToastOverlay` calls target that overlay. */
290
+ /** Subtree whose `useToast` calls target that overlay. */
307
291
  children?: ReactNode | undefined;
308
292
  };
309
293
 
@@ -319,6 +303,7 @@ export {
319
303
  type ListRowProps,
320
304
  type ListSectionRenderArgs,
321
305
  type ListItemRenderer,
306
+ type ListItemFactoryProps,
322
307
  type ListRowPropsResolver,
323
308
  type ListSectionRenderer,
324
309
  type ColumnViewColumn,
@@ -329,6 +314,5 @@ export {
329
314
  type ComboRowProps,
330
315
  type ToastOptions,
331
316
  type ToastController,
332
- type ToastOverlayController,
333
317
  type ToastProviderProps,
334
318
  };