@databricks/appkit-ui 0.15.0 → 0.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cli/commands/plugin/add-resource/add-resource.js +10 -4
- package/dist/cli/commands/plugin/add-resource/add-resource.js.map +1 -1
- package/dist/cli/commands/plugin/create/scaffold.js +10 -16
- package/dist/cli/commands/plugin/create/scaffold.js.map +1 -1
- package/dist/cli/commands/plugin/list/list.js +44 -26
- package/dist/cli/commands/plugin/list/list.js.map +1 -1
- package/dist/cli/commands/plugin/manifest-resolve.js +57 -0
- package/dist/cli/commands/plugin/manifest-resolve.js.map +1 -0
- package/dist/cli/commands/plugin/sync/sync.js +121 -71
- package/dist/cli/commands/plugin/sync/sync.js.map +1 -1
- package/dist/cli/commands/plugin/trusted-js-manifest.js +28 -0
- package/dist/cli/commands/plugin/trusted-js-manifest.js.map +1 -0
- package/dist/cli/commands/plugin/validate/validate.js +32 -14
- package/dist/cli/commands/plugin/validate/validate.js.map +1 -1
- package/dist/js/arrow/arrow-client.d.ts.map +1 -1
- package/dist/js/arrow/index.d.ts +3 -0
- package/dist/js/arrow/lazy-arrow.d.ts +0 -1
- package/dist/js/arrow/lazy-arrow.d.ts.map +1 -1
- package/dist/js/constants.d.ts.map +1 -1
- package/dist/js/index.d.ts +2 -0
- package/dist/js/sse/connect-sse.d.ts +0 -1
- package/dist/js/sse/connect-sse.d.ts.map +1 -1
- package/dist/js/sse/types.d.ts +1 -3
- package/dist/js/sse/types.d.ts.map +1 -1
- package/dist/react/charts/area/index.d.ts +2 -3
- package/dist/react/charts/area/index.d.ts.map +1 -1
- package/dist/react/charts/bar/index.d.ts +2 -3
- package/dist/react/charts/bar/index.d.ts.map +1 -1
- package/dist/react/charts/base.d.ts +2 -2
- package/dist/react/charts/base.d.ts.map +1 -1
- package/dist/react/charts/base.js.map +1 -1
- package/dist/react/charts/chart-error-boundary.js.map +1 -1
- package/dist/react/charts/constants.d.ts.map +1 -1
- package/dist/react/charts/create-chart.d.ts +2 -3
- package/dist/react/charts/create-chart.d.ts.map +1 -1
- package/dist/react/charts/create-chart.js.map +1 -1
- package/dist/react/charts/empty.js.map +1 -1
- package/dist/react/charts/error.js.map +1 -1
- package/dist/react/charts/heatmap/index.d.ts +2 -3
- package/dist/react/charts/heatmap/index.d.ts.map +1 -1
- package/dist/react/charts/index.d.ts +18 -0
- package/dist/react/charts/line/index.d.ts +2 -3
- package/dist/react/charts/line/index.d.ts.map +1 -1
- package/dist/react/charts/loading.js.map +1 -1
- package/dist/react/charts/normalize.d.ts +0 -1
- package/dist/react/charts/normalize.d.ts.map +1 -1
- package/dist/react/charts/options.d.ts.map +1 -1
- package/dist/react/charts/pie/index.d.ts +3 -4
- package/dist/react/charts/pie/index.d.ts.map +1 -1
- package/dist/react/charts/radar/index.d.ts +2 -3
- package/dist/react/charts/radar/index.d.ts.map +1 -1
- package/dist/react/charts/scatter/index.d.ts +2 -3
- package/dist/react/charts/scatter/index.d.ts.map +1 -1
- package/dist/react/charts/theme.d.ts +0 -1
- package/dist/react/charts/theme.d.ts.map +1 -1
- package/dist/react/charts/types.d.ts.map +1 -1
- package/dist/react/charts/utils.d.ts.map +1 -1
- package/dist/react/charts/wrapper.d.ts +2 -2
- package/dist/react/charts/wrapper.d.ts.map +1 -1
- package/dist/react/charts/wrapper.js.map +1 -1
- package/dist/react/genie/genie-chat-input.d.ts +2 -2
- package/dist/react/genie/genie-chat-input.d.ts.map +1 -1
- package/dist/react/genie/genie-chat-input.js.map +1 -1
- package/dist/react/genie/genie-chat-message-list.d.ts +9 -3
- package/dist/react/genie/genie-chat-message-list.d.ts.map +1 -1
- package/dist/react/genie/genie-chat-message-list.js +92 -17
- package/dist/react/genie/genie-chat-message-list.js.map +1 -1
- package/dist/react/genie/genie-chat-message.d.ts +2 -2
- package/dist/react/genie/genie-chat-message.d.ts.map +1 -1
- package/dist/react/genie/genie-chat-message.js.map +1 -1
- package/dist/react/genie/genie-chat.d.ts +2 -2
- package/dist/react/genie/genie-chat.d.ts.map +1 -1
- package/dist/react/genie/genie-chat.js +4 -2
- package/dist/react/genie/genie-chat.js.map +1 -1
- package/dist/react/genie/index.d.ts +7 -0
- package/dist/react/genie/types.d.ts +8 -1
- package/dist/react/genie/types.d.ts.map +1 -1
- package/dist/react/genie/use-genie-chat.d.ts +0 -1
- package/dist/react/genie/use-genie-chat.d.ts.map +1 -1
- package/dist/react/genie/use-genie-chat.js +119 -41
- package/dist/react/genie/use-genie-chat.js.map +1 -1
- package/dist/react/hooks/index.d.ts +3 -0
- package/dist/react/hooks/types.d.ts.map +1 -1
- package/dist/react/hooks/use-analytics-query.d.ts +0 -1
- package/dist/react/hooks/use-analytics-query.d.ts.map +1 -1
- package/dist/react/hooks/use-chart-data.d.ts.map +1 -1
- package/dist/react/index.d.ts +5 -0
- package/dist/react/lib/utils.d.ts.map +1 -1
- package/dist/react/portal-container-context.d.ts +0 -1
- package/dist/react/portal-container-context.d.ts.map +1 -1
- package/dist/react/portal-container-context.js.map +1 -1
- package/dist/react/table/data-table.d.ts +2 -3
- package/dist/react/table/data-table.d.ts.map +1 -1
- package/dist/react/table/data-table.js.map +1 -1
- package/dist/react/table/empty.js.map +1 -1
- package/dist/react/table/error.js.map +1 -1
- package/dist/react/table/index.d.ts +1 -0
- package/dist/react/table/loading.js.map +1 -1
- package/dist/react/table/table-wrapper.js.map +1 -1
- package/dist/react/table/types.d.ts +0 -1
- package/dist/react/table/types.d.ts.map +1 -1
- package/dist/react/ui/accordion.d.ts.map +1 -1
- package/dist/react/ui/accordion.js.map +1 -1
- package/dist/react/ui/alert-dialog.d.ts +12 -12
- package/dist/react/ui/alert-dialog.d.ts.map +1 -1
- package/dist/react/ui/alert-dialog.js.map +1 -1
- package/dist/react/ui/alert.d.ts +4 -4
- package/dist/react/ui/alert.d.ts.map +1 -1
- package/dist/react/ui/alert.js.map +1 -1
- package/dist/react/ui/aspect-ratio.d.ts +2 -2
- package/dist/react/ui/aspect-ratio.d.ts.map +1 -1
- package/dist/react/ui/aspect-ratio.js.map +1 -1
- package/dist/react/ui/avatar.d.ts +4 -4
- package/dist/react/ui/avatar.d.ts.map +1 -1
- package/dist/react/ui/avatar.js.map +1 -1
- package/dist/react/ui/badge.d.ts +2 -2
- package/dist/react/ui/badge.d.ts.map +1 -1
- package/dist/react/ui/badge.js.map +1 -1
- package/dist/react/ui/breadcrumb.d.ts +8 -8
- package/dist/react/ui/breadcrumb.d.ts.map +1 -1
- package/dist/react/ui/breadcrumb.js.map +1 -1
- package/dist/react/ui/button-group.d.ts +6 -6
- package/dist/react/ui/button-group.d.ts.map +1 -1
- package/dist/react/ui/button-group.js.map +1 -1
- package/dist/react/ui/button.d.ts +4 -4
- package/dist/react/ui/button.d.ts.map +1 -1
- package/dist/react/ui/button.js.map +1 -1
- package/dist/react/ui/calendar.d.ts +3 -3
- package/dist/react/ui/calendar.d.ts.map +1 -1
- package/dist/react/ui/calendar.js.map +1 -1
- package/dist/react/ui/card.d.ts +8 -8
- package/dist/react/ui/card.d.ts.map +1 -1
- package/dist/react/ui/card.js.map +1 -1
- package/dist/react/ui/carousel.d.ts +6 -6
- package/dist/react/ui/carousel.d.ts.map +1 -1
- package/dist/react/ui/carousel.js.map +1 -1
- package/dist/react/ui/chart.d.ts +19 -19
- package/dist/react/ui/chart.d.ts.map +1 -1
- package/dist/react/ui/chart.js.map +1 -1
- package/dist/react/ui/checkbox.d.ts +2 -2
- package/dist/react/ui/checkbox.d.ts.map +1 -1
- package/dist/react/ui/checkbox.js.map +1 -1
- package/dist/react/ui/collapsible.d.ts +4 -4
- package/dist/react/ui/collapsible.d.ts.map +1 -1
- package/dist/react/ui/collapsible.js.map +1 -1
- package/dist/react/ui/command.d.ts +10 -10
- package/dist/react/ui/command.d.ts.map +1 -1
- package/dist/react/ui/command.js.map +1 -1
- package/dist/react/ui/context-menu.d.ts +16 -16
- package/dist/react/ui/context-menu.d.ts.map +1 -1
- package/dist/react/ui/context-menu.js.map +1 -1
- package/dist/react/ui/dialog.d.ts +11 -11
- package/dist/react/ui/dialog.d.ts.map +1 -1
- package/dist/react/ui/dialog.js.map +1 -1
- package/dist/react/ui/drawer.d.ts +11 -11
- package/dist/react/ui/drawer.d.ts.map +1 -1
- package/dist/react/ui/drawer.js.map +1 -1
- package/dist/react/ui/dropdown-menu.d.ts +16 -16
- package/dist/react/ui/dropdown-menu.d.ts.map +1 -1
- package/dist/react/ui/dropdown-menu.js.map +1 -1
- package/dist/react/ui/empty.d.ts +9 -9
- package/dist/react/ui/empty.d.ts.map +1 -1
- package/dist/react/ui/empty.js.map +1 -1
- package/dist/react/ui/field.d.ts +13 -13
- package/dist/react/ui/field.d.ts.map +1 -1
- package/dist/react/ui/field.js.map +1 -1
- package/dist/react/ui/form.d.ts +9 -9
- package/dist/react/ui/form.d.ts.map +1 -1
- package/dist/react/ui/form.js.map +1 -1
- package/dist/react/ui/hover-card.d.ts +4 -4
- package/dist/react/ui/hover-card.d.ts.map +1 -1
- package/dist/react/ui/hover-card.js.map +1 -1
- package/dist/react/ui/index.d.ts +53 -0
- package/dist/react/ui/input-group.d.ts +10 -10
- package/dist/react/ui/input-group.d.ts.map +1 -1
- package/dist/react/ui/input-group.js.map +1 -1
- package/dist/react/ui/input-otp.d.ts +5 -5
- package/dist/react/ui/input-otp.d.ts.map +1 -1
- package/dist/react/ui/input-otp.js.map +1 -1
- package/dist/react/ui/input.d.ts +2 -2
- package/dist/react/ui/input.d.ts.map +1 -1
- package/dist/react/ui/input.js.map +1 -1
- package/dist/react/ui/item.d.ts +14 -14
- package/dist/react/ui/item.d.ts.map +1 -1
- package/dist/react/ui/item.js.map +1 -1
- package/dist/react/ui/kbd.d.ts +3 -3
- package/dist/react/ui/kbd.d.ts.map +1 -1
- package/dist/react/ui/kbd.js.map +1 -1
- package/dist/react/ui/label.d.ts +2 -2
- package/dist/react/ui/label.d.ts.map +1 -1
- package/dist/react/ui/label.js.map +1 -1
- package/dist/react/ui/menubar.d.ts +17 -17
- package/dist/react/ui/menubar.d.ts.map +1 -1
- package/dist/react/ui/menubar.js.map +1 -1
- package/dist/react/ui/navigation-menu.d.ts +11 -11
- package/dist/react/ui/navigation-menu.d.ts.map +1 -1
- package/dist/react/ui/navigation-menu.js.map +1 -1
- package/dist/react/ui/pagination.d.ts +8 -8
- package/dist/react/ui/pagination.d.ts.map +1 -1
- package/dist/react/ui/pagination.js.map +1 -1
- package/dist/react/ui/popover.d.ts +5 -5
- package/dist/react/ui/popover.d.ts.map +1 -1
- package/dist/react/ui/popover.js.map +1 -1
- package/dist/react/ui/progress.d.ts +2 -2
- package/dist/react/ui/progress.d.ts.map +1 -1
- package/dist/react/ui/progress.js.map +1 -1
- package/dist/react/ui/radio-group.d.ts +3 -3
- package/dist/react/ui/radio-group.d.ts.map +1 -1
- package/dist/react/ui/radio-group.js.map +1 -1
- package/dist/react/ui/resizable.d.ts +4 -4
- package/dist/react/ui/resizable.d.ts.map +1 -1
- package/dist/react/ui/resizable.js.map +1 -1
- package/dist/react/ui/scroll-area.d.ts +3 -3
- package/dist/react/ui/scroll-area.d.ts.map +1 -1
- package/dist/react/ui/scroll-area.js.map +1 -1
- package/dist/react/ui/select.d.ts +11 -11
- package/dist/react/ui/select.d.ts.map +1 -1
- package/dist/react/ui/select.js.map +1 -1
- package/dist/react/ui/separator.d.ts +2 -2
- package/dist/react/ui/separator.d.ts.map +1 -1
- package/dist/react/ui/separator.js.map +1 -1
- package/dist/react/ui/sheet.d.ts +9 -9
- package/dist/react/ui/sheet.d.ts.map +1 -1
- package/dist/react/ui/sheet.js.map +1 -1
- package/dist/react/ui/sidebar.d.ts +38 -55
- package/dist/react/ui/sidebar.d.ts.map +1 -1
- package/dist/react/ui/sidebar.js.map +1 -1
- package/dist/react/ui/skeleton.d.ts +2 -2
- package/dist/react/ui/skeleton.d.ts.map +1 -1
- package/dist/react/ui/skeleton.js.map +1 -1
- package/dist/react/ui/slider.d.ts +2 -2
- package/dist/react/ui/slider.d.ts.map +1 -1
- package/dist/react/ui/slider.js.map +1 -1
- package/dist/react/ui/sonner.d.ts +2 -2
- package/dist/react/ui/sonner.d.ts.map +1 -1
- package/dist/react/ui/sonner.js.map +1 -1
- package/dist/react/ui/spinner.d.ts +2 -2
- package/dist/react/ui/spinner.d.ts.map +1 -1
- package/dist/react/ui/spinner.js.map +1 -1
- package/dist/react/ui/switch.d.ts +2 -2
- package/dist/react/ui/switch.d.ts.map +1 -1
- package/dist/react/ui/switch.js.map +1 -1
- package/dist/react/ui/table.d.ts +9 -9
- package/dist/react/ui/table.d.ts.map +1 -1
- package/dist/react/ui/table.js.map +1 -1
- package/dist/react/ui/tabs.d.ts +5 -5
- package/dist/react/ui/tabs.d.ts.map +1 -1
- package/dist/react/ui/tabs.js.map +1 -1
- package/dist/react/ui/textarea.d.ts +2 -2
- package/dist/react/ui/textarea.d.ts.map +1 -1
- package/dist/react/ui/textarea.js.map +1 -1
- package/dist/react/ui/toggle-group.d.ts +3 -3
- package/dist/react/ui/toggle-group.d.ts.map +1 -1
- package/dist/react/ui/toggle-group.js.map +1 -1
- package/dist/react/ui/toggle.d.ts +4 -4
- package/dist/react/ui/toggle.d.ts.map +1 -1
- package/dist/react/ui/toggle.js.map +1 -1
- package/dist/react/ui/tooltip.d.ts +5 -5
- package/dist/react/ui/tooltip.d.ts.map +1 -1
- package/dist/react/ui/tooltip.js.map +1 -1
- package/dist/shared/src/cache.d.ts +1 -0
- package/dist/shared/src/execute.d.ts +1 -0
- package/dist/shared/src/genie.d.ts +6 -0
- package/dist/shared/src/genie.d.ts.map +1 -1
- package/dist/shared/src/index.d.ts +7 -0
- package/dist/shared/src/plugin.d.ts +2 -0
- package/dist/shared/src/sql/helpers.d.ts +0 -1
- package/dist/shared/src/sql/helpers.d.ts.map +1 -1
- package/dist/shared/src/sql/types.d.ts.map +1 -1
- package/dist/shared/src/tunnel.d.ts +1 -0
- package/docs/api/appkit-ui/genie/GenieChatMessageList.md +7 -5
- package/docs/development/project-setup.md +1 -1
- package/docs/plugins/plugin-management.md +16 -2
- package/package.json +3 -1
|
@@ -55,6 +55,47 @@ function messageResultToItems(msg) {
|
|
|
55
55
|
return [makeUserItem(msg, "-user"), makeAssistantItem(msg)];
|
|
56
56
|
}
|
|
57
57
|
/**
|
|
58
|
+
* Streams a conversation page via SSE. Collects message items and query
|
|
59
|
+
* results into a buffer and returns them when the stream completes.
|
|
60
|
+
*/
|
|
61
|
+
function fetchConversationPage(basePath, alias, convId, options) {
|
|
62
|
+
const params = new URLSearchParams({ requestId: crypto.randomUUID() });
|
|
63
|
+
if (options.pageToken) params.set("pageToken", options.pageToken);
|
|
64
|
+
const items = [];
|
|
65
|
+
return connectSSE({
|
|
66
|
+
url: `${basePath}/${encodeURIComponent(alias)}/conversations/${encodeURIComponent(convId)}?${params}`,
|
|
67
|
+
signal: options.signal,
|
|
68
|
+
onMessage: async (message) => {
|
|
69
|
+
try {
|
|
70
|
+
const event = JSON.parse(message.data);
|
|
71
|
+
switch (event.type) {
|
|
72
|
+
case "message_result":
|
|
73
|
+
items.push(...messageResultToItems(event.message));
|
|
74
|
+
break;
|
|
75
|
+
case "query_result":
|
|
76
|
+
for (let i = items.length - 1; i >= 0; i--) {
|
|
77
|
+
const item = items[i];
|
|
78
|
+
if (item.attachments.some((a) => a.attachmentId === event.attachmentId)) {
|
|
79
|
+
item.queryResults.set(event.attachmentId, event.data);
|
|
80
|
+
break;
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
break;
|
|
84
|
+
case "history_info":
|
|
85
|
+
options.onPaginationInfo?.(event.nextPageToken);
|
|
86
|
+
break;
|
|
87
|
+
case "error":
|
|
88
|
+
options.onError?.(event.error);
|
|
89
|
+
break;
|
|
90
|
+
}
|
|
91
|
+
} catch {}
|
|
92
|
+
},
|
|
93
|
+
onError: (err) => options.onConnectionError?.(err)
|
|
94
|
+
}).then(() => items);
|
|
95
|
+
}
|
|
96
|
+
/** Minimum time (ms) to hold the loading-older state so scroll inertia settles before prepending messages. */
|
|
97
|
+
const MIN_PREVIOUS_PAGE_LOAD_MS = 800;
|
|
98
|
+
/**
|
|
58
99
|
* Manages the full Genie chat lifecycle:
|
|
59
100
|
* SSE streaming, conversation persistence via URL, and history replay.
|
|
60
101
|
*
|
|
@@ -69,12 +110,20 @@ function useGenieChat(options) {
|
|
|
69
110
|
const [status, setStatus] = useState("idle");
|
|
70
111
|
const [conversationId, setConversationId] = useState(null);
|
|
71
112
|
const [error, setError] = useState(null);
|
|
113
|
+
const [nextPageToken, setNextPageToken] = useState(null);
|
|
114
|
+
const hasPreviousPage = nextPageToken !== null;
|
|
115
|
+
const isFetchingPreviousPage = status === "loading-older";
|
|
72
116
|
const abortControllerRef = useRef(null);
|
|
117
|
+
const paginationAbortRef = useRef(null);
|
|
73
118
|
const conversationIdRef = useRef(null);
|
|
119
|
+
const nextPageTokenRef = useRef(null);
|
|
120
|
+
const isLoadingOlderRef = useRef(false);
|
|
74
121
|
useEffect(() => {
|
|
75
122
|
conversationIdRef.current = conversationId;
|
|
76
|
-
|
|
77
|
-
|
|
123
|
+
nextPageTokenRef.current = nextPageToken;
|
|
124
|
+
}, [conversationId, nextPageToken]);
|
|
125
|
+
/** Process SSE events during live message streaming (sendMessage). */
|
|
126
|
+
const processStreamEvent = useCallback((event) => {
|
|
78
127
|
switch (event.type) {
|
|
79
128
|
case "message_start":
|
|
80
129
|
setConversationId(event.conversationId);
|
|
@@ -92,11 +141,7 @@ function useGenieChat(options) {
|
|
|
92
141
|
break;
|
|
93
142
|
case "message_result": {
|
|
94
143
|
const msg = event.message;
|
|
95
|
-
|
|
96
|
-
if (isHistory) {
|
|
97
|
-
const items = messageResultToItems(msg);
|
|
98
|
-
setMessages((prev) => [...prev, ...items]);
|
|
99
|
-
} else if (hasAttachments) {
|
|
144
|
+
if ((msg.attachments?.length ?? 0) > 0) {
|
|
100
145
|
const item = makeAssistantItem(msg);
|
|
101
146
|
setMessages((prev) => {
|
|
102
147
|
const last = prev[prev.length - 1];
|
|
@@ -108,20 +153,18 @@ function useGenieChat(options) {
|
|
|
108
153
|
}
|
|
109
154
|
case "query_result":
|
|
110
155
|
setMessages((prev) => {
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
const msg = updated[i];
|
|
156
|
+
for (let i = prev.length - 1; i >= 0; i--) {
|
|
157
|
+
const msg = prev[i];
|
|
114
158
|
if (msg.attachments.some((a) => a.attachmentId === event.attachmentId)) {
|
|
115
|
-
const
|
|
116
|
-
queryResults.set(event.attachmentId, event.data);
|
|
159
|
+
const updated = prev.slice();
|
|
117
160
|
updated[i] = {
|
|
118
161
|
...msg,
|
|
119
|
-
queryResults
|
|
162
|
+
queryResults: new Map(msg.queryResults).set(event.attachmentId, event.data)
|
|
120
163
|
};
|
|
121
|
-
|
|
164
|
+
return updated;
|
|
122
165
|
}
|
|
123
166
|
}
|
|
124
|
-
return
|
|
167
|
+
return prev;
|
|
125
168
|
});
|
|
126
169
|
break;
|
|
127
170
|
case "error":
|
|
@@ -134,6 +177,7 @@ function useGenieChat(options) {
|
|
|
134
177
|
const trimmed = content.trim();
|
|
135
178
|
if (!trimmed) return;
|
|
136
179
|
abortControllerRef.current?.abort();
|
|
180
|
+
paginationAbortRef.current?.abort();
|
|
137
181
|
setError(null);
|
|
138
182
|
setStatus("streaming");
|
|
139
183
|
const userMessage = {
|
|
@@ -169,7 +213,7 @@ function useGenieChat(options) {
|
|
|
169
213
|
signal: abortController.signal,
|
|
170
214
|
onMessage: async (message) => {
|
|
171
215
|
try {
|
|
172
|
-
|
|
216
|
+
processStreamEvent(JSON.parse(message.data));
|
|
173
217
|
} catch {}
|
|
174
218
|
},
|
|
175
219
|
onError: (err) => {
|
|
@@ -187,44 +231,74 @@ function useGenieChat(options) {
|
|
|
187
231
|
}, [
|
|
188
232
|
alias,
|
|
189
233
|
basePath,
|
|
190
|
-
|
|
234
|
+
processStreamEvent
|
|
191
235
|
]);
|
|
236
|
+
/** Creates an AbortController, stores it in the given ref, and fetches a conversation page. */
|
|
237
|
+
const fetchPage = useCallback((controllerRef, convId, options) => {
|
|
238
|
+
controllerRef.current?.abort();
|
|
239
|
+
const abortController = new AbortController();
|
|
240
|
+
controllerRef.current = abortController;
|
|
241
|
+
return {
|
|
242
|
+
promise: fetchConversationPage(basePath, alias, convId, {
|
|
243
|
+
pageToken: options?.pageToken,
|
|
244
|
+
signal: abortController.signal,
|
|
245
|
+
onPaginationInfo: setNextPageToken,
|
|
246
|
+
onError: (msg) => {
|
|
247
|
+
setError(msg);
|
|
248
|
+
setStatus("error");
|
|
249
|
+
},
|
|
250
|
+
onConnectionError: (err) => {
|
|
251
|
+
if (abortController.signal.aborted) return;
|
|
252
|
+
setError(err instanceof Error ? err.message : options?.errorMessage ?? "Failed to load messages.");
|
|
253
|
+
setStatus("error");
|
|
254
|
+
}
|
|
255
|
+
}),
|
|
256
|
+
abortController
|
|
257
|
+
};
|
|
258
|
+
}, [alias, basePath]);
|
|
192
259
|
const loadHistory = useCallback((convId) => {
|
|
193
|
-
|
|
260
|
+
paginationAbortRef.current?.abort();
|
|
194
261
|
setStatus("loading-history");
|
|
195
262
|
setError(null);
|
|
196
263
|
setMessages([]);
|
|
197
264
|
setConversationId(convId);
|
|
198
|
-
const abortController =
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
signal: abortController.signal,
|
|
204
|
-
onMessage: async (message) => {
|
|
205
|
-
try {
|
|
206
|
-
processEvent(JSON.parse(message.data), true);
|
|
207
|
-
} catch {}
|
|
208
|
-
},
|
|
209
|
-
onError: (err) => {
|
|
210
|
-
if (abortController.signal.aborted) return;
|
|
211
|
-
setError(err instanceof Error ? err.message : "Failed to load conversation history.");
|
|
212
|
-
setStatus("error");
|
|
265
|
+
const { promise, abortController } = fetchPage(abortControllerRef, convId, { errorMessage: "Failed to load conversation history." });
|
|
266
|
+
promise.then((items) => {
|
|
267
|
+
if (!abortController.signal.aborted) {
|
|
268
|
+
setMessages(items);
|
|
269
|
+
setStatus((prev) => prev === "error" ? "error" : "idle");
|
|
213
270
|
}
|
|
214
|
-
}).then(() => {
|
|
215
|
-
if (!abortController.signal.aborted) setStatus((prev) => prev === "error" ? "error" : "idle");
|
|
216
271
|
});
|
|
217
|
-
}, [
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
272
|
+
}, [fetchPage]);
|
|
273
|
+
const fetchPreviousPage = useCallback(() => {
|
|
274
|
+
if (!nextPageTokenRef.current || !conversationIdRef.current || isLoadingOlderRef.current) return;
|
|
275
|
+
isLoadingOlderRef.current = true;
|
|
276
|
+
setStatus("loading-older");
|
|
277
|
+
setError(null);
|
|
278
|
+
const startTime = Date.now();
|
|
279
|
+
const { promise, abortController } = fetchPage(paginationAbortRef, conversationIdRef.current, {
|
|
280
|
+
pageToken: nextPageTokenRef.current,
|
|
281
|
+
errorMessage: "Failed to load older messages."
|
|
282
|
+
});
|
|
283
|
+
promise.then(async (items) => {
|
|
284
|
+
if (abortController.signal.aborted) return;
|
|
285
|
+
const elapsed = Date.now() - startTime;
|
|
286
|
+
if (elapsed < MIN_PREVIOUS_PAGE_LOAD_MS) await new Promise((r) => setTimeout(r, MIN_PREVIOUS_PAGE_LOAD_MS - elapsed));
|
|
287
|
+
if (abortController.signal.aborted) return;
|
|
288
|
+
if (items.length > 0) setMessages((prev) => [...items, ...prev]);
|
|
289
|
+
setStatus((current) => current === "loading-older" ? "idle" : current);
|
|
290
|
+
}).finally(() => {
|
|
291
|
+
isLoadingOlderRef.current = false;
|
|
292
|
+
});
|
|
293
|
+
}, [fetchPage]);
|
|
222
294
|
const reset = useCallback(() => {
|
|
223
295
|
abortControllerRef.current?.abort();
|
|
296
|
+
paginationAbortRef.current?.abort();
|
|
224
297
|
setMessages([]);
|
|
225
298
|
setConversationId(null);
|
|
226
299
|
setError(null);
|
|
227
300
|
setStatus("idle");
|
|
301
|
+
setNextPageToken(null);
|
|
228
302
|
if (persistInUrl) removeUrlParam(urlParamName);
|
|
229
303
|
}, [persistInUrl, urlParamName]);
|
|
230
304
|
useEffect(() => {
|
|
@@ -233,6 +307,7 @@ function useGenieChat(options) {
|
|
|
233
307
|
if (existingId) loadHistory(existingId);
|
|
234
308
|
return () => {
|
|
235
309
|
abortControllerRef.current?.abort();
|
|
310
|
+
paginationAbortRef.current?.abort();
|
|
236
311
|
};
|
|
237
312
|
}, [
|
|
238
313
|
persistInUrl,
|
|
@@ -245,7 +320,10 @@ function useGenieChat(options) {
|
|
|
245
320
|
conversationId,
|
|
246
321
|
error,
|
|
247
322
|
sendMessage,
|
|
248
|
-
reset
|
|
323
|
+
reset,
|
|
324
|
+
hasPreviousPage,
|
|
325
|
+
isFetchingPreviousPage,
|
|
326
|
+
fetchPreviousPage
|
|
249
327
|
};
|
|
250
328
|
}
|
|
251
329
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-genie-chat.js","names":[],"sources":["../../../src/react/genie/use-genie-chat.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { connectSSE } from \"@/js\";\nimport type {\n GenieChatStatus,\n GenieMessageItem,\n GenieMessageResponse,\n GenieStreamEvent,\n UseGenieChatOptions,\n UseGenieChatReturn,\n} from \"./types\";\n\nfunction getUrlParam(name: string): string | null {\n return new URLSearchParams(window.location.search).get(name);\n}\n\nfunction setUrlParam(name: string, value: string): void {\n const url = new URL(window.location.href);\n url.searchParams.set(name, value);\n window.history.replaceState({}, \"\", url.toString());\n}\n\nfunction removeUrlParam(name: string): void {\n const url = new URL(window.location.href);\n url.searchParams.delete(name);\n window.history.replaceState({}, \"\", url.toString());\n}\n\n/**\n * The Genie API puts the user's question in `message.content` and the\n * actual AI answer in text attachments. Extract the text attachment\n * content so we display the real answer, not the question echo.\n */\nfunction extractAssistantContent(msg: GenieMessageResponse): string {\n const textParts = (msg.attachments ?? [])\n .map((att) => att.text?.content)\n .filter(Boolean) as string[];\n return textParts.length > 0 ? textParts.join(\"\\n\\n\") : msg.content;\n}\n\nfunction makeUserItem(\n msg: GenieMessageResponse,\n idSuffix = \"\",\n): GenieMessageItem {\n return {\n id: `${msg.messageId}${idSuffix}`,\n role: \"user\",\n content: msg.content,\n status: msg.status,\n attachments: [],\n queryResults: new Map(),\n };\n}\n\nfunction makeAssistantItem(msg: GenieMessageResponse): GenieMessageItem {\n return {\n id: msg.messageId,\n role: \"assistant\",\n content: extractAssistantContent(msg),\n status: msg.status,\n attachments: msg.attachments ?? [],\n queryResults: new Map(),\n error: msg.error,\n };\n}\n\n/**\n * The API bundles user question (content) and AI answer (attachments) in one message.\n * Split into separate user + assistant items for display.\n */\nfunction messageResultToItems(msg: GenieMessageResponse): GenieMessageItem[] {\n const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n if (!hasAttachments) return [makeUserItem(msg)];\n return [makeUserItem(msg, \"-user\"), makeAssistantItem(msg)];\n}\n\n/**\n * Manages the full Genie chat lifecycle:\n * SSE streaming, conversation persistence via URL, and history replay.\n *\n * @example\n * ```tsx\n * const { messages, status, sendMessage, reset } = useGenieChat({ alias: \"demo\" });\n * ```\n */\nexport function useGenieChat(options: UseGenieChatOptions): UseGenieChatReturn {\n const {\n alias,\n basePath = \"/api/genie\",\n persistInUrl = true,\n urlParamName = \"conversationId\",\n } = options;\n\n const [messages, setMessages] = useState<GenieMessageItem[]>([]);\n const [status, setStatus] = useState<GenieChatStatus>(\"idle\");\n const [conversationId, setConversationId] = useState<string | null>(null);\n const [error, setError] = useState<string | null>(null);\n\n const abortControllerRef = useRef<AbortController | null>(null);\n const conversationIdRef = useRef<string | null>(null);\n\n useEffect(() => {\n conversationIdRef.current = conversationId;\n }, [conversationId]);\n\n const processEvent = useCallback(\n (event: GenieStreamEvent, isHistory: boolean) => {\n switch (event.type) {\n case \"message_start\": {\n setConversationId(event.conversationId);\n if (persistInUrl) {\n setUrlParam(urlParamName, event.conversationId);\n }\n break;\n }\n\n case \"status\": {\n setMessages((prev) => {\n const last = prev[prev.length - 1];\n if (last?.role === \"assistant\") {\n return [...prev.slice(0, -1), { ...last, status: event.status }];\n }\n return prev;\n });\n break;\n }\n\n case \"message_result\": {\n const msg = event.message;\n const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n\n if (isHistory) {\n const items = messageResultToItems(msg);\n setMessages((prev) => [...prev, ...items]);\n } else if (hasAttachments) {\n // During streaming we already appended the user message locally,\n // so only handle assistant results. Messages without attachments\n // are the user-message echo from the API — skip those.\n const item = makeAssistantItem(msg);\n setMessages((prev) => {\n const last = prev[prev.length - 1];\n if (last?.role === \"assistant\" && last.id === \"\") {\n return [...prev.slice(0, -1), item];\n }\n return [...prev, item];\n });\n }\n break;\n }\n\n case \"query_result\": {\n setMessages((prev) => {\n const updated = [...prev];\n for (let i = updated.length - 1; i >= 0; i--) {\n const msg = updated[i];\n if (\n msg.attachments.some(\n (a) => a.attachmentId === event.attachmentId,\n )\n ) {\n const queryResults = new Map(msg.queryResults);\n queryResults.set(event.attachmentId, event.data);\n updated[i] = { ...msg, queryResults };\n break;\n }\n }\n return updated;\n });\n break;\n }\n\n case \"error\": {\n setError(event.error);\n setStatus(\"error\");\n break;\n }\n }\n },\n [persistInUrl, urlParamName],\n );\n\n const sendMessage = useCallback(\n (content: string) => {\n const trimmed = content.trim();\n if (!trimmed) return;\n\n abortControllerRef.current?.abort();\n setError(null);\n setStatus(\"streaming\");\n\n const userMessage: GenieMessageItem = {\n id: crypto.randomUUID(),\n role: \"user\",\n content: trimmed,\n status: \"COMPLETED\",\n attachments: [],\n queryResults: new Map(),\n };\n\n const assistantPlaceholder: GenieMessageItem = {\n id: \"\",\n role: \"assistant\",\n content: \"\",\n status: \"ASKING_AI\",\n attachments: [],\n queryResults: new Map(),\n };\n\n setMessages((prev) => [...prev, userMessage, assistantPlaceholder]);\n\n const abortController = new AbortController();\n abortControllerRef.current = abortController;\n\n const requestId = crypto.randomUUID();\n\n connectSSE({\n url: `${basePath}/${encodeURIComponent(alias)}/messages?requestId=${encodeURIComponent(requestId)}`,\n payload: {\n content: trimmed,\n conversationId: conversationIdRef.current ?? undefined,\n },\n signal: abortController.signal,\n onMessage: async (message) => {\n try {\n processEvent(JSON.parse(message.data) as GenieStreamEvent, false);\n } catch {\n // Malformed SSE data\n }\n },\n onError: (err) => {\n if (abortController.signal.aborted) return;\n setError(\n err instanceof Error\n ? err.message\n : \"Connection error. Please try again.\",\n );\n setStatus(\"error\");\n setMessages((prev) => {\n const last = prev[prev.length - 1];\n return last?.role === \"assistant\" && last.id === \"\"\n ? prev.slice(0, -1)\n : prev;\n });\n },\n }).then(() => {\n if (!abortController.signal.aborted) {\n setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n }\n });\n },\n [alias, basePath, processEvent],\n );\n\n const loadHistory = useCallback(\n (convId: string) => {\n abortControllerRef.current?.abort();\n setStatus(\"loading-history\");\n setError(null);\n setMessages([]);\n setConversationId(convId);\n\n const abortController = new AbortController();\n abortControllerRef.current = abortController;\n\n const requestId = crypto.randomUUID();\n\n connectSSE({\n url: `${basePath}/${encodeURIComponent(alias)}/conversations/${encodeURIComponent(convId)}?requestId=${encodeURIComponent(requestId)}`,\n signal: abortController.signal,\n onMessage: async (message) => {\n try {\n processEvent(JSON.parse(message.data) as GenieStreamEvent, true);\n } catch {\n // Malformed SSE data\n }\n },\n onError: (err) => {\n if (abortController.signal.aborted) return;\n setError(\n err instanceof Error\n ? err.message\n : \"Failed to load conversation history.\",\n );\n setStatus(\"error\");\n },\n }).then(() => {\n if (!abortController.signal.aborted) {\n setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n }\n });\n },\n [alias, basePath, processEvent],\n );\n\n const reset = useCallback(() => {\n abortControllerRef.current?.abort();\n setMessages([]);\n setConversationId(null);\n setError(null);\n setStatus(\"idle\");\n if (persistInUrl) {\n removeUrlParam(urlParamName);\n }\n }, [persistInUrl, urlParamName]);\n\n useEffect(() => {\n if (!persistInUrl) return;\n const existingId = getUrlParam(urlParamName);\n if (existingId) {\n loadHistory(existingId);\n }\n return () => {\n abortControllerRef.current?.abort();\n };\n }, [persistInUrl, urlParamName, loadHistory]);\n\n return { messages, status, conversationId, error, sendMessage, reset };\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"use-genie-chat.js","names":[],"sources":["../../../src/react/genie/use-genie-chat.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { connectSSE } from \"@/js\";\nimport type {\n GenieChatStatus,\n GenieMessageItem,\n GenieMessageResponse,\n GenieStreamEvent,\n UseGenieChatOptions,\n UseGenieChatReturn,\n} from \"./types\";\n\nfunction getUrlParam(name: string): string | null {\n return new URLSearchParams(window.location.search).get(name);\n}\n\nfunction setUrlParam(name: string, value: string): void {\n const url = new URL(window.location.href);\n url.searchParams.set(name, value);\n window.history.replaceState({}, \"\", url.toString());\n}\n\nfunction removeUrlParam(name: string): void {\n const url = new URL(window.location.href);\n url.searchParams.delete(name);\n window.history.replaceState({}, \"\", url.toString());\n}\n\n/**\n * The Genie API puts the user's question in `message.content` and the\n * actual AI answer in text attachments. Extract the text attachment\n * content so we display the real answer, not the question echo.\n */\nfunction extractAssistantContent(msg: GenieMessageResponse): string {\n const textParts = (msg.attachments ?? [])\n .map((att) => att.text?.content)\n .filter(Boolean) as string[];\n return textParts.length > 0 ? textParts.join(\"\\n\\n\") : msg.content;\n}\n\nfunction makeUserItem(\n msg: GenieMessageResponse,\n idSuffix = \"\",\n): GenieMessageItem {\n return {\n id: `${msg.messageId}${idSuffix}`,\n role: \"user\",\n content: msg.content,\n status: msg.status,\n attachments: [],\n queryResults: new Map(),\n };\n}\n\nfunction makeAssistantItem(msg: GenieMessageResponse): GenieMessageItem {\n return {\n id: msg.messageId,\n role: \"assistant\",\n content: extractAssistantContent(msg),\n status: msg.status,\n attachments: msg.attachments ?? [],\n queryResults: new Map(),\n error: msg.error,\n };\n}\n\n/**\n * The API bundles user question (content) and AI answer (attachments) in one message.\n * Split into separate user + assistant items for display.\n */\nfunction messageResultToItems(msg: GenieMessageResponse): GenieMessageItem[] {\n const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n if (!hasAttachments) return [makeUserItem(msg)];\n return [makeUserItem(msg, \"-user\"), makeAssistantItem(msg)];\n}\n\n/**\n * Streams a conversation page via SSE. Collects message items and query\n * results into a buffer and returns them when the stream completes.\n */\nfunction fetchConversationPage(\n basePath: string,\n alias: string,\n convId: string,\n options: {\n pageToken?: string;\n signal?: AbortSignal;\n onPaginationInfo?: (nextPageToken: string | null) => void;\n onError?: (error: string) => void;\n onConnectionError?: (err: unknown) => void;\n },\n): Promise<GenieMessageItem[]> {\n const params = new URLSearchParams({\n requestId: crypto.randomUUID(),\n });\n if (options.pageToken) {\n params.set(\"pageToken\", options.pageToken);\n }\n\n const items: GenieMessageItem[] = [];\n return connectSSE({\n url: `${basePath}/${encodeURIComponent(alias)}/conversations/${encodeURIComponent(convId)}?${params}`,\n signal: options.signal,\n onMessage: async (message) => {\n try {\n const event = JSON.parse(message.data) as GenieStreamEvent;\n switch (event.type) {\n case \"message_result\":\n items.push(...messageResultToItems(event.message));\n break;\n case \"query_result\":\n for (let i = items.length - 1; i >= 0; i--) {\n const item = items[i];\n if (\n item.attachments.some(\n (a) => a.attachmentId === event.attachmentId,\n )\n ) {\n item.queryResults.set(event.attachmentId, event.data);\n break;\n }\n }\n break;\n case \"history_info\":\n options.onPaginationInfo?.(event.nextPageToken);\n break;\n case \"error\":\n options.onError?.(event.error);\n break;\n }\n } catch {\n // Malformed SSE data\n }\n },\n onError: (err) => options.onConnectionError?.(err),\n }).then(() => items);\n}\n\n/** Minimum time (ms) to hold the loading-older state so scroll inertia settles before prepending messages. */\nconst MIN_PREVIOUS_PAGE_LOAD_MS = 800;\n\n/**\n * Manages the full Genie chat lifecycle:\n * SSE streaming, conversation persistence via URL, and history replay.\n *\n * @example\n * ```tsx\n * const { messages, status, sendMessage, reset } = useGenieChat({ alias: \"demo\" });\n * ```\n */\nexport function useGenieChat(options: UseGenieChatOptions): UseGenieChatReturn {\n const {\n alias,\n basePath = \"/api/genie\",\n persistInUrl = true,\n urlParamName = \"conversationId\",\n } = options;\n\n const [messages, setMessages] = useState<GenieMessageItem[]>([]);\n const [status, setStatus] = useState<GenieChatStatus>(\"idle\");\n const [conversationId, setConversationId] = useState<string | null>(null);\n const [error, setError] = useState<string | null>(null);\n const [nextPageToken, setNextPageToken] = useState<string | null>(null);\n\n const hasPreviousPage = nextPageToken !== null;\n const isFetchingPreviousPage = status === \"loading-older\";\n\n const abortControllerRef = useRef<AbortController | null>(null);\n const paginationAbortRef = useRef<AbortController | null>(null);\n const conversationIdRef = useRef<string | null>(null);\n const nextPageTokenRef = useRef<string | null>(null);\n const isLoadingOlderRef = useRef(false);\n\n useEffect(() => {\n conversationIdRef.current = conversationId;\n nextPageTokenRef.current = nextPageToken;\n }, [conversationId, nextPageToken]);\n\n /** Process SSE events during live message streaming (sendMessage). */\n const processStreamEvent = useCallback(\n (event: GenieStreamEvent) => {\n switch (event.type) {\n case \"message_start\": {\n setConversationId(event.conversationId);\n if (persistInUrl) {\n setUrlParam(urlParamName, event.conversationId);\n }\n break;\n }\n\n case \"status\": {\n setMessages((prev) => {\n const last = prev[prev.length - 1];\n if (last?.role === \"assistant\") {\n return [...prev.slice(0, -1), { ...last, status: event.status }];\n }\n return prev;\n });\n break;\n }\n\n case \"message_result\": {\n const msg = event.message;\n const hasAttachments = (msg.attachments?.length ?? 0) > 0;\n\n if (hasAttachments) {\n // During streaming we already appended the user message locally,\n // so only handle assistant results. Messages without attachments\n // are the user-message echo from the API — skip those.\n const item = makeAssistantItem(msg);\n setMessages((prev) => {\n const last = prev[prev.length - 1];\n if (last?.role === \"assistant\" && last.id === \"\") {\n return [...prev.slice(0, -1), item];\n }\n return [...prev, item];\n });\n }\n break;\n }\n\n case \"query_result\": {\n setMessages((prev) => {\n // Reverse scan — query results typically match recent messages\n for (let i = prev.length - 1; i >= 0; i--) {\n const msg = prev[i];\n if (\n msg.attachments.some(\n (a) => a.attachmentId === event.attachmentId,\n )\n ) {\n const updated = prev.slice();\n updated[i] = {\n ...msg,\n queryResults: new Map(msg.queryResults).set(\n event.attachmentId,\n event.data,\n ),\n };\n return updated;\n }\n }\n return prev;\n });\n break;\n }\n\n case \"error\": {\n setError(event.error);\n setStatus(\"error\");\n break;\n }\n }\n },\n [persistInUrl, urlParamName],\n );\n\n const sendMessage = useCallback(\n (content: string) => {\n const trimmed = content.trim();\n if (!trimmed) return;\n\n abortControllerRef.current?.abort();\n paginationAbortRef.current?.abort();\n setError(null);\n setStatus(\"streaming\");\n\n const userMessage: GenieMessageItem = {\n id: crypto.randomUUID(),\n role: \"user\",\n content: trimmed,\n status: \"COMPLETED\",\n attachments: [],\n queryResults: new Map(),\n };\n\n const assistantPlaceholder: GenieMessageItem = {\n id: \"\",\n role: \"assistant\",\n content: \"\",\n status: \"ASKING_AI\",\n attachments: [],\n queryResults: new Map(),\n };\n\n setMessages((prev) => [...prev, userMessage, assistantPlaceholder]);\n\n const abortController = new AbortController();\n abortControllerRef.current = abortController;\n\n const requestId = crypto.randomUUID();\n\n connectSSE({\n url: `${basePath}/${encodeURIComponent(alias)}/messages?requestId=${encodeURIComponent(requestId)}`,\n payload: {\n content: trimmed,\n conversationId: conversationIdRef.current ?? undefined,\n },\n signal: abortController.signal,\n onMessage: async (message) => {\n try {\n processStreamEvent(JSON.parse(message.data) as GenieStreamEvent);\n } catch {\n // Malformed SSE data\n }\n },\n onError: (err) => {\n if (abortController.signal.aborted) return;\n setError(\n err instanceof Error\n ? err.message\n : \"Connection error. Please try again.\",\n );\n setStatus(\"error\");\n setMessages((prev) => {\n const last = prev[prev.length - 1];\n return last?.role === \"assistant\" && last.id === \"\"\n ? prev.slice(0, -1)\n : prev;\n });\n },\n }).then(() => {\n if (!abortController.signal.aborted) {\n setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n }\n });\n },\n [alias, basePath, processStreamEvent],\n );\n\n /** Creates an AbortController, stores it in the given ref, and fetches a conversation page. */\n const fetchPage = useCallback(\n (\n controllerRef: { current: AbortController | null },\n convId: string,\n options?: { pageToken?: string; errorMessage?: string },\n ) => {\n controllerRef.current?.abort();\n const abortController = new AbortController();\n controllerRef.current = abortController;\n\n const promise = fetchConversationPage(basePath, alias, convId, {\n pageToken: options?.pageToken,\n signal: abortController.signal,\n onPaginationInfo: setNextPageToken,\n onError: (msg) => {\n setError(msg);\n setStatus(\"error\");\n },\n onConnectionError: (err) => {\n if (abortController.signal.aborted) return;\n setError(\n err instanceof Error\n ? err.message\n : (options?.errorMessage ?? \"Failed to load messages.\"),\n );\n setStatus(\"error\");\n },\n });\n\n return { promise, abortController };\n },\n [alias, basePath],\n );\n\n const loadHistory = useCallback(\n (convId: string) => {\n paginationAbortRef.current?.abort();\n setStatus(\"loading-history\");\n setError(null);\n setMessages([]);\n setConversationId(convId);\n\n const { promise, abortController } = fetchPage(\n abortControllerRef,\n convId,\n { errorMessage: \"Failed to load conversation history.\" },\n );\n promise.then((items) => {\n if (!abortController.signal.aborted) {\n setMessages(items);\n setStatus((prev) => (prev === \"error\" ? \"error\" : \"idle\"));\n }\n });\n },\n [fetchPage],\n );\n\n const fetchPreviousPage = useCallback(() => {\n if (\n !nextPageTokenRef.current ||\n !conversationIdRef.current ||\n isLoadingOlderRef.current\n )\n return;\n\n isLoadingOlderRef.current = true;\n setStatus(\"loading-older\");\n setError(null);\n\n const startTime = Date.now();\n const { promise, abortController } = fetchPage(\n paginationAbortRef,\n conversationIdRef.current,\n {\n pageToken: nextPageTokenRef.current,\n errorMessage: \"Failed to load older messages.\",\n },\n );\n promise\n .then(async (items) => {\n if (abortController.signal.aborted) return;\n const elapsed = Date.now() - startTime;\n if (elapsed < MIN_PREVIOUS_PAGE_LOAD_MS) {\n await new Promise((r) =>\n setTimeout(r, MIN_PREVIOUS_PAGE_LOAD_MS - elapsed),\n );\n }\n if (abortController.signal.aborted) return;\n if (items.length > 0) {\n setMessages((prev) => [...items, ...prev]);\n }\n setStatus((current) =>\n current === \"loading-older\" ? \"idle\" : current,\n );\n })\n .finally(() => {\n isLoadingOlderRef.current = false;\n });\n }, [fetchPage]);\n\n const reset = useCallback(() => {\n abortControllerRef.current?.abort();\n paginationAbortRef.current?.abort();\n setMessages([]);\n setConversationId(null);\n setError(null);\n setStatus(\"idle\");\n setNextPageToken(null);\n if (persistInUrl) {\n removeUrlParam(urlParamName);\n }\n }, [persistInUrl, urlParamName]);\n\n useEffect(() => {\n if (!persistInUrl) return;\n const existingId = getUrlParam(urlParamName);\n if (existingId) {\n loadHistory(existingId);\n }\n return () => {\n abortControllerRef.current?.abort();\n paginationAbortRef.current?.abort();\n };\n }, [persistInUrl, urlParamName, loadHistory]);\n\n return {\n messages,\n status,\n conversationId,\n error,\n sendMessage,\n reset,\n hasPreviousPage,\n isFetchingPreviousPage,\n fetchPreviousPage,\n };\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import { UseChartDataOptions, UseChartDataResult, useChartData } from "./use-chart-data.js";
|
|
2
|
+
import { AnalyticsFormat, InferResultByFormat, InferRowType, PluginRegistry, QueryRegistry, TypedArrowTable, UseAnalyticsQueryOptions, UseAnalyticsQueryResult } from "./types.js";
|
|
3
|
+
import { useAnalyticsQuery } from "./use-analytics-query.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/react/hooks/types.ts"],"
|
|
1
|
+
{"version":3,"file":"types.d.ts","names":[],"sources":["../../../src/react/hooks/types.ts"],"mappings":";;;;KAOY,eAAA;AAAZ;;;;;AAYA;;;;;AAZA,UAYiB,eAAA,cACF,MAAA,oBAA0B,MAAA,2BAC/B,KAAA;EAAA;;;;EAAA,SAKC,SAAA,GAAY,IAAA;AAAA;;UAQN,wBAAA,WAAmC,eAAA;EAR7B;EAUrB,MAAA,GAAS,CAAA;EAVgB;EAazB,iBAAA;EALuC;EAQvC,SAAA;AAAA;;UAIe,uBAAA;EAVf;EAYA,IAAA,EAAM,CAAA;EATN;EAWA,OAAA;EARS;EAUT,KAAA;AAAA;;;;;;;;;;;AAqBF;;;;;;;;UAAiB,aAAA;EAAA,CACd,GAAA;IACC,IAAA;IACA,UAAA,EAAY,MAAA;IACZ,MAAA;EAAA;AAAA;;KAKQ,iBAAA,0BACE,CAAA,mBAAoB,CAAA,WAAY,CAAA,GAAI,CAAA,CAAE,CAAA;;KAIxC,QAAA,GAAW,iBAAA,CAAkB,aAAA,2BAErC,iBAAA,CAAkB,aAAA;;;;;KAMV,WAAA,SAAoB,CAAA,SAAU,iBAAA,CAAkB,aAAA,IACxD,aAAA,CAAc,CAAA;EAAa,MAAA;AAAA,IACzB,CAAA,GACA,CAAA,GACF,CAAA;;;AAZJ;;KAkBY,YAAA,MAAkB,CAAA,SAAU,iBAAA,CAAkB,aAAA,IACtD,aAAA,CAAc,CAAA;EAAa,MAAA,EAAQ,KAAA;AAAA,IACjC,CAAA,SAAU,MAAA,oBACR,CAAA,GACA,MAAA,oBACF,MAAA,oBACF,MAAA;;;;;;KAOQ,mBAAA,iBAGA,eAAA,IACR,CAAA,mBAAoB,eAAA,CAAgB,YAAA,CAAa,CAAA,KAAM,WAAA,CAAY,CAAA,EAAG,CAAA;;;;KAK9D,WAAA,MAAiB,CAAA,SAAU,iBAAA,CAAkB,aAAA,IACrD,aAAA,CAAc,CAAA;EAAa,UAAA;AAAA,IACzB,CAAA,GACA,MAAA,oBACF,MAAA;AAAA,UAEa,cAAA;EAAA,CACd,GAAA,WAAc,MAAA;AAAA"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { AnalyticsFormat, InferParams, InferResultByFormat, QueryKey, UseAnalyticsQueryOptions, UseAnalyticsQueryResult } from "./types.js";
|
|
2
2
|
|
|
3
3
|
//#region src/react/hooks/use-analytics-query.d.ts
|
|
4
|
-
|
|
5
4
|
/**
|
|
6
5
|
* Subscribe to an analytics query over SSE and returns its latest result.
|
|
7
6
|
* Integration hook between client and analytics plugin.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-analytics-query.d.ts","names":[],"sources":["../../../src/react/hooks/use-analytics-query.ts"],"
|
|
1
|
+
{"version":3,"file":"use-analytics-query.d.ts","names":[],"sources":["../../../src/react/hooks/use-analytics-query.ts"],"mappings":";;;;;AAqDA;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAAgB,iBAAA,wBAEJ,QAAA,GAAW,QAAA,YACX,eAAA,UAAA,CAEV,QAAA,EAAU,CAAA,EACV,UAAA,GAAa,WAAA,CAAY,CAAA,UACzB,OAAA,GAAS,wBAAA,CAAyB,CAAA,IACjC,uBAAA,CAAwB,mBAAA,CAAoB,CAAA,EAAG,CAAA,EAAG,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-chart-data.d.ts","names":[],"sources":["../../../src/react/hooks/use-chart-data.ts"],"
|
|
1
|
+
{"version":3,"file":"use-chart-data.d.ts","names":[],"sources":["../../../src/react/hooks/use-chart-data.ts"],"mappings":";;;UAYiB,mBAAA;;EAEf,QAAA;EAFkC;EAIlC,UAAA,GAAa,MAAA;EAAA;;;;;;;EAQb,MAAA,GAAS,UAAA;EARI;EAUb,WAAA,OAAkB,IAAA,EAAM,CAAA,KAAM,CAAA;AAAA;AAAA,UAGf,kBAAA;EAHA;EAKf,IAAA,EAAM,SAAA;EALY;EAOlB,OAAA;EAP+B;EAS/B,OAAA;EANe;EAQf,KAAA;;EAEA,OAAA;AAAA;;;;;;;;AAgEF;;;;;;;;;;;;iBAAgB,YAAA,CAAa,OAAA,EAAS,mBAAA,GAAsB,kBAAA"}
|
package/dist/react/index.d.ts
CHANGED
|
@@ -17,17 +17,21 @@ import { CHART_COLOR_VARS, CHART_COLOR_VARS_CATEGORICAL, CHART_COLOR_VARS_DIVERG
|
|
|
17
17
|
import { useAllThemeColors, useThemeColors } from "./charts/theme.js";
|
|
18
18
|
import { createTimeSeriesData, formatLabel, sortTimeSeriesAscending, toChartArray, toChartValue, truncateLabel } from "./charts/utils.js";
|
|
19
19
|
import { CartesianContext, HeatmapContext, OptionBuilderContext, buildCartesianOption, buildHeatmapOption, buildHorizontalBarOption, buildPieOption, buildRadarOption } from "./charts/options.js";
|
|
20
|
+
import "./charts/index.js";
|
|
20
21
|
import { GenieChatProps, GenieChatStatus, GenieMessageItem, UseGenieChatOptions, UseGenieChatReturn } from "./genie/types.js";
|
|
21
22
|
import { GenieChat } from "./genie/genie-chat.js";
|
|
22
23
|
import { GenieChatInput } from "./genie/genie-chat-input.js";
|
|
23
24
|
import { GenieChatMessage } from "./genie/genie-chat-message.js";
|
|
24
25
|
import { GenieChatMessageList } from "./genie/genie-chat-message-list.js";
|
|
25
26
|
import { useGenieChat } from "./genie/use-genie-chat.js";
|
|
27
|
+
import "./genie/index.js";
|
|
26
28
|
import { AnalyticsFormat, InferResultByFormat, InferRowType, PluginRegistry, QueryRegistry, TypedArrowTable, UseAnalyticsQueryOptions, UseAnalyticsQueryResult } from "./hooks/types.js";
|
|
27
29
|
import { useAnalyticsQuery } from "./hooks/use-analytics-query.js";
|
|
30
|
+
import "./hooks/index.js";
|
|
28
31
|
import { cn } from "./lib/utils.js";
|
|
29
32
|
import { PortalContainerContext, PortalContainerProvider, usePortalContainer, useResolvedPortalContainer } from "./portal-container-context.js";
|
|
30
33
|
import { DataTable } from "./table/data-table.js";
|
|
34
|
+
import "./table/index.js";
|
|
31
35
|
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "./ui/accordion.js";
|
|
32
36
|
import { Alert, AlertDescription, AlertTitle } from "./ui/alert.js";
|
|
33
37
|
import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger } from "./ui/alert-dialog.js";
|
|
@@ -81,4 +85,5 @@ import { Tabs, TabsContent, TabsList, TabsTrigger } from "./ui/tabs.js";
|
|
|
81
85
|
import { Textarea } from "./ui/textarea.js";
|
|
82
86
|
import { Toggle, toggleVariants } from "./ui/toggle.js";
|
|
83
87
|
import { ToggleGroup, ToggleGroupItem } from "./ui/toggle-group.js";
|
|
88
|
+
import "./ui/index.js";
|
|
84
89
|
export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AnalyticsFormat, AreaChart, AreaChartProps, AreaChartSpecificProps, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, BarChart, BarChartProps, BarChartSpecificProps, BaseChart, BaseChartProps, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, CHART_COLOR_VARS, CHART_COLOR_VARS_CATEGORICAL, CHART_COLOR_VARS_DIVERGING, CHART_COLOR_VARS_SEQUENTIAL, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, CartesianContext, ChartBaseProps, ChartColorPalette, ChartConfig, ChartContainer, ChartData, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, ChartType, ChartWrapper, ChartWrapperProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DATE_FIELD_PATTERNS, DataFormat, DataProps, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, DonutChartProps, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, FALLBACK_COLORS, FALLBACK_COLORS_CATEGORICAL, FALLBACK_COLORS_DIVERGING, FALLBACK_COLORS_SEQUENTIAL, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, GenieAttachmentResponse, GenieChat, GenieChatInput, GenieChatMessage, GenieChatMessageList, GenieChatProps, GenieChatStatus, GenieMessageItem, GenieMessageResponse, GenieStreamEvent, HeatmapChart, HeatmapChartProps, HeatmapChartSpecificProps, HeatmapContext, HoverCard, HoverCardContent, HoverCardTrigger, InferResultByFormat, InferRowType, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, LineChart, LineChartProps, LineChartSpecificProps, METADATA_DATE_PATTERNS, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NAME_FIELD_PATTERNS, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, NormalizedChartData, NormalizedChartDataBase, NormalizedHeatmapData, OptionBuilderContext, Orientation, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PieChart, PieChartProps, PieChartSpecificProps, PluginRegistry, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalContainerContext, PortalContainerProvider, Progress, QueryProps, QueryRegistry, RadarChart, RadarChartProps, RadarChartSpecificProps, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScatterChart, ScatterChartProps, ScatterChartSpecificProps, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TypedArrowTable, UnifiedChartProps, UseAnalyticsQueryOptions, UseAnalyticsQueryResult, UseChartDataOptions, UseChartDataResult, UseGenieChatOptions, UseGenieChatReturn, badgeVariants, buildCartesianOption, buildHeatmapOption, buildHorizontalBarOption, buildPieOption, buildRadarOption, buttonGroupVariants, buttonVariants, cn, createChart, createTimeSeriesData, formatLabel, isArrowTable, isDataProps, isQueryProps, navigationMenuTriggerStyle, normalizeChartData, normalizeHeatmapData, sortTimeSeriesAscending, toChartArray, toChartValue, toggleVariants, truncateLabel, useAllThemeColors, useAnalyticsQuery, useChartData, useFormField, useGenieChat, usePortalContainer, useResolvedPortalContainer, useSidebar, useThemeColors };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","names":[],"sources":["../../../src/react/lib/utils.ts"],"
|
|
1
|
+
{"version":3,"file":"utils.d.ts","names":[],"sources":["../../../src/react/lib/utils.ts"],"mappings":";;;iBAGgB,EAAA,CAAA,GAAM,MAAA,EAAQ,UAAA"}
|
|
@@ -2,7 +2,6 @@ import React from "react";
|
|
|
2
2
|
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/react/portal-container-context.d.ts
|
|
5
|
-
|
|
6
5
|
/**
|
|
7
6
|
* Context for providing a custom portal container.
|
|
8
7
|
* This is used when rendering components in isolated contexts like iframes or shadow DOM.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"portal-container-context.d.ts","names":[],"sources":["../../src/react/portal-container-context.tsx"],"
|
|
1
|
+
{"version":3,"file":"portal-container-context.d.ts","names":[],"sources":["../../src/react/portal-container-context.tsx"],"mappings":";;;;;;;AAQA;;cAAa,sBAAA,EAAsB,KAAA,CAAA,OAAA,CAAA,WAAA;AAAA,iBAEnB,kBAAA,CAAA,GAAkB,WAAA;;;;;;AAAlC;;;;;AA4BA;;;;;;;;;;;;;;iBAAgB,0BAAA,CACd,aAAA,GAAgB,OAAA,GAAU,gBAAA,GAAmB,WAAA,sBAC5C,OAAA,GAAU,gBAAA,GAAmB,WAAA;AAAA,UAKtB,4BAAA;EACR,SAAA,EAAW,WAAA;EACX,QAAA,EAAU,KAAA,CAAM,SAAA;AAAA;AAAA,iBAGF,uBAAA,CAAA;EACd,SAAA;EACA;AAAA,GACC,4BAAA,GAA4B,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"portal-container-context.js","names":[],"sources":["../../src/react/portal-container-context.tsx"],"sourcesContent":["import type React from \"react\";\nimport { createContext, useContext } from \"react\";\n\n/**\n * Context for providing a custom portal container.\n * This is used when rendering components in isolated contexts like iframes or shadow DOM.\n * Portal components (AlertDialog, ContextMenu, etc.) will use this container instead of document.body\n */\nexport const PortalContainerContext = createContext<HTMLElement | null>(null);\n\nexport function usePortalContainer() {\n return useContext(PortalContainerContext);\n}\n\n/**\n * Resolves the final portal container from explicit prop or context.\n *\n * This hook enables Portal components to work seamlessly in isolated rendering contexts\n * (like iframes, shadow DOM, or isolated component previews) by accepting a container\n * from either:\n * 1. An explicit `container` prop (highest priority)\n * 2. A `PortalContainerProvider` context (fallback)\n * 3. undefined (lets Radix UI use document.body as default)\n *\n * @param containerProp - Optional explicit container element from props\n * @returns The resolved container element to use for portal rendering\n *\n * @example\n * ```tsx\n * function MyPortal({ container, ...props }) {\n * return (\n * <RadixPortal container={useResolvedPortalContainer(container)} {...props}>\n * <MyContent />\n * </RadixPortal>\n * );\n * }\n * ```\n */\nexport function useResolvedPortalContainer(\n containerProp?: Element | DocumentFragment | HTMLElement | null | undefined,\n): Element | DocumentFragment | HTMLElement | null | undefined {\n const containerFromContext = usePortalContainer();\n return containerProp ?? containerFromContext ?? undefined;\n}\n\ninterface PortalContainerProviderProps {\n container: HTMLElement | null;\n children: React.ReactNode;\n}\n\nexport function PortalContainerProvider({\n container,\n children,\n}: PortalContainerProviderProps) {\n return (\n <PortalContainerContext.Provider value={container}>\n {children}\n </PortalContainerContext.Provider>\n );\n}\n"],"mappings":";;;;;;;;;AAQA,MAAa,yBAAyB,cAAkC,KAAK;AAE7E,SAAgB,qBAAqB;AACnC,QAAO,WAAW,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;AA2B3C,SAAgB,2BACd,eAC6D;CAC7D,MAAM,uBAAuB,oBAAoB;AACjD,QAAO,iBAAiB,wBAAwB;;AAQlD,SAAgB,wBAAwB,EACtC,WACA,YAC+B;AAC/B,QACE,oBAAC,uBAAuB
|
|
1
|
+
{"version":3,"file":"portal-container-context.js","names":[],"sources":["../../src/react/portal-container-context.tsx"],"sourcesContent":["import type React from \"react\";\nimport { createContext, useContext } from \"react\";\n\n/**\n * Context for providing a custom portal container.\n * This is used when rendering components in isolated contexts like iframes or shadow DOM.\n * Portal components (AlertDialog, ContextMenu, etc.) will use this container instead of document.body\n */\nexport const PortalContainerContext = createContext<HTMLElement | null>(null);\n\nexport function usePortalContainer() {\n return useContext(PortalContainerContext);\n}\n\n/**\n * Resolves the final portal container from explicit prop or context.\n *\n * This hook enables Portal components to work seamlessly in isolated rendering contexts\n * (like iframes, shadow DOM, or isolated component previews) by accepting a container\n * from either:\n * 1. An explicit `container` prop (highest priority)\n * 2. A `PortalContainerProvider` context (fallback)\n * 3. undefined (lets Radix UI use document.body as default)\n *\n * @param containerProp - Optional explicit container element from props\n * @returns The resolved container element to use for portal rendering\n *\n * @example\n * ```tsx\n * function MyPortal({ container, ...props }) {\n * return (\n * <RadixPortal container={useResolvedPortalContainer(container)} {...props}>\n * <MyContent />\n * </RadixPortal>\n * );\n * }\n * ```\n */\nexport function useResolvedPortalContainer(\n containerProp?: Element | DocumentFragment | HTMLElement | null | undefined,\n): Element | DocumentFragment | HTMLElement | null | undefined {\n const containerFromContext = usePortalContainer();\n return containerProp ?? containerFromContext ?? undefined;\n}\n\ninterface PortalContainerProviderProps {\n container: HTMLElement | null;\n children: React.ReactNode;\n}\n\nexport function PortalContainerProvider({\n container,\n children,\n}: PortalContainerProviderProps) {\n return (\n <PortalContainerContext.Provider value={container}>\n {children}\n </PortalContainerContext.Provider>\n );\n}\n"],"mappings":";;;;;;;;;AAQA,MAAa,yBAAyB,cAAkC,KAAK;AAE7E,SAAgB,qBAAqB;AACnC,QAAO,WAAW,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;AA2B3C,SAAgB,2BACd,eAC6D;CAC7D,MAAM,uBAAuB,oBAAoB;AACjD,QAAO,iBAAiB,wBAAwB;;AAQlD,SAAgB,wBAAwB,EACtC,WACA,YAC+B;AAC/B,QACE,oBAAC,uBAAuB;EAAS,OAAO;EACrC;GAC+B"}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { DataTableProps } from "./types.js";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/react/table/data-table.d.ts
|
|
5
|
-
|
|
6
5
|
/**
|
|
7
6
|
* Production-ready data table with automatic data fetching and state management
|
|
8
7
|
*
|
|
@@ -44,7 +43,7 @@ import * as react_jsx_runtime285 from "react/jsx-runtime";
|
|
|
44
43
|
* )}
|
|
45
44
|
* </DataTable>
|
|
46
45
|
*/
|
|
47
|
-
declare function DataTable(props: DataTableProps):
|
|
46
|
+
declare function DataTable(props: DataTableProps): react_jsx_runtime0.JSX.Element;
|
|
48
47
|
//#endregion
|
|
49
48
|
export { DataTable };
|
|
50
49
|
//# sourceMappingURL=data-table.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-table.d.ts","names":[],"sources":["../../../src/react/table/data-table.tsx"],"
|
|
1
|
+
{"version":3,"file":"data-table.d.ts","names":[],"sources":["../../../src/react/table/data-table.tsx"],"mappings":";;;;;;;AAsEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAAgB,SAAA,CAAU,KAAA,EAAO,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-table.js","names":["Table"],"sources":["../../../src/react/table/data-table.tsx"],"sourcesContent":["import { flexRender } from \"@tanstack/react-table\";\nimport { ChevronDown } from \"lucide-react\";\nimport { formatFieldLabel } from \"../lib/format\";\nimport { Button } from \"../ui/button\";\nimport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuTrigger,\n} from \"../ui/dropdown-menu\";\nimport { Input } from \"../ui/input\";\nimport {\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n} from \"../ui/select\";\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from \"../ui/table\";\nimport { TableWrapper } from \"./table-wrapper\";\nimport type { DataTableLabels, DataTableProps } from \"./types\";\n\n/**\n * Production-ready data table with automatic data fetching and state management\n *\n * Features:\n * - Automatic column generation from data structure\n * - Integrated with useAnalyticsQuery for data fetching\n * - Built-in loading, error, and empty states\n * - Dynamic filtering, sorting and pagination\n * - Column visibility controls\n * - Responsive design\n * - Supports opinionated mode (auto columns) and full-control mode (`children(table)`)\n *\n * @param props - Props for the DataTable component\n * @param props.queryKey - The query key to fetch the data\n * @param props.parameters - The parameters to pass to the query. Required - use `{}` if none.\n * @param props.filterColumn - The column to filter by\n * @param props.filterPlaceholder - The placeholder for the filter input\n * @param props.children - Optional children for full control mode\n * @returns - The rendered data table component\n *\n * @example\n * // Opinionated mode\n * <DataTable\n * queryKey=\"users-list\"\n * parameters={{ status: \"active\" }}\n * filterColumn=\"email\"\n * filterPlaceholder=\"Filter by email...\"\n * />\n * @example\n * // full control mode\n * <DataTable queryKey=\"users-list\" parameters={{ status: \"active\" }}>\n * {(table) => (\n * <div>\n * <h2>Custom Table UI</h2>\n * {table.getRowModel().rows.map(row => (\n * <div key={row.id}>{row.original.name}</div>\n * ))}\n * </div>\n * )}\n * </DataTable>\n */\nexport function DataTable(props: DataTableProps) {\n const {\n parameters,\n queryKey,\n filterColumn,\n filterPlaceholder,\n transform,\n labels,\n ariaLabel,\n testId,\n className,\n enableRowSelection,\n onRowSelectionChange,\n children,\n pageSize = 10,\n pageSizeOptions = [10, 25, 50, 100],\n } = props;\n\n const defaultLabels: Required<DataTableLabels> = {\n columnsButton: \"Columns\",\n noResults: \"No results found.\",\n rowsFound: `\\${count} row(s) found`,\n previousButton: \"Previous\",\n nextButton: \"Next\",\n rowsPerPage: \"Rows per page\",\n showing: `Showing \\${from} to \\${to} of \\${total}`,\n };\n\n const finalLabels = { ...defaultLabels, ...labels };\n\n return (\n <TableWrapper\n queryKey={queryKey}\n parameters={parameters}\n ariaLabel={ariaLabel}\n testId={testId}\n className={className}\n transformer={transform}\n enableRowSelection={enableRowSelection}\n onRowSelectionChange={onRowSelectionChange}\n pageSize={pageSize}\n >\n {(table) => {\n if (children) {\n return children(table);\n }\n\n const data = table.options.data;\n\n const defaultFilterColumn =\n filterColumn ||\n (data && data.length > 0\n ? Object.keys(data[0] as Record<string, any>).find(\n (key) =>\n typeof (data[0] as Record<string, any>)[key] === \"string\",\n )\n : null);\n\n const totalRows = table.getFilteredRowModel().rows.length;\n const currentPage = table.getState().pagination.pageIndex + 1;\n const currentPageSize = table.getState().pagination.pageSize;\n const fromRow =\n totalRows === 0 ? 0 : (currentPage - 1) * currentPageSize + 1;\n const toRow = Math.min(currentPage * currentPageSize, totalRows);\n\n return (\n <div className=\"w-full\">\n <div className=\"flex items-center py-4 gap-2\">\n {defaultFilterColumn && (\n <Input\n placeholder={\n filterPlaceholder ||\n `Filter by ${formatFieldLabel(defaultFilterColumn)}...`\n }\n value={\n (table\n .getColumn(defaultFilterColumn)\n ?.getFilterValue() as string) ?? \"\"\n }\n onChange={(event) =>\n table\n .getColumn(defaultFilterColumn)\n ?.setFilterValue(event.target.value)\n }\n className=\"max-w-sm\"\n />\n )}\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button variant=\"outline\" className=\"ml-auto\">\n {finalLabels.columnsButton}{\" \"}\n <ChevronDown className=\"ml-2 h-4 w-4\" />\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\">\n {table\n .getAllColumns()\n .filter((column) => column.getCanHide())\n .map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.id}\n className=\"capitalize\"\n checked={column.getIsVisible()}\n onCheckedChange={(value) =>\n column.toggleVisibility(!!value)\n }\n >\n {formatFieldLabel(column.id)}\n </DropdownMenuCheckboxItem>\n );\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n <div className=\"overflow-hidden rounded-md border border-border\">\n <div className=\"max-h-[600px] overflow-y-auto\">\n <Table>\n <TableHeader className=\"sticky top-0 bg-background z-10\">\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n const isSelectColumn = header.column.id === \"select\";\n return (\n <TableHead\n key={header.id}\n style={{\n width: header.getSize(),\n position: \"relative\",\n }}\n className={\n isSelectColumn ? \"w-[40px] p-0\" : undefined\n }\n >\n {header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )}\n </TableHead>\n );\n })}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {table.getRowModel().rows?.length ? (\n table.getRowModel().rows.map((row) => (\n <TableRow\n key={row.id}\n data-state={row.getIsSelected() && \"selected\"}\n >\n {row.getVisibleCells().map((cell) => {\n const isSelectColumn = cell.column.id === \"select\";\n return (\n <TableCell\n key={cell.id}\n style={{\n width: cell.column.getSize(),\n }}\n className={\n isSelectColumn ? \"w-[40px] p-0\" : undefined\n }\n >\n {flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )}\n </TableCell>\n );\n })}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={table.getAllColumns().length}\n className=\"h-24 text-center\"\n >\n {finalLabels.noResults}\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n </div>\n </div>\n <div className=\"flex items-center justify-between py-4\">\n <div className=\"flex items-center gap-6\">\n <div className=\"text-foreground text-sm\">\n {totalRows > 0\n ? finalLabels.showing\n .replace(`\\${from}`, fromRow.toString())\n .replace(`\\${to}`, toRow.toString())\n .replace(`\\${total}`, totalRows.toString())\n : finalLabels.noResults}\n </div>\n <div className=\"flex items-center gap-2\">\n <span className=\"text-sm text-foreground\">\n {finalLabels.rowsPerPage}\n </span>\n <Select\n value={currentPageSize.toString()}\n onValueChange={(value) => {\n table.setPageSize(Number(value));\n }}\n >\n <SelectTrigger className=\"w-[70px]\">\n <SelectValue />\n </SelectTrigger>\n <SelectContent>\n {pageSizeOptions.map((size) => (\n <SelectItem key={size} value={size.toString()}>\n {size}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n </div>\n </div>\n <div className=\"space-x-2\">\n <Button\n variant=\"outline\"\n size=\"sm\"\n onClick={() => table.previousPage()}\n disabled={!table.getCanPreviousPage()}\n >\n {finalLabels.previousButton}\n </Button>\n <Button\n variant=\"outline\"\n size=\"sm\"\n onClick={() => table.nextPage()}\n disabled={!table.getCanNextPage()}\n >\n {finalLabels.nextButton}\n </Button>\n </div>\n </div>\n </div>\n );\n }}\n </TableWrapper>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"data-table.js","names":["Table"],"sources":["../../../src/react/table/data-table.tsx"],"sourcesContent":["import { flexRender } from \"@tanstack/react-table\";\nimport { ChevronDown } from \"lucide-react\";\nimport { formatFieldLabel } from \"../lib/format\";\nimport { Button } from \"../ui/button\";\nimport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuTrigger,\n} from \"../ui/dropdown-menu\";\nimport { Input } from \"../ui/input\";\nimport {\n Select,\n SelectContent,\n SelectItem,\n SelectTrigger,\n SelectValue,\n} from \"../ui/select\";\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from \"../ui/table\";\nimport { TableWrapper } from \"./table-wrapper\";\nimport type { DataTableLabels, DataTableProps } from \"./types\";\n\n/**\n * Production-ready data table with automatic data fetching and state management\n *\n * Features:\n * - Automatic column generation from data structure\n * - Integrated with useAnalyticsQuery for data fetching\n * - Built-in loading, error, and empty states\n * - Dynamic filtering, sorting and pagination\n * - Column visibility controls\n * - Responsive design\n * - Supports opinionated mode (auto columns) and full-control mode (`children(table)`)\n *\n * @param props - Props for the DataTable component\n * @param props.queryKey - The query key to fetch the data\n * @param props.parameters - The parameters to pass to the query. Required - use `{}` if none.\n * @param props.filterColumn - The column to filter by\n * @param props.filterPlaceholder - The placeholder for the filter input\n * @param props.children - Optional children for full control mode\n * @returns - The rendered data table component\n *\n * @example\n * // Opinionated mode\n * <DataTable\n * queryKey=\"users-list\"\n * parameters={{ status: \"active\" }}\n * filterColumn=\"email\"\n * filterPlaceholder=\"Filter by email...\"\n * />\n * @example\n * // full control mode\n * <DataTable queryKey=\"users-list\" parameters={{ status: \"active\" }}>\n * {(table) => (\n * <div>\n * <h2>Custom Table UI</h2>\n * {table.getRowModel().rows.map(row => (\n * <div key={row.id}>{row.original.name}</div>\n * ))}\n * </div>\n * )}\n * </DataTable>\n */\nexport function DataTable(props: DataTableProps) {\n const {\n parameters,\n queryKey,\n filterColumn,\n filterPlaceholder,\n transform,\n labels,\n ariaLabel,\n testId,\n className,\n enableRowSelection,\n onRowSelectionChange,\n children,\n pageSize = 10,\n pageSizeOptions = [10, 25, 50, 100],\n } = props;\n\n const defaultLabels: Required<DataTableLabels> = {\n columnsButton: \"Columns\",\n noResults: \"No results found.\",\n rowsFound: `\\${count} row(s) found`,\n previousButton: \"Previous\",\n nextButton: \"Next\",\n rowsPerPage: \"Rows per page\",\n showing: `Showing \\${from} to \\${to} of \\${total}`,\n };\n\n const finalLabels = { ...defaultLabels, ...labels };\n\n return (\n <TableWrapper\n queryKey={queryKey}\n parameters={parameters}\n ariaLabel={ariaLabel}\n testId={testId}\n className={className}\n transformer={transform}\n enableRowSelection={enableRowSelection}\n onRowSelectionChange={onRowSelectionChange}\n pageSize={pageSize}\n >\n {(table) => {\n if (children) {\n return children(table);\n }\n\n const data = table.options.data;\n\n const defaultFilterColumn =\n filterColumn ||\n (data && data.length > 0\n ? Object.keys(data[0] as Record<string, any>).find(\n (key) =>\n typeof (data[0] as Record<string, any>)[key] === \"string\",\n )\n : null);\n\n const totalRows = table.getFilteredRowModel().rows.length;\n const currentPage = table.getState().pagination.pageIndex + 1;\n const currentPageSize = table.getState().pagination.pageSize;\n const fromRow =\n totalRows === 0 ? 0 : (currentPage - 1) * currentPageSize + 1;\n const toRow = Math.min(currentPage * currentPageSize, totalRows);\n\n return (\n <div className=\"w-full\">\n <div className=\"flex items-center py-4 gap-2\">\n {defaultFilterColumn && (\n <Input\n placeholder={\n filterPlaceholder ||\n `Filter by ${formatFieldLabel(defaultFilterColumn)}...`\n }\n value={\n (table\n .getColumn(defaultFilterColumn)\n ?.getFilterValue() as string) ?? \"\"\n }\n onChange={(event) =>\n table\n .getColumn(defaultFilterColumn)\n ?.setFilterValue(event.target.value)\n }\n className=\"max-w-sm\"\n />\n )}\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button variant=\"outline\" className=\"ml-auto\">\n {finalLabels.columnsButton}{\" \"}\n <ChevronDown className=\"ml-2 h-4 w-4\" />\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\">\n {table\n .getAllColumns()\n .filter((column) => column.getCanHide())\n .map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.id}\n className=\"capitalize\"\n checked={column.getIsVisible()}\n onCheckedChange={(value) =>\n column.toggleVisibility(!!value)\n }\n >\n {formatFieldLabel(column.id)}\n </DropdownMenuCheckboxItem>\n );\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n <div className=\"overflow-hidden rounded-md border border-border\">\n <div className=\"max-h-[600px] overflow-y-auto\">\n <Table>\n <TableHeader className=\"sticky top-0 bg-background z-10\">\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n const isSelectColumn = header.column.id === \"select\";\n return (\n <TableHead\n key={header.id}\n style={{\n width: header.getSize(),\n position: \"relative\",\n }}\n className={\n isSelectColumn ? \"w-[40px] p-0\" : undefined\n }\n >\n {header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext(),\n )}\n </TableHead>\n );\n })}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {table.getRowModel().rows?.length ? (\n table.getRowModel().rows.map((row) => (\n <TableRow\n key={row.id}\n data-state={row.getIsSelected() && \"selected\"}\n >\n {row.getVisibleCells().map((cell) => {\n const isSelectColumn = cell.column.id === \"select\";\n return (\n <TableCell\n key={cell.id}\n style={{\n width: cell.column.getSize(),\n }}\n className={\n isSelectColumn ? \"w-[40px] p-0\" : undefined\n }\n >\n {flexRender(\n cell.column.columnDef.cell,\n cell.getContext(),\n )}\n </TableCell>\n );\n })}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={table.getAllColumns().length}\n className=\"h-24 text-center\"\n >\n {finalLabels.noResults}\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n </div>\n </div>\n <div className=\"flex items-center justify-between py-4\">\n <div className=\"flex items-center gap-6\">\n <div className=\"text-foreground text-sm\">\n {totalRows > 0\n ? finalLabels.showing\n .replace(`\\${from}`, fromRow.toString())\n .replace(`\\${to}`, toRow.toString())\n .replace(`\\${total}`, totalRows.toString())\n : finalLabels.noResults}\n </div>\n <div className=\"flex items-center gap-2\">\n <span className=\"text-sm text-foreground\">\n {finalLabels.rowsPerPage}\n </span>\n <Select\n value={currentPageSize.toString()}\n onValueChange={(value) => {\n table.setPageSize(Number(value));\n }}\n >\n <SelectTrigger className=\"w-[70px]\">\n <SelectValue />\n </SelectTrigger>\n <SelectContent>\n {pageSizeOptions.map((size) => (\n <SelectItem key={size} value={size.toString()}>\n {size}\n </SelectItem>\n ))}\n </SelectContent>\n </Select>\n </div>\n </div>\n <div className=\"space-x-2\">\n <Button\n variant=\"outline\"\n size=\"sm\"\n onClick={() => table.previousPage()}\n disabled={!table.getCanPreviousPage()}\n >\n {finalLabels.previousButton}\n </Button>\n <Button\n variant=\"outline\"\n size=\"sm\"\n onClick={() => table.nextPage()}\n disabled={!table.getCanNextPage()}\n >\n {finalLabels.nextButton}\n </Button>\n </div>\n </div>\n </div>\n );\n }}\n </TableWrapper>\n );\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"empty.js","names":[],"sources":["../../../src/react/table/empty.tsx"],"sourcesContent":["export function EmptyState() {\n return (\n <div className=\"w-full p-8 text-center\">\n <p className=\"text-sm text-muted-foreground\">No data available</p>\n </div>\n );\n}\n"],"mappings":";;;AAAA,SAAgB,aAAa;AAC3B,QACE,oBAAC
|
|
1
|
+
{"version":3,"file":"empty.js","names":[],"sources":["../../../src/react/table/empty.tsx"],"sourcesContent":["export function EmptyState() {\n return (\n <div className=\"w-full p-8 text-center\">\n <p className=\"text-sm text-muted-foreground\">No data available</p>\n </div>\n );\n}\n"],"mappings":";;;AAAA,SAAgB,aAAa;AAC3B,QACE,oBAAC;EAAI,WAAU;YACb,oBAAC;GAAE,WAAU;aAAgC;IAAqB;GAC9D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error.js","names":[],"sources":["../../../src/react/table/error.tsx"],"sourcesContent":["export function ErrorState({ error }: { error: string }) {\n return (\n <div className=\"w-full p-8 text-center\">\n <p className=\"text-sm text-destructive\">Error loading table: {error}</p>\n </div>\n );\n}\n"],"mappings":";;;AAAA,SAAgB,WAAW,EAAE,SAA4B;AACvD,QACE,oBAAC
|
|
1
|
+
{"version":3,"file":"error.js","names":[],"sources":["../../../src/react/table/error.tsx"],"sourcesContent":["export function ErrorState({ error }: { error: string }) {\n return (\n <div className=\"w-full p-8 text-center\">\n <p className=\"text-sm text-destructive\">Error loading table: {error}</p>\n </div>\n );\n}\n"],"mappings":";;;AAAA,SAAgB,WAAW,EAAE,SAA4B;AACvD,QACE,oBAAC;EAAI,WAAU;YACb,qBAAC;GAAE,WAAU;cAA2B,yBAAsB;IAAU;GACpE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import { DataTable } from "./data-table.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"loading.js","names":[],"sources":["../../../src/react/table/loading.tsx"],"sourcesContent":["export function LoadingSkeleton() {\n return (\n <div className=\"w-full space-y-3 mt-2\">\n <div className=\"flex items-center gap-2 mt-4\">\n <div className=\"h-10 bg-muted rounded animate-pulse flex-1 max-w-sm\" />\n <div className=\"h-10 bg-muted rounded animate-pulse w-24 ml-auto\" />\n </div>\n\n <div className=\"rounded-md border overflow-hidden\">\n <div className=\"border-b bg-secondary p-4\">\n <div className=\"flex gap-4\">\n <div className=\"h-8 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-8 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-8 bg-muted rounded animate-pulse flex-1\" />\n </div>\n </div>\n\n {Array.from({ length: 5 }).map(() => (\n <div\n key={`loading-row-${Math.random()}`}\n className=\"border-b p-4 last:border-b-0\"\n >\n <div className=\"flex gap-4\">\n <div className=\"h-6 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-6 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-6 bg-muted rounded animate-pulse flex-1\" />\n </div>\n </div>\n ))}\n </div>\n\n <div className=\"flex items-center justify-end gap-2\">\n <div className=\"h-4 bg-muted rounded animate-pulse w-32\" />\n <div className=\"h-9 bg-muted rounded animate-pulse w-20\" />\n <div className=\"h-9 bg-muted rounded animate-pulse w-20\" />\n </div>\n </div>\n );\n}\n"],"mappings":";;;AAAA,SAAgB,kBAAkB;AAChC,QACE,qBAAC
|
|
1
|
+
{"version":3,"file":"loading.js","names":[],"sources":["../../../src/react/table/loading.tsx"],"sourcesContent":["export function LoadingSkeleton() {\n return (\n <div className=\"w-full space-y-3 mt-2\">\n <div className=\"flex items-center gap-2 mt-4\">\n <div className=\"h-10 bg-muted rounded animate-pulse flex-1 max-w-sm\" />\n <div className=\"h-10 bg-muted rounded animate-pulse w-24 ml-auto\" />\n </div>\n\n <div className=\"rounded-md border overflow-hidden\">\n <div className=\"border-b bg-secondary p-4\">\n <div className=\"flex gap-4\">\n <div className=\"h-8 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-8 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-8 bg-muted rounded animate-pulse flex-1\" />\n </div>\n </div>\n\n {Array.from({ length: 5 }).map(() => (\n <div\n key={`loading-row-${Math.random()}`}\n className=\"border-b p-4 last:border-b-0\"\n >\n <div className=\"flex gap-4\">\n <div className=\"h-6 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-6 bg-muted rounded animate-pulse flex-1\" />\n <div className=\"h-6 bg-muted rounded animate-pulse flex-1\" />\n </div>\n </div>\n ))}\n </div>\n\n <div className=\"flex items-center justify-end gap-2\">\n <div className=\"h-4 bg-muted rounded animate-pulse w-32\" />\n <div className=\"h-9 bg-muted rounded animate-pulse w-20\" />\n <div className=\"h-9 bg-muted rounded animate-pulse w-20\" />\n </div>\n </div>\n );\n}\n"],"mappings":";;;AAAA,SAAgB,kBAAkB;AAChC,QACE,qBAAC;EAAI,WAAU;;GACb,qBAAC;IAAI,WAAU;eACb,oBAAC,SAAI,WAAU,wDAAwD,EACvE,oBAAC,SAAI,WAAU,qDAAqD;KAChE;GAEN,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAI,WAAU;eACb,qBAAC;MAAI,WAAU;;OACb,oBAAC,SAAI,WAAU,8CAA8C;OAC7D,oBAAC,SAAI,WAAU,8CAA8C;OAC7D,oBAAC,SAAI,WAAU,8CAA8C;;OACzD;MACF,EAEL,MAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,CAAC,UACzB,oBAAC;KAEC,WAAU;eAEV,qBAAC;MAAI,WAAU;;OACb,oBAAC,SAAI,WAAU,8CAA8C;OAC7D,oBAAC,SAAI,WAAU,8CAA8C;OAC7D,oBAAC,SAAI,WAAU,8CAA8C;;OACzD;OAPD,eAAe,KAAK,QAAQ,GAQ7B,CACN;KACE;GAEN,qBAAC;IAAI,WAAU;;KACb,oBAAC,SAAI,WAAU,4CAA4C;KAC3D,oBAAC,SAAI,WAAU,4CAA4C;KAC3D,oBAAC,SAAI,WAAU,4CAA4C;;KACvD;;GACF"}
|