@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.
- package/README.md +8 -168
- package/dist/column-view.d.ts.map +1 -1
- package/dist/column-view.js +19 -9
- package/dist/column-view.js.map +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -1
- package/dist/index.js.map +1 -1
- package/dist/internal/cells.d.ts +8 -1
- package/dist/internal/cells.d.ts.map +1 -1
- package/dist/internal/cells.js +84 -19
- package/dist/internal/cells.js.map +1 -1
- package/dist/internal/collection-index.d.ts +3 -2
- package/dist/internal/collection-index.d.ts.map +1 -1
- package/dist/internal/collection-index.js +3 -3
- package/dist/internal/collection-index.js.map +1 -1
- package/dist/internal/collection-model.d.ts +23 -2
- package/dist/internal/collection-model.d.ts.map +1 -1
- package/dist/internal/collection-model.js +118 -98
- package/dist/internal/collection-model.js.map +1 -1
- package/dist/internal/collection.d.ts +5 -4
- package/dist/internal/collection.d.ts.map +1 -1
- package/dist/internal/collection.js +20 -21
- package/dist/internal/collection.js.map +1 -1
- package/dist/internal/controlled-sync.d.ts +6 -8
- package/dist/internal/controlled-sync.d.ts.map +1 -1
- package/dist/internal/controlled-sync.js +3 -3
- package/dist/internal/controlled-sync.js.map +1 -1
- package/dist/internal/drop-down.d.ts.map +1 -1
- package/dist/internal/drop-down.js +43 -44
- package/dist/internal/drop-down.js.map +1 -1
- package/dist/internal/expansion.js +4 -4
- package/dist/internal/expansion.js.map +1 -1
- package/dist/internal/selection.d.ts +1 -0
- package/dist/internal/selection.d.ts.map +1 -1
- package/dist/internal/selection.js +6 -6
- package/dist/internal/selection.js.map +1 -1
- package/dist/internal/tree-expansion.d.ts.map +1 -1
- package/dist/internal/tree-expansion.js +2 -11
- package/dist/internal/tree-expansion.js.map +1 -1
- package/dist/internal/tree-order.d.ts.map +1 -1
- package/dist/internal/tree-order.js +32 -76
- package/dist/internal/tree-order.js.map +1 -1
- package/dist/internal/use-collection.d.ts +5 -1
- package/dist/internal/use-collection.d.ts.map +1 -1
- package/dist/internal/use-collection.js +21 -7
- package/dist/internal/use-collection.js.map +1 -1
- package/dist/list-item-factory.d.ts +10 -0
- package/dist/list-item-factory.d.ts.map +1 -0
- package/dist/list-item-factory.js +14 -0
- package/dist/list-item-factory.js.map +1 -0
- package/dist/toast.d.ts +3 -5
- package/dist/toast.d.ts.map +1 -1
- package/dist/toast.js +3 -12
- package/dist/toast.js.map +1 -1
- package/dist/types.d.ts +33 -50
- package/dist/types.d.ts.map +1 -1
- package/dist/types.js.map +1 -1
- package/package.json +12 -10
- package/src/column-view.tsx +23 -12
- package/src/index.ts +3 -2
- package/src/internal/cells.tsx +137 -20
- package/src/internal/collection-index.ts +8 -6
- package/src/internal/collection-model.ts +156 -134
- package/src/internal/collection.ts +28 -24
- package/src/internal/controlled-sync.ts +9 -12
- package/src/internal/drop-down.tsx +64 -60
- package/src/internal/expansion.ts +4 -4
- package/src/internal/selection.tsx +8 -8
- package/src/internal/tree-expansion.ts +2 -14
- package/src/internal/tree-order.ts +33 -121
- package/src/internal/use-collection.tsx +29 -8
- package/src/list-item-factory.tsx +27 -0
- package/src/toast.tsx +4 -18
- 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
|
|
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
|
|
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.
|
|
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.
|
|
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
|
|
162
|
+
type SourceProps<T, S> = ({
|
|
163
|
+
/** Items to render, nesting through `ListItem.children` for a tree. */
|
|
161
164
|
items?: ListItem<T>[] | undefined;
|
|
162
|
-
|
|
163
|
-
|
|
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
|
-
*
|
|
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 |
|
|
211
|
-
/** Called with the id
|
|
212
|
-
onSelectionChanged?: ((id: string) => void) | null | undefined;
|
|
213
|
-
/** Renders the collapsed display
|
|
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
|
-
*
|
|
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
|
-
*
|
|
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
|
-
*
|
|
266
|
-
*
|
|
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
|
-
*
|
|
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
|
|
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`
|
|
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
|
};
|