@magemetrics/ai 0.5.4 → 0.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react/ai.js +10772 -10286
- package/dist/react/index.d.ts +206 -7
- package/dist/styles.css +1 -1
- package/dist/web-component/index.d.ts +206 -7
- package/dist/web-component/web-component.es.js +25108 -24574
- package/package.json +10 -10
package/dist/react/index.d.ts
CHANGED
|
@@ -1,7 +1,11 @@
|
|
|
1
|
+
import { AuthProvider } from '@magemetrics/core';
|
|
1
2
|
import { AuthState } from '@magemetrics/core';
|
|
2
3
|
import { CreateFlowParam } from '@magemetrics/core';
|
|
3
4
|
import { default as default_2 } from 'react';
|
|
5
|
+
import { DirectAuthProvider } from '@magemetrics/core';
|
|
4
6
|
import { Dispatch } from 'react';
|
|
7
|
+
import { ExternalAuthProvider } from '@magemetrics/core';
|
|
8
|
+
import { ExternalAuthProviderConfig } from '@magemetrics/core';
|
|
5
9
|
import { FetchNextPageOptions } from '@tanstack/react-query';
|
|
6
10
|
import { ForwardRefExoticComponent } from 'react';
|
|
7
11
|
import { GenerateInsightParam } from '@magemetrics/core';
|
|
@@ -20,21 +24,76 @@ import { UseMutationOptions } from '@tanstack/react-query';
|
|
|
20
24
|
import { UseQueryResult } from '@tanstack/react-query';
|
|
21
25
|
import { z } from 'zod';
|
|
22
26
|
|
|
27
|
+
/**
|
|
28
|
+
* Appearance configuration for visual customization of the `@magemetrics/ai` package.
|
|
29
|
+
*/
|
|
30
|
+
export declare type AppearanceConfig = {
|
|
31
|
+
/**
|
|
32
|
+
* Brand colors used throughout the UI (buttons, accents, interactive elements).
|
|
33
|
+
*/
|
|
34
|
+
colors?: BrandColors;
|
|
35
|
+
/**
|
|
36
|
+
* Modal-specific appearance settings.
|
|
37
|
+
*/
|
|
38
|
+
modal?: ModalAppearance;
|
|
39
|
+
};
|
|
40
|
+
|
|
23
41
|
declare type AssemblyAIMicrophoneController = {
|
|
24
42
|
status: "idle" | "starting" | "recording";
|
|
25
43
|
startRecording: (onTranscript: (text: string) => void) => Promise<void>;
|
|
26
44
|
stopRecording: () => Promise<void>;
|
|
27
45
|
};
|
|
28
46
|
|
|
47
|
+
export { AuthProvider }
|
|
48
|
+
|
|
29
49
|
export { AuthState }
|
|
30
50
|
|
|
51
|
+
/**
|
|
52
|
+
* Brand colors configuration for the appearance prop.
|
|
53
|
+
*/
|
|
54
|
+
export declare type BrandColors = PrimaryColorOption & SecondaryColorOption;
|
|
55
|
+
|
|
31
56
|
export declare type CellContentProps = {
|
|
32
57
|
formattedValue: FormattedData | undefined;
|
|
33
58
|
unit?: string;
|
|
34
59
|
renderType?: string;
|
|
35
60
|
};
|
|
36
61
|
|
|
37
|
-
export declare const Chat: React.FC<
|
|
62
|
+
export declare const Chat: React.FC<PublicChatProps>;
|
|
63
|
+
|
|
64
|
+
declare const Chat_2: ChatComponent;
|
|
65
|
+
|
|
66
|
+
declare interface ChatComponent extends default_2.MemoExoticComponent<(props: ChatProps) => default_2.JSX.Element> {
|
|
67
|
+
Messages: typeof MessagesContainer;
|
|
68
|
+
Input: typeof InputContainer & {
|
|
69
|
+
Default: typeof ChatInputDefault;
|
|
70
|
+
};
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
export declare interface ChatContextValue {
|
|
74
|
+
flowId: string | undefined | null;
|
|
75
|
+
enableSpeechToText?: boolean;
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
export declare interface ChatInputContextValue {
|
|
79
|
+
flowId: string | undefined;
|
|
80
|
+
isLoading: boolean;
|
|
81
|
+
isStreaming: boolean;
|
|
82
|
+
isError: boolean;
|
|
83
|
+
onRetry?: () => void;
|
|
84
|
+
onStop?: () => void;
|
|
85
|
+
sendMessage: (text: string, isEditing: boolean) => void;
|
|
86
|
+
lastUserMessage?: string;
|
|
87
|
+
enableSpeechToText?: boolean;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
declare const ChatInputDefault: default_2.FC;
|
|
91
|
+
|
|
92
|
+
declare interface ChatProps {
|
|
93
|
+
flowId: string | undefined | null;
|
|
94
|
+
enableSpeechToText?: boolean;
|
|
95
|
+
children?: default_2.ReactNode;
|
|
96
|
+
}
|
|
38
97
|
|
|
39
98
|
declare interface ColumnSort {
|
|
40
99
|
desc: boolean;
|
|
@@ -70,6 +129,25 @@ export declare interface Components {
|
|
|
70
129
|
getCanvasShareableLink?: (canvasId: string) => string;
|
|
71
130
|
}
|
|
72
131
|
|
|
132
|
+
export declare const ConfigurableChat: ConfigurableChatComponent;
|
|
133
|
+
|
|
134
|
+
declare interface ConfigurableChatComponent extends default_2.FC<ConfigurableChatComponentProps> {
|
|
135
|
+
Messages: typeof Chat_2.Messages;
|
|
136
|
+
Input: typeof Chat_2.Input;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
declare type ConfigurableChatComponentProps = {
|
|
140
|
+
flowId: string | undefined | null;
|
|
141
|
+
enableSpeechToText?: boolean;
|
|
142
|
+
disableCanvas?: boolean;
|
|
143
|
+
children?: default_2.ReactNode;
|
|
144
|
+
/**
|
|
145
|
+
* Appearance configuration for customizing the visual style.
|
|
146
|
+
* Includes brand colors and modal-specific styling options.
|
|
147
|
+
*/
|
|
148
|
+
appearance?: AppearanceConfig;
|
|
149
|
+
};
|
|
150
|
+
|
|
73
151
|
/** @deprecated This type is no longer used and will be removed in a future version. */
|
|
74
152
|
declare type ControlledModalProps = {
|
|
75
153
|
visible: boolean;
|
|
@@ -85,6 +163,7 @@ declare interface ConversationContentProps {
|
|
|
85
163
|
topBar?: React.ReactNode;
|
|
86
164
|
disableCanvas?: boolean;
|
|
87
165
|
enableSpeechToText?: boolean;
|
|
166
|
+
children?: React.ReactNode;
|
|
88
167
|
}
|
|
89
168
|
|
|
90
169
|
export { CreateFlowParam }
|
|
@@ -129,6 +208,8 @@ declare type DataTableState = {
|
|
|
129
208
|
filters: TableFilters;
|
|
130
209
|
};
|
|
131
210
|
|
|
211
|
+
export { DirectAuthProvider }
|
|
212
|
+
|
|
132
213
|
declare type DisplayControlProps = {
|
|
133
214
|
/** Whether to display the recommendations section when the input is active */
|
|
134
215
|
showRecommendations?: boolean;
|
|
@@ -140,9 +221,7 @@ declare type DisplayControlProps = {
|
|
|
140
221
|
|
|
141
222
|
export declare const DomWrapper: React.FC<PropsWithChildren<DomWrapperProps>>;
|
|
142
223
|
|
|
143
|
-
declare type DomWrapperProps =
|
|
144
|
-
display?: string;
|
|
145
|
-
};
|
|
224
|
+
declare type DomWrapperProps = InternalColorSwatchProps;
|
|
146
225
|
|
|
147
226
|
export declare const DownloadDataReportButton: React.FC<{
|
|
148
227
|
reportId: number;
|
|
@@ -159,6 +238,10 @@ declare type ExportReportDataResult = {
|
|
|
159
238
|
data: Blob | string;
|
|
160
239
|
};
|
|
161
240
|
|
|
241
|
+
export { ExternalAuthProvider }
|
|
242
|
+
|
|
243
|
+
export { ExternalAuthProviderConfig }
|
|
244
|
+
|
|
162
245
|
declare type ExtractInsightResponse = z.infer<typeof ExtractInsightResponseSchema>;
|
|
163
246
|
|
|
164
247
|
declare const ExtractInsightResponseSchema: z.ZodUnion<[z.ZodObject<{
|
|
@@ -258,6 +341,8 @@ declare const FrontendReportExplainabilitySchema: z.ZodObject<{
|
|
|
258
341
|
friendliness_score: z.ZodOptional<z.ZodNumber>;
|
|
259
342
|
friendliness_score_reason: z.ZodOptional<z.ZodString>;
|
|
260
343
|
flow_data_id: z.ZodNumber;
|
|
344
|
+
output_dataset: z.ZodOptional<z.ZodString>;
|
|
345
|
+
sql: z.ZodOptional<z.ZodString>;
|
|
261
346
|
}, z.core.$strip>;
|
|
262
347
|
|
|
263
348
|
declare const FrontendReportSchema: z.ZodObject<{
|
|
@@ -283,6 +368,16 @@ declare const FrontendReportSchema: z.ZodObject<{
|
|
|
283
368
|
null_count: z.ZodNullable<z.ZodNumber>;
|
|
284
369
|
unique_count: z.ZodNullable<z.ZodNumber>;
|
|
285
370
|
unique_percentage: z.ZodNullable<z.ZodNumber>;
|
|
371
|
+
min_value: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
372
|
+
max_value: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
373
|
+
avg_value: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
374
|
+
median_value: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
375
|
+
std_value: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
376
|
+
min_date: z.ZodOptional<z.ZodNullable<z.ZodString>>;
|
|
377
|
+
max_date: z.ZodOptional<z.ZodNullable<z.ZodString>>;
|
|
378
|
+
min_length: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
379
|
+
max_length: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
380
|
+
avg_length: z.ZodOptional<z.ZodNullable<z.ZodNumber>>;
|
|
286
381
|
}, z.core.$loose>>;
|
|
287
382
|
}, z.core.$loose>;
|
|
288
383
|
bookmarked: z.ZodBoolean;
|
|
@@ -363,6 +458,21 @@ declare type InfiniteDataTableUIProps = {
|
|
|
363
458
|
totalRows: number;
|
|
364
459
|
};
|
|
365
460
|
|
|
461
|
+
declare const InputContainer: default_2.FC<{
|
|
462
|
+
children?: default_2.ReactNode | ((context: ChatInputContextValue) => default_2.ReactNode);
|
|
463
|
+
}>;
|
|
464
|
+
|
|
465
|
+
/**
|
|
466
|
+
* Internal/relaxed type for passing color props through component trees.
|
|
467
|
+
* Use this for internal components; use ColorSwatchOptions for external APIs.
|
|
468
|
+
*/
|
|
469
|
+
declare type InternalColorSwatchProps = {
|
|
470
|
+
primaryColor?: string;
|
|
471
|
+
primarySwatch?: PrimaryColorSwatch;
|
|
472
|
+
secondaryColor?: string;
|
|
473
|
+
secondarySwatch?: SecondaryColorSwatch;
|
|
474
|
+
};
|
|
475
|
+
|
|
366
476
|
export declare const logout: () => void;
|
|
367
477
|
|
|
368
478
|
export { MageMetricsClient }
|
|
@@ -395,7 +505,7 @@ declare type MageMetricsPublicContextProviderProps = PropsWithChildren<Pick<Mage
|
|
|
395
505
|
|
|
396
506
|
export declare const ManagedModal: React.FC<ManagedModalProps>;
|
|
397
507
|
|
|
398
|
-
declare
|
|
508
|
+
declare type ManagedModalBaseProps = ModalProps & {
|
|
399
509
|
/** API key for authenticating with the MageMetrics service */
|
|
400
510
|
apiKey: string;
|
|
401
511
|
/** External JWT token for user authentication */
|
|
@@ -412,12 +522,36 @@ declare interface ManagedModalProps extends ModalProps {
|
|
|
412
522
|
components?: Components;
|
|
413
523
|
/** Application name to associate with flows created through this modal */
|
|
414
524
|
applicationName?: string;
|
|
525
|
+
/**
|
|
526
|
+
* Appearance configuration for customizing the visual style.
|
|
527
|
+
* Includes brand colors and modal-specific styling options.
|
|
528
|
+
*/
|
|
529
|
+
appearance?: AppearanceConfig;
|
|
415
530
|
/** Callbacks for various events */
|
|
416
531
|
callbacks?: {
|
|
417
532
|
/** Callback fired when the conversation modal is opened */
|
|
418
533
|
onConversationOpen?: () => void;
|
|
419
534
|
};
|
|
420
|
-
}
|
|
535
|
+
};
|
|
536
|
+
|
|
537
|
+
/**
|
|
538
|
+
* Props for ManagedModal component.
|
|
539
|
+
*/
|
|
540
|
+
declare type ManagedModalProps = ManagedModalBaseProps;
|
|
541
|
+
|
|
542
|
+
declare const MessagesContainer: default_2.FC;
|
|
543
|
+
|
|
544
|
+
/**
|
|
545
|
+
* Modal-specific appearance configuration.
|
|
546
|
+
*/
|
|
547
|
+
export declare type ModalAppearance = {
|
|
548
|
+
/**
|
|
549
|
+
* Primary color for modal background gradient.
|
|
550
|
+
* Used to customize the mesh gradient background in conversation modals.
|
|
551
|
+
* Can be any CSS color (hex, rgb, hsl, oklch, etc.).
|
|
552
|
+
*/
|
|
553
|
+
backgroundPrimary?: string;
|
|
554
|
+
};
|
|
421
555
|
|
|
422
556
|
declare interface ModalProps {
|
|
423
557
|
/**
|
|
@@ -462,12 +596,44 @@ declare type PaginatedDataTableUIProps = {
|
|
|
462
596
|
|
|
463
597
|
declare type PersistenceOptions = "queryParam" | "none";
|
|
464
598
|
|
|
599
|
+
/**
|
|
600
|
+
* Primary color shade stops used in the UI.
|
|
601
|
+
*/
|
|
602
|
+
declare const PRIMARY_SHADE_STOPS: readonly ["50", "400", "500", "600", "650", "750", "900"];
|
|
603
|
+
|
|
604
|
+
/**
|
|
605
|
+
* Primary color options - mutually exclusive: use either primaryColor OR primarySwatch, not both.
|
|
606
|
+
*/
|
|
607
|
+
declare type PrimaryColorOption = {
|
|
608
|
+
primaryColor: string;
|
|
609
|
+
primarySwatch?: never;
|
|
610
|
+
} | {
|
|
611
|
+
primaryColor?: never;
|
|
612
|
+
primarySwatch: PrimaryColorSwatch;
|
|
613
|
+
} | {
|
|
614
|
+
primaryColor?: never;
|
|
615
|
+
primarySwatch?: never;
|
|
616
|
+
};
|
|
617
|
+
|
|
618
|
+
declare type PrimaryColorShade = (typeof PRIMARY_SHADE_STOPS)[number];
|
|
619
|
+
|
|
620
|
+
/** Complete primary swatch (7 shades required) */
|
|
621
|
+
export declare type PrimaryColorSwatch = Record<PrimaryColorShade, string>;
|
|
622
|
+
|
|
465
623
|
export declare const PublicCanvas: React.FC<React.ComponentProps<typeof PublicCanvasPanel>>;
|
|
466
624
|
|
|
467
625
|
declare const PublicCanvasPanel: default_2.FC<{
|
|
468
626
|
canvasId: string;
|
|
469
627
|
}>;
|
|
470
628
|
|
|
629
|
+
export declare type PublicChatProps = Omit<ConversationContentProps, "children"> & {
|
|
630
|
+
/**
|
|
631
|
+
* Appearance configuration for customizing the visual style.
|
|
632
|
+
* Includes brand colors and modal-specific styling options.
|
|
633
|
+
*/
|
|
634
|
+
appearance?: AppearanceConfig;
|
|
635
|
+
};
|
|
636
|
+
|
|
471
637
|
/**
|
|
472
638
|
* This component is not bounded in height and must be wrapped in a container to properly work
|
|
473
639
|
* @param props - props
|
|
@@ -492,9 +658,33 @@ declare type ReportDataFilters = {
|
|
|
492
658
|
cursor?: number;
|
|
493
659
|
};
|
|
494
660
|
|
|
661
|
+
/**
|
|
662
|
+
* Secondary color shade stops used in the UI.
|
|
663
|
+
*/
|
|
664
|
+
declare const SECONDARY_SHADE_STOPS: readonly ["500", "600", "700"];
|
|
665
|
+
|
|
666
|
+
/**
|
|
667
|
+
* Secondary color options - mutually exclusive: use either secondaryColor OR secondarySwatch, not both.
|
|
668
|
+
*/
|
|
669
|
+
declare type SecondaryColorOption = {
|
|
670
|
+
secondaryColor: string;
|
|
671
|
+
secondarySwatch?: never;
|
|
672
|
+
} | {
|
|
673
|
+
secondaryColor?: never;
|
|
674
|
+
secondarySwatch: SecondaryColorSwatch;
|
|
675
|
+
} | {
|
|
676
|
+
secondaryColor?: never;
|
|
677
|
+
secondarySwatch?: never;
|
|
678
|
+
};
|
|
679
|
+
|
|
680
|
+
declare type SecondaryColorShade = (typeof SECONDARY_SHADE_STOPS)[number];
|
|
681
|
+
|
|
682
|
+
/** Complete secondary swatch (3 shades required) */
|
|
683
|
+
export declare type SecondaryColorSwatch = Record<SecondaryColorShade, string>;
|
|
684
|
+
|
|
495
685
|
declare type SortingState = ColumnSort[];
|
|
496
686
|
|
|
497
|
-
export declare const StandaloneConversationModal:
|
|
687
|
+
export declare const StandaloneConversationModal: default_2.FC<StandaloneConversationModalProps>;
|
|
498
688
|
|
|
499
689
|
declare type StandaloneConversationModalProps = {
|
|
500
690
|
opened: boolean;
|
|
@@ -502,6 +692,7 @@ declare type StandaloneConversationModalProps = {
|
|
|
502
692
|
disableCanvas?: boolean;
|
|
503
693
|
showDataFreshness?: boolean;
|
|
504
694
|
onOpenChange?: (open: boolean) => void;
|
|
695
|
+
appearance?: AppearanceConfig;
|
|
505
696
|
};
|
|
506
697
|
|
|
507
698
|
declare type StartOptions = DisplayControlProps & {
|
|
@@ -517,6 +708,10 @@ declare type StartOptions = DisplayControlProps & {
|
|
|
517
708
|
|
|
518
709
|
declare type TableFilters = Record<string, string | number>;
|
|
519
710
|
|
|
711
|
+
export declare const useChatContext: () => ChatContextValue;
|
|
712
|
+
|
|
713
|
+
export declare const useChatInputContext: () => ChatInputContextValue;
|
|
714
|
+
|
|
520
715
|
export declare const useCreateFlow: (options?: UseMutationOptions<{
|
|
521
716
|
flowId: string;
|
|
522
717
|
}, Error, CreateFlowParam>) => {
|
|
@@ -692,6 +887,8 @@ export declare const useDataReport: (reportId: FrontendReport["id"]) => {
|
|
|
692
887
|
friendliness_score?: number;
|
|
693
888
|
friendliness_score_reason?: string;
|
|
694
889
|
flow_data_id: number;
|
|
890
|
+
output_dataset?: string;
|
|
891
|
+
sql?: string;
|
|
695
892
|
} | null | undefined;
|
|
696
893
|
totalRows: number;
|
|
697
894
|
infiniteData: InfiniteData< {
|
|
@@ -1003,6 +1200,8 @@ export declare const usePaginatedDataReport: (reportId: FrontendReport["id"], op
|
|
|
1003
1200
|
friendliness_score?: number;
|
|
1004
1201
|
friendliness_score_reason?: string;
|
|
1005
1202
|
flow_data_id: number;
|
|
1203
|
+
output_dataset?: string;
|
|
1204
|
+
sql?: string;
|
|
1006
1205
|
} | null | undefined;
|
|
1007
1206
|
totalRows: number | undefined;
|
|
1008
1207
|
pageIndex: number;
|