@ocelescope/core 0.10.1 → 0.10.2
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/ActivityPicker-BfA34hBU.js +29 -0
- package/dist/{AreaChart-DoD3LM50.js → AreaChart-q6rVcUIp.js} +4 -3
- package/dist/AttributePicker-Dd8eKA_3.js +95 -0
- package/dist/{BarChart-Cixo5Okd.js → BarChart-BLZS87ex.js} +4 -3
- package/dist/E2ORelationPicker-CcDSJWc0.js +46 -0
- package/dist/EventAttributePicker-Ch0rYS1h.js +27 -0
- package/dist/EventPicker-DbqFMMr2.js +39 -0
- package/dist/HistogramChart-GgiQdlsk.js +87 -0
- package/dist/{LineChart-CVz-dkJI.js → LineChart-Cq935Tk2.js} +4 -3
- package/dist/O2ORelationPicker-_XU1FfIX.js +44 -0
- package/dist/ObjectAttributePicker-Dpt3IfC5.js +27 -0
- package/dist/ObjectPicker-Bd68wl9p.js +39 -0
- package/dist/ObjectTypePicker-CXCMky34.js +42 -0
- package/dist/{OcelChart-DvGTjJXo.js → OcelChart-BnXjHb_r.js} +1 -1
- package/dist/OptionPicker-D9rUIwbY.js +351 -0
- package/dist/{PieChart-DBiASngC.js → PieChart-DZFHaTXD.js} +4 -3
- package/dist/{ScatterChart-jIQOjQes.js → ScatterChart-DJfJmABJ.js} +4 -3
- package/dist/{SqlChart-bwDArK2l.js → SqlChart-Bf7D5o5P.js} +33 -33
- package/dist/{SunburstChart-D6FhYBHI.js → SunburstChart-CMNYlKon.js} +3 -2
- package/dist/attributeOptions-D4slIoZx.js +37 -0
- package/dist/{cartesian-5TPNWjl_.js → cartesian-Dt7weMqK.js} +1 -1
- package/dist/index.d.ts +240 -143
- package/dist/index.js +28 -100
- package/dist/relationOptions-DTtIOIr1.js +33 -0
- package/dist/{series-BBXVjHHY.js → series-W1jsVape.js} +1 -1
- package/dist/style.css +596 -731
- package/dist/{Plot-CxHHyXot.js → useChart-jzzXgs0j.js} +28 -1
- package/dist/{useOcelId-BSU0-Srk.js → useOcelId-DIu_aGLH.js} +5 -2
- package/dist/useSearch-Ad3AtTVj.js +19 -0
- package/package.json +17 -18
- package/dist/ActivityPicker-DbrGeiC_.js +0 -18
- package/dist/EventAttributePicker-Cf2vVKv5.js +0 -27
- package/dist/NamePicker-Be-qmr1x.js +0 -43
- package/dist/ObjectAttributePicker-CL43EsYt.js +0 -27
- package/dist/ObjectTypePicker-CKmszS0y.js +0 -18
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { colorForSeed, useViewerConfig } from "@r4pm/components";
|
|
2
3
|
import { ThemedPlot } from "@r4pm/components/charts";
|
|
3
4
|
//#region src/components/charts/types.ts
|
|
4
5
|
/** How a cell reads once it is a label. */
|
|
@@ -72,4 +73,30 @@ const axis = (title, range) => ({
|
|
|
72
73
|
...range && { range: [...range] }
|
|
73
74
|
});
|
|
74
75
|
//#endregion
|
|
75
|
-
|
|
76
|
+
//#region src/components/charts/internal/useChart.ts
|
|
77
|
+
/**
|
|
78
|
+
* A chart's props with colour and selection resolved the way every r4pm
|
|
79
|
+
* viewer does: the chart's own prop, else the ambient `ViewerConfig`, else
|
|
80
|
+
* the hash. Both come back bound to the chart's scope, which is all the
|
|
81
|
+
* traces need.
|
|
82
|
+
*/
|
|
83
|
+
const useChart = ({ rows, x, y, series, colorScope, colorOf, onSelect }) => {
|
|
84
|
+
const config = useViewerConfig({
|
|
85
|
+
colorOf,
|
|
86
|
+
onSelect
|
|
87
|
+
});
|
|
88
|
+
return {
|
|
89
|
+
rows,
|
|
90
|
+
x,
|
|
91
|
+
y,
|
|
92
|
+
series,
|
|
93
|
+
...colorScope && { colorOf: (name) => config.colorOf?.(colorScope, name) ?? colorForSeed(name) },
|
|
94
|
+
...config.onSelect && { onSelect: (name, point) => config.onSelect?.({
|
|
95
|
+
scope: colorScope ?? x,
|
|
96
|
+
key: name,
|
|
97
|
+
data: point
|
|
98
|
+
}) }
|
|
99
|
+
};
|
|
100
|
+
};
|
|
101
|
+
//#endregion
|
|
102
|
+
export { measureOf as a, label as i, Plot as n, plotted as o, axis as r, useChart as t };
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import { t as useCurrentOcel } from "./useCurrentOCEL-BeBa7K0g.js";
|
|
2
|
-
//#region src/components/
|
|
2
|
+
//#region src/components/Pickers/internal/useOcelId.ts
|
|
3
3
|
/** The OCEL a picker reads: the one it was given, else the selected one. */
|
|
4
|
-
const useOcelId = (ocelId) =>
|
|
4
|
+
const useOcelId = (ocelId) => {
|
|
5
|
+
const current = useCurrentOcel();
|
|
6
|
+
return ocelId ?? current.id;
|
|
7
|
+
};
|
|
5
8
|
//#endregion
|
|
6
9
|
export { useOcelId as t };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { useEffect, useState } from "react";
|
|
2
|
+
//#region src/components/Pickers/internal/useSearch.ts
|
|
3
|
+
const DELAY_MS = 300;
|
|
4
|
+
/** What the reader has typed, slowed to one request per pause in typing. */
|
|
5
|
+
const useSearch = () => {
|
|
6
|
+
const [search, setSearch] = useState("");
|
|
7
|
+
const [debounced, setDebounced] = useState("");
|
|
8
|
+
useEffect(() => {
|
|
9
|
+
const timer = setTimeout(() => setDebounced(search), DELAY_MS);
|
|
10
|
+
return () => clearTimeout(timer);
|
|
11
|
+
}, [search]);
|
|
12
|
+
return {
|
|
13
|
+
search,
|
|
14
|
+
setSearch,
|
|
15
|
+
debounced: debounced || void 0
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
//#endregion
|
|
19
|
+
export { useSearch as t };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ocelescope/core",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.10.
|
|
4
|
+
"version": "0.10.2",
|
|
5
5
|
"description": "Core React component and style library for Ocelescope (Mantine + React Query).",
|
|
6
6
|
"author": "Görkem-Emre Öztürk <goerkem.oeztuerk@rwth-aachen.de>",
|
|
7
7
|
"license": "MIT",
|
|
@@ -28,35 +28,34 @@
|
|
|
28
28
|
"access": "public"
|
|
29
29
|
},
|
|
30
30
|
"peerDependencies": {
|
|
31
|
-
"@mantine/core": "^9.
|
|
32
|
-
"@mantine/dropzone": "^9.
|
|
33
|
-
"@mantine/hooks": "^9.
|
|
34
|
-
"@mantine/notifications": "^9.
|
|
31
|
+
"@mantine/core": "^9.7.2",
|
|
32
|
+
"@mantine/dropzone": "^9.7.2",
|
|
33
|
+
"@mantine/hooks": "^9.7.2",
|
|
34
|
+
"@mantine/notifications": "^9.7.2",
|
|
35
35
|
"@marko19907/string-to-color": "^1.0.2",
|
|
36
|
-
"@ocelescope/api-base": "^0.10.
|
|
37
|
-
"@ocelescope/api-client": "^0.10.
|
|
38
|
-
"@ocelescope/resources": "^0.10.
|
|
39
|
-
"@tanstack/react-query": "^5.
|
|
40
|
-
"@tanstack/react-query-devtools": "^5.
|
|
36
|
+
"@ocelescope/api-base": "^0.10.2",
|
|
37
|
+
"@ocelescope/api-client": "^0.10.2",
|
|
38
|
+
"@ocelescope/resources": "^0.10.2",
|
|
39
|
+
"@tanstack/react-query": "^5.104.2",
|
|
40
|
+
"@tanstack/react-query-devtools": "^5.104.2",
|
|
41
41
|
"@r4pm/components": "^0.3.2",
|
|
42
42
|
"clsx": "^2.1.1",
|
|
43
43
|
"content-disposition-attachment": "^0.3.1",
|
|
44
44
|
"dayjs": "^1.11.23",
|
|
45
45
|
"file-saver": "^2.0.5",
|
|
46
|
-
"lucide-react": "^1.
|
|
46
|
+
"lucide-react": "^1.56.0",
|
|
47
47
|
"mantine-datatable": "^9.4.0",
|
|
48
|
-
"next": "16.
|
|
48
|
+
"next": "16.4.0",
|
|
49
49
|
"qs": "^6.16.0",
|
|
50
50
|
"react": "^19.3.0",
|
|
51
51
|
"react-dom": "^19.3.0",
|
|
52
|
-
"zod": "^4.6.
|
|
52
|
+
"zod": "^4.6.7",
|
|
53
53
|
"zustand": "^5.0.15"
|
|
54
54
|
},
|
|
55
55
|
"devDependencies": {
|
|
56
|
-
"@mantine/
|
|
57
|
-
"@mantine/
|
|
58
|
-
"@
|
|
59
|
-
"@tsdown/css": "^0.23.0",
|
|
56
|
+
"@mantine/dates": "^9.7.2",
|
|
57
|
+
"@mantine/notifications": "^9.7.2",
|
|
58
|
+
"@tsdown/css": "^0.23.1",
|
|
60
59
|
"@types/file-saver": "^2.0.7",
|
|
61
60
|
"@types/node": "^26.6.1",
|
|
62
61
|
"@types/qs": "^6.15.1",
|
|
@@ -64,7 +63,7 @@
|
|
|
64
63
|
"@types/react-dom": "^19.3.0",
|
|
65
64
|
"@xyflow/react": "^12.11.3",
|
|
66
65
|
"qs": "^6.16.0",
|
|
67
|
-
"tsdown": "^0.23.
|
|
66
|
+
"tsdown": "^0.23.1",
|
|
68
67
|
"typescript": "^6.0.3"
|
|
69
68
|
},
|
|
70
69
|
"scripts": {
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { t as useOcelId } from "./useOcelId-BSU0-Srk.js";
|
|
2
|
-
import { NamePicker } from "./NamePicker-Be-qmr1x.js";
|
|
3
|
-
import { useEventCounts } from "@ocelescope/api-base";
|
|
4
|
-
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
//#region src/components/pickers/ActivityPicker.tsx
|
|
6
|
-
/** The log's activities, by how often they occur. */
|
|
7
|
-
const ActivityPicker = ({ ocelId, ocelVersion = "filtered", ...picker }) => {
|
|
8
|
-
const id = useOcelId(ocelId);
|
|
9
|
-
const { data, isPending } = useEventCounts(id, { ocel_version: ocelVersion }, { query: { enabled: id != null } });
|
|
10
|
-
return /* @__PURE__ */ jsx(NamePicker, {
|
|
11
|
-
items: data ?? {},
|
|
12
|
-
scope: "activity",
|
|
13
|
-
loading: isPending,
|
|
14
|
-
...picker
|
|
15
|
-
});
|
|
16
|
-
};
|
|
17
|
-
//#endregion
|
|
18
|
-
export { ActivityPicker };
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import { t as useOcelId } from "./useOcelId-BSU0-Srk.js";
|
|
2
|
-
import { NamePicker } from "./NamePicker-Be-qmr1x.js";
|
|
3
|
-
import { useEventAttributes } from "@ocelescope/api-base";
|
|
4
|
-
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
//#region src/components/pickers/EventAttributePicker.tsx
|
|
6
|
-
/** The attributes events carry, counted by how many values each takes. */
|
|
7
|
-
const EventAttributePicker = ({ activity, ocelId, ocelVersion = "filtered", ...picker }) => {
|
|
8
|
-
const id = useOcelId(ocelId);
|
|
9
|
-
const { data, isPending } = useEventAttributes(id, {
|
|
10
|
-
ocel_version: ocelVersion,
|
|
11
|
-
...activity ? { names: [activity] } : {}
|
|
12
|
-
}, { query: { enabled: id != null } });
|
|
13
|
-
return /* @__PURE__ */ jsx(NamePicker, {
|
|
14
|
-
items: (data ?? []).map((attribute) => ({
|
|
15
|
-
key: attribute.name,
|
|
16
|
-
count: attribute.distinct_values
|
|
17
|
-
})),
|
|
18
|
-
scope: "attribute",
|
|
19
|
-
loading: isPending,
|
|
20
|
-
bars: false,
|
|
21
|
-
cutoff: false,
|
|
22
|
-
sort: "name",
|
|
23
|
-
...picker
|
|
24
|
-
});
|
|
25
|
-
};
|
|
26
|
-
//#endregion
|
|
27
|
-
export { EventAttributePicker };
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
import { Stack, Text } from "@mantine/core";
|
|
2
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { FrequencyPicker } from "@r4pm/components";
|
|
4
|
-
//#region src/components/pickers/types.ts
|
|
5
|
-
/** The names as a set, which is how the pickers themselves hold them. */
|
|
6
|
-
const chosen = (selection) => new Set(selection.multiple ? selection.value : selection.value == null ? [] : [selection.value]);
|
|
7
|
-
/** Report a set back as the one name, or the list, the caller asked for. */
|
|
8
|
-
const report = (selection, names) => {
|
|
9
|
-
const list = [...names];
|
|
10
|
-
if (selection.multiple) selection.onChange(list);
|
|
11
|
-
else selection.onChange(list[0]);
|
|
12
|
-
};
|
|
13
|
-
//#endregion
|
|
14
|
-
//#region src/components/pickers/NamePicker.tsx
|
|
15
|
-
/**
|
|
16
|
-
* Picking names out of a list, with what is known about how often each occurs.
|
|
17
|
-
*
|
|
18
|
-
* Presentational: it is handed the names and reports back what was picked.
|
|
19
|
-
* `ActivityPicker` and the others wrap it around an endpoint.
|
|
20
|
-
*/
|
|
21
|
-
const NamePicker = ({ items, label, searchable = true, bars = true, counts = true, cutoff = false, sort = "count", scope = "name", loading = false, emptyText, disabled = false, autoFocus, ...selection }) => /* @__PURE__ */ jsxs(Stack, {
|
|
22
|
-
gap: 4,
|
|
23
|
-
children: [label && /* @__PURE__ */ jsx(Text, {
|
|
24
|
-
size: "xs",
|
|
25
|
-
c: "dimmed",
|
|
26
|
-
children: label
|
|
27
|
-
}), /* @__PURE__ */ jsx(FrequencyPicker, {
|
|
28
|
-
items,
|
|
29
|
-
mode: selection.multiple ? "multi" : "single",
|
|
30
|
-
value: chosen(selection),
|
|
31
|
-
onChange: (next) => !disabled && report(selection, next),
|
|
32
|
-
searchable,
|
|
33
|
-
showBars: bars,
|
|
34
|
-
showCounts: counts,
|
|
35
|
-
showCutoff: cutoff,
|
|
36
|
-
sort,
|
|
37
|
-
scope,
|
|
38
|
-
autoFocus,
|
|
39
|
-
emptyText: emptyText ?? (loading ? "Reading the OCEL…" : "Nothing here")
|
|
40
|
-
})]
|
|
41
|
-
});
|
|
42
|
-
//#endregion
|
|
43
|
-
export { NamePicker };
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import { t as useOcelId } from "./useOcelId-BSU0-Srk.js";
|
|
2
|
-
import { NamePicker } from "./NamePicker-Be-qmr1x.js";
|
|
3
|
-
import { useObjectAttributes } from "@ocelescope/api-base";
|
|
4
|
-
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
//#region src/components/pickers/ObjectAttributePicker.tsx
|
|
6
|
-
/** The attributes objects carry, counted by how many values each takes. */
|
|
7
|
-
const ObjectAttributePicker = ({ objectType, ocelId, ocelVersion = "filtered", ...picker }) => {
|
|
8
|
-
const id = useOcelId(ocelId);
|
|
9
|
-
const { data, isPending } = useObjectAttributes(id, {
|
|
10
|
-
ocel_version: ocelVersion,
|
|
11
|
-
...objectType ? { names: [objectType] } : {}
|
|
12
|
-
}, { query: { enabled: id != null } });
|
|
13
|
-
return /* @__PURE__ */ jsx(NamePicker, {
|
|
14
|
-
items: (data ?? []).map((attribute) => ({
|
|
15
|
-
key: attribute.name,
|
|
16
|
-
count: attribute.distinct_values
|
|
17
|
-
})),
|
|
18
|
-
scope: "attribute",
|
|
19
|
-
loading: isPending,
|
|
20
|
-
bars: false,
|
|
21
|
-
cutoff: false,
|
|
22
|
-
sort: "name",
|
|
23
|
-
...picker
|
|
24
|
-
});
|
|
25
|
-
};
|
|
26
|
-
//#endregion
|
|
27
|
-
export { ObjectAttributePicker };
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { t as useOcelId } from "./useOcelId-BSU0-Srk.js";
|
|
2
|
-
import { NamePicker } from "./NamePicker-Be-qmr1x.js";
|
|
3
|
-
import { useObjectCounts } from "@ocelescope/api-base";
|
|
4
|
-
import { jsx } from "react/jsx-runtime";
|
|
5
|
-
//#region src/components/pickers/ObjectTypePicker.tsx
|
|
6
|
-
/** The log's object types, by how often they occur. */
|
|
7
|
-
const ObjectTypePicker = ({ ocelId, ocelVersion = "filtered", ...picker }) => {
|
|
8
|
-
const id = useOcelId(ocelId);
|
|
9
|
-
const { data, isPending } = useObjectCounts(id, { ocel_version: ocelVersion }, { query: { enabled: id != null } });
|
|
10
|
-
return /* @__PURE__ */ jsx(NamePicker, {
|
|
11
|
-
items: data ?? {},
|
|
12
|
-
scope: "objectType",
|
|
13
|
-
loading: isPending,
|
|
14
|
-
...picker
|
|
15
|
-
});
|
|
16
|
-
};
|
|
17
|
-
//#endregion
|
|
18
|
-
export { ObjectTypePicker };
|