@gtkx/components 0.21.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.
- package/dist/collection-view.d.ts +30 -0
- package/dist/collection-view.d.ts.map +1 -0
- package/dist/collection-view.js +52 -0
- package/dist/collection-view.js.map +1 -0
- package/dist/column-view-column.d.ts +17 -0
- package/dist/column-view-column.d.ts.map +1 -0
- package/dist/column-view-column.js +51 -0
- package/dist/column-view-column.js.map +1 -0
- package/dist/column-view.d.ts +18 -0
- package/dist/column-view.d.ts.map +1 -0
- package/dist/column-view.js +108 -0
- package/dist/column-view.js.map +1 -0
- package/dist/constraint-layout-apply.d.ts +6 -0
- package/dist/constraint-layout-apply.d.ts.map +1 -0
- package/dist/constraint-layout-apply.js +107 -0
- package/dist/constraint-layout-apply.js.map +1 -0
- package/dist/constraint-layout.d.ts +13 -0
- package/dist/constraint-layout.d.ts.map +1 -0
- package/dist/constraint-layout.js +85 -0
- package/dist/constraint-layout.js.map +1 -0
- package/dist/contexts/column-view-context.d.ts +17 -0
- package/dist/contexts/column-view-context.d.ts.map +1 -0
- package/dist/contexts/column-view-context.js +10 -0
- package/dist/contexts/column-view-context.js.map +1 -0
- package/dist/drop-down.d.ts +41 -0
- package/dist/drop-down.d.ts.map +1 -0
- package/dist/drop-down.js +129 -0
- package/dist/drop-down.js.map +1 -0
- package/dist/grid-view.d.ts +16 -0
- package/dist/grid-view.d.ts.map +1 -0
- package/dist/grid-view.js +22 -0
- package/dist/grid-view.js.map +1 -0
- package/dist/hooks/use-drop-down-selection.d.ts +15 -0
- package/dist/hooks/use-drop-down-selection.d.ts.map +1 -0
- package/dist/hooks/use-drop-down-selection.js +35 -0
- package/dist/hooks/use-drop-down-selection.js.map +1 -0
- package/dist/hooks/use-header-menu.d.ts +4 -0
- package/dist/hooks/use-header-menu.d.ts.map +1 -0
- package/dist/hooks/use-header-menu.js +32 -0
- package/dist/hooks/use-header-menu.js.map +1 -0
- package/dist/hooks/use-list-model.d.ts +20 -0
- package/dist/hooks/use-list-model.d.ts.map +1 -0
- package/dist/hooks/use-list-model.js +70 -0
- package/dist/hooks/use-list-model.js.map +1 -0
- package/dist/hooks/use-model-installation.d.ts +9 -0
- package/dist/hooks/use-model-installation.d.ts.map +1 -0
- package/dist/hooks/use-model-installation.js +20 -0
- package/dist/hooks/use-model-installation.js.map +1 -0
- package/dist/hooks/use-realized-slots.d.ts +20 -0
- package/dist/hooks/use-realized-slots.d.ts.map +1 -0
- package/dist/hooks/use-realized-slots.js +66 -0
- package/dist/hooks/use-realized-slots.js.map +1 -0
- package/dist/hooks/use-selection-model.d.ts +12 -0
- package/dist/hooks/use-selection-model.d.ts.map +1 -0
- package/dist/hooks/use-selection-model.js +111 -0
- package/dist/hooks/use-selection-model.js.map +1 -0
- package/dist/hooks/use-sort-handler.d.ts +12 -0
- package/dist/hooks/use-sort-handler.d.ts.map +1 -0
- package/dist/hooks/use-sort-handler.js +87 -0
- package/dist/hooks/use-sort-handler.js.map +1 -0
- package/dist/index.d.ts +19 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +18 -0
- package/dist/index.js.map +1 -0
- package/dist/list-portal-host.d.ts +11 -0
- package/dist/list-portal-host.d.ts.map +1 -0
- package/dist/list-portal-host.js +8 -0
- package/dist/list-portal-host.js.map +1 -0
- package/dist/list-slot.d.ts +14 -0
- package/dist/list-slot.d.ts.map +1 -0
- package/dist/list-slot.js +29 -0
- package/dist/list-slot.js.map +1 -0
- package/dist/list-view.d.ts +16 -0
- package/dist/list-view.d.ts.map +1 -0
- package/dist/list-view.js +31 -0
- package/dist/list-view.js.map +1 -0
- package/dist/menu-items.d.ts +5 -0
- package/dist/menu-items.d.ts.map +1 -0
- package/dist/menu-items.js +48 -0
- package/dist/menu-items.js.map +1 -0
- package/dist/menu.d.ts +18 -0
- package/dist/menu.d.ts.map +1 -0
- package/dist/menu.js +26 -0
- package/dist/menu.js.map +1 -0
- package/dist/types.d.ts +198 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +2 -0
- package/dist/types.js.map +1 -0
- package/dist/utils/item-resolver.d.ts +28 -0
- package/dist/utils/item-resolver.d.ts.map +1 -0
- package/dist/utils/item-resolver.js +111 -0
- package/dist/utils/item-resolver.js.map +1 -0
- package/dist/utils/list-item-flatten.d.ts +32 -0
- package/dist/utils/list-item-flatten.d.ts.map +1 -0
- package/dist/utils/list-item-flatten.js +88 -0
- package/dist/utils/list-item-flatten.js.map +1 -0
- package/dist/utils/position-only-model.d.ts +10 -0
- package/dist/utils/position-only-model.d.ts.map +1 -0
- package/dist/utils/position-only-model.js +83 -0
- package/dist/utils/position-only-model.js.map +1 -0
- package/dist/utils/realized-slot-store.d.ts +30 -0
- package/dist/utils/realized-slot-store.d.ts.map +1 -0
- package/dist/utils/realized-slot-store.js +103 -0
- package/dist/utils/realized-slot-store.js.map +1 -0
- package/package.json +55 -0
- package/src/collection-view.tsx +125 -0
- package/src/column-view-column.tsx +73 -0
- package/src/column-view.tsx +206 -0
- package/src/constraint-layout-apply.ts +121 -0
- package/src/constraint-layout.tsx +130 -0
- package/src/contexts/column-view-context.ts +28 -0
- package/src/drop-down.tsx +259 -0
- package/src/grid-view.tsx +73 -0
- package/src/hooks/use-drop-down-selection.ts +53 -0
- package/src/hooks/use-header-menu.ts +33 -0
- package/src/hooks/use-list-model.ts +145 -0
- package/src/hooks/use-model-installation.ts +25 -0
- package/src/hooks/use-realized-slots.ts +93 -0
- package/src/hooks/use-selection-model.ts +121 -0
- package/src/hooks/use-sort-handler.ts +102 -0
- package/src/index.ts +31 -0
- package/src/list-portal-host.tsx +27 -0
- package/src/list-slot.tsx +56 -0
- package/src/list-view.tsx +85 -0
- package/src/menu-items.ts +48 -0
- package/src/menu.tsx +34 -0
- package/src/types.ts +227 -0
- package/src/utils/item-resolver.ts +143 -0
- package/src/utils/list-item-flatten.ts +113 -0
- package/src/utils/position-only-model.ts +115 -0
- package/src/utils/realized-slot-store.ts +126 -0
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import type * as Gio from "@gtkx/gi/gio";
|
|
2
|
+
import type * as Gtk from "@gtkx/gi/gtk";
|
|
3
|
+
import { type ElementType, type ReactNode, type Ref } from "react";
|
|
4
|
+
import { type FactoryBinding } from "./hooks/use-realized-slots.js";
|
|
5
|
+
import type { SlotRenderer } from "./list-slot.js";
|
|
6
|
+
import type { ListItem } from "./types.js";
|
|
7
|
+
export interface ModelBinding<W extends Gtk.Widget> {
|
|
8
|
+
install(widget: W, model: Gio.ListModel): void;
|
|
9
|
+
}
|
|
10
|
+
export interface CollectionViewProps<T, S, W extends Gtk.Widget> {
|
|
11
|
+
element: ElementType;
|
|
12
|
+
intrinsicProps: Record<string, unknown>;
|
|
13
|
+
ref: Ref<W | null> | undefined;
|
|
14
|
+
items: ListItem<T, S>[] | undefined;
|
|
15
|
+
model: Gio.ListModel | undefined;
|
|
16
|
+
renderItem: SlotRenderer<T, S>;
|
|
17
|
+
autoexpand: boolean | undefined;
|
|
18
|
+
renderHeader: ((value: S | undefined) => ReactNode) | undefined;
|
|
19
|
+
estimatedHeight: number | undefined;
|
|
20
|
+
estimatedWidth: number | undefined;
|
|
21
|
+
selected: string[] | null | undefined;
|
|
22
|
+
selectionMode: Gtk.SelectionMode | null | undefined;
|
|
23
|
+
onSelectionChanged: ((ids: string[]) => void) | null | undefined;
|
|
24
|
+
factoryBinding: FactoryBinding<W>;
|
|
25
|
+
headerFactoryBinding: FactoryBinding<W> | undefined;
|
|
26
|
+
modelBinding: ModelBinding<W>;
|
|
27
|
+
children?: ReactNode;
|
|
28
|
+
}
|
|
29
|
+
export declare const CollectionView: <T, S, W extends Gtk.Widget>(props: CollectionViewProps<T, S, W>) => ReactNode;
|
|
30
|
+
//# sourceMappingURL=collection-view.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"collection-view.d.ts","sourceRoot":"","sources":["../src/collection-view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AACzC,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AAEzC,OAAO,EAEH,KAAK,WAAW,EAEhB,KAAK,SAAS,EACd,KAAK,GAAG,EAGX,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,KAAK,cAAc,EAAoB,MAAM,+BAA+B,CAAC;AAGtF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAI3C,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,GAAG,CAAC,MAAM;IAC9C,OAAO,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,GAAG,CAAC,SAAS,GAAG,IAAI,CAAC;CAClD;AAED,MAAM,WAAW,mBAAmB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,SAAS,GAAG,CAAC,MAAM;IAC3D,OAAO,EAAE,WAAW,CAAC;IACrB,cAAc,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACxC,GAAG,EAAE,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,SAAS,CAAC;IAC/B,KAAK,EAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,SAAS,CAAC;IACpC,KAAK,EAAE,GAAG,CAAC,SAAS,GAAG,SAAS,CAAC;IACjC,UAAU,EAAE,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAC/B,UAAU,EAAE,OAAO,GAAG,SAAS,CAAC;IAChC,YAAY,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,GAAG,SAAS,KAAK,SAAS,CAAC,GAAG,SAAS,CAAC;IAChE,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,cAAc,EAAE,MAAM,GAAG,SAAS,CAAC;IACnC,QAAQ,EAAE,MAAM,EAAE,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,aAAa,EAAE,GAAG,CAAC,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;IACpD,kBAAkB,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACjE,cAAc,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IAClC,oBAAoB,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;IACpD,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC9B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB;AA8DD,eAAO,MAAM,cAAc,GAAI,CAAC,EAAE,CAAC,EAAE,CAAC,SAAS,GAAG,CAAC,MAAM,EAAE,OAAO,mBAAmB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,KAAG,SAkBhG,CAAC"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useForwardedRef } from "@gtkx/react";
|
|
3
|
+
import { createElement, useCallback, useRef, } from "react";
|
|
4
|
+
import { useListModel } from "./hooks/use-list-model.js";
|
|
5
|
+
import { useModelInstallation } from "./hooks/use-model-installation.js";
|
|
6
|
+
import { useRealizedSlots } from "./hooks/use-realized-slots.js";
|
|
7
|
+
import { useSelectionModel } from "./hooks/use-selection-model.js";
|
|
8
|
+
import { ListPortalHost } from "./list-portal-host.js";
|
|
9
|
+
const headerRenderer = (renderHeader) => (value) => renderHeader ? renderHeader(value) : null;
|
|
10
|
+
const useCollectionWiring = (props) => {
|
|
11
|
+
const widgetRef = useRef(null);
|
|
12
|
+
const captureWidget = useCallback((value) => {
|
|
13
|
+
widgetRef.current = value;
|
|
14
|
+
}, []);
|
|
15
|
+
const [, setRef] = useForwardedRef(props.ref, captureWidget);
|
|
16
|
+
const externalModel = props.model;
|
|
17
|
+
const listModel = useListModel(externalModel === undefined ? { items: props.items, autoexpand: props.autoexpand } : { model: externalModel });
|
|
18
|
+
const controlledSelection = useSelectionModel({
|
|
19
|
+
base: listModel.model,
|
|
20
|
+
selectionMode: props.selectionMode,
|
|
21
|
+
selected: props.selected,
|
|
22
|
+
onSelectionChanged: props.onSelectionChanged,
|
|
23
|
+
resolver: listModel.resolver,
|
|
24
|
+
});
|
|
25
|
+
const installedModel = externalModel === undefined ? controlledSelection : externalModel;
|
|
26
|
+
const items = useRealizedSlots({
|
|
27
|
+
target: widgetRef,
|
|
28
|
+
binding: props.factoryBinding,
|
|
29
|
+
estimatedHeight: props.estimatedHeight,
|
|
30
|
+
estimatedWidth: props.estimatedWidth,
|
|
31
|
+
});
|
|
32
|
+
const headers = useRealizedSlots({
|
|
33
|
+
target: props.headerFactoryBinding ? widgetRef : null,
|
|
34
|
+
binding: props.headerFactoryBinding ?? props.factoryBinding,
|
|
35
|
+
estimatedHeight: props.estimatedHeight,
|
|
36
|
+
estimatedWidth: props.estimatedWidth,
|
|
37
|
+
});
|
|
38
|
+
useModelInstallation(widgetRef, installedModel, (widget, model) => props.modelBinding.install(widget, model));
|
|
39
|
+
return {
|
|
40
|
+
setRef,
|
|
41
|
+
resolver: listModel.resolver,
|
|
42
|
+
headerResolver: listModel.headerResolver,
|
|
43
|
+
itemStore: items.store,
|
|
44
|
+
headerStore: headers.store,
|
|
45
|
+
};
|
|
46
|
+
};
|
|
47
|
+
export const CollectionView = (props) => {
|
|
48
|
+
const { setRef, resolver, headerResolver, itemStore, headerStore } = useCollectionWiring(props);
|
|
49
|
+
const intrinsic = createElement(props.element, { ...props.intrinsicProps, ref: setRef });
|
|
50
|
+
return (_jsxs(_Fragment, { children: [intrinsic, _jsx(ListPortalHost, { store: itemStore, resolver: resolver, render: props.renderItem }), props.headerFactoryBinding ? (_jsx(ListPortalHost, { store: headerStore, resolver: headerResolver, render: headerRenderer(props.renderHeader) })) : null, props.children] }));
|
|
51
|
+
};
|
|
52
|
+
//# sourceMappingURL=collection-view.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"collection-view.js","sourceRoot":"","sources":["../src/collection-view.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EACH,aAAa,EAKb,WAAW,EACX,MAAM,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAuB,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACtF,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AA8BvD,MAAM,cAAc,GAChB,CAAO,YAA+D,EAAsB,EAAE,CAC9F,CAAC,KAAK,EAAE,EAAE,CACN,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,KAAsB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;AAUnE,MAAM,mBAAmB,GAAG,CACxB,KAAmC,EACV,EAAE;IAC3B,MAAM,SAAS,GAAG,MAAM,CAAW,IAAI,CAAC,CAAC;IACzC,MAAM,aAAa,GAAG,WAAW,CAAC,CAAC,KAAe,EAAE,EAAE;QAClD,SAAS,CAAC,OAAO,GAAG,KAAK,CAAC;IAC9B,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,MAAM,CAAC,EAAE,MAAM,CAAC,GAAG,eAAe,CAAI,KAAK,CAAC,GAAG,EAAE,aAAa,CAAC,CAAC;IAEhE,MAAM,aAAa,GAAG,KAAK,CAAC,KAAK,CAAC;IAClC,MAAM,SAAS,GAAG,YAAY,CAC1B,aAAa,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,CAChH,CAAC;IAEF,MAAM,mBAAmB,GAAG,iBAAiB,CAAO;QAChD,IAAI,EAAE,SAAS,CAAC,KAAK;QACrB,aAAa,EAAE,KAAK,CAAC,aAAa;QAClC,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,kBAAkB,EAAE,KAAK,CAAC,kBAAkB;QAC5C,QAAQ,EAAE,SAAS,CAAC,QAAQ;KAC/B,CAAC,CAAC;IACH,MAAM,cAAc,GAAkB,aAAa,KAAK,SAAS,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,aAAa,CAAC;IAExG,MAAM,KAAK,GAAG,gBAAgB,CAAI;QAC9B,MAAM,EAAE,SAAS;QACjB,OAAO,EAAE,KAAK,CAAC,cAAc;QAC7B,eAAe,EAAE,KAAK,CAAC,eAAe;QACtC,cAAc,EAAE,KAAK,CAAC,cAAc;KACvC,CAAC,CAAC;IACH,MAAM,OAAO,GAAG,gBAAgB,CAAI;QAChC,MAAM,EAAE,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI;QACrD,OAAO,EAAE,KAAK,CAAC,oBAAoB,IAAI,KAAK,CAAC,cAAc;QAC3D,eAAe,EAAE,KAAK,CAAC,eAAe;QACtC,cAAc,EAAE,KAAK,CAAC,cAAc;KACvC,CAAC,CAAC;IAEH,oBAAoB,CAAC,SAAS,EAAE,cAAc,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC;IAE9G,OAAO;QACH,MAAM;QACN,QAAQ,EAAE,SAAS,CAAC,QAAQ;QAC5B,cAAc,EAAE,SAAS,CAAC,cAAc;QACxC,SAAS,EAAE,KAAK,CAAC,KAAK;QACtB,WAAW,EAAE,OAAO,CAAC,KAAK;KAC7B,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAA6B,KAAmC,EAAa,EAAE;IACzG,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,cAAc,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,mBAAmB,CAAC,KAAK,CAAC,CAAC;IAChG,MAAM,SAAS,GAAiB,aAAa,CAAC,KAAK,CAAC,OAAO,EAAE,EAAE,GAAG,KAAK,CAAC,cAAc,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,CAAC;IAEvG,OAAO,CACH,8BACK,SAAS,EACV,KAAC,cAAc,IAAC,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,CAAC,UAAU,GAAI,EACjF,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAC1B,KAAC,cAAc,IACX,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,cAAc,EACxB,MAAM,EAAE,cAAc,CAAO,KAAK,CAAC,YAAY,CAAC,GAClD,CACL,CAAC,CAAC,CAAC,IAAI,EACP,KAAK,CAAC,QAAQ,IAChB,CACN,CAAC;AACN,CAAC,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { type GtkColumnViewColumnProps } from "@gtkx/jsx/gtk";
|
|
2
|
+
import { type ReactNode } from "react";
|
|
3
|
+
import type { ColumnViewColumnProps } from "./types.js";
|
|
4
|
+
/**
|
|
5
|
+
* Props for the {@link ColumnViewColumn} component: the raw
|
|
6
|
+
* `GtkColumnViewColumn` element surface (minus its imperative `factory` and
|
|
7
|
+
* `sorter` properties) with its cell wiring replaced by the declarative
|
|
8
|
+
* {@link ColumnViewColumnProps} API.
|
|
9
|
+
*/
|
|
10
|
+
export type ColumnViewColumnComponentProps<T = unknown> = Omit<GtkColumnViewColumnProps, "factory" | "sorter"> & ColumnViewColumnProps<T>;
|
|
11
|
+
/**
|
|
12
|
+
* A single column of a {@link ColumnView}, rendering each row's cell through
|
|
13
|
+
* the declarative `renderCell` callback and optionally attaching a header
|
|
14
|
+
* context menu.
|
|
15
|
+
*/
|
|
16
|
+
export declare const ColumnViewColumn: <T = unknown>(props: ColumnViewColumnComponentProps<T>) => ReactNode;
|
|
17
|
+
//# sourceMappingURL=column-view-column.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-view-column.d.ts","sourceRoot":"","sources":["../src/column-view-column.tsx"],"names":[],"mappings":"AACA,OAAO,EAAuB,KAAK,wBAAwB,EAAE,MAAM,eAAe,CAAC;AACnF,OAAO,EAAiB,KAAK,SAAS,EAAqC,MAAM,OAAO,CAAC;AAMzF,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAOxD;;;;;GAKG;AACH,MAAM,MAAM,8BAA8B,CAAC,CAAC,GAAG,OAAO,IAAI,IAAI,CAAC,wBAAwB,EAAE,SAAS,GAAG,QAAQ,CAAC,GAC1G,qBAAqB,CAAC,CAAC,CAAC,CAAC;AAE7B;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,CAAC,GAAG,OAAO,EAAE,OAAO,8BAA8B,CAAC,CAAC,CAAC,KAAG,SA2CxF,CAAC"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { GtkColumnViewColumn } from "@gtkx/jsx/gtk";
|
|
3
|
+
import { createElement, useLayoutEffect, useRef, useState } from "react";
|
|
4
|
+
import { useColumnViewContext } from "./contexts/column-view-context.js";
|
|
5
|
+
import { useHeaderMenu } from "./hooks/use-header-menu.js";
|
|
6
|
+
import { useRealizedSlots } from "./hooks/use-realized-slots.js";
|
|
7
|
+
import { ListPortalHost } from "./list-portal-host.js";
|
|
8
|
+
const factoryBinding = {
|
|
9
|
+
install: (column, factory) => column.setFactory(factory),
|
|
10
|
+
uninstall: (column) => column.setFactory(null),
|
|
11
|
+
};
|
|
12
|
+
/**
|
|
13
|
+
* A single column of a {@link ColumnView}, rendering each row's cell through
|
|
14
|
+
* the declarative `renderCell` callback and optionally attaching a header
|
|
15
|
+
* context menu.
|
|
16
|
+
*/
|
|
17
|
+
export const ColumnViewColumn = (props) => {
|
|
18
|
+
const { id, title, expand, resizable, fixedWidth, visible, sortable, renderCell, headerMenu } = props;
|
|
19
|
+
const context = useColumnViewContext();
|
|
20
|
+
const [column, setColumn] = useState(null);
|
|
21
|
+
const captureColumn = useRef((value) => {
|
|
22
|
+
setColumn(value);
|
|
23
|
+
}).current;
|
|
24
|
+
const { store } = useRealizedSlots({
|
|
25
|
+
target: column,
|
|
26
|
+
binding: factoryBinding,
|
|
27
|
+
});
|
|
28
|
+
const registerRef = useRef(context.register);
|
|
29
|
+
registerRef.current = context.register;
|
|
30
|
+
const unregisterRef = useRef(context.unregister);
|
|
31
|
+
unregisterRef.current = context.unregister;
|
|
32
|
+
useLayoutEffect(() => {
|
|
33
|
+
if (column === null)
|
|
34
|
+
return;
|
|
35
|
+
registerRef.current({ id, column, sortable: sortable ?? false });
|
|
36
|
+
return () => unregisterRef.current(id);
|
|
37
|
+
}, [column, id, sortable]);
|
|
38
|
+
const headerMenuPortal = useHeaderMenu(column, headerMenu);
|
|
39
|
+
const slotRenderer = (value, _treeRow, isHeader) => isHeader ? null : renderCell(value);
|
|
40
|
+
const intrinsicProps = { id, title, ref: captureColumn };
|
|
41
|
+
if (expand !== undefined)
|
|
42
|
+
intrinsicProps["expand"] = expand;
|
|
43
|
+
if (resizable !== undefined)
|
|
44
|
+
intrinsicProps["resizable"] = resizable;
|
|
45
|
+
if (fixedWidth !== undefined)
|
|
46
|
+
intrinsicProps["fixedWidth"] = fixedWidth;
|
|
47
|
+
if (visible !== undefined)
|
|
48
|
+
intrinsicProps["visible"] = visible;
|
|
49
|
+
return (_jsxs(_Fragment, { children: [createElement(GtkColumnViewColumn, intrinsicProps), _jsx(ListPortalHost, { store: store, resolver: context.resolver, render: slotRenderer }), headerMenuPortal] }));
|
|
50
|
+
};
|
|
51
|
+
//# sourceMappingURL=column-view-column.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-view-column.js","sourceRoot":"","sources":["../src/column-view-column.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { type GtkColumnViewProps } from "@gtkx/jsx/gtk";
|
|
2
|
+
import { type ReactNode } from "react";
|
|
3
|
+
import type { ColumnViewProps } from "./types.js";
|
|
4
|
+
/**
|
|
5
|
+
* Props for the {@link ColumnView} component: the raw `GtkColumnView` element
|
|
6
|
+
* surface (minus its imperative `columns` property) with its model/sort wiring
|
|
7
|
+
* replaced by the declarative {@link ColumnViewProps} API. Columns are declared
|
|
8
|
+
* as {@link ColumnViewColumn} children.
|
|
9
|
+
*/
|
|
10
|
+
export type ColumnViewComponentProps<T = unknown, S = unknown> = Omit<GtkColumnViewProps, "columns" | keyof ColumnViewProps<T, S>> & ColumnViewProps<T, S>;
|
|
11
|
+
/**
|
|
12
|
+
* A `GtkColumnView` driven by a declarative `items` model with optional
|
|
13
|
+
* controlled selection, controlled sorting, and section headers. Columns are
|
|
14
|
+
* declared as {@link ColumnViewColumn} children. Supplying an external `model`
|
|
15
|
+
* switches to the uncontrolled form.
|
|
16
|
+
*/
|
|
17
|
+
export declare const ColumnView: <T = unknown, S = unknown>(props: ColumnViewComponentProps<T, S>) => ReactNode;
|
|
18
|
+
//# sourceMappingURL=column-view.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-view.d.ts","sourceRoot":"","sources":["../src/column-view.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAEvE,OAAO,EAAiB,KAAK,SAAS,EAAoD,MAAM,OAAO,CAAC;AAaxG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAmClD;;;;;GAKG;AACH,MAAM,MAAM,wBAAwB,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,OAAO,IAAI,IAAI,CACjE,kBAAkB,EAClB,SAAS,GAAG,MAAM,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,CAC1C,GACG,eAAe,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAoF1B;;;;;GAKG;AACH,eAAO,MAAM,UAAU,GAAI,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,OAAO,EAAE,OAAO,wBAAwB,CAAC,CAAC,EAAE,CAAC,CAAC,KAAG,SAqD5F,CAAC"}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { GtkColumnView } from "@gtkx/jsx/gtk";
|
|
3
|
+
import { useForwardedRef } from "@gtkx/react";
|
|
4
|
+
import { createElement, useCallback, useMemo, useRef, useState } from "react";
|
|
5
|
+
import { ColumnViewContext, } from "./contexts/column-view-context.js";
|
|
6
|
+
import { useListModel } from "./hooks/use-list-model.js";
|
|
7
|
+
import { useModelInstallation } from "./hooks/use-model-installation.js";
|
|
8
|
+
import { useRealizedSlots } from "./hooks/use-realized-slots.js";
|
|
9
|
+
import { useSelectionModel } from "./hooks/use-selection-model.js";
|
|
10
|
+
import { useSortHandler } from "./hooks/use-sort-handler.js";
|
|
11
|
+
import { ListPortalHost } from "./list-portal-host.js";
|
|
12
|
+
const headerFactoryBinding = {
|
|
13
|
+
install: (widget, factory) => widget.setHeaderFactory(factory),
|
|
14
|
+
uninstall: (widget) => widget.setHeaderFactory(null),
|
|
15
|
+
};
|
|
16
|
+
const useColumnRegistry = () => {
|
|
17
|
+
const [registrations, setRegistrations] = useState(() => new Map());
|
|
18
|
+
const register = useCallback((registration) => {
|
|
19
|
+
setRegistrations((current) => {
|
|
20
|
+
const next = new Map(current);
|
|
21
|
+
next.set(registration.id, registration);
|
|
22
|
+
return next;
|
|
23
|
+
});
|
|
24
|
+
}, []);
|
|
25
|
+
const unregister = useCallback((id) => {
|
|
26
|
+
setRegistrations((current) => {
|
|
27
|
+
if (!current.has(id))
|
|
28
|
+
return current;
|
|
29
|
+
const next = new Map(current);
|
|
30
|
+
next.delete(id);
|
|
31
|
+
return next;
|
|
32
|
+
});
|
|
33
|
+
}, []);
|
|
34
|
+
const columns = useMemo(() => [...registrations.values()], [registrations]);
|
|
35
|
+
return { columns, register, unregister };
|
|
36
|
+
};
|
|
37
|
+
const headerRenderer = (renderHeader) => (value) => renderHeader ? renderHeader(value) : null;
|
|
38
|
+
const useColumnViewWiring = (props, registry) => {
|
|
39
|
+
const widgetRef = useRef(null);
|
|
40
|
+
const captureWidget = useCallback((value) => {
|
|
41
|
+
widgetRef.current = value;
|
|
42
|
+
}, []);
|
|
43
|
+
const [, setRef] = useForwardedRef(props.ref, captureWidget);
|
|
44
|
+
const externalModel = props.model;
|
|
45
|
+
const listModel = useListModel(externalModel === undefined ? { items: props.items } : { model: externalModel });
|
|
46
|
+
const controlledSelection = useSelectionModel({
|
|
47
|
+
base: listModel.model,
|
|
48
|
+
selectionMode: props.selectionMode,
|
|
49
|
+
selected: props.selected,
|
|
50
|
+
onSelectionChanged: props.onSelectionChanged,
|
|
51
|
+
resolver: listModel.resolver,
|
|
52
|
+
});
|
|
53
|
+
const installedModel = externalModel === undefined ? controlledSelection : externalModel;
|
|
54
|
+
useModelInstallation(widgetRef, installedModel, (widget, model) => widget.setModel(model));
|
|
55
|
+
const useHeader = externalModel === undefined && typeof props.renderHeader === "function";
|
|
56
|
+
const headers = useRealizedSlots({
|
|
57
|
+
target: useHeader ? widgetRef : null,
|
|
58
|
+
binding: headerFactoryBinding,
|
|
59
|
+
estimatedHeight: props.estimatedRowHeight ?? undefined,
|
|
60
|
+
});
|
|
61
|
+
useSortHandler({
|
|
62
|
+
columnView: widgetRef,
|
|
63
|
+
sortColumn: props.sortColumn,
|
|
64
|
+
sortOrder: props.sortOrder,
|
|
65
|
+
onSortChanged: props.onSortChanged,
|
|
66
|
+
columns: registry.columns,
|
|
67
|
+
});
|
|
68
|
+
const contextValue = useMemo(() => ({
|
|
69
|
+
columnView: widgetRef,
|
|
70
|
+
resolver: listModel.resolver,
|
|
71
|
+
register: registry.register,
|
|
72
|
+
unregister: registry.unregister,
|
|
73
|
+
}), [listModel.resolver, registry.register, registry.unregister]);
|
|
74
|
+
return {
|
|
75
|
+
setRef,
|
|
76
|
+
resolver: listModel.resolver,
|
|
77
|
+
headerResolver: listModel.headerResolver,
|
|
78
|
+
headerStore: headers.store,
|
|
79
|
+
useHeader,
|
|
80
|
+
contextValue,
|
|
81
|
+
};
|
|
82
|
+
};
|
|
83
|
+
/**
|
|
84
|
+
* A `GtkColumnView` driven by a declarative `items` model with optional
|
|
85
|
+
* controlled selection, controlled sorting, and section headers. Columns are
|
|
86
|
+
* declared as {@link ColumnViewColumn} children. Supplying an external `model`
|
|
87
|
+
* switches to the uncontrolled form.
|
|
88
|
+
*/
|
|
89
|
+
export const ColumnView = (props) => {
|
|
90
|
+
const { ref, items, model, selected, selectionMode, onSelectionChanged, sortColumn, sortOrder, onSortChanged, renderHeader, estimatedRowHeight, children, ...intrinsicProps } = props;
|
|
91
|
+
const registry = useColumnRegistry();
|
|
92
|
+
const wiring = useColumnViewWiring({
|
|
93
|
+
ref,
|
|
94
|
+
items,
|
|
95
|
+
model,
|
|
96
|
+
selected,
|
|
97
|
+
selectionMode,
|
|
98
|
+
onSelectionChanged,
|
|
99
|
+
sortColumn,
|
|
100
|
+
sortOrder,
|
|
101
|
+
onSortChanged,
|
|
102
|
+
renderHeader,
|
|
103
|
+
estimatedRowHeight,
|
|
104
|
+
}, registry);
|
|
105
|
+
const intrinsic = createElement(GtkColumnView, { ...intrinsicProps, ref: wiring.setRef }, _jsx(ColumnViewContext.Provider, { value: wiring.contextValue, children: children }));
|
|
106
|
+
return (_jsxs(_Fragment, { children: [intrinsic, wiring.useHeader ? (_jsx(ListPortalHost, { store: wiring.headerStore, resolver: wiring.headerResolver, render: headerRenderer(renderHeader) })) : null] }));
|
|
107
|
+
};
|
|
108
|
+
//# sourceMappingURL=column-view.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-view.js","sourceRoot":"","sources":["../src/column-view.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as Gtk from "@gtkx/gi/gtk";
|
|
2
|
+
import type { ConstraintGuideProps, ConstraintProps, ConstraintVflProps } from "./types.js";
|
|
3
|
+
export declare function applyConstraint(layout: Gtk.ConstraintLayout, props: ConstraintProps): () => void;
|
|
4
|
+
export declare function applyVfl(layout: Gtk.ConstraintLayout, props: ConstraintVflProps): () => void;
|
|
5
|
+
export declare function applyGuide(layout: Gtk.ConstraintLayout, props: ConstraintGuideProps): () => void;
|
|
6
|
+
//# sourceMappingURL=constraint-layout-apply.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constraint-layout-apply.d.ts","sourceRoot":"","sources":["../src/constraint-layout-apply.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,GAAG,MAAM,cAAc,CAAC;AACpC,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AA8D5F,wBAAgB,eAAe,CAAC,MAAM,EAAE,GAAG,CAAC,gBAAgB,EAAE,KAAK,EAAE,eAAe,GAAG,MAAM,IAAI,CAqBhG;AAED,wBAAgB,QAAQ,CAAC,MAAM,EAAE,GAAG,CAAC,gBAAgB,EAAE,KAAK,EAAE,kBAAkB,GAAG,MAAM,IAAI,CAa5F;AAED,wBAAgB,UAAU,CAAC,MAAM,EAAE,GAAG,CAAC,gBAAgB,EAAE,KAAK,EAAE,oBAAoB,GAAG,MAAM,IAAI,CAkBhG"}
|
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
import * as GObject from "@gtkx/gi/gobject";
|
|
2
|
+
import * as Gtk from "@gtkx/gi/gtk";
|
|
3
|
+
const SUPER_ID = "super";
|
|
4
|
+
const unknownIdMessage = (role, id) => `<ConstraintLayout.Constraint> references unknown id '${id}'. ` +
|
|
5
|
+
`Set name="${id}" on the ${role} widget, or add a <ConstraintLayout.Guide id="${id}">.`;
|
|
6
|
+
const guideRegistry = new WeakMap();
|
|
7
|
+
const guidesFor = (layout) => {
|
|
8
|
+
let map = guideRegistry.get(layout);
|
|
9
|
+
if (!map) {
|
|
10
|
+
map = new Map();
|
|
11
|
+
guideRegistry.set(layout, map);
|
|
12
|
+
}
|
|
13
|
+
return map;
|
|
14
|
+
};
|
|
15
|
+
const explicitWidgetName = (widget) => {
|
|
16
|
+
const value = new GObject.Value();
|
|
17
|
+
value.init(GObject.TYPE_STRING);
|
|
18
|
+
widget.getProperty("name", value);
|
|
19
|
+
const name = value.getString();
|
|
20
|
+
return name !== null && name.length > 0 ? name : null;
|
|
21
|
+
};
|
|
22
|
+
function* namedChildren(layout) {
|
|
23
|
+
const host = layout.getWidget();
|
|
24
|
+
if (!host)
|
|
25
|
+
return;
|
|
26
|
+
for (let child = host.getFirstChild(); child; child = child.getNextSibling()) {
|
|
27
|
+
const name = explicitWidgetName(child);
|
|
28
|
+
if (name !== null)
|
|
29
|
+
yield [name, child];
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
const findChildByName = (layout, id) => {
|
|
33
|
+
for (const [name, child] of namedChildren(layout)) {
|
|
34
|
+
if (name === id)
|
|
35
|
+
return child;
|
|
36
|
+
}
|
|
37
|
+
return undefined;
|
|
38
|
+
};
|
|
39
|
+
const resolveConstraintTarget = (layout, id) => {
|
|
40
|
+
if (id === undefined || id === SUPER_ID)
|
|
41
|
+
return null;
|
|
42
|
+
return findChildByName(layout, id) ?? guidesFor(layout).get(id);
|
|
43
|
+
};
|
|
44
|
+
const constraintViews = (layout) => {
|
|
45
|
+
const views = new Map();
|
|
46
|
+
for (const [name, child] of namedChildren(layout))
|
|
47
|
+
views.set(name, child);
|
|
48
|
+
for (const [name, guide] of guidesFor(layout)) {
|
|
49
|
+
if (!views.has(name))
|
|
50
|
+
views.set(name, guide);
|
|
51
|
+
}
|
|
52
|
+
return views;
|
|
53
|
+
};
|
|
54
|
+
const isLayoutLive = (layout) => layout.getWidget() !== null;
|
|
55
|
+
export function applyConstraint(layout, props) {
|
|
56
|
+
const target = resolveConstraintTarget(layout, props.target);
|
|
57
|
+
if (target === undefined)
|
|
58
|
+
throw new Error(unknownIdMessage("target", String(props.target)));
|
|
59
|
+
const source = resolveConstraintTarget(layout, props.source);
|
|
60
|
+
if (source === undefined)
|
|
61
|
+
throw new Error(unknownIdMessage("source", String(props.source)));
|
|
62
|
+
const constraint = new Gtk.Constraint({
|
|
63
|
+
target,
|
|
64
|
+
targetAttribute: props.targetAttribute,
|
|
65
|
+
relation: props.relation ?? Gtk.ConstraintRelation.EQ,
|
|
66
|
+
source,
|
|
67
|
+
sourceAttribute: props.sourceAttribute ?? Gtk.ConstraintAttribute.NONE,
|
|
68
|
+
multiplier: props.multiplier ?? 1,
|
|
69
|
+
constant: props.constant ?? 0,
|
|
70
|
+
strength: props.strength ?? Gtk.ConstraintStrength.REQUIRED,
|
|
71
|
+
});
|
|
72
|
+
layout.addConstraint(constraint);
|
|
73
|
+
return () => {
|
|
74
|
+
if (isLayoutLive(layout))
|
|
75
|
+
layout.removeConstraint(constraint);
|
|
76
|
+
};
|
|
77
|
+
}
|
|
78
|
+
export function applyVfl(layout, props) {
|
|
79
|
+
const views = constraintViews(layout);
|
|
80
|
+
const constraints = layout.addConstraintsFromDescription(props.lines, props.hspacing ?? 0, props.vspacing ?? 0, views);
|
|
81
|
+
return () => {
|
|
82
|
+
if (!isLayoutLive(layout))
|
|
83
|
+
return;
|
|
84
|
+
for (const constraint of constraints)
|
|
85
|
+
layout.removeConstraint(constraint);
|
|
86
|
+
};
|
|
87
|
+
}
|
|
88
|
+
export function applyGuide(layout, props) {
|
|
89
|
+
const guide = new Gtk.ConstraintGuide({
|
|
90
|
+
name: props.id,
|
|
91
|
+
minWidth: props.minWidth,
|
|
92
|
+
minHeight: props.minHeight,
|
|
93
|
+
natWidth: props.natWidth,
|
|
94
|
+
natHeight: props.natHeight,
|
|
95
|
+
maxWidth: props.maxWidth,
|
|
96
|
+
maxHeight: props.maxHeight,
|
|
97
|
+
strength: props.strength,
|
|
98
|
+
});
|
|
99
|
+
layout.addGuide(guide);
|
|
100
|
+
guidesFor(layout).set(props.id, guide);
|
|
101
|
+
return () => {
|
|
102
|
+
guidesFor(layout).delete(props.id);
|
|
103
|
+
if (isLayoutLive(layout))
|
|
104
|
+
layout.removeGuide(guide);
|
|
105
|
+
};
|
|
106
|
+
}
|
|
107
|
+
//# sourceMappingURL=constraint-layout-apply.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constraint-layout-apply.js","sourceRoot":"","sources":["../src/constraint-layout-apply.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type * as Gtk from "@gtkx/gi/gtk";
|
|
2
|
+
import { type ReactNode, type Ref } from "react";
|
|
3
|
+
import type { ConstraintGuideProps, ConstraintProps, ConstraintVflProps } from "./types.js";
|
|
4
|
+
export type ConstraintLayoutProps = {
|
|
5
|
+
children?: ReactNode;
|
|
6
|
+
ref?: Ref<Gtk.ConstraintLayout | null>;
|
|
7
|
+
};
|
|
8
|
+
export declare const ConstraintLayout: ((props: ConstraintLayoutProps) => ReactNode) & {
|
|
9
|
+
Guide: (props: ConstraintGuideProps) => ReactNode;
|
|
10
|
+
Constraint: (props: ConstraintProps) => ReactNode;
|
|
11
|
+
Vfl: (props: ConstraintVflProps) => ReactNode;
|
|
12
|
+
};
|
|
13
|
+
//# sourceMappingURL=constraint-layout.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constraint-layout.d.ts","sourceRoot":"","sources":["../src/constraint-layout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AAGzC,OAAO,EAIH,KAAK,SAAS,EACd,KAAK,GAAG,EAOX,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,oBAAoB,EAAE,eAAe,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAa5F,MAAM,MAAM,qBAAqB,GAAG;IAChC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,GAAG,CAAC,EAAE,GAAG,CAAC,GAAG,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;CAC1C,CAAC;AAqCF,eAAO,MAAM,gBAAgB,EAAE,CAAC,CAAC,KAAK,EAAE,qBAAqB,KAAK,SAAS,CAAC,GAAG;IAC3E,KAAK,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,SAAS,CAAC;IAClD,UAAU,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,SAAS,CAAC;IAClD,GAAG,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,SAAS,CAAC;CAwDjD,CAAC"}
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { GtkConstraintLayout } from "@gtkx/jsx/gtk";
|
|
3
|
+
import { useForwardedRef } from "@gtkx/react";
|
|
4
|
+
import { createContext, createElement, useCallback, useContext, useEffect, useLayoutEffect, useRef, } from "react";
|
|
5
|
+
import { applyConstraint, applyGuide, applyVfl } from "./constraint-layout-apply.js";
|
|
6
|
+
const ORPHAN_MESSAGE = "<ConstraintLayout.Constraint> / <Guide> / <Vfl> must be a child of <ConstraintLayout>";
|
|
7
|
+
const ConstraintLayoutContext = createContext(null);
|
|
8
|
+
const useConstraintLayoutRef = () => {
|
|
9
|
+
const ref = useContext(ConstraintLayoutContext);
|
|
10
|
+
if (!ref)
|
|
11
|
+
throw new Error(ORPHAN_MESSAGE);
|
|
12
|
+
return ref;
|
|
13
|
+
};
|
|
14
|
+
const cleanupContribution = (cleanupRef) => {
|
|
15
|
+
const cleanup = cleanupRef.current;
|
|
16
|
+
if (!cleanup)
|
|
17
|
+
return;
|
|
18
|
+
cleanupRef.current = null;
|
|
19
|
+
cleanup();
|
|
20
|
+
};
|
|
21
|
+
const useLayoutContribution = (apply, deps) => {
|
|
22
|
+
const layoutRef = useConstraintLayoutRef();
|
|
23
|
+
useLayoutEffect(() => {
|
|
24
|
+
const layout = layoutRef.current;
|
|
25
|
+
if (!layout)
|
|
26
|
+
return;
|
|
27
|
+
return apply(layout);
|
|
28
|
+
}, deps);
|
|
29
|
+
};
|
|
30
|
+
const useDeferredContribution = (apply, deps) => {
|
|
31
|
+
const layoutRef = useConstraintLayoutRef();
|
|
32
|
+
const cleanupRef = useRef(null);
|
|
33
|
+
useLayoutEffect(() => () => cleanupContribution(cleanupRef), deps);
|
|
34
|
+
useEffect(() => {
|
|
35
|
+
const layout = layoutRef.current;
|
|
36
|
+
if (!layout)
|
|
37
|
+
return;
|
|
38
|
+
const cleanup = apply(layout);
|
|
39
|
+
cleanupRef.current = cleanup;
|
|
40
|
+
return () => {
|
|
41
|
+
if (cleanupRef.current === cleanup)
|
|
42
|
+
cleanupContribution(cleanupRef);
|
|
43
|
+
};
|
|
44
|
+
}, deps);
|
|
45
|
+
};
|
|
46
|
+
export const ConstraintLayout = Object.assign(({ children, ref }) => {
|
|
47
|
+
const layoutRef = useRef(null);
|
|
48
|
+
const captureLayout = useCallback((layout) => {
|
|
49
|
+
layoutRef.current = layout;
|
|
50
|
+
}, [layoutRef]);
|
|
51
|
+
const [, mergedRef] = useForwardedRef(ref, captureLayout);
|
|
52
|
+
return (_jsxs(_Fragment, { children: [createElement(GtkConstraintLayout, { ref: mergedRef }), _jsx(ConstraintLayoutContext.Provider, { value: layoutRef, children: children })] }));
|
|
53
|
+
}, {
|
|
54
|
+
Guide: (props) => {
|
|
55
|
+
useLayoutContribution((layout) => applyGuide(layout, props), [
|
|
56
|
+
props.id,
|
|
57
|
+
props.minWidth,
|
|
58
|
+
props.minHeight,
|
|
59
|
+
props.natWidth,
|
|
60
|
+
props.natHeight,
|
|
61
|
+
props.maxWidth,
|
|
62
|
+
props.maxHeight,
|
|
63
|
+
props.strength,
|
|
64
|
+
]);
|
|
65
|
+
return null;
|
|
66
|
+
},
|
|
67
|
+
Constraint: (props) => {
|
|
68
|
+
useDeferredContribution((layout) => applyConstraint(layout, props), [
|
|
69
|
+
props.target,
|
|
70
|
+
props.targetAttribute,
|
|
71
|
+
props.relation,
|
|
72
|
+
props.source,
|
|
73
|
+
props.sourceAttribute,
|
|
74
|
+
props.multiplier,
|
|
75
|
+
props.constant,
|
|
76
|
+
props.strength,
|
|
77
|
+
]);
|
|
78
|
+
return null;
|
|
79
|
+
},
|
|
80
|
+
Vfl: (props) => {
|
|
81
|
+
useDeferredContribution((layout) => applyVfl(layout, props), [props.lines, props.hspacing, props.vspacing]);
|
|
82
|
+
return null;
|
|
83
|
+
},
|
|
84
|
+
});
|
|
85
|
+
//# sourceMappingURL=constraint-layout.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constraint-layout.js","sourceRoot":"","sources":["../src/constraint-layout.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type * as Gtk from "@gtkx/gi/gtk";
|
|
2
|
+
import { type Context, type RefObject } from "react";
|
|
3
|
+
import type { ItemResolver } from "../utils/item-resolver.js";
|
|
4
|
+
export interface ColumnRegistration {
|
|
5
|
+
id: string;
|
|
6
|
+
column: Gtk.ColumnViewColumn;
|
|
7
|
+
sortable: boolean;
|
|
8
|
+
}
|
|
9
|
+
export interface ColumnViewContextValue {
|
|
10
|
+
columnView: RefObject<Gtk.ColumnView | null>;
|
|
11
|
+
resolver: ItemResolver<unknown, unknown>;
|
|
12
|
+
register(registration: ColumnRegistration): void;
|
|
13
|
+
unregister(id: string): void;
|
|
14
|
+
}
|
|
15
|
+
export declare const ColumnViewContext: Context<ColumnViewContextValue | null>;
|
|
16
|
+
export declare const useColumnViewContext: () => ColumnViewContextValue;
|
|
17
|
+
//# sourceMappingURL=column-view-context.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-view-context.d.ts","sourceRoot":"","sources":["../../src/contexts/column-view-context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,GAAG,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,KAAK,OAAO,EAAiB,KAAK,SAAS,EAAc,MAAM,OAAO,CAAC;AAChF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAE9D,MAAM,WAAW,kBAAkB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,GAAG,CAAC,gBAAgB,CAAC;IAC7B,QAAQ,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,sBAAsB;IACnC,UAAU,EAAE,SAAS,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,CAAC,CAAC;IAC7C,QAAQ,EAAE,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;IACzC,QAAQ,CAAC,YAAY,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACjD,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,CAAC;CAChC;AAED,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,sBAAsB,GAAG,IAAI,CAEpE,CAAC;AAEF,eAAO,MAAM,oBAAoB,QAAO,sBAMvC,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { createContext, useContext } from "react";
|
|
2
|
+
export const ColumnViewContext = createContext(null);
|
|
3
|
+
export const useColumnViewContext = () => {
|
|
4
|
+
const context = useContext(ColumnViewContext);
|
|
5
|
+
if (context === null) {
|
|
6
|
+
throw new Error("<ColumnViewColumn> must be rendered inside a <ColumnView>.");
|
|
7
|
+
}
|
|
8
|
+
return context;
|
|
9
|
+
};
|
|
10
|
+
//# sourceMappingURL=column-view-context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"column-view-context.js","sourceRoot":"","sources":["../../src/contexts/column-view-context.ts"],"names":[],"mappings":"AACA,OAAO,EAAgB,aAAa,EAAkB,UAAU,EAAE,MAAM,OAAO,CAAC;AAgBhF,MAAM,CAAC,MAAM,iBAAiB,GAA2C,aAAa,CAClF,IAAI,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAA2B,EAAE;IAC7D,MAAM,OAAO,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAC9C,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;QACnB,MAAM,IAAI,KAAK,CAAC,4DAA4D,CAAC,CAAC;IAClF,CAAC;IACD,OAAO,OAAO,CAAC;AACnB,CAAC,CAAC"}
|