@ocelescope/core 0.10.1 → 0.11.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.
Files changed (40) hide show
  1. package/README.md +2 -2
  2. package/dist/ActivityPicker-CtFSu1YR.js +31 -0
  3. package/dist/{AreaChart-DoD3LM50.js → AreaChart-BSwN1fMp.js} +6 -6
  4. package/dist/AttributePicker-Cq7luTEi.js +94 -0
  5. package/dist/{BarChart-Cixo5Okd.js → BarChart-CyMePf1z.js} +6 -6
  6. package/dist/E2ORelationPicker-C8EmrbFx.js +45 -0
  7. package/dist/EventAttributePicker-BgEdydek.js +26 -0
  8. package/dist/EventPicker-D5uNOTw1.js +38 -0
  9. package/dist/HistogramChart-CJwvvDUu.js +86 -0
  10. package/dist/{LineChart-CVz-dkJI.js → LineChart-Cbxnm338.js} +6 -6
  11. package/dist/O2ORelationPicker-CryAxxUo.js +43 -0
  12. package/dist/ObjectAttributePicker-D_I3LQsY.js +26 -0
  13. package/dist/ObjectPicker-D-ksQveT.js +38 -0
  14. package/dist/ObjectTypePicker-Bw8Fsktx.js +45 -0
  15. package/dist/{OcelChart-DvGTjJXo.js → OcelChart-DJNM5peW.js} +3 -4
  16. package/dist/OptionPicker-DQ-WYFQZ.js +344 -0
  17. package/dist/{PieChart-DBiASngC.js → PieChart-BmMoI0TY.js} +6 -6
  18. package/dist/{ScatterChart-jIQOjQes.js → ScatterChart-CASPRlZU.js} +6 -6
  19. package/dist/{SqlChart-bwDArK2l.js → SqlChart-cxKpWkyh.js} +34 -35
  20. package/dist/{SunburstChart-D6FhYBHI.js → SunburstChart-Ddx9EaL-.js} +5 -5
  21. package/dist/attributeOptions-COiWnKUS.js +36 -0
  22. package/dist/{cartesian-5TPNWjl_.js → cartesian-CtdS2iZb.js} +2 -3
  23. package/dist/index.d.ts +228 -209
  24. package/dist/index.js +83 -172
  25. package/dist/relationOptions-hEEsEQrx.js +32 -0
  26. package/dist/{rolldown-runtime-D7D4PA-g.js → rolldown-runtime-D8jQpDG7.js} +1 -2
  27. package/dist/{series-BBXVjHHY.js → series-Bx0HVnSy.js} +2 -3
  28. package/dist/style.css +630 -745
  29. package/dist/{Plot-CxHHyXot.js → useChart-BK4pjGal.js} +29 -5
  30. package/dist/{useCurrentOCEL-BeBa7K0g.js → useCurrentOCEL-BUH5XGje.js} +2 -4
  31. package/dist/useOcelId-BEC6_yRa.js +8 -0
  32. package/dist/{useOcelQuery-D1QM-Zgv.js → useOcelQuery-6vtgZNzz.js} +2 -3
  33. package/dist/useSearch-CdXjjv-a.js +18 -0
  34. package/package.json +25 -26
  35. package/dist/ActivityPicker-DbrGeiC_.js +0 -18
  36. package/dist/EventAttributePicker-Cf2vVKv5.js +0 -27
  37. package/dist/NamePicker-Be-qmr1x.js +0 -43
  38. package/dist/ObjectAttributePicker-CL43EsYt.js +0 -27
  39. package/dist/ObjectTypePicker-CKmszS0y.js +0 -18
  40. package/dist/useOcelId-BSU0-Srk.js +0 -6
package/README.md CHANGED
@@ -137,7 +137,7 @@ ranges:
137
137
  series="measure"
138
138
  yAxes="independent"
139
139
  sql={measurements}
140
- />
140
+ />;
141
141
  ```
142
142
 
143
143
  Charts are r4pm viewers. Colours come from the ambient `ViewerConfig` when a
@@ -149,7 +149,7 @@ clicks report a `ViewerTarget` to `onSelect`; and a chart inside a
149
149
  <ViewerExportFrame filename="activities">
150
150
  <OcelChart title="Events per activity" sql={events} />
151
151
  <OcelChart title="Objects per type" sql={objects} series="type" stacked />
152
- </ViewerExportFrame>
152
+ </ViewerExportFrame>;
153
153
  ```
154
154
 
155
155
  ## About
@@ -0,0 +1,31 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { useEventCounts } from "@ocelescope/api-base";
4
+ import { useMemo } from "react";
5
+ import { jsx } from "react/jsx-runtime";
6
+ import { useColorOf } from "@r4pm/components";
7
+ // src/components/Pickers/ActivityPicker.tsx
8
+ /** The log's activities, by how many events each has. */
9
+ const ActivityPicker = ({ ocelId, ocelVersion = "filtered", viewId, ...picker }) => {
10
+ const id = useOcelId(ocelId);
11
+ const colorOf = useColorOf("activity");
12
+ const { data, isPending, error } = useEventCounts(id, {
13
+ ocel_version: ocelVersion,
14
+ view_id: viewId
15
+ }, { query: { enabled: id != null } });
16
+ const options = useMemo(() => Object.entries(data ?? {}).map(([name, count]) => ({
17
+ value: name,
18
+ label: name,
19
+ count,
20
+ color: colorOf(name)
21
+ })), [data, colorOf]);
22
+ return /* @__PURE__ */ jsx(OptionPicker, {
23
+ options,
24
+ loading: isPending,
25
+ error,
26
+ placeholder: "Choose an activity…",
27
+ emptyText: "The log has no events",
28
+ ...picker
29
+ });
30
+ };
31
+ export { ActivityPicker };
@@ -1,11 +1,12 @@
1
- import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.js";
2
- import { i as measureOf, n as axis, t as Plot } from "./Plot-CxHHyXot.js";
3
- import { n as traceCount, t as cartesian } from "./cartesian-5TPNWjl_.js";
1
+ import { t as __exportAll } from "./rolldown-runtime-D8jQpDG7.js";
2
+ import { a as measureOf, n as Plot, r as axis, t as useChart } from "./useChart-BK4pjGal.js";
3
+ import { n as traceCount, t as cartesian } from "./cartesian-CtdS2iZb.js";
4
4
  import { jsx } from "react/jsx-runtime";
5
- //#region src/components/charts/AreaChart.tsx
5
+ // src/components/charts/AreaChart.tsx
6
6
  var AreaChart_exports = /* @__PURE__ */ __exportAll({ AreaChart: () => AreaChart });
7
7
  /** A line with the ground beneath it filled in, for totals over time. */
8
- const AreaChart = ({ xRange, ...props }) => {
8
+ const AreaChart = ({ xRange, ...given }) => {
9
+ const props = useChart(given);
9
10
  const measure = measureOf(props.y);
10
11
  return /* @__PURE__ */ jsx(Plot, {
11
12
  traces: cartesian(props, {
@@ -32,5 +33,4 @@ const AreaChart = ({ xRange, ...props }) => {
32
33
  }
33
34
  });
34
35
  };
35
- //#endregion
36
36
  export { AreaChart_exports as n, AreaChart as t };
@@ -0,0 +1,94 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { n as attributeOptions, t as attributeDefaults } from "./attributeOptions-COiWnKUS.js";
4
+ import { useE2o, useEventAttributes, useObjectAttributes } from "@ocelescope/api-base";
5
+ import { useMemo } from "react";
6
+ import { jsx } from "react/jsx-runtime";
7
+ import { useColorOf } from "@r4pm/components";
8
+ // src/components/Pickers/AttributePicker.tsx
9
+ const attributeId = (ref) => JSON.stringify(ref.target === "event" ? [
10
+ "event",
11
+ ref.activity,
12
+ ref.name
13
+ ] : [
14
+ "object",
15
+ ref.objectType,
16
+ ref.name
17
+ ]);
18
+ /**
19
+ * Attributes around an activity: those its events carry, and those of the
20
+ * object types its events relate to, grouped by where they come from.
21
+ */
22
+ const AttributePicker = ({ activity, objectTypes, onlyUniquelyRelated = false, valueTypes, ocelId, ocelVersion = "filtered", ...picker }) => {
23
+ const id = useOcelId(ocelId);
24
+ const activityColor = useColorOf("activity");
25
+ const objectTypeColor = useColorOf("objectType");
26
+ const enabled = id != null && activity !== void 0;
27
+ const events = useEventAttributes(id, {
28
+ ocel_version: ocelVersion,
29
+ names: activity ? [activity] : []
30
+ }, { query: { enabled } });
31
+ const relations = useE2o(id, {
32
+ source_types: activity ? [activity] : [],
33
+ ocel_version: ocelVersion,
34
+ page_size: 1e3
35
+ }, { query: { enabled } });
36
+ const relatedTypes = useMemo(() => {
37
+ const rows = (relations.data?.response ?? []).filter((row) => row.source === activity);
38
+ const isUnique = (type) => {
39
+ const [row, ...rest] = rows.filter((r) => r.target === type);
40
+ return row !== void 0 && rest.length === 0 && row.min_count === 1 && row.max_count === 1;
41
+ };
42
+ return [...new Set(rows.map((row) => row.target))].filter((type) => !objectTypes || objectTypes.includes(type)).filter((type) => !onlyUniquelyRelated || isUnique(type));
43
+ }, [
44
+ relations.data,
45
+ activity,
46
+ objectTypes,
47
+ onlyUniquelyRelated
48
+ ]);
49
+ const objects = useObjectAttributes(id, {
50
+ ocel_version: ocelVersion,
51
+ names: relatedTypes
52
+ }, { query: { enabled: enabled && relatedTypes.length > 0 } });
53
+ const options = useMemo(() => {
54
+ if (activity === void 0) return [];
55
+ return [...attributeOptions(events.data, valueTypes, (name) => ({
56
+ target: "event",
57
+ activity,
58
+ name
59
+ }), {
60
+ label: activity,
61
+ color: activityColor(activity),
62
+ caption: "event attributes"
63
+ }), ...relatedTypes.flatMap((objectType) => attributeOptions(objects.data?.filter((a) => a.entity_type === objectType), valueTypes, (name) => ({
64
+ target: "object",
65
+ objectType,
66
+ name
67
+ }), {
68
+ label: objectType,
69
+ color: objectTypeColor(objectType),
70
+ caption: "object attributes"
71
+ }))];
72
+ }, [
73
+ activity,
74
+ events.data,
75
+ objects.data,
76
+ relatedTypes,
77
+ valueTypes,
78
+ activityColor,
79
+ objectTypeColor
80
+ ]);
81
+ return /* @__PURE__ */ jsx(OptionPicker, {
82
+ options,
83
+ idOf: attributeId,
84
+ labelOf: (ref) => ref.name,
85
+ loading: events.isPending || relations.isPending || relatedTypes.length > 0 && objects.isPending,
86
+ error: events.error ?? relations.error ?? objects.error,
87
+ missing: activity === void 0 ? "Choose an activity first" : void 0,
88
+ placeholder: "Choose an attribute…",
89
+ emptyText: "No attributes to choose from",
90
+ ...attributeDefaults,
91
+ ...picker
92
+ });
93
+ };
94
+ export { AttributePicker };
@@ -1,11 +1,12 @@
1
- import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.js";
2
- import { i as measureOf, n as axis, t as Plot } from "./Plot-CxHHyXot.js";
3
- import { n as traceCount, t as cartesian } from "./cartesian-5TPNWjl_.js";
1
+ import { t as __exportAll } from "./rolldown-runtime-D8jQpDG7.js";
2
+ import { a as measureOf, n as Plot, r as axis, t as useChart } from "./useChart-BK4pjGal.js";
3
+ import { n as traceCount, t as cartesian } from "./cartesian-CtdS2iZb.js";
4
4
  import { jsx } from "react/jsx-runtime";
5
- //#region src/components/charts/BarChart.tsx
5
+ // src/components/charts/BarChart.tsx
6
6
  var BarChart_exports = /* @__PURE__ */ __exportAll({ BarChart: () => BarChart });
7
7
  /** Counts as bars, one per category. */
8
- const BarChart = ({ stacked = false, horizontal = false, xRange, ...props }) => {
8
+ const BarChart = ({ stacked = false, horizontal = false, xRange, ...given }) => {
9
+ const props = useChart(given);
9
10
  const measure = measureOf(props.y);
10
11
  const count = props.rows.length;
11
12
  const traces = cartesian(props, {
@@ -65,5 +66,4 @@ const withStackShare = (traces, horizontal, measure) => {
65
66
  };
66
67
  });
67
68
  };
68
- //#endregion
69
69
  export { BarChart_exports as n, BarChart as t };
@@ -0,0 +1,45 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { n as relationLabel, r as relationOptions, t as relationId } from "./relationOptions-hEEsEQrx.js";
4
+ import { useE2o } from "@ocelescope/api-base";
5
+ import { useMemo } from "react";
6
+ import { jsx } from "react/jsx-runtime";
7
+ import { useColorOf } from "@r4pm/components";
8
+ // src/components/Pickers/E2ORelationPicker.tsx
9
+ /**
10
+ * How events relate to objects: one choice per object type and qualifier,
11
+ * with how many objects an event relates to.
12
+ */
13
+ const E2ORelationPicker = ({ activity, ocelId, ocelVersion = "filtered", ...picker }) => {
14
+ const id = useOcelId(ocelId);
15
+ const activityColor = useColorOf("activity");
16
+ const objectTypeColor = useColorOf("objectType");
17
+ const { data, isPending, error } = useE2o(id, {
18
+ ...activity ? { source_types: [activity] } : {},
19
+ ocel_version: ocelVersion,
20
+ page_size: 1e3
21
+ }, { query: { enabled: id != null } });
22
+ const options = useMemo(() => relationOptions({
23
+ rows: data?.response ?? [],
24
+ source: activity,
25
+ unit: "event",
26
+ sourceColor: activityColor,
27
+ targetColor: objectTypeColor
28
+ }), [
29
+ data,
30
+ activity,
31
+ activityColor,
32
+ objectTypeColor
33
+ ]);
34
+ return /* @__PURE__ */ jsx(OptionPicker, {
35
+ options,
36
+ idOf: relationId,
37
+ labelOf: relationLabel,
38
+ loading: isPending,
39
+ error,
40
+ placeholder: "Choose a relation…",
41
+ emptyText: activity ? "Events of this type relate to no objects" : "Events relate to no objects",
42
+ ...picker
43
+ });
44
+ };
45
+ export { E2ORelationPicker };
@@ -0,0 +1,26 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { n as attributeOptions, t as attributeDefaults } from "./attributeOptions-COiWnKUS.js";
4
+ import { useEventAttributes } from "@ocelescope/api-base";
5
+ import { useMemo } from "react";
6
+ import { jsx } from "react/jsx-runtime";
7
+ // src/components/Pickers/EventAttributePicker.tsx
8
+ /** The attributes events carry, by name. */
9
+ const EventAttributePicker = ({ activity, valueTypes, ocelId, ocelVersion = "filtered", ...picker }) => {
10
+ const id = useOcelId(ocelId);
11
+ const { data, isPending, error } = useEventAttributes(id, {
12
+ ocel_version: ocelVersion,
13
+ ...activity ? { names: [activity] } : {}
14
+ }, { query: { enabled: id != null } });
15
+ const options = useMemo(() => attributeOptions(data, valueTypes, (name) => name), [data, valueTypes]);
16
+ return /* @__PURE__ */ jsx(OptionPicker, {
17
+ options,
18
+ loading: isPending,
19
+ error,
20
+ placeholder: "Choose an event attribute…",
21
+ emptyText: activity ? "Events of this type carry no attributes" : "Events carry no attributes",
22
+ ...attributeDefaults,
23
+ ...picker
24
+ });
25
+ };
26
+ export { EventAttributePicker };
@@ -0,0 +1,38 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { t as useSearch } from "./useSearch-CdXjjv-a.js";
4
+ import { useEventCounts, useEventIds } from "@ocelescope/api-base";
5
+ import { useMemo } from "react";
6
+ import { jsx } from "react/jsx-runtime";
7
+ // src/components/Pickers/EventPicker.tsx
8
+ /** Events of the log, found by typing part of an id. */
9
+ const EventPicker = ({ ocelId, ocelVersion = "filtered", limit = 50, ...picker }) => {
10
+ const id = useOcelId(ocelId);
11
+ const { search, setSearch, debounced } = useSearch();
12
+ const { data, isFetching, error } = useEventIds(id, {
13
+ search: debounced,
14
+ size: limit,
15
+ ocel_version: ocelVersion
16
+ }, { query: { enabled: id != null } });
17
+ const counts = useEventCounts(id, { ocel_version: ocelVersion }, { query: { enabled: id != null } });
18
+ const total = useMemo(() => Object.values(counts.data ?? {}).reduce((sum, n) => sum + n, 0), [counts.data]);
19
+ const options = useMemo(() => (data?.response ?? []).map((eventId) => ({
20
+ value: eventId,
21
+ label: eventId
22
+ })), [data]);
23
+ return /* @__PURE__ */ jsx(OptionPicker, {
24
+ options,
25
+ search,
26
+ onSearch: setSearch,
27
+ total: counts.data ? total : void 0,
28
+ loading: isFetching,
29
+ error,
30
+ placeholder: "Search for an event…",
31
+ emptyText: "No event matches",
32
+ sort: "name",
33
+ counts: false,
34
+ bars: false,
35
+ ...picker
36
+ });
37
+ };
38
+ export { EventPicker };
@@ -0,0 +1,86 @@
1
+ import { t as __exportAll } from "./rolldown-runtime-D8jQpDG7.js";
2
+ import { a as measureOf, n as Plot, r as axis, t as useChart } from "./useChart-BK4pjGal.js";
3
+ import { jsx } from "react/jsx-runtime";
4
+ import { useViewerConfig } from "@r4pm/components";
5
+ // src/components/charts/HistogramChart.tsx
6
+ var HistogramChart_exports = /* @__PURE__ */ __exportAll({ HistogramChart: () => HistogramChart });
7
+ /**
8
+ * A distribution as bins along a numeric axis.
9
+ *
10
+ * The rows are the bins, already counted: a histogram of a whole log is
11
+ * computed where the log is, not from every value sent to the browser. Bars
12
+ * touch and are as wide as their bin, so unequal bins and gaps where nothing
13
+ * fell read as what they are.
14
+ */
15
+ const HistogramChart = ({ xEnd, ...given }) => {
16
+ const props = useChart(given);
17
+ const { format } = useViewerConfig({});
18
+ const measure = measureOf(props.y);
19
+ const number = format?.number ?? defaultNumber;
20
+ const bins = props.rows.map((row) => ({
21
+ from: edge(row[props.x]),
22
+ to: edge(row[xEnd]),
23
+ count: Number(row[measure] ?? 0)
24
+ }));
25
+ const typical = median(bins.flatMap((bin) => bin.from !== void 0 && bin.to !== void 0 ? [bin.to - bin.from] : []));
26
+ const bars = bins.flatMap(({ from, to, count }) => {
27
+ if (from === void 0 && to === void 0) return [];
28
+ let start = from ?? to - typical;
29
+ let end = to ?? from + typical;
30
+ if (end === start) {
31
+ start -= typical / 2;
32
+ end += typical / 2;
33
+ }
34
+ return [{
35
+ center: (start + end) / 2,
36
+ width: end - start,
37
+ count,
38
+ open: from === void 0 || to === void 0,
39
+ label: from === void 0 ? `< ${number(to)}` : to === void 0 ? `> ${number(from)}` : from === to ? number(from) : `${number(from)} – ${number(to)}`
40
+ }];
41
+ });
42
+ const color = props.colorOf?.(props.x);
43
+ return /* @__PURE__ */ jsx(Plot, {
44
+ traces: [{
45
+ type: "bar",
46
+ x: bars.map((bar) => bar.center),
47
+ y: bars.map((bar) => bar.count),
48
+ width: bars.map((bar) => bar.width),
49
+ customdata: bars.map((bar) => bar.label),
50
+ hovertemplate: `<b>%{customdata}</b><br>${measure}: %{y}<extra></extra>`,
51
+ marker: {
52
+ ...color && { color },
53
+ line: {
54
+ color: "rgba(128,128,128,0.45)",
55
+ width: 1
56
+ },
57
+ pattern: {
58
+ shape: bars.map((bar) => bar.open ? "/" : ""),
59
+ fillmode: "overlay"
60
+ },
61
+ opacity: bars.map((bar) => bar.open ? .55 : 1)
62
+ }
63
+ }],
64
+ readName: (point) => String(point.x ?? ""),
65
+ onSelect: props.onSelect,
66
+ layout: {
67
+ bargap: 0,
68
+ hovermode: "closest",
69
+ xaxis: axis(props.x),
70
+ yaxis: axis(measure)
71
+ }
72
+ });
73
+ };
74
+ /** A bin edge: a number, or nothing where the bin is open-ended. */
75
+ const edge = (value) => {
76
+ if (value == null || value === "") return void 0;
77
+ const number = Number(value);
78
+ return Number.isFinite(number) ? number : void 0;
79
+ };
80
+ /** The middle width, or 1 where no bin has one to go by. */
81
+ const median = (values) => {
82
+ const sorted = values.filter((value) => value > 0).sort((a, b) => a - b);
83
+ return sorted[Math.floor(sorted.length / 2)] ?? 1;
84
+ };
85
+ const defaultNumber = (value) => new Intl.NumberFormat(void 0, { maximumSignificantDigits: 4 }).format(value);
86
+ export { HistogramChart_exports as n, HistogramChart as t };
@@ -1,11 +1,12 @@
1
- import { t as __exportAll } from "./rolldown-runtime-D7D4PA-g.js";
2
- import { i as measureOf, n as axis, t as Plot } from "./Plot-CxHHyXot.js";
3
- import { n as toSeries, t as paint } from "./series-BBXVjHHY.js";
1
+ import { t as __exportAll } from "./rolldown-runtime-D8jQpDG7.js";
2
+ import { a as measureOf, n as Plot, r as axis, t as useChart } from "./useChart-BK4pjGal.js";
3
+ import { n as toSeries, t as paint } from "./series-Bx0HVnSy.js";
4
4
  import { jsx } from "react/jsx-runtime";
5
- //#region src/components/charts/LineChart.tsx
5
+ // src/components/charts/LineChart.tsx
6
6
  var LineChart_exports = /* @__PURE__ */ __exportAll({ LineChart: () => LineChart });
7
7
  /** Lines through ordered values, optionally with one scale per line. */
8
- const LineChart = ({ step = false, yAxes = "shared", xRange, ...props }) => {
8
+ const LineChart = ({ step = false, yAxes = "shared", xRange, ...given }) => {
9
+ const props = useChart(given);
9
10
  const groups = toSeries(props);
10
11
  const independent = yAxes === "independent" && groups.length > 1;
11
12
  const colors = groups.map((group) => {
@@ -60,5 +61,4 @@ const LineChart = ({ step = false, yAxes = "shared", xRange, ...props }) => {
60
61
  }
61
62
  });
62
63
  };
63
- //#endregion
64
64
  export { LineChart_exports as n, LineChart as t };
@@ -0,0 +1,43 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { n as relationLabel, r as relationOptions, t as relationId } from "./relationOptions-hEEsEQrx.js";
4
+ import { useO2o } from "@ocelescope/api-base";
5
+ import { useMemo } from "react";
6
+ import { jsx } from "react/jsx-runtime";
7
+ import { useColorOf } from "@r4pm/components";
8
+ // src/components/Pickers/O2ORelationPicker.tsx
9
+ /**
10
+ * How objects relate to objects: one choice per object type and qualifier,
11
+ * with how many objects an object relates to.
12
+ */
13
+ const O2ORelationPicker = ({ objectType, ocelId, ocelVersion = "filtered", ...picker }) => {
14
+ const id = useOcelId(ocelId);
15
+ const objectTypeColor = useColorOf("objectType");
16
+ const { data, isPending, error } = useO2o(id, {
17
+ ...objectType ? { source_types: [objectType] } : {},
18
+ ocel_version: ocelVersion,
19
+ page_size: 1e3
20
+ }, { query: { enabled: id != null } });
21
+ const options = useMemo(() => relationOptions({
22
+ rows: data?.response ?? [],
23
+ source: objectType,
24
+ unit: "object",
25
+ sourceColor: objectTypeColor,
26
+ targetColor: objectTypeColor
27
+ }), [
28
+ data,
29
+ objectType,
30
+ objectTypeColor
31
+ ]);
32
+ return /* @__PURE__ */ jsx(OptionPicker, {
33
+ options,
34
+ idOf: relationId,
35
+ labelOf: relationLabel,
36
+ loading: isPending,
37
+ error,
38
+ placeholder: "Choose a relation…",
39
+ emptyText: objectType ? "Objects of this type relate to no objects" : "Objects relate to no objects",
40
+ ...picker
41
+ });
42
+ };
43
+ export { O2ORelationPicker };
@@ -0,0 +1,26 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { n as attributeOptions, t as attributeDefaults } from "./attributeOptions-COiWnKUS.js";
4
+ import { useObjectAttributes } from "@ocelescope/api-base";
5
+ import { useMemo } from "react";
6
+ import { jsx } from "react/jsx-runtime";
7
+ // src/components/Pickers/ObjectAttributePicker.tsx
8
+ /** The attributes objects carry, by name. */
9
+ const ObjectAttributePicker = ({ objectType, valueTypes, ocelId, ocelVersion = "filtered", ...picker }) => {
10
+ const id = useOcelId(ocelId);
11
+ const { data, isPending, error } = useObjectAttributes(id, {
12
+ ocel_version: ocelVersion,
13
+ ...objectType ? { names: [objectType] } : {}
14
+ }, { query: { enabled: id != null } });
15
+ const options = useMemo(() => attributeOptions(data, valueTypes, (name) => name), [data, valueTypes]);
16
+ return /* @__PURE__ */ jsx(OptionPicker, {
17
+ options,
18
+ loading: isPending,
19
+ error,
20
+ placeholder: "Choose an object attribute…",
21
+ emptyText: objectType ? "Objects of this type carry no attributes" : "Objects carry no attributes",
22
+ ...attributeDefaults,
23
+ ...picker
24
+ });
25
+ };
26
+ export { ObjectAttributePicker };
@@ -0,0 +1,38 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { t as useSearch } from "./useSearch-CdXjjv-a.js";
4
+ import { useObjectCounts, useObjectIds } from "@ocelescope/api-base";
5
+ import { useMemo } from "react";
6
+ import { jsx } from "react/jsx-runtime";
7
+ // src/components/Pickers/ObjectPicker.tsx
8
+ /** Objects of the log, found by typing part of an id. */
9
+ const ObjectPicker = ({ ocelId, ocelVersion = "filtered", limit = 50, ...picker }) => {
10
+ const id = useOcelId(ocelId);
11
+ const { search, setSearch, debounced } = useSearch();
12
+ const { data, isFetching, error } = useObjectIds(id, {
13
+ search: debounced,
14
+ size: limit,
15
+ ocel_version: ocelVersion
16
+ }, { query: { enabled: id != null } });
17
+ const counts = useObjectCounts(id, { ocel_version: ocelVersion }, { query: { enabled: id != null } });
18
+ const total = useMemo(() => Object.values(counts.data ?? {}).reduce((sum, n) => sum + n, 0), [counts.data]);
19
+ const options = useMemo(() => (data?.response ?? []).map((objectId) => ({
20
+ value: objectId,
21
+ label: objectId
22
+ })), [data]);
23
+ return /* @__PURE__ */ jsx(OptionPicker, {
24
+ options,
25
+ search,
26
+ onSearch: setSearch,
27
+ total: counts.data ? total : void 0,
28
+ loading: isFetching,
29
+ error,
30
+ placeholder: "Search for an object…",
31
+ emptyText: "No object matches",
32
+ sort: "name",
33
+ counts: false,
34
+ bars: false,
35
+ ...picker
36
+ });
37
+ };
38
+ export { ObjectPicker };
@@ -0,0 +1,45 @@
1
+ import { t as useOcelId } from "./useOcelId-BEC6_yRa.js";
2
+ import { OptionPicker } from "./OptionPicker-DQ-WYFQZ.js";
3
+ import { useE2o, useObjectCounts } from "@ocelescope/api-base";
4
+ import { useMemo } from "react";
5
+ import { jsx } from "react/jsx-runtime";
6
+ import { useColorOf } from "@r4pm/components";
7
+ // src/components/Pickers/ObjectTypePicker.tsx
8
+ /** The log's object types, by how many objects each has. */
9
+ const ObjectTypePicker = ({ activity, ocelId, ocelVersion = "filtered", viewId, ...picker }) => {
10
+ const id = useOcelId(ocelId);
11
+ const colorOf = useColorOf("objectType");
12
+ const { data, isPending, error } = useObjectCounts(id, {
13
+ ocel_version: ocelVersion,
14
+ view_id: viewId
15
+ }, { query: { enabled: id != null } });
16
+ const relations = useE2o(id, {
17
+ source_types: activity ? [activity] : [],
18
+ ocel_version: ocelVersion,
19
+ view_id: viewId,
20
+ page_size: 1e3
21
+ }, { query: { enabled: id != null && activity !== void 0 } });
22
+ const options = useMemo(() => {
23
+ const related = activity === void 0 ? void 0 : new Set((relations.data?.response ?? []).filter((row) => row.source === activity).map((row) => row.target));
24
+ return Object.entries(data ?? {}).filter(([name]) => !related || related.has(name)).map(([name, count]) => ({
25
+ value: name,
26
+ label: name,
27
+ count,
28
+ color: colorOf(name)
29
+ }));
30
+ }, [
31
+ data,
32
+ colorOf,
33
+ activity,
34
+ relations.data
35
+ ]);
36
+ return /* @__PURE__ */ jsx(OptionPicker, {
37
+ options,
38
+ loading: isPending || activity !== void 0 && relations.isPending,
39
+ error: error ?? relations.error,
40
+ placeholder: "Choose an object type…",
41
+ emptyText: "The log has no objects",
42
+ ...picker
43
+ });
44
+ };
45
+ export { ObjectTypePicker };
@@ -1,8 +1,8 @@
1
- import { t as useOcelQuery } from "./useOcelQuery-D1QM-Zgv.js";
2
- import { SqlChart } from "./SqlChart-bwDArK2l.js";
1
+ import { t as useOcelQuery } from "./useOcelQuery-6vtgZNzz.js";
2
+ import { SqlChart } from "./SqlChart-cxKpWkyh.js";
3
3
  import { jsx } from "react/jsx-runtime";
4
4
  import { AsyncBoundary, EmptyState } from "@r4pm/components";
5
- //#region src/components/charts/OcelChart.tsx
5
+ // src/components/charts/OcelChart.tsx
6
6
  /**
7
7
  * A chart of the current OCEL: give it SQL, get a chart.
8
8
  *
@@ -37,5 +37,4 @@ const OcelChart = ({ sql, parameters, ocelVersion = "filtered", enabled = true,
37
37
  })
38
38
  });
39
39
  };
40
- //#endregion
41
40
  export { OcelChart };