@vuer-ai/vuer-uikit 0.0.97 → 0.0.98
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +106 -7
- package/cli/dial-cli.js +49 -7
- package/dist/SyncScroll/SyncScroll.cjs +9 -9
- package/dist/SyncScroll/SyncScroll.mjs +2 -2
- package/dist/SyncScroll/index.cjs +9 -9
- package/dist/SyncScroll/index.mjs +2 -2
- package/dist/chunk-4KWGGESI.cjs +494 -0
- package/dist/{chunk-6YDZA2RP.cjs → chunk-7GWDO25E.cjs} +1 -1
- package/dist/chunk-A5LCX2UQ.cjs +208 -0
- package/dist/chunk-BEJIZ56L.mjs +300 -0
- package/dist/chunk-C7VGRU3O.mjs +283 -0
- package/dist/chunk-LJMNHTTG.cjs +679 -0
- package/dist/chunk-O66RESRR.cjs +285 -0
- package/dist/{chunk-JBHXGZUF.mjs → chunk-TTYSYGVE.mjs} +1 -1
- package/dist/chunk-VA3PEYFM.mjs +489 -0
- package/dist/chunk-VBBJSIY7.cjs +308 -0
- package/dist/chunk-W4JCKCW7.mjs +661 -0
- package/dist/chunk-WWGF6TBZ.mjs +206 -0
- package/dist/dial/DialPanel.cjs +11 -11
- package/dist/dial/DialPanel.mjs +10 -10
- package/dist/dial/index.cjs +27 -27
- package/dist/dial/index.mjs +10 -10
- package/dist/dial/wrapped-inputs/ControlledInputs.cjs +14 -14
- package/dist/dial/wrapped-inputs/ControlledInputs.mjs +10 -10
- package/dist/dial/wrapped-inputs/DialInputs.cjs +21 -21
- package/dist/dial/wrapped-inputs/DialInputs.mjs +10 -10
- package/dist/dial/wrapped-inputs/DialVectorInput.cjs +11 -11
- package/dist/dial/wrapped-inputs/DialVectorInput.mjs +10 -10
- package/dist/dial/wrapped-inputs/index.cjs +26 -26
- package/dist/dial/wrapped-inputs/index.mjs +10 -10
- package/dist/highlight-cursor/cursor-provider.cjs +3 -3
- package/dist/highlight-cursor/cursor-provider.mjs +2 -2
- package/dist/highlight-cursor/enhanced-components.cjs +1 -1
- package/dist/highlight-cursor/enhanced-components.mjs +1 -1
- package/dist/highlight-cursor/index.cjs +3 -3
- package/dist/highlight-cursor/index.mjs +2 -2
- package/dist/index.cjs +86 -86
- package/dist/index.mjs +10 -10
- package/dist/ui/UIKitBadge.cjs +5 -5
- package/dist/ui/UIKitBadge.mjs +1 -1
- package/dist/ui/badge.d.cts +1 -1
- package/dist/ui/badge.d.ts +1 -1
- package/dist/ui/index.cjs +12 -12
- package/dist/ui/index.mjs +6 -6
- package/dist/ui/inputs/input.d.cts +1 -1
- package/dist/ui/inputs/input.d.ts +1 -1
- package/dist/ui/select.d.cts +1 -1
- package/dist/ui/select.d.ts +1 -1
- package/dist/ui/textarea.d.cts +1 -1
- package/dist/ui/textarea.d.ts +1 -1
- package/dist/ui/tree-view-legacy.cjs +8 -8
- package/dist/ui/tree-view-legacy.mjs +4 -4
- package/dist/ui/waterfall/index.cjs +5 -5
- package/dist/ui/waterfall/index.mjs +4 -4
- package/package.json +1 -1
- package/src/cli/dial-cli.ts +64 -8
|
@@ -0,0 +1,285 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var chunkWJL5HMO6_cjs = require('./chunk-WJL5HMO6.cjs');
|
|
4
|
+
var chunkRJ7I6ZQK_cjs = require('./chunk-RJ7I6ZQK.cjs');
|
|
5
|
+
var chunkMVAFOQ67_cjs = require('./chunk-MVAFOQ67.cjs');
|
|
6
|
+
var chunkTUYG6BYZ_cjs = require('./chunk-TUYG6BYZ.cjs');
|
|
7
|
+
var chunkYXFHJKNW_cjs = require('./chunk-YXFHJKNW.cjs');
|
|
8
|
+
var chunk5MNZYCN2_cjs = require('./chunk-5MNZYCN2.cjs');
|
|
9
|
+
var chunkZ6UDRPC2_cjs = require('./chunk-Z6UDRPC2.cjs');
|
|
10
|
+
var chunk55RSKLJ5_cjs = require('./chunk-55RSKLJ5.cjs');
|
|
11
|
+
var chunkHAVTMZR3_cjs = require('./chunk-HAVTMZR3.cjs');
|
|
12
|
+
var chunkEEGQLTSQ_cjs = require('./chunk-EEGQLTSQ.cjs');
|
|
13
|
+
var chunk2J75MYQA_cjs = require('./chunk-2J75MYQA.cjs');
|
|
14
|
+
var chunkLP3AGGRK_cjs = require('./chunk-LP3AGGRK.cjs');
|
|
15
|
+
var chunkG2ZYONQO_cjs = require('./chunk-G2ZYONQO.cjs');
|
|
16
|
+
var chunk6TSA7KXX_cjs = require('./chunk-6TSA7KXX.cjs');
|
|
17
|
+
var chunk2CZEFXEW_cjs = require('./chunk-2CZEFXEW.cjs');
|
|
18
|
+
var chunkVBBJSIY7_cjs = require('./chunk-VBBJSIY7.cjs');
|
|
19
|
+
var chunkG4FJGNY5_cjs = require('./chunk-G4FJGNY5.cjs');
|
|
20
|
+
var chunkOHIB3TEN_cjs = require('./chunk-OHIB3TEN.cjs');
|
|
21
|
+
var react = require('react');
|
|
22
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
23
|
+
|
|
24
|
+
function Waterfall({
|
|
25
|
+
logData,
|
|
26
|
+
temporalCursor,
|
|
27
|
+
onTemporalCursorChange,
|
|
28
|
+
getIcon,
|
|
29
|
+
panelWidth = 300,
|
|
30
|
+
className,
|
|
31
|
+
hoveredId: externalHoveredId,
|
|
32
|
+
onItemHover: externalOnItemHover,
|
|
33
|
+
minWindow = 0.01,
|
|
34
|
+
maxWindow,
|
|
35
|
+
zoomFactor = 1.1,
|
|
36
|
+
enabled = true,
|
|
37
|
+
children
|
|
38
|
+
}) {
|
|
39
|
+
const [visibleLogData, setVisibleLogData] = react.useState([]);
|
|
40
|
+
const [temporalMarkers, setTemporalMarkers] = react.useState([]);
|
|
41
|
+
const [searchQuery, setSearchQuery] = react.useState("");
|
|
42
|
+
const [isCaseSensitive, setIsCaseSensitive] = react.useState(false);
|
|
43
|
+
const [isRegex, setIsRegex] = react.useState(false);
|
|
44
|
+
const internalTimelineState = chunkWJL5HMO6_cjs.useTimelineState(logData);
|
|
45
|
+
const hoveredId = externalHoveredId ?? internalTimelineState.hoveredId;
|
|
46
|
+
const setHoveredId = externalOnItemHover ?? internalTimelineState.setHoveredId;
|
|
47
|
+
const { visibleData, expandedItems, toggleItem, hasDescendants, dataWithMeta } = chunkEEGQLTSQ_cjs.useTreeState({
|
|
48
|
+
data: logData,
|
|
49
|
+
defaultExpanded: true
|
|
50
|
+
});
|
|
51
|
+
const { filteredData, searchResultsCount, isRegexValid, renderLabel, hasActiveSearch } = chunkEEGQLTSQ_cjs.useTreeSearch({
|
|
52
|
+
data: logData,
|
|
53
|
+
searchQuery,
|
|
54
|
+
isCaseSensitive,
|
|
55
|
+
isRegex
|
|
56
|
+
});
|
|
57
|
+
react.useEffect(() => {
|
|
58
|
+
const dataToUse = hasActiveSearch ? dataWithMeta.filter((item) => filteredData.some((f) => f.id === item.id)) : visibleData;
|
|
59
|
+
setVisibleLogData(dataToUse);
|
|
60
|
+
}, [filteredData, visibleData, dataWithMeta, hasActiveSearch]);
|
|
61
|
+
const {
|
|
62
|
+
viewStart,
|
|
63
|
+
viewDuration,
|
|
64
|
+
timelineContainerRef,
|
|
65
|
+
timeToPercent,
|
|
66
|
+
ticks,
|
|
67
|
+
eventDots,
|
|
68
|
+
handlePan,
|
|
69
|
+
handleZoomDragStart,
|
|
70
|
+
setViewStart,
|
|
71
|
+
setViewDuration,
|
|
72
|
+
cursorVisible,
|
|
73
|
+
cursorPosition,
|
|
74
|
+
cursorLabel,
|
|
75
|
+
showMagnet
|
|
76
|
+
} = chunkRJ7I6ZQK_cjs.useViewport({
|
|
77
|
+
visibleLogData,
|
|
78
|
+
onTemporalCursorChange,
|
|
79
|
+
temporalCursor
|
|
80
|
+
});
|
|
81
|
+
return /* @__PURE__ */ jsxRuntime.jsx(chunk2CZEFXEW_cjs.TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(chunkG4FJGNY5_cjs.SyncScrollProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
82
|
+
"div",
|
|
83
|
+
{
|
|
84
|
+
className: chunkOHIB3TEN_cjs.cn(
|
|
85
|
+
"bg-bg-primary text-text-primary rounded-uk-md border-line-primary/50",
|
|
86
|
+
"mx-auto flex w-full flex-col overflow-hidden border font-sans",
|
|
87
|
+
"shadow-[0_4px_16px_0_var(--color-shadow-secondary)]",
|
|
88
|
+
className
|
|
89
|
+
),
|
|
90
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex h-full flex-row items-stretch", children: [
|
|
91
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
92
|
+
"div",
|
|
93
|
+
{
|
|
94
|
+
className: "border-line-primary/50 relative flex h-full flex-none flex-col border-r",
|
|
95
|
+
style: { width: panelWidth },
|
|
96
|
+
children: [
|
|
97
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
98
|
+
chunk55RSKLJ5_cjs.TreeSearchBar,
|
|
99
|
+
{
|
|
100
|
+
className: "p-1",
|
|
101
|
+
searchQuery,
|
|
102
|
+
setSearchQuery,
|
|
103
|
+
isCaseSensitive,
|
|
104
|
+
setIsCaseSensitive,
|
|
105
|
+
isRegex,
|
|
106
|
+
setIsRegex,
|
|
107
|
+
isRegexValid,
|
|
108
|
+
searchResultsCount
|
|
109
|
+
}
|
|
110
|
+
),
|
|
111
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkVBBJSIY7_cjs.SyncScroll, { className: "flex-1 overflow-y-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
112
|
+
chunkHAVTMZR3_cjs.TreeView,
|
|
113
|
+
{
|
|
114
|
+
data: hasActiveSearch ? dataWithMeta.filter((item) => filteredData.some((f) => f.id === item.id)) : visibleData,
|
|
115
|
+
getIcon,
|
|
116
|
+
expandedItems,
|
|
117
|
+
onToggleItem: toggleItem,
|
|
118
|
+
onItemHover: setHoveredId,
|
|
119
|
+
hoveredId,
|
|
120
|
+
hasDescendants,
|
|
121
|
+
renderLabel
|
|
122
|
+
}
|
|
123
|
+
) })
|
|
124
|
+
]
|
|
125
|
+
}
|
|
126
|
+
),
|
|
127
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
128
|
+
"div",
|
|
129
|
+
{
|
|
130
|
+
ref: timelineContainerRef,
|
|
131
|
+
className: "overflow-y-none scrollbar-hide relative flex h-full w-full flex-auto cursor-crosshair flex-col overflow-x-hidden pl-px active:cursor-grabbing",
|
|
132
|
+
children: [
|
|
133
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-bg-primary sticky top-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-line-primary/50 relative h-8 border-b", children: [
|
|
134
|
+
ticks.map((marker, ind) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
135
|
+
chunk6TSA7KXX_cjs.Tick,
|
|
136
|
+
{
|
|
137
|
+
time: marker.time,
|
|
138
|
+
label: marker.label,
|
|
139
|
+
timeToPercent,
|
|
140
|
+
zIndex: ind < ticks.length - 1 ? 10 : 0
|
|
141
|
+
},
|
|
142
|
+
marker.time
|
|
143
|
+
)),
|
|
144
|
+
eventDots.map(({ time }, tickIndex) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
145
|
+
chunkMVAFOQ67_cjs.TimeRuleEventDot,
|
|
146
|
+
{
|
|
147
|
+
percent: timeToPercent(time)
|
|
148
|
+
},
|
|
149
|
+
`snap-${time}-${tickIndex}`
|
|
150
|
+
))
|
|
151
|
+
] }) }),
|
|
152
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
153
|
+
chunkZ6UDRPC2_cjs.WheelZoomContext,
|
|
154
|
+
{
|
|
155
|
+
className: "scrollbar-hide relative h-full max-h-full overflow-auto",
|
|
156
|
+
viewStart,
|
|
157
|
+
viewDuration,
|
|
158
|
+
onViewStartChange: setViewStart,
|
|
159
|
+
onWindowChange: setViewDuration,
|
|
160
|
+
minWindow,
|
|
161
|
+
maxWindow: maxWindow ?? chunkG2ZYONQO_cjs.TOTAL_DURATION * 10,
|
|
162
|
+
zoomFactor,
|
|
163
|
+
enabled,
|
|
164
|
+
children: [
|
|
165
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkVBBJSIY7_cjs.SyncDragY, { className: "scrollbar-hide hide-scrollbar relative h-full w-full", children: visibleLogData.map(
|
|
166
|
+
(item, index) => item.time === void 0 ? (
|
|
167
|
+
// Render TimelineProcessBar for duration events
|
|
168
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
169
|
+
chunkYXFHJKNW_cjs.TimelineProcessBar,
|
|
170
|
+
{
|
|
171
|
+
index,
|
|
172
|
+
item,
|
|
173
|
+
isHovered: hoveredId === item.id,
|
|
174
|
+
onMouseEnter: () => setHoveredId(item.id),
|
|
175
|
+
onMouseLeave: () => setHoveredId(null),
|
|
176
|
+
onClick: (time) => {
|
|
177
|
+
setTemporalMarkers((prev) => [...prev, time]);
|
|
178
|
+
},
|
|
179
|
+
viewStart,
|
|
180
|
+
viewWindow: viewDuration,
|
|
181
|
+
timeToPercent
|
|
182
|
+
},
|
|
183
|
+
item.id
|
|
184
|
+
)
|
|
185
|
+
) : (
|
|
186
|
+
// Render TimelineEvent for instant events (with time property)
|
|
187
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
188
|
+
chunkTUYG6BYZ_cjs.TimelineEvent,
|
|
189
|
+
{
|
|
190
|
+
item,
|
|
191
|
+
isHovered: hoveredId === item.id,
|
|
192
|
+
onMouseEnter: () => setHoveredId(item.id),
|
|
193
|
+
onMouseLeave: () => setHoveredId(null),
|
|
194
|
+
onClick: (time) => {
|
|
195
|
+
setTemporalMarkers((prev) => [...prev, time]);
|
|
196
|
+
},
|
|
197
|
+
timeToPercent,
|
|
198
|
+
index
|
|
199
|
+
},
|
|
200
|
+
item.id
|
|
201
|
+
)
|
|
202
|
+
)
|
|
203
|
+
) }),
|
|
204
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkVBBJSIY7_cjs.SyncScrollSlave, { className: "scrollbar-hide pointer-events-none absolute top-0 left-0 z-10 h-full w-2", children: visibleLogData.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
205
|
+
chunk5MNZYCN2_cjs.LeftWedge,
|
|
206
|
+
{
|
|
207
|
+
item,
|
|
208
|
+
classes: chunkG2ZYONQO_cjs.rightWedgeClasses,
|
|
209
|
+
viewStart,
|
|
210
|
+
index
|
|
211
|
+
},
|
|
212
|
+
`left-wedge-${item.id}`
|
|
213
|
+
)) }),
|
|
214
|
+
/* @__PURE__ */ jsxRuntime.jsx(chunkVBBJSIY7_cjs.SyncScrollSlave, { className: "scrollbar-hide pointer-events-none absolute top-0 right-0 z-10 h-full w-2", children: visibleLogData.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
215
|
+
chunk5MNZYCN2_cjs.RightWedge,
|
|
216
|
+
{
|
|
217
|
+
item,
|
|
218
|
+
classes: chunkG2ZYONQO_cjs.leftWedgeClasses,
|
|
219
|
+
viewEnd: viewStart + viewDuration,
|
|
220
|
+
index
|
|
221
|
+
},
|
|
222
|
+
`right-wedge-${item.id}`
|
|
223
|
+
)) }),
|
|
224
|
+
children,
|
|
225
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute bottom-1 left-1/2 -translate-x-1/2 justify-center pb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
226
|
+
chunkLP3AGGRK_cjs.NavigationControls,
|
|
227
|
+
{
|
|
228
|
+
viewDuration,
|
|
229
|
+
handlePan,
|
|
230
|
+
handleZoomDragStart
|
|
231
|
+
}
|
|
232
|
+
) })
|
|
233
|
+
]
|
|
234
|
+
}
|
|
235
|
+
),
|
|
236
|
+
temporalMarkers.map((time, index) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
237
|
+
"div",
|
|
238
|
+
{
|
|
239
|
+
className: "pointer-events-none absolute top-0 h-8 w-20 cursor-pointer",
|
|
240
|
+
style: {
|
|
241
|
+
zIndex: 110,
|
|
242
|
+
left: `calc(${timeToPercent(time)}% - 2.5rem)`
|
|
243
|
+
},
|
|
244
|
+
onClick: () => {
|
|
245
|
+
setTemporalMarkers((prev) => prev.filter((_, i) => i !== index));
|
|
246
|
+
},
|
|
247
|
+
title: "Click to remove marker",
|
|
248
|
+
children: [
|
|
249
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "pointer-events-auto relative h-full w-full" }),
|
|
250
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
251
|
+
chunk2J75MYQA_cjs.CursorOverlay,
|
|
252
|
+
{
|
|
253
|
+
left: 50,
|
|
254
|
+
label: `T${index + 1}`,
|
|
255
|
+
color: "#3b82f6",
|
|
256
|
+
showReadout: true,
|
|
257
|
+
variant: "static",
|
|
258
|
+
zIndex: 110
|
|
259
|
+
}
|
|
260
|
+
)
|
|
261
|
+
]
|
|
262
|
+
},
|
|
263
|
+
`marker-${time}-${index}`
|
|
264
|
+
)),
|
|
265
|
+
cursorVisible && /* @__PURE__ */ jsxRuntime.jsx(
|
|
266
|
+
chunk2J75MYQA_cjs.CursorOverlay,
|
|
267
|
+
{
|
|
268
|
+
left: cursorPosition,
|
|
269
|
+
label: cursorLabel,
|
|
270
|
+
color: "#ef4444",
|
|
271
|
+
showReadout: true,
|
|
272
|
+
showMagnet,
|
|
273
|
+
className: "transition-opacity duration-150",
|
|
274
|
+
zIndex: 100
|
|
275
|
+
}
|
|
276
|
+
)
|
|
277
|
+
]
|
|
278
|
+
}
|
|
279
|
+
)
|
|
280
|
+
] })
|
|
281
|
+
}
|
|
282
|
+
) }) });
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
exports.Waterfall = Waterfall;
|