@xeonr/platform-ui 1.5.1 → 1.6.1
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/index.d.ts +12 -5
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +12 -3
- package/dist/index.js.map +1 -1
- package/dist/kit/Anchored.d.ts.map +1 -1
- package/dist/kit/Anchored.js +4 -1
- package/dist/kit/Anchored.js.map +1 -1
- package/dist/kit/Blocks.d.ts +6 -1
- package/dist/kit/Blocks.d.ts.map +1 -1
- package/dist/kit/Blocks.js +13 -2
- package/dist/kit/Blocks.js.map +1 -1
- package/dist/kit/Card.d.ts +6 -1
- package/dist/kit/Card.d.ts.map +1 -1
- package/dist/kit/Card.js +19 -4
- package/dist/kit/Card.js.map +1 -1
- package/dist/kit/Charts.d.ts +39 -3
- package/dist/kit/Charts.d.ts.map +1 -1
- package/dist/kit/Charts.js +70 -15
- package/dist/kit/Charts.js.map +1 -1
- package/dist/kit/CommandPalette.d.ts +47 -0
- package/dist/kit/CommandPalette.d.ts.map +1 -0
- package/dist/kit/CommandPalette.js +204 -0
- package/dist/kit/CommandPalette.js.map +1 -0
- package/dist/kit/DataTable.d.ts +18 -2
- package/dist/kit/DataTable.d.ts.map +1 -1
- package/dist/kit/DataTable.js +45 -6
- package/dist/kit/DataTable.js.map +1 -1
- package/dist/kit/Editable.d.ts +30 -0
- package/dist/kit/Editable.d.ts.map +1 -1
- package/dist/kit/Editable.js +150 -3
- package/dist/kit/Editable.js.map +1 -1
- package/dist/kit/EmptyState.d.ts +9 -2
- package/dist/kit/EmptyState.d.ts.map +1 -1
- package/dist/kit/EmptyState.js +16 -2
- package/dist/kit/EmptyState.js.map +1 -1
- package/dist/kit/GroupedMultiSelect.d.ts +57 -0
- package/dist/kit/GroupedMultiSelect.d.ts.map +1 -0
- package/dist/kit/GroupedMultiSelect.js +219 -0
- package/dist/kit/GroupedMultiSelect.js.map +1 -0
- package/dist/kit/List.d.ts +18 -1
- package/dist/kit/List.d.ts.map +1 -1
- package/dist/kit/List.js +38 -10
- package/dist/kit/List.js.map +1 -1
- package/dist/kit/LogView.d.ts +39 -3
- package/dist/kit/LogView.d.ts.map +1 -1
- package/dist/kit/LogView.js +52 -10
- package/dist/kit/LogView.js.map +1 -1
- package/dist/kit/Marker.d.ts +19 -0
- package/dist/kit/Marker.d.ts.map +1 -1
- package/dist/kit/Marker.js +50 -0
- package/dist/kit/Marker.js.map +1 -1
- package/dist/kit/Modal.d.ts +13 -3
- package/dist/kit/Modal.d.ts.map +1 -1
- package/dist/kit/Modal.js +39 -9
- package/dist/kit/Modal.js.map +1 -1
- package/dist/kit/Panel.d.ts +21 -0
- package/dist/kit/Panel.d.ts.map +1 -1
- package/dist/kit/Panel.js +36 -0
- package/dist/kit/Panel.js.map +1 -1
- package/dist/kit/PipelineFlow.d.ts +44 -0
- package/dist/kit/PipelineFlow.d.ts.map +1 -0
- package/dist/kit/PipelineFlow.js +215 -0
- package/dist/kit/PipelineFlow.js.map +1 -0
- package/dist/kit/Popover.d.ts.map +1 -1
- package/dist/kit/Popover.js +4 -1
- package/dist/kit/Popover.js.map +1 -1
- package/dist/kit/Reorder.d.ts +54 -0
- package/dist/kit/Reorder.d.ts.map +1 -0
- package/dist/kit/Reorder.js +171 -0
- package/dist/kit/Reorder.js.map +1 -0
- package/dist/kit/Stat.d.ts +38 -5
- package/dist/kit/Stat.d.ts.map +1 -1
- package/dist/kit/Stat.js +99 -11
- package/dist/kit/Stat.js.map +1 -1
- package/dist/kit/Tooltip.d.ts.map +1 -1
- package/dist/kit/Tooltip.js +5 -2
- package/dist/kit/Tooltip.js.map +1 -1
- package/dist/theme/ThemeScope.d.ts +30 -0
- package/dist/theme/ThemeScope.d.ts.map +1 -0
- package/dist/theme/ThemeScope.js +61 -0
- package/dist/theme/ThemeScope.js.map +1 -0
- package/dist/theme/brand.d.ts +2 -1
- package/dist/theme/brand.d.ts.map +1 -1
- package/dist/theme/brand.js +10 -6
- package/dist/theme/brand.js.map +1 -1
- package/dist/theme/scope.d.ts +23 -0
- package/dist/theme/scope.d.ts.map +1 -0
- package/dist/theme/scope.js +32 -0
- package/dist/theme/scope.js.map +1 -0
- package/dist/theme/tokens.d.ts +2 -1
- package/dist/theme/tokens.d.ts.map +1 -1
- package/dist/theme/tokens.js +65 -100
- package/dist/theme/tokens.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,219 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef, useState } from "react";
|
|
3
|
+
import styled, { css } from "styled-components";
|
|
4
|
+
import { v } from "../theme/tokens.js";
|
|
5
|
+
import { Icon } from "./Icon.js";
|
|
6
|
+
import { Anchored } from "./Anchored.js";
|
|
7
|
+
import { useEscapeLayer } from "./layers.js";
|
|
8
|
+
const pickable = (g) => g.members.filter((m) => !m.disabled);
|
|
9
|
+
/**
|
|
10
|
+
* How much of a group is picked: "all" once every enabled member is (a
|
|
11
|
+
* disabled one cannot be, so it does not hold the group back), "none" when no
|
|
12
|
+
* member is. A group with nothing enabled and nothing picked is "none".
|
|
13
|
+
*/
|
|
14
|
+
export function groupSelection(group, value) {
|
|
15
|
+
if (!group.members.some((m) => value.has(m.id)))
|
|
16
|
+
return "none";
|
|
17
|
+
const open = pickable(group);
|
|
18
|
+
return open.length > 0 && open.every((m) => value.has(m.id)) ? "all" : "some";
|
|
19
|
+
}
|
|
20
|
+
/** The default trigger text: "All sources", "Hubs · 2 of 5 grabbers", "None". */
|
|
21
|
+
export function describeGroupedSelection(groups, value, { allLabel = "All", noneLabel = "None" } = {}) {
|
|
22
|
+
const states = groups.map((g) => groupSelection(g, value));
|
|
23
|
+
if (groups.length > 0 && states.every((s) => s === "all"))
|
|
24
|
+
return allLabel;
|
|
25
|
+
const pieces = groups.flatMap((g, i) => {
|
|
26
|
+
if (states[i] === "all")
|
|
27
|
+
return [g.label];
|
|
28
|
+
if (states[i] === "none")
|
|
29
|
+
return [];
|
|
30
|
+
const n = pickable(g).filter((m) => value.has(m.id)).length;
|
|
31
|
+
return [`${n} of ${pickable(g).length} ${g.label.toLowerCase()}`];
|
|
32
|
+
});
|
|
33
|
+
return pieces.length > 0 ? pieces.join(" · ") : noneLabel;
|
|
34
|
+
}
|
|
35
|
+
const Wrap = styled.div `position: relative; display: inline-flex;`;
|
|
36
|
+
const Trigger = styled.button `
|
|
37
|
+
display: inline-flex;
|
|
38
|
+
align-items: center;
|
|
39
|
+
gap: 7px;
|
|
40
|
+
height: 30px;
|
|
41
|
+
max-width: 100%;
|
|
42
|
+
padding: 0 11px;
|
|
43
|
+
border-radius: ${v.rCtl};
|
|
44
|
+
font-size: 12.5px;
|
|
45
|
+
font-weight: 500;
|
|
46
|
+
color: ${v.text};
|
|
47
|
+
background: ${(p) => (p.$active ? v.brand12 : v.field)};
|
|
48
|
+
border: 1px solid ${(p) => (p.$active ? v.brand55 : v.fieldLine)};
|
|
49
|
+
cursor: pointer;
|
|
50
|
+
white-space: nowrap;
|
|
51
|
+
&:hover:not(:disabled) { border-color: ${v.brand55}; }
|
|
52
|
+
&:focus-visible { outline: none; box-shadow: ${v.ring}; }
|
|
53
|
+
&:disabled { opacity: 0.55; cursor: not-allowed; }
|
|
54
|
+
.lbl { color: ${v.muted}; }
|
|
55
|
+
.sum { overflow: hidden; text-overflow: ellipsis; }
|
|
56
|
+
.caret { font-size: 10px; opacity: 0.7; }
|
|
57
|
+
`;
|
|
58
|
+
const Panel = styled.div `
|
|
59
|
+
min-width: 260px;
|
|
60
|
+
max-height: 360px;
|
|
61
|
+
overflow-y: auto;
|
|
62
|
+
background: ${v.surface2};
|
|
63
|
+
border: 1px solid ${v.line2};
|
|
64
|
+
border-radius: ${v.rCard};
|
|
65
|
+
box-shadow: ${v.elev};
|
|
66
|
+
padding: 5px;
|
|
67
|
+
`;
|
|
68
|
+
const Item = styled.button `
|
|
69
|
+
display: flex;
|
|
70
|
+
align-items: center;
|
|
71
|
+
gap: 9px;
|
|
72
|
+
width: 100%;
|
|
73
|
+
text-align: left;
|
|
74
|
+
padding: 6px 9px;
|
|
75
|
+
${(p) => !p.$group && css `padding-left: 33px;`}
|
|
76
|
+
border-radius: ${v.rCtl};
|
|
77
|
+
font-size: 12.5px;
|
|
78
|
+
font-weight: ${(p) => (p.$group ? 600 : 400)};
|
|
79
|
+
color: ${v.text};
|
|
80
|
+
cursor: pointer;
|
|
81
|
+
&:hover:not(:disabled) { background: ${v.hover}; }
|
|
82
|
+
&:focus-visible { outline: none; background: ${v.hover}; box-shadow: ${v.ring}; }
|
|
83
|
+
&:disabled { opacity: 0.5; cursor: not-allowed; }
|
|
84
|
+
.txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
85
|
+
.meta { color: ${v.faint}; font-size: 11px; font-weight: 400; font-variant-numeric: tabular-nums; white-space: nowrap; }
|
|
86
|
+
`;
|
|
87
|
+
// Drawn as the kit's Checkbox is; the row is the control, so this is only the picture of it.
|
|
88
|
+
const Box = styled.span `
|
|
89
|
+
display: inline-grid;
|
|
90
|
+
place-items: center;
|
|
91
|
+
flex: none;
|
|
92
|
+
width: 15px;
|
|
93
|
+
height: 15px;
|
|
94
|
+
border-radius: 5px;
|
|
95
|
+
border: 1.5px solid ${(p) => (p.$on ? "transparent" : v.line2)};
|
|
96
|
+
background: ${(p) => (p.$on ? v.grad : v.field)};
|
|
97
|
+
color: ${v.onBrand};
|
|
98
|
+
font-size: 9px;
|
|
99
|
+
`;
|
|
100
|
+
const Foot = styled.div `
|
|
101
|
+
display: flex;
|
|
102
|
+
gap: 4px;
|
|
103
|
+
margin-top: 4px;
|
|
104
|
+
padding: 5px 4px 1px;
|
|
105
|
+
border-top: 1px solid ${v.line};
|
|
106
|
+
button {
|
|
107
|
+
padding: 3px 7px;
|
|
108
|
+
border-radius: ${v.rCtl};
|
|
109
|
+
font-size: 11.5px;
|
|
110
|
+
color: ${v.muted};
|
|
111
|
+
cursor: pointer;
|
|
112
|
+
&:hover { color: ${v.text}; background: ${v.hover}; }
|
|
113
|
+
&:focus-visible { outline: none; box-shadow: ${v.ring}; }
|
|
114
|
+
&:disabled { opacity: 0.45; cursor: default; background: none; }
|
|
115
|
+
}
|
|
116
|
+
`;
|
|
117
|
+
const Note = styled.div `
|
|
118
|
+
padding: 12px;
|
|
119
|
+
color: ${v.faint};
|
|
120
|
+
font-size: 12px;
|
|
121
|
+
text-align: center;
|
|
122
|
+
`;
|
|
123
|
+
function Tick({ state }) {
|
|
124
|
+
return (_jsx(Box, { "$on": state !== "none", "aria-hidden": "true", children: state === "all" ? _jsx(Icon, { name: "check" }) : state === "some" ? _jsx(Icon, { name: "minus" }) : null }));
|
|
125
|
+
}
|
|
126
|
+
const rowsOf = (panel) => Array.from(panel?.querySelectorAll('[role="checkbox"]:not(:disabled)') ?? []);
|
|
127
|
+
/**
|
|
128
|
+
* GroupedMultiSelect: a trigger that summarises what is picked, opening a
|
|
129
|
+
* panel of groups, each a tri-state checkbox (aria-checked "mixed" for some)
|
|
130
|
+
* over its members' checkboxes. A group row picks all of its enabled members,
|
|
131
|
+
* or clears them when they are all already picked. Arrow keys, Home and End
|
|
132
|
+
* move between rows; Space or Enter toggles; Escape closes back to the trigger.
|
|
133
|
+
*/
|
|
134
|
+
export function GroupedMultiSelect({ groups, value, onChange, label, allLabel, noneLabel, summary, shortcuts = true, disabled, ariaLabel, align = "left", }) {
|
|
135
|
+
const [open, setOpen] = useState(false);
|
|
136
|
+
const wrap = useRef(null);
|
|
137
|
+
const layer = useRef(null);
|
|
138
|
+
const trigger = useRef(null);
|
|
139
|
+
const name = ariaLabel ?? (typeof label === "string" ? label : undefined);
|
|
140
|
+
const close = (refocus) => {
|
|
141
|
+
setOpen(false);
|
|
142
|
+
if (refocus)
|
|
143
|
+
trigger.current?.focus();
|
|
144
|
+
};
|
|
145
|
+
useEscapeLayer(open, () => close(true));
|
|
146
|
+
useEffect(() => {
|
|
147
|
+
if (!open)
|
|
148
|
+
return;
|
|
149
|
+
const onDown = (e) => {
|
|
150
|
+
const t = e.target;
|
|
151
|
+
if (wrap.current && !wrap.current.contains(t) && !layer.current?.contains(t))
|
|
152
|
+
setOpen(false);
|
|
153
|
+
};
|
|
154
|
+
document.addEventListener("mousedown", onDown);
|
|
155
|
+
return () => document.removeEventListener("mousedown", onDown);
|
|
156
|
+
}, [open]);
|
|
157
|
+
// into the first row on open, so the keyboard carries on from the trigger
|
|
158
|
+
useEffect(() => {
|
|
159
|
+
if (open)
|
|
160
|
+
rowsOf(layer.current)[0]?.focus();
|
|
161
|
+
}, [open]);
|
|
162
|
+
const onKey = (e) => {
|
|
163
|
+
const all = rowsOf(layer.current);
|
|
164
|
+
const at = all.indexOf(document.activeElement);
|
|
165
|
+
const to = e.key === "ArrowDown" ? Math.min(all.length - 1, at + 1)
|
|
166
|
+
: e.key === "ArrowUp" ? Math.max(0, at - 1)
|
|
167
|
+
: e.key === "Home" ? 0
|
|
168
|
+
: e.key === "End" ? all.length - 1
|
|
169
|
+
: null;
|
|
170
|
+
if (to === null)
|
|
171
|
+
return;
|
|
172
|
+
e.preventDefault();
|
|
173
|
+
all[to]?.focus();
|
|
174
|
+
};
|
|
175
|
+
const toggleMember = (id) => {
|
|
176
|
+
const next = new Set(value);
|
|
177
|
+
if (next.has(id))
|
|
178
|
+
next.delete(id);
|
|
179
|
+
else
|
|
180
|
+
next.add(id);
|
|
181
|
+
onChange(next);
|
|
182
|
+
};
|
|
183
|
+
const toggleGroup = (g) => {
|
|
184
|
+
const next = new Set(value);
|
|
185
|
+
const allOn = groupSelection(g, value) === "all";
|
|
186
|
+
for (const m of pickable(g)) {
|
|
187
|
+
if (allOn)
|
|
188
|
+
next.delete(m.id);
|
|
189
|
+
else
|
|
190
|
+
next.add(m.id);
|
|
191
|
+
}
|
|
192
|
+
onChange(next);
|
|
193
|
+
};
|
|
194
|
+
const setAll = (on) => {
|
|
195
|
+
const next = new Set(value);
|
|
196
|
+
for (const g of groups)
|
|
197
|
+
for (const m of g.members) {
|
|
198
|
+
if (m.disabled)
|
|
199
|
+
continue;
|
|
200
|
+
if (on)
|
|
201
|
+
next.add(m.id);
|
|
202
|
+
else
|
|
203
|
+
next.delete(m.id);
|
|
204
|
+
}
|
|
205
|
+
onChange(next);
|
|
206
|
+
};
|
|
207
|
+
const anyPicked = groups.some((g) => g.members.some((m) => value.has(m.id)));
|
|
208
|
+
const everyPicked = groups.length > 0 && groups.every((g) => groupSelection(g, value) === "all");
|
|
209
|
+
const text = summary ? summary(value, groups) : describeGroupedSelection(groups, value, { allLabel, noneLabel });
|
|
210
|
+
return (_jsxs(Wrap, { ref: wrap, children: [_jsxs(Trigger, { ref: trigger, type: "button", "$active": anyPicked && !everyPicked, disabled: disabled, "aria-haspopup": "dialog", "aria-expanded": open, "aria-label": name && typeof text === "string" ? `${name}: ${text}` : name, onClick: () => setOpen((o) => !o), children: [label ? _jsx("span", { className: "lbl", children: label }) : null, _jsx("span", { className: "sum", children: text }), _jsx("span", { className: "caret", children: _jsx(Icon, { name: "chevron-down" }) })] }), open ? (_jsx(Anchored, { anchor: wrap, layerRef: layer, align: align, children: _jsxs(Panel, { role: "dialog", "aria-label": name, onKeyDown: onKey, children: [groups.length === 0 ? _jsx(Note, { children: "Nothing to pick" }) : null, groups.map((g) => {
|
|
211
|
+
const state = groupSelection(g, value);
|
|
212
|
+
const empty = pickable(g).length === 0;
|
|
213
|
+
return (_jsxs("div", { role: "group", "aria-label": g.label, children: [_jsxs(Item, { type: "button", role: "checkbox", "$group": true, "aria-label": g.label, "aria-checked": state === "all" ? "true" : state === "some" ? "mixed" : "false", disabled: empty, onClick: () => toggleGroup(g), children: [_jsx(Tick, { state: state }), _jsx("span", { className: "txt", children: g.label }), _jsxs("span", { className: "meta", children: [pickable(g).filter((m) => value.has(m.id)).length, "/", pickable(g).length] })] }), g.members.map((m) => {
|
|
214
|
+
const on = value.has(m.id);
|
|
215
|
+
return (_jsxs(Item, { type: "button", role: "checkbox", "aria-checked": on, disabled: m.disabled, onClick: () => toggleMember(m.id), children: [_jsx(Tick, { state: on ? "all" : "none" }), _jsx("span", { className: "txt", children: m.label }), m.meta !== undefined ? _jsx("span", { className: "meta", children: m.meta }) : null] }, m.id));
|
|
216
|
+
})] }, g.id));
|
|
217
|
+
}), shortcuts && groups.length > 0 ? (_jsxs(Foot, { children: [_jsx("button", { type: "button", disabled: everyPicked, onClick: () => setAll(true), children: "All" }), _jsx("button", { type: "button", disabled: !anyPicked, onClick: () => setAll(false), children: "None" })] })) : null] }) })) : null] }));
|
|
218
|
+
}
|
|
219
|
+
//# sourceMappingURL=GroupedMultiSelect.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GroupedMultiSelect.js","sourceRoot":"","sources":["../../src/kit/GroupedMultiSelect.tsx"],"names":[],"mappings":"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"}
|
package/dist/kit/List.d.ts
CHANGED
|
@@ -10,7 +10,7 @@ export declare const RowList: import("styled-components/dist/types").IStyledComp
|
|
|
10
10
|
* button — unless the row also carries `actions`, in which case it renders as
|
|
11
11
|
* a keyboard-operable div so the action buttons aren't nested in a button.
|
|
12
12
|
*/
|
|
13
|
-
export declare function ListRow({ to, href, external, onClick, selected, leading, trailing, actions, keepActions, inline, dense, depth, card, highlight, title, children }: {
|
|
13
|
+
export declare function ListRow({ to, href, external, onClick, selected, leading, trailing, actions, keepActions, inline, dense, depth, card, highlight, tone, columns, collapseBelow, dim, title, children }: {
|
|
14
14
|
to?: string | undefined;
|
|
15
15
|
/** a destination off this origin — an upstream registry, a provider's console */
|
|
16
16
|
href?: string | undefined;
|
|
@@ -30,6 +30,23 @@ export declare function ListRow({ to, href, external, onClick, selected, leading
|
|
|
30
30
|
card?: boolean | undefined;
|
|
31
31
|
/** flash a brand ring once: the row a ⌘K result or ?highlight= landed on */
|
|
32
32
|
highlight?: boolean | undefined;
|
|
33
|
+
/**
|
|
34
|
+
* Flag the row: a 3px edge stripe, a faint wash and a tinted leading icon,
|
|
35
|
+
* the same look as DataTable's `severity`. Said to assistive tech too
|
|
36
|
+
* ("Critical"/"Warning", read first; also `data-tone` on the row).
|
|
37
|
+
*/
|
|
38
|
+
tone?: "crit" | "warn" | null | undefined;
|
|
39
|
+
/**
|
|
40
|
+
* A CSS grid template (`"1fr 80px 80px auto"`) laid over the row so cells
|
|
41
|
+
* align down the list. Each child of the row is one cell; `leading`,
|
|
42
|
+
* `trailing` and `actions`, when present, are the grid's first and last
|
|
43
|
+
* items, so the template counts them. `inline` is ignored.
|
|
44
|
+
*/
|
|
45
|
+
columns?: string | undefined;
|
|
46
|
+
/** viewport width (px) at or under which `columns` stacks to one column */
|
|
47
|
+
collapseBelow?: number | undefined;
|
|
48
|
+
/** the row is inactive or not yet live (unaired, disabled): faded until hovered or focused */
|
|
49
|
+
dim?: boolean | undefined;
|
|
33
50
|
leading?: ReactNode | undefined;
|
|
34
51
|
trailing?: ReactNode | undefined;
|
|
35
52
|
actions?: ReactNode | undefined;
|
package/dist/kit/List.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/kit/List.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,YAAY,CAAC;AAMjD,eAAO,MAAM,OAAO;;;aAAyB,OAAO,GAAG,SAAS;YAI/D,CAAC;
|
|
1
|
+
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../src/kit/List.tsx"],"names":[],"mappings":"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"}
|
package/dist/kit/List.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import styled, { css, keyframes } from "styled-components";
|
|
3
3
|
import { Link } from "react-router-dom";
|
|
4
4
|
import { v } from "../theme/tokens.js";
|
|
@@ -17,6 +17,13 @@ const rowFlash = keyframes `
|
|
|
17
17
|
0% { box-shadow: 0 0 0 2px ${v.brand}; }
|
|
18
18
|
100% { box-shadow: 0 0 0 2px transparent; }
|
|
19
19
|
`;
|
|
20
|
+
const TONE_WORD = { crit: "Critical", warn: "Warning" };
|
|
21
|
+
const toneEdge = (t) => (t === "crit" ? v.danger : v.warning);
|
|
22
|
+
/* the tone's tint at half strength, as DataTable's `severity`: the edge says it, the wash only helps the eye find it */
|
|
23
|
+
const toneWash = (t) => `color-mix(in srgb, ${t === "crit" ? v.dangerBg : v.warningBg} 50%, transparent)`;
|
|
24
|
+
const SrOnly = styled.span `
|
|
25
|
+
position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
|
|
26
|
+
`;
|
|
20
27
|
const rowCss = css `
|
|
21
28
|
display: flex;
|
|
22
29
|
align-items: center;
|
|
@@ -44,36 +51,57 @@ const rowCss = css `
|
|
|
44
51
|
`}
|
|
45
52
|
${(p) => p.$highlight && css `animation: ${rowFlash} 2.4s ease-out;`}
|
|
46
53
|
&:hover .row-actions, &:focus-within .row-actions { opacity: 1; }
|
|
54
|
+
${(p) => p.$tone && css `
|
|
55
|
+
position: relative;
|
|
56
|
+
background: ${toneWash(p.$tone)};
|
|
57
|
+
box-shadow: inset 3px 0 0 0 ${toneEdge(p.$tone)};
|
|
58
|
+
${p.$click && css `&:hover { background: ${v.hover}; }`}
|
|
59
|
+
.row-lead { color: ${toneEdge(p.$tone)}; }
|
|
60
|
+
`}
|
|
61
|
+
${(p) => p.$dim && css `opacity: 0.55; &:hover, &:focus-within { opacity: 1; }`}
|
|
62
|
+
/* columns: the row is a grid, its children the cells, so they line up down a list */
|
|
63
|
+
${(p) => p.$columns && css `
|
|
64
|
+
display: grid;
|
|
65
|
+
grid-template-columns: ${p.$columns};
|
|
66
|
+
${p.$collapseBelow !== undefined && css `
|
|
67
|
+
@media (max-width: ${p.$collapseBelow}px) {
|
|
68
|
+
grid-template-columns: minmax(0, 1fr);
|
|
69
|
+
row-gap: 4px;
|
|
70
|
+
align-items: start;
|
|
71
|
+
}
|
|
72
|
+
`}
|
|
73
|
+
`}
|
|
47
74
|
`;
|
|
48
75
|
const RowDiv = styled.div `${rowCss}`;
|
|
49
76
|
const RowLink = styled(Link) `${rowCss}`;
|
|
50
77
|
const RowBtn = styled.button `${rowCss}`;
|
|
51
78
|
const RowAnchor = styled.a `${rowCss}`;
|
|
52
|
-
const Main = styled.span `flex: 1 1 auto; min-width: 0; display: flex; flex-direction: ${(p) => (p.$inline ? "row" : "column")}; align-items: ${(p) => (p.$inline ? "center" : "stretch")}; gap: ${(p) => (p.$inline ? "8px" : "2px")};`;
|
|
53
|
-
const Lead = styled.span `flex: none; display: grid; place-items: center; color: ${v.muted};`;
|
|
79
|
+
const Main = styled.span `flex: 1 1 auto; min-width: 0; display: ${(p) => (p.$cells ? "contents" : "flex")}; flex-direction: ${(p) => (p.$inline ? "row" : "column")}; align-items: ${(p) => (p.$inline ? "center" : "stretch")}; gap: ${(p) => (p.$inline ? "8px" : "2px")};`;
|
|
80
|
+
const Lead = styled.span.attrs({ className: "row-lead" }) `flex: none; display: grid; place-items: center; color: ${v.muted};`;
|
|
54
81
|
const Trail = styled.span `flex: none; display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: ${v.faint};`;
|
|
55
82
|
/**
|
|
56
83
|
* ListRow: one row of a RowList. `to` makes it a router link, `onClick` a
|
|
57
84
|
* button — unless the row also carries `actions`, in which case it renders as
|
|
58
85
|
* a keyboard-operable div so the action buttons aren't nested in a button.
|
|
59
86
|
*/
|
|
60
|
-
export function ListRow({ to, href, external, onClick, selected, leading, trailing, actions, keepActions, inline, dense, depth, card, highlight, title, children }) {
|
|
61
|
-
const
|
|
87
|
+
export function ListRow({ to, href, external, onClick, selected, leading, trailing, actions, keepActions, inline, dense, depth, card, highlight, tone, columns, collapseBelow, dim, title, children }) {
|
|
88
|
+
const t = tone ?? undefined;
|
|
89
|
+
const inner = (_jsxs(_Fragment, { children: [t ? _jsxs(SrOnly, { children: [TONE_WORD[t], ": "] }) : null, leading ? _jsx(Lead, { children: leading }) : null, _jsx(Main, { "$inline": inline, "$cells": columns !== undefined, children: children }), trailing ? _jsx(Trail, { children: trailing }) : null, actions ? _jsx(RowActions, { "$keep": keepActions, children: actions }) : null] }));
|
|
62
90
|
if (to)
|
|
63
|
-
return _jsx(RowLink, { to: to, title: title, "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, children: inner });
|
|
91
|
+
return _jsx(RowLink, { to: to, title: title, "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, "$tone": t, "$dim": dim, "$columns": columns, "$collapseBelow": collapseBelow, "data-tone": t, children: inner });
|
|
64
92
|
if (href) {
|
|
65
93
|
const away = external !== false;
|
|
66
|
-
return (_jsx(RowAnchor, { href: href, title: title, ...(away ? { target: "_blank", rel: "noreferrer noopener" } : {}), "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, children: inner }));
|
|
94
|
+
return (_jsx(RowAnchor, { href: href, title: title, ...(away ? { target: "_blank", rel: "noreferrer noopener" } : {}), "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, "$tone": t, "$dim": dim, "$columns": columns, "$collapseBelow": collapseBelow, "data-tone": t, children: inner }));
|
|
67
95
|
}
|
|
68
96
|
if (onClick && actions) {
|
|
69
97
|
return (_jsx(RowDiv, { role: "button", tabIndex: 0, title: title, onClick: onClick, onKeyDown: (e) => { if (e.key === "Enter" || e.key === " ") {
|
|
70
98
|
e.preventDefault();
|
|
71
99
|
onClick();
|
|
72
|
-
} }, "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, children: inner }));
|
|
100
|
+
} }, "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, "$tone": t, "$dim": dim, "$columns": columns, "$collapseBelow": collapseBelow, "data-tone": t, children: inner }));
|
|
73
101
|
}
|
|
74
102
|
if (onClick)
|
|
75
|
-
return _jsx(RowBtn, { type: "button", title: title, onClick: onClick, "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, children: inner });
|
|
76
|
-
return _jsx(RowDiv, { title: title, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, children: inner });
|
|
103
|
+
return _jsx(RowBtn, { type: "button", title: title, onClick: onClick, "$click": true, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, "$tone": t, "$dim": dim, "$columns": columns, "$collapseBelow": collapseBelow, "data-tone": t, children: inner });
|
|
104
|
+
return _jsx(RowDiv, { title: title, "$selected": selected, "$dense": dense, "$depth": depth, "$card": card, "$highlight": highlight, "$tone": t, "$dim": dim, "$columns": columns, "$collapseBelow": collapseBelow, "data-tone": t, children: inner });
|
|
77
105
|
}
|
|
78
106
|
/** RowActions: an action cluster revealed on row hover/focus (rows and table cells). */
|
|
79
107
|
export const RowActions = styled.span.attrs({ className: "row-actions" }) `
|
package/dist/kit/List.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/kit/List.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE3D,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;AACxC,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AACvC,OAAO,EAAE,IAAI,EAAiB,MAAM,WAAY,CAAC;AAEjD,wEAAwE;AACxE,0EAA0E;AAC1E,0EAA0E;AAE1E,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAkC;;;IAG/D,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,MAAM,IAAI,YAAY;CAClC,CAAC;AAEF,uEAAuE;AACvE,gDAAgD;AAChD,MAAM,QAAQ,GAAG,SAAS,CAAA;+BACK,CAAC,CAAC,KAAK;;CAErC,CAAC;AAEF,MAAM,MAAM,GAAG,GAAG,
|
|
1
|
+
{"version":3,"file":"List.js","sourceRoot":"","sources":["../../src/kit/List.tsx"],"names":[],"mappings":"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"}
|
package/dist/kit/LogView.d.ts
CHANGED
|
@@ -1,25 +1,61 @@
|
|
|
1
1
|
export interface LogLine {
|
|
2
|
-
|
|
2
|
+
/** when: a preformatted string is shown as is; a Date or epoch-ms is formatted as local HH:MM:SS */
|
|
3
|
+
at?: string | Date | number | undefined;
|
|
3
4
|
text: string;
|
|
4
5
|
stderr?: boolean | undefined;
|
|
5
6
|
/** render as a labelled rule instead of a line (attempt boundaries, restarts) */
|
|
6
7
|
divider?: boolean | undefined;
|
|
7
8
|
/** tone of a divider: ok (finished), crit (crashed), default muted */
|
|
8
9
|
tone?: "ok" | "crit" | "mut" | undefined;
|
|
10
|
+
/**
|
|
11
|
+
* the seam between two process lifetimes, drawn as a full-width row between
|
|
12
|
+
* lines (`text` is its label, e.g. "boot 3 · v1.4.2"): the line above belongs
|
|
13
|
+
* to the process that died, the line below to the one that replaced it.
|
|
14
|
+
*/
|
|
15
|
+
boot?: boolean | undefined;
|
|
16
|
+
/** structured detail on the line, shown inline after the text, dimmer than it: `key=value` */
|
|
17
|
+
fields?: Record<string, string | number | boolean | null | undefined> | undefined;
|
|
18
|
+
/** severity, drawn as a toned label before the text: error danger, warn warning, info info, debug dim */
|
|
19
|
+
level?: LogLevel | undefined;
|
|
20
|
+
/** who wrote the line (`hub/eu-1`), a dim column between the time and the text */
|
|
21
|
+
source?: string | undefined;
|
|
9
22
|
}
|
|
10
|
-
export
|
|
23
|
+
export type LogLevel = "info" | "warn" | "error" | "debug";
|
|
24
|
+
export declare function LogSurface({ lines, height, flow, order, follow, placeholder, onLoadOlder, loadingOlder, olderLabel, footer }: {
|
|
11
25
|
lines: LogLine[];
|
|
12
26
|
height?: number | undefined;
|
|
27
|
+
/** let the log take its natural height and flow with the page: no fixed height, no inner scroll (`height` and `follow` are ignored) */
|
|
28
|
+
flow?: boolean | undefined;
|
|
29
|
+
/**
|
|
30
|
+
* which end is the tail. `lines` always runs oldest first; "newest-first" draws
|
|
31
|
+
* it reversed, so `follow` pins the top and the load-older control moves to the bottom
|
|
32
|
+
*/
|
|
33
|
+
order?: "oldest-first" | "newest-first" | undefined;
|
|
13
34
|
follow?: boolean | undefined;
|
|
14
35
|
placeholder?: string | undefined;
|
|
36
|
+
/** reaches further back: a button above the first line (lines run oldest first). Omit when there is nothing older */
|
|
37
|
+
onLoadOlder?: (() => void) | undefined;
|
|
38
|
+
loadingOlder?: boolean | undefined;
|
|
39
|
+
/** the button's label; carry the count if you have it ("Load 500 older lines") */
|
|
40
|
+
olderLabel?: string | undefined;
|
|
41
|
+
/** the line under the log saying what is not in it ("Showing the last 500 of 12,034 lines") */
|
|
42
|
+
footer?: React.ReactNode | undefined;
|
|
15
43
|
}): import("react").JSX.Element;
|
|
16
44
|
/** LogPanel: LogSurface inside a Panel with a follow toggle and status slot. */
|
|
17
|
-
export declare function LogPanel({ title, lines, status, height, actions, placeholder }: {
|
|
45
|
+
export declare function LogPanel({ title, lines, status, height, flow, order, actions, placeholder, onLoadOlder, loadingOlder, olderLabel, footer }: {
|
|
18
46
|
title: string;
|
|
19
47
|
lines: LogLine[];
|
|
20
48
|
status?: React.ReactNode | undefined;
|
|
21
49
|
height?: number | undefined;
|
|
50
|
+
/** see LogSurface */
|
|
51
|
+
flow?: boolean | undefined;
|
|
52
|
+
order?: "oldest-first" | "newest-first" | undefined;
|
|
22
53
|
actions?: React.ReactNode | undefined;
|
|
23
54
|
placeholder?: string | undefined;
|
|
55
|
+
/** see LogSurface */
|
|
56
|
+
onLoadOlder?: (() => void) | undefined;
|
|
57
|
+
loadingOlder?: boolean | undefined;
|
|
58
|
+
olderLabel?: string | undefined;
|
|
59
|
+
footer?: React.ReactNode | undefined;
|
|
24
60
|
}): import("react").JSX.Element;
|
|
25
61
|
//# sourceMappingURL=LogView.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogView.d.ts","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,OAAO;IACtB,EAAE,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"LogView.d.ts","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":"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"}
|
package/dist/kit/LogView.js
CHANGED
|
@@ -1,9 +1,18 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { useEffect, useRef, useState } from "react";
|
|
3
3
|
import styled from "styled-components";
|
|
4
4
|
import { v } from "../theme/tokens.js";
|
|
5
5
|
import { PanelHead, PanelTitle, PanelActions, Panel } from "./Panel.js";
|
|
6
6
|
import { AppButton } from "./Button.js";
|
|
7
|
+
const pad = (n) => String(n).padStart(2, "0");
|
|
8
|
+
function fmtAt(at) {
|
|
9
|
+
if (typeof at === "string")
|
|
10
|
+
return at;
|
|
11
|
+
const d = at instanceof Date ? at : new Date(at);
|
|
12
|
+
if (Number.isNaN(d.getTime()))
|
|
13
|
+
return "";
|
|
14
|
+
return `${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;
|
|
15
|
+
}
|
|
7
16
|
const Sur = styled.pre `
|
|
8
17
|
margin: 0;
|
|
9
18
|
padding: 12px 16px;
|
|
@@ -12,12 +21,14 @@ const Sur = styled.pre `
|
|
|
12
21
|
font-family: ${v.mono};
|
|
13
22
|
font-size: 11.5px;
|
|
14
23
|
line-height: 1.75;
|
|
15
|
-
overflow: auto;
|
|
16
|
-
height: ${(p) => p.$h ?? 420}px;
|
|
24
|
+
${(p) => (p.$flow ? "" : `overflow: auto; height: ${p.$h ?? 420}px;`)}
|
|
17
25
|
white-space: pre-wrap;
|
|
18
26
|
word-break: break-word;
|
|
19
27
|
`;
|
|
20
28
|
const Ts = styled.span `color: ${v.logDim}; user-select: none;`;
|
|
29
|
+
const levelColor = (l) => (l === "error" ? v.danger : l === "warn" ? v.warning : l === "info" ? v.info : v.logDim);
|
|
30
|
+
const Lvl = styled.span `color: ${(p) => levelColor(p.$l)}; text-transform: uppercase; font-size: 10.5px; letter-spacing: 0.04em;`;
|
|
31
|
+
const Src = styled.span `color: ${v.logDim};`;
|
|
21
32
|
const Err = styled.span `color: ${v.danger};`;
|
|
22
33
|
const Rule = styled.div `
|
|
23
34
|
display: flex; align-items: center; gap: 8px;
|
|
@@ -25,17 +36,48 @@ const Rule = styled.div `
|
|
|
25
36
|
margin: 4px 0;
|
|
26
37
|
&::before, &::after { content: ""; flex: 1 1 auto; border-top: 1px dashed ${v.logDim}; opacity: 0.6; }
|
|
27
38
|
`;
|
|
28
|
-
|
|
39
|
+
const Boot = styled.div `
|
|
40
|
+
margin: 6px -16px;
|
|
41
|
+
padding: 3px 16px;
|
|
42
|
+
border-top: 1px solid ${v.logDim};
|
|
43
|
+
border-bottom: 1px solid ${v.logDim};
|
|
44
|
+
color: ${v.logDim};
|
|
45
|
+
font-size: 10.5px;
|
|
46
|
+
letter-spacing: 0.1em;
|
|
47
|
+
text-transform: uppercase;
|
|
48
|
+
`;
|
|
49
|
+
const Fields = styled.span `margin-left: 8px; color: ${v.logDim}; font-size: 10.5px; overflow-wrap: anywhere;`;
|
|
50
|
+
const Older = styled.button `
|
|
51
|
+
display: block;
|
|
52
|
+
width: 100%;
|
|
53
|
+
margin: 0 0 8px;
|
|
54
|
+
padding: 5px;
|
|
55
|
+
border: 1px solid ${v.logDim};
|
|
56
|
+
border-radius: ${v.rCtl};
|
|
57
|
+
background: transparent;
|
|
58
|
+
color: ${v.logText};
|
|
59
|
+
font: inherit;
|
|
60
|
+
font-size: 11px;
|
|
61
|
+
cursor: pointer;
|
|
62
|
+
&:hover:not(:disabled) { background: ${v.hover}; }
|
|
63
|
+
&:disabled { cursor: default; opacity: 0.6; }
|
|
64
|
+
`;
|
|
65
|
+
const Foot = styled.div `margin-top: 8px; color: ${v.logDim}; font-size: 10.5px; text-align: center;`;
|
|
66
|
+
export function LogSurface({ lines, height, flow, order = "oldest-first", follow = true, placeholder = "waiting for output…", onLoadOlder, loadingOlder, olderLabel = "Load older", footer }) {
|
|
29
67
|
const ref = useRef(null);
|
|
68
|
+
const newest = order === "newest-first";
|
|
69
|
+
const shown = newest ? [...lines].reverse() : lines;
|
|
70
|
+
const older = onLoadOlder ? _jsx(Older, { type: "button", disabled: loadingOlder, onClick: onLoadOlder, style: newest ? { margin: "8px 0 0" } : undefined, children: loadingOlder ? "Loading…" : olderLabel }) : null;
|
|
30
71
|
useEffect(() => {
|
|
31
|
-
if (follow && ref.current)
|
|
32
|
-
ref.current.scrollTop = ref.current.scrollHeight;
|
|
33
|
-
}, [lines, follow]);
|
|
34
|
-
return (_jsxs(Sur, { ref: ref, "$h": height, children: [lines.length === 0 ? _jsx(Ts, { children: placeholder }) : null,
|
|
72
|
+
if (follow && !flow && ref.current)
|
|
73
|
+
ref.current.scrollTop = newest ? 0 : ref.current.scrollHeight;
|
|
74
|
+
}, [lines, follow, flow, newest]);
|
|
75
|
+
return (_jsxs(Sur, { ref: ref, "$h": height, "$flow": flow, children: [newest ? null : older, lines.length === 0 ? _jsx(Ts, { children: placeholder }) : null, shown.map((l, i) => (l.boot ? _jsx(Boot, { children: l.text }, i) :
|
|
76
|
+
l.divider ? _jsx(Rule, { "$tone": l.tone, children: l.text }, i) : (_jsxs("div", { children: [l.at != null && l.at !== "" ? _jsxs(Ts, { children: [fmtAt(l.at), " "] }) : null, l.level ? _jsxs(_Fragment, { children: [_jsx(Lvl, { "$l": l.level, children: l.level }), " "] }) : null, l.source ? _jsxs(_Fragment, { children: [_jsx(Src, { children: l.source }), " "] }) : null, l.stderr ? _jsx(Err, { children: l.text }) : l.text, l.fields ? _jsx(Fields, { children: Object.entries(l.fields).filter(([, val]) => val != null).map(([k, val]) => `${k}=${String(val)}`).join(" ") }) : null] }, i)))), newest ? older : null, footer ? _jsx(Foot, { children: footer }) : null] }));
|
|
35
77
|
}
|
|
36
78
|
/** LogPanel: LogSurface inside a Panel with a follow toggle and status slot. */
|
|
37
|
-
export function LogPanel({ title, lines, status, height, actions, placeholder }) {
|
|
79
|
+
export function LogPanel({ title, lines, status, height, flow, order, actions, placeholder, onLoadOlder, loadingOlder, olderLabel, footer }) {
|
|
38
80
|
const [follow, setFollow] = useState(true);
|
|
39
|
-
return (_jsxs(Panel, { children: [_jsxs(PanelHead, { children: [_jsx(PanelTitle, { children: title }), status, _jsxs(PanelActions, { children: [actions, _jsx(AppButton, { size: "xs", variant: follow ? "quiet" : "ghost", onClick: () => setFollow(!follow), children: follow ? "Following" : "Follow" })] })] }), _jsx(LogSurface, { lines: lines, height: height, follow: follow, ...(placeholder !== undefined ? { placeholder } : {}) })] }));
|
|
81
|
+
return (_jsxs(Panel, { children: [_jsxs(PanelHead, { children: [_jsx(PanelTitle, { children: title }), status, _jsxs(PanelActions, { children: [actions, flow ? null : (_jsx(AppButton, { size: "xs", variant: follow ? "quiet" : "ghost", onClick: () => setFollow(!follow), children: follow ? "Following" : "Follow" }))] })] }), _jsx(LogSurface, { lines: lines, height: height, follow: follow, ...(flow !== undefined ? { flow } : {}), ...(order !== undefined ? { order } : {}), ...(placeholder !== undefined ? { placeholder } : {}), onLoadOlder: onLoadOlder, loadingOlder: loadingOlder, ...(olderLabel !== undefined ? { olderLabel } : {}), footer: footer })] }));
|
|
40
82
|
}
|
|
41
83
|
//# sourceMappingURL=LogView.js.map
|
package/dist/kit/LogView.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LogView.js","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,CAAC,EAAE,MAAM,oBAAoB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,YAAa,CAAC;AACzE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"LogView.js","sourceRoot":"","sources":["../../src/kit/LogView.tsx"],"names":[],"mappings":"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"}
|