@melony/react 0.1.54 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,441 +1,21 @@
1
- import * as React$1 from 'react';
2
- import React__default, { ReactNode } from 'react';
1
+ import React, { ReactNode } from 'react';
3
2
  import { ClientState, MelonyClient } from 'melony/client';
4
- import { Message, Event, Config, UIWidth, UISpacing, UIColor, UIRadius, UINode, UIContract, UIJustify, UIAlign } from 'melony';
5
- import { QueryClient } from '@tanstack/react-query';
6
- import * as react_jsx_runtime from 'react/jsx-runtime';
7
- export * from '@tabler/icons-react';
3
+ import { Event, Config } from 'melony';
8
4
 
9
5
  interface MelonyContextValue extends ClientState {
10
- messages: Message[];
11
6
  sendEvent: (event: Event) => Promise<void>;
12
7
  reset: (events?: Event[]) => void;
13
8
  client: MelonyClient;
14
9
  config?: Config;
15
10
  }
16
- declare const MelonyContext: React__default.Context<MelonyContextValue | undefined>;
11
+ declare const MelonyContext: React.Context<MelonyContextValue | undefined>;
17
12
  interface MelonyProviderProps {
18
13
  children: ReactNode;
19
14
  client: MelonyClient;
20
15
  initialEvents?: Event[];
21
- queryClient?: QueryClient;
22
16
  }
23
- declare const MelonyProvider: React__default.FC<MelonyProviderProps>;
17
+ declare const MelonyProvider: React.FC<MelonyProviderProps>;
24
18
 
25
- interface User {
26
- id?: string;
27
- uid: string;
28
- email: string;
29
- name?: string;
30
- displayName?: string;
31
- picture?: string;
32
- createdAt?: string;
33
- lastSignIn?: string | null;
34
- emailVerified?: boolean;
35
- }
36
- interface ThreadData {
37
- id: string;
38
- title?: string;
39
- updatedAt?: Date | string;
40
- }
41
- interface StarterPrompt {
42
- label: string;
43
- prompt: string;
44
- icon?: React.ReactNode;
45
- }
46
- interface ComposerOption {
47
- id: string;
48
- label: string;
49
- value: any;
50
- }
51
- interface ComposerOptionGroup {
52
- id: string;
53
- label: string;
54
- options: ComposerOption[];
55
- type?: "single" | "multiple";
56
- defaultSelectedIds?: string[];
57
- }
58
- interface AuthService {
59
- getMe: () => Promise<User | null>;
60
- login: () => void;
61
- logout: () => Promise<void>;
62
- getToken: () => string | null;
63
- }
64
- interface ThreadService {
65
- getThreads: () => Promise<ThreadData[]>;
66
- createThread?: () => Promise<string>;
67
- deleteThread: (id: string) => Promise<void>;
68
- getEvents: (threadId: string) => Promise<Event[]>;
69
- }
70
-
71
- interface WelcomeScreenProps {
72
- title?: string;
73
- description?: string;
74
- features?: {
75
- title: string;
76
- description: string;
77
- }[];
78
- className?: string;
79
- onLoginClick?: () => void;
80
- termsUrl?: string;
81
- privacyUrl?: string;
82
- imageUrl?: string;
83
- imageAlt?: string;
84
- }
85
- declare function WelcomeScreen({ title, description, features, className, onLoginClick, termsUrl, privacyUrl, imageUrl, imageAlt, }: WelcomeScreenProps): react_jsx_runtime.JSX.Element;
86
-
87
- interface AuthContextValue {
88
- user: User | null;
89
- isAuthenticated: boolean;
90
- isLoading: boolean;
91
- login: () => void;
92
- logout: () => void;
93
- getToken: () => string | null;
94
- }
95
- declare const AuthContext: React__default.Context<AuthContextValue | undefined>;
96
- interface AuthProviderProps {
97
- children: ReactNode;
98
- service: AuthService;
99
- welcomeScreenProps?: WelcomeScreenProps;
100
- }
101
- declare const AuthProvider: React__default.FC<AuthProviderProps>;
102
-
103
- interface ThreadContextValue {
104
- threads: ThreadData[];
105
- activeThreadId: string | null;
106
- isLoading: boolean;
107
- error: Error | null;
108
- selectThread: (threadId: string) => void;
109
- createThread: () => Promise<string | null>;
110
- deleteThread: (threadId: string) => Promise<void>;
111
- refreshThreads: () => Promise<void>;
112
- threadEvents: Event[];
113
- isLoadingEvents: boolean;
114
- }
115
- declare const ThreadContext: React__default.Context<ThreadContextValue | undefined>;
116
- interface ThreadProviderProps {
117
- children: ReactNode;
118
- service: ThreadService;
119
- initialThreadId?: string;
120
- }
121
- declare const ThreadProvider: React__default.FC<ThreadProviderProps>;
122
-
123
- interface SidebarContextValue {
124
- leftCollapsed: boolean;
125
- rightCollapsed: boolean;
126
- setLeftCollapsed: (collapsed: boolean) => void;
127
- setRightCollapsed: (collapsed: boolean) => void;
128
- leftCollapsible: boolean;
129
- rightCollapsible: boolean;
130
- }
131
- declare const SidebarContext: React__default.Context<SidebarContextValue | undefined>;
132
- declare function useSidebar(): SidebarContextValue;
133
- interface SidebarProviderProps {
134
- children: React__default.ReactNode;
135
- defaultLeftCollapsed?: boolean;
136
- defaultRightCollapsed?: boolean;
137
- }
138
- declare function SidebarProvider({ children, defaultLeftCollapsed, defaultRightCollapsed, }: SidebarProviderProps): react_jsx_runtime.JSX.Element;
139
-
140
- type Theme = "light" | "dark" | "system";
141
- interface ThemeContextType {
142
- theme: Theme;
143
- setTheme: (theme: Theme) => void;
144
- resolvedTheme: "light" | "dark";
145
- }
146
- declare function ThemeProvider({ children }: {
147
- children: React.ReactNode;
148
- }): react_jsx_runtime.JSX.Element;
149
- declare function useTheme(): ThemeContextType;
150
-
151
- interface UseMelonyOptions {
152
- initialEvents?: Event[];
153
- }
154
- declare const useMelony: (options?: UseMelonyOptions) => MelonyContextValue;
155
-
156
- declare const useAuth: () => AuthContextValue;
157
-
158
- declare const useThreads: () => ThreadContextValue;
159
-
160
- interface UseSurfaceOptions {
161
- name: string;
162
- }
163
- declare const useSurface: (options: UseSurfaceOptions) => {
164
- events: Event[];
165
- };
166
-
167
- interface ScreenSize {
168
- width: number;
169
- height: number;
170
- isMobile: boolean;
171
- isTablet: boolean;
172
- isDesktop: boolean;
173
- }
174
- /**
175
- * Hook to detect screen size and breakpoints
176
- * @param mobileBreakpoint - Breakpoint for mobile (default: 768px, Tailwind's md)
177
- * @param tabletBreakpoint - Breakpoint for tablet (default: 1024px, Tailwind's lg)
178
- */
179
- declare function useScreenSize(mobileBreakpoint?: number, tabletBreakpoint?: number): ScreenSize;
180
-
181
- interface ThreadProps {
182
- placeholder?: string;
183
- starterPrompts?: StarterPrompt[];
184
- options?: ComposerOptionGroup[];
185
- autoFocus?: boolean;
186
- defaultSelectedIds?: string[];
187
- }
188
- declare function Thread({ placeholder, starterPrompts: localStarterPrompts, options: localOptions, autoFocus, defaultSelectedIds, }: ThreadProps): react_jsx_runtime.JSX.Element;
189
-
190
- interface ComposerProps {
191
- value: string;
192
- onChange: (value: string) => void;
193
- onSubmit: (state?: Record<string, any>) => void;
194
- placeholder?: string;
195
- isLoading?: boolean;
196
- className?: string;
197
- options?: ComposerOptionGroup[];
198
- autoFocus?: boolean;
199
- defaultSelectedIds?: string[];
200
- fileAttachments?: {
201
- enabled?: boolean;
202
- accept?: string;
203
- maxFiles?: number;
204
- maxFileSize?: number;
205
- };
206
- }
207
- declare function Composer({ value, onChange, onSubmit, placeholder, isLoading, className, options, autoFocus, defaultSelectedIds, fileAttachments, }: ComposerProps): react_jsx_runtime.JSX.Element;
208
-
209
- interface ChatHeaderProps {
210
- /**
211
- * The title to display in the header. Can be a string or a React node for custom content.
212
- */
213
- title?: string | React__default.ReactNode;
214
- /**
215
- * Content to render on the left side of the header (e.g., back button).
216
- */
217
- leftContent?: React__default.ReactNode;
218
- /**
219
- * Content to render on the right side of the header (e.g., action buttons).
220
- */
221
- rightContent?: React__default.ReactNode;
222
- /**
223
- * Custom className for the header container.
224
- */
225
- className?: string;
226
- /**
227
- * Custom className for the title element (only applies when title is a string).
228
- */
229
- titleClassName?: string;
230
- /**
231
- * Custom children to render inside the header. If provided, this takes precedence over title/leftContent/rightContent.
232
- */
233
- children?: React__default.ReactNode;
234
- }
235
- /**
236
- * A shared, customizable header component for chat interfaces.
237
- * Used consistently across ChatFull, ChatSidebar, and ChatPopup components.
238
- */
239
- declare function ChatHeader({ leftContent, rightContent, className, children, }: ChatHeaderProps): react_jsx_runtime.JSX.Element;
240
-
241
- interface PopupChatProps {
242
- title?: string;
243
- placeholder?: string;
244
- starterPrompts?: StarterPrompt[];
245
- options?: ComposerOptionGroup[];
246
- defaultOpen?: boolean;
247
- /**
248
- * Props for customizing the header. Note: leftContent and rightContent in headerProps
249
- * will be merged with the default popup header actions (back, history, new chat, close).
250
- */
251
- headerProps?: Omit<ChatHeaderProps, "title" | "leftContent" | "rightContent">;
252
- /**
253
- * IDs of options to be selected by default
254
- */
255
- defaultSelectedIds?: string[];
256
- }
257
- declare function PopupChat({ title, placeholder, starterPrompts, options, defaultOpen, headerProps, defaultSelectedIds, }: PopupChatProps): react_jsx_runtime.JSX.Element;
258
-
259
- interface SidebarProps {
260
- side: "left" | "right";
261
- children: React__default.ReactNode;
262
- width?: UIWidth | string;
263
- }
264
- /**
265
- * A sidebar component that responds to ChatSidebarContext.
266
- * Typically used within ChatFull or a layout with ChatSidebarProvider.
267
- */
268
- declare function Sidebar({ side, children, width }: SidebarProps): react_jsx_runtime.JSX.Element;
269
-
270
- interface FullChatProps {
271
- title?: string;
272
- placeholder?: string;
273
- starterPrompts?: StarterPrompt[];
274
- options?: ComposerOptionGroup[];
275
- className?: string;
276
- /**
277
- * Props for customizing the header. If provided, title prop will be passed to header.
278
- */
279
- headerProps?: Omit<ChatHeaderProps, "title">;
280
- /**
281
- * Whether the composer should be auto focused
282
- */
283
- autoFocus?: boolean;
284
- /**
285
- * IDs of options to be selected by default
286
- */
287
- defaultSelectedIds?: string[];
288
- }
289
- declare function FullChat({ title, placeholder, starterPrompts, options, className, headerProps, autoFocus, defaultSelectedIds, }: FullChatProps): react_jsx_runtime.JSX.Element;
290
-
291
- interface SurfaceProps {
292
- /**
293
- * The name of the surface to filter events by.
294
- * Only events with matching Event.surface will be included.
295
- */
296
- name: string;
297
- /**
298
- * Render function that receives the filtered and slot-deduplicated events.
299
- */
300
- children: (events: Event[]) => ReactNode;
301
- }
302
- /**
303
- * A reusable component that listens to Melony events for a specific surface.
304
- * It automatically handles slot-based deduplication (latest event for a slot replaces previous ones).
305
- */
306
- declare function Surface({ name, children }: SurfaceProps): react_jsx_runtime.JSX.Element;
307
-
308
- interface SidebarToggleProps {
309
- side: "left" | "right";
310
- className?: string;
311
- }
312
- declare function SidebarToggle({ side, className }: SidebarToggleProps): react_jsx_runtime.JSX.Element | null;
313
-
314
- interface ThreadListProps {
315
- padding?: UISpacing;
316
- gap?: UISpacing;
317
- background?: UIColor;
318
- radius?: UIRadius;
319
- }
320
- declare const ThreadList: React$1.FC<ThreadListProps>;
321
-
322
- interface ThreadPopoverProps {
323
- }
324
- declare const ThreadPopover: React$1.FC<ThreadPopoverProps>;
325
-
326
- interface CreateThreadButtonProps {
327
- className?: string;
328
- variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link";
329
- size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg";
330
- children?: React$1.ReactNode;
331
- onThreadCreated?: (threadId: string) => void;
332
- }
333
- declare const CreateThreadButton: React$1.FC<CreateThreadButtonProps>;
334
-
335
- interface AccountButtonProps {
336
- className?: string;
337
- variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
338
- size?: "default" | "sm" | "lg" | "icon";
339
- }
340
- declare const AccountButton: React$1.FC<AccountButtonProps>;
341
-
342
- declare function ThemeToggle(): react_jsx_runtime.JSX.Element;
343
-
344
- interface UIRendererProps {
345
- node: UINode;
346
- }
347
- /**
348
- * Maps UINode types to refined React elements aligned with shadcn.
349
- * UI is built via elements always starting with a card element as a root.
350
- * Children are always rendered elements, never raw strings.
351
- */
352
- declare function UIRenderer({ node }: UIRendererProps): react_jsx_runtime.JSX.Element;
353
-
354
- interface CreateThreadListItemProps {
355
- padding?: UISpacing;
356
- background?: UIColor;
357
- radius?: UIRadius;
358
- }
359
- declare const CreateThreadListItem: React$1.FC<CreateThreadListItemProps>;
360
-
361
- declare const Button: React__default.FC<UIContract["button"] & {
362
- justify?: UIJustify;
363
- }>;
364
-
365
- declare const Input: React__default.FC<UIContract["input"]>;
366
-
367
- declare const Textarea: React__default.FC<UIContract["textarea"]>;
368
-
369
- declare const Select: React__default.FC<UIContract["select"]>;
370
-
371
- declare const Checkbox: React__default.FC<UIContract["checkbox"]>;
372
-
373
- declare const RadioGroup: React__default.FC<UIContract["radioGroup"]>;
374
-
375
- declare const Form: React__default.FC<UIContract["form"] & {
376
- children?: React__default.ReactNode[];
377
- }>;
378
-
379
- declare const Upload: React__default.FC<UIContract["upload"]>;
380
-
381
- declare const Heading: React__default.FC<UIContract["heading"]>;
382
-
383
- declare const Image: React__default.FC<UIContract["image"]>;
384
-
385
- declare const Label: React__default.FC<UIContract["label"]>;
386
-
387
- interface DropdownItem {
388
- label: string;
389
- icon?: string;
390
- onClickAction?: Event;
391
- }
392
- declare const Dropdown: React$1.FC<UIContract["dropdown"] & {
393
- children?: React$1.ReactNode | React$1.ReactNode[];
394
- }>;
395
-
396
- declare const List: React__default.FC<UIContract["list"] & {
397
- children?: React__default.ReactNode;
398
- flex?: string;
399
- overflow?: string;
400
- }>;
401
-
402
- declare const ListItem: React__default.FC<UIContract["listItem"] & {
403
- children?: React__default.ReactNode;
404
- align?: UIAlign;
405
- }>;
406
-
407
- declare const Spacer: React__default.FC<UIContract["spacer"]>;
408
-
409
- declare const Divider: React__default.FC<UIContract["divider"]>;
410
-
411
- declare const Box: React__default.FC<UIContract["box"] & {
412
- children?: React__default.ReactNode | React__default.ReactNode[];
413
- }>;
414
-
415
- declare const Float: React__default.FC<UIContract["float"] & {
416
- children?: React__default.ReactNode | React__default.ReactNode[];
417
- }>;
418
-
419
- declare const Chart: React__default.FC<UIContract["chart"]>;
420
-
421
- declare const Card: React__default.FC<UIContract["card"] & {
422
- children?: React__default.ReactNode[];
423
- }>;
424
-
425
- declare const Row: React__default.FC<UIContract["row"] & {
426
- children?: React__default.ReactNode[];
427
- }>;
428
-
429
- declare const Col: React__default.FC<UIContract["col"] & {
430
- children?: React__default.ReactNode | React__default.ReactNode[];
431
- }>;
432
-
433
- declare const Text: React__default.FC<UIContract["text"]>;
434
-
435
- declare const Badge: React__default.FC<UIContract["badge"]>;
436
-
437
- declare const Hidden: React__default.FC<UIContract["hidden"]>;
438
-
439
- declare const ColorPicker: React__default.FC<UIContract["colorPicker"]>;
19
+ declare const useMelony: () => MelonyContextValue;
440
20
 
441
- export { AccountButton, type AccountButtonProps, AuthContext, type AuthContextValue, AuthProvider, type AuthProviderProps, type AuthService, Badge, Box, Button, Card, Chart, ChatHeader, type ChatHeaderProps, Checkbox, Col, ColorPicker, Composer, type ComposerOption, type ComposerOptionGroup, CreateThreadButton, type CreateThreadButtonProps, CreateThreadListItem, type CreateThreadListItemProps, Divider, Dropdown, type DropdownItem, Float, Form, FullChat, type FullChatProps, Heading, Hidden, Image, Input, Label, List, ListItem, MelonyContext, type MelonyContextValue, MelonyProvider, type MelonyProviderProps, PopupChat, type PopupChatProps, RadioGroup, Row, type ScreenSize, Select, Sidebar, SidebarContext, type SidebarContextValue, type SidebarProps, SidebarProvider, type SidebarProviderProps, SidebarToggle, type SidebarToggleProps, Spacer, type StarterPrompt, Surface, type SurfaceProps, Text, Textarea, ThemeProvider, ThemeToggle, Thread, ThreadContext, type ThreadContextValue, type ThreadData, ThreadList, type ThreadListProps, ThreadPopover, type ThreadPopoverProps, ThreadProvider, type ThreadProviderProps, type ThreadService, UIRenderer, type UIRendererProps, Upload, type UseMelonyOptions, type UseSurfaceOptions, type User, WelcomeScreen, type WelcomeScreenProps, useAuth, useMelony, useScreenSize, useSidebar, useSurface, useTheme, useThreads };
21
+ export { MelonyContext, type MelonyContextValue, MelonyProvider, type MelonyProviderProps, useMelony };