@stephenov/feedbackwidget 0.1.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.
Files changed (5) hide show
  1. package/dist/index.d.mts +189 -0
  2. package/dist/index.d.ts +189 -0
  3. package/dist/index.js +1576 -0
  4. package/dist/index.mjs +1530 -0
  5. package/package.json +53 -0
package/dist/index.d.mts ADDED
@@ -0,0 +1,189 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ type FeedbackType = "voice" | "text";
4
+ type Position = "bottom-right" | "bottom-left" | "top-right" | "top-left";
5
+ type Theme = "light" | "dark" | "auto";
6
+ interface FeedbackUser {
7
+ id?: string;
8
+ email?: string;
9
+ name?: string;
10
+ [key: string]: unknown;
11
+ }
12
+ interface FeedbackWidgetProps {
13
+ /** Your API key from feedbackwidget.dev */
14
+ apiKey: string;
15
+ /** Widget position on screen */
16
+ position?: Position;
17
+ /** Color theme */
18
+ theme?: Theme;
19
+ /** Primary accent color (hex) */
20
+ accentColor?: string;
21
+ /** Enable voice recording */
22
+ allowVoice?: boolean;
23
+ /** Enable text input */
24
+ allowText?: boolean;
25
+ /** Enable screenshot uploads */
26
+ allowScreenshots?: boolean;
27
+ /** Max voice recording duration in seconds */
28
+ maxVoiceDuration?: number;
29
+ /** User context attached to feedback */
30
+ user?: FeedbackUser;
31
+ /** Custom metadata attached to every submission */
32
+ metadata?: Record<string, unknown>;
33
+ /** Callback when widget opens */
34
+ onOpen?: () => void;
35
+ /** Callback when widget closes */
36
+ onClose?: () => void;
37
+ /** Callback after successful submission */
38
+ onSubmit?: (feedback: FeedbackSubmission) => void;
39
+ /** Callback on error */
40
+ onError?: (error: Error) => void;
41
+ /** Custom trigger element (replaces default button) */
42
+ triggerComponent?: React.ReactNode;
43
+ /** Customize labels */
44
+ labels?: FeedbackLabels;
45
+ }
46
+ interface FeedbackLabels {
47
+ triggerTooltip?: string;
48
+ panelTitle?: string;
49
+ voiceButton?: string;
50
+ textButton?: string;
51
+ submitButton?: string;
52
+ successMessage?: string;
53
+ placeholder?: string;
54
+ }
55
+ interface FeedbackSubmission {
56
+ id: string;
57
+ type: FeedbackType;
58
+ message?: string;
59
+ audioUrl?: string;
60
+ transcript?: string;
61
+ screenshotUrls?: string[];
62
+ pagePath: string;
63
+ pageTitle: string;
64
+ timestamp: string;
65
+ }
66
+ interface SubmitFeedbackParams {
67
+ type: FeedbackType;
68
+ message?: string;
69
+ audioBlob?: Blob;
70
+ audioDuration?: number;
71
+ screenshots?: File[];
72
+ pagePath: string;
73
+ pageTitle: string;
74
+ user?: FeedbackUser;
75
+ metadata?: Record<string, unknown>;
76
+ }
77
+ interface ApiValidationResponse {
78
+ valid: boolean;
79
+ project?: string;
80
+ plan?: string;
81
+ usage?: {
82
+ submissions: number;
83
+ limit: number;
84
+ resetAt: string;
85
+ };
86
+ features?: {
87
+ voice: boolean;
88
+ screenshots: boolean;
89
+ maxVoiceDuration: number;
90
+ };
91
+ error?: string;
92
+ }
93
+ interface ApiSubmitResponse {
94
+ id: string;
95
+ status: "processing" | "completed" | "failed";
96
+ error?: string;
97
+ }
98
+
99
+ declare function FeedbackWidget({ apiKey, position, theme, accentColor, allowVoice, allowText, allowScreenshots, maxVoiceDuration, user, metadata, onOpen, onClose, onSubmit, onError, triggerComponent, labels, }: FeedbackWidgetProps): react_jsx_runtime.JSX.Element | null;
100
+
101
+ interface FeedbackPanelProps {
102
+ isOpen: boolean;
103
+ onClose: () => void;
104
+ apiKey: string;
105
+ apiBaseUrl?: string;
106
+ accentColor?: string;
107
+ allowVoice?: boolean;
108
+ allowText?: boolean;
109
+ allowScreenshots?: boolean;
110
+ maxVoiceDuration?: number;
111
+ user?: FeedbackUser;
112
+ metadata?: Record<string, unknown>;
113
+ labels?: FeedbackLabels;
114
+ onSubmit?: (feedback: FeedbackSubmission) => void;
115
+ onError?: (error: Error) => void;
116
+ }
117
+ declare function FeedbackPanel({ isOpen, onClose, apiKey, apiBaseUrl, accentColor, allowVoice, allowText, allowScreenshots, maxVoiceDuration, user, metadata, labels, onSubmit, onError, }: FeedbackPanelProps): react_jsx_runtime.JSX.Element;
118
+
119
+ interface FeedbackTriggerProps {
120
+ onClick: () => void;
121
+ isOpen: boolean;
122
+ position?: Position;
123
+ accentColor?: string;
124
+ tooltip?: string;
125
+ }
126
+ declare function FeedbackTrigger({ onClick, isOpen, position, accentColor, tooltip, }: FeedbackTriggerProps): react_jsx_runtime.JSX.Element | null;
127
+
128
+ interface VoiceRecorderProps {
129
+ onSubmit: (audioBlob: Blob, duration: number) => Promise<void>;
130
+ isSubmitting: boolean;
131
+ maxDuration?: number;
132
+ accentColor?: string;
133
+ }
134
+ declare function VoiceRecorder({ onSubmit, isSubmitting, maxDuration, accentColor, }: VoiceRecorderProps): react_jsx_runtime.JSX.Element;
135
+
136
+ interface UseFeedbackOptions {
137
+ apiKey: string;
138
+ apiBaseUrl?: string;
139
+ user?: FeedbackUser;
140
+ metadata?: Record<string, unknown>;
141
+ onSubmit?: (feedback: FeedbackSubmission) => void;
142
+ onError?: (error: Error) => void;
143
+ }
144
+ interface UseFeedbackReturn {
145
+ /** Open the feedback panel (if managing state externally) */
146
+ isOpen: boolean;
147
+ /** Set panel open state */
148
+ setIsOpen: (open: boolean) => void;
149
+ /** Open the panel */
150
+ open: () => void;
151
+ /** Close the panel */
152
+ close: () => void;
153
+ /** Toggle panel */
154
+ toggle: () => void;
155
+ /** Submit feedback programmatically */
156
+ submit: (params: Omit<SubmitFeedbackParams, "pagePath" | "pageTitle" | "user" | "metadata">) => Promise<void>;
157
+ /** Whether submission is in progress */
158
+ isSubmitting: boolean;
159
+ /** Last submission result */
160
+ lastSubmission: FeedbackSubmission | null;
161
+ /** Last error */
162
+ error: Error | null;
163
+ }
164
+ /**
165
+ * Headless hook for feedback functionality.
166
+ * Use this to build custom feedback UIs.
167
+ */
168
+ declare function useFeedback({ apiKey, apiBaseUrl, user, metadata, onSubmit, onError, }: UseFeedbackOptions): UseFeedbackReturn;
169
+
170
+ declare class FeedbackApiClient {
171
+ private apiKey;
172
+ private baseUrl;
173
+ constructor(apiKey: string, baseUrl?: string);
174
+ /** Validate API key and get project config */
175
+ validate(): Promise<ApiValidationResponse>;
176
+ /** Submit feedback */
177
+ submit(params: SubmitFeedbackParams): Promise<ApiSubmitResponse>;
178
+ }
179
+ /** Create API client instance */
180
+ declare function createApiClient(apiKey: string, baseUrl?: string): FeedbackApiClient;
181
+
182
+ /** Merge class names conditionally */
183
+ declare function cn(...classes: (string | boolean | undefined | null)[]): string;
184
+ /** Format seconds to MM:SS */
185
+ declare function formatDuration(seconds: number): string;
186
+ /** Check if voice recording is supported */
187
+ declare function isVoiceSupported(): boolean;
188
+
189
+ export { type ApiSubmitResponse, type ApiValidationResponse, FeedbackApiClient, type FeedbackLabels, FeedbackPanel, type FeedbackSubmission, FeedbackTrigger, type FeedbackType, type FeedbackUser, FeedbackWidget, type FeedbackWidgetProps, type Position, type SubmitFeedbackParams, type Theme, VoiceRecorder, cn, createApiClient, formatDuration, isVoiceSupported, useFeedback };
package/dist/index.d.ts ADDED
@@ -0,0 +1,189 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ type FeedbackType = "voice" | "text";
4
+ type Position = "bottom-right" | "bottom-left" | "top-right" | "top-left";
5
+ type Theme = "light" | "dark" | "auto";
6
+ interface FeedbackUser {
7
+ id?: string;
8
+ email?: string;
9
+ name?: string;
10
+ [key: string]: unknown;
11
+ }
12
+ interface FeedbackWidgetProps {
13
+ /** Your API key from feedbackwidget.dev */
14
+ apiKey: string;
15
+ /** Widget position on screen */
16
+ position?: Position;
17
+ /** Color theme */
18
+ theme?: Theme;
19
+ /** Primary accent color (hex) */
20
+ accentColor?: string;
21
+ /** Enable voice recording */
22
+ allowVoice?: boolean;
23
+ /** Enable text input */
24
+ allowText?: boolean;
25
+ /** Enable screenshot uploads */
26
+ allowScreenshots?: boolean;
27
+ /** Max voice recording duration in seconds */
28
+ maxVoiceDuration?: number;
29
+ /** User context attached to feedback */
30
+ user?: FeedbackUser;
31
+ /** Custom metadata attached to every submission */
32
+ metadata?: Record<string, unknown>;
33
+ /** Callback when widget opens */
34
+ onOpen?: () => void;
35
+ /** Callback when widget closes */
36
+ onClose?: () => void;
37
+ /** Callback after successful submission */
38
+ onSubmit?: (feedback: FeedbackSubmission) => void;
39
+ /** Callback on error */
40
+ onError?: (error: Error) => void;
41
+ /** Custom trigger element (replaces default button) */
42
+ triggerComponent?: React.ReactNode;
43
+ /** Customize labels */
44
+ labels?: FeedbackLabels;
45
+ }
46
+ interface FeedbackLabels {
47
+ triggerTooltip?: string;
48
+ panelTitle?: string;
49
+ voiceButton?: string;
50
+ textButton?: string;
51
+ submitButton?: string;
52
+ successMessage?: string;
53
+ placeholder?: string;
54
+ }
55
+ interface FeedbackSubmission {
56
+ id: string;
57
+ type: FeedbackType;
58
+ message?: string;
59
+ audioUrl?: string;
60
+ transcript?: string;
61
+ screenshotUrls?: string[];
62
+ pagePath: string;
63
+ pageTitle: string;
64
+ timestamp: string;
65
+ }
66
+ interface SubmitFeedbackParams {
67
+ type: FeedbackType;
68
+ message?: string;
69
+ audioBlob?: Blob;
70
+ audioDuration?: number;
71
+ screenshots?: File[];
72
+ pagePath: string;
73
+ pageTitle: string;
74
+ user?: FeedbackUser;
75
+ metadata?: Record<string, unknown>;
76
+ }
77
+ interface ApiValidationResponse {
78
+ valid: boolean;
79
+ project?: string;
80
+ plan?: string;
81
+ usage?: {
82
+ submissions: number;
83
+ limit: number;
84
+ resetAt: string;
85
+ };
86
+ features?: {
87
+ voice: boolean;
88
+ screenshots: boolean;
89
+ maxVoiceDuration: number;
90
+ };
91
+ error?: string;
92
+ }
93
+ interface ApiSubmitResponse {
94
+ id: string;
95
+ status: "processing" | "completed" | "failed";
96
+ error?: string;
97
+ }
98
+
99
+ declare function FeedbackWidget({ apiKey, position, theme, accentColor, allowVoice, allowText, allowScreenshots, maxVoiceDuration, user, metadata, onOpen, onClose, onSubmit, onError, triggerComponent, labels, }: FeedbackWidgetProps): react_jsx_runtime.JSX.Element | null;
100
+
101
+ interface FeedbackPanelProps {
102
+ isOpen: boolean;
103
+ onClose: () => void;
104
+ apiKey: string;
105
+ apiBaseUrl?: string;
106
+ accentColor?: string;
107
+ allowVoice?: boolean;
108
+ allowText?: boolean;
109
+ allowScreenshots?: boolean;
110
+ maxVoiceDuration?: number;
111
+ user?: FeedbackUser;
112
+ metadata?: Record<string, unknown>;
113
+ labels?: FeedbackLabels;
114
+ onSubmit?: (feedback: FeedbackSubmission) => void;
115
+ onError?: (error: Error) => void;
116
+ }
117
+ declare function FeedbackPanel({ isOpen, onClose, apiKey, apiBaseUrl, accentColor, allowVoice, allowText, allowScreenshots, maxVoiceDuration, user, metadata, labels, onSubmit, onError, }: FeedbackPanelProps): react_jsx_runtime.JSX.Element;
118
+
119
+ interface FeedbackTriggerProps {
120
+ onClick: () => void;
121
+ isOpen: boolean;
122
+ position?: Position;
123
+ accentColor?: string;
124
+ tooltip?: string;
125
+ }
126
+ declare function FeedbackTrigger({ onClick, isOpen, position, accentColor, tooltip, }: FeedbackTriggerProps): react_jsx_runtime.JSX.Element | null;
127
+
128
+ interface VoiceRecorderProps {
129
+ onSubmit: (audioBlob: Blob, duration: number) => Promise<void>;
130
+ isSubmitting: boolean;
131
+ maxDuration?: number;
132
+ accentColor?: string;
133
+ }
134
+ declare function VoiceRecorder({ onSubmit, isSubmitting, maxDuration, accentColor, }: VoiceRecorderProps): react_jsx_runtime.JSX.Element;
135
+
136
+ interface UseFeedbackOptions {
137
+ apiKey: string;
138
+ apiBaseUrl?: string;
139
+ user?: FeedbackUser;
140
+ metadata?: Record<string, unknown>;
141
+ onSubmit?: (feedback: FeedbackSubmission) => void;
142
+ onError?: (error: Error) => void;
143
+ }
144
+ interface UseFeedbackReturn {
145
+ /** Open the feedback panel (if managing state externally) */
146
+ isOpen: boolean;
147
+ /** Set panel open state */
148
+ setIsOpen: (open: boolean) => void;
149
+ /** Open the panel */
150
+ open: () => void;
151
+ /** Close the panel */
152
+ close: () => void;
153
+ /** Toggle panel */
154
+ toggle: () => void;
155
+ /** Submit feedback programmatically */
156
+ submit: (params: Omit<SubmitFeedbackParams, "pagePath" | "pageTitle" | "user" | "metadata">) => Promise<void>;
157
+ /** Whether submission is in progress */
158
+ isSubmitting: boolean;
159
+ /** Last submission result */
160
+ lastSubmission: FeedbackSubmission | null;
161
+ /** Last error */
162
+ error: Error | null;
163
+ }
164
+ /**
165
+ * Headless hook for feedback functionality.
166
+ * Use this to build custom feedback UIs.
167
+ */
168
+ declare function useFeedback({ apiKey, apiBaseUrl, user, metadata, onSubmit, onError, }: UseFeedbackOptions): UseFeedbackReturn;
169
+
170
+ declare class FeedbackApiClient {
171
+ private apiKey;
172
+ private baseUrl;
173
+ constructor(apiKey: string, baseUrl?: string);
174
+ /** Validate API key and get project config */
175
+ validate(): Promise<ApiValidationResponse>;
176
+ /** Submit feedback */
177
+ submit(params: SubmitFeedbackParams): Promise<ApiSubmitResponse>;
178
+ }
179
+ /** Create API client instance */
180
+ declare function createApiClient(apiKey: string, baseUrl?: string): FeedbackApiClient;
181
+
182
+ /** Merge class names conditionally */
183
+ declare function cn(...classes: (string | boolean | undefined | null)[]): string;
184
+ /** Format seconds to MM:SS */
185
+ declare function formatDuration(seconds: number): string;
186
+ /** Check if voice recording is supported */
187
+ declare function isVoiceSupported(): boolean;
188
+
189
+ export { type ApiSubmitResponse, type ApiValidationResponse, FeedbackApiClient, type FeedbackLabels, FeedbackPanel, type FeedbackSubmission, FeedbackTrigger, type FeedbackType, type FeedbackUser, FeedbackWidget, type FeedbackWidgetProps, type Position, type SubmitFeedbackParams, type Theme, VoiceRecorder, cn, createApiClient, formatDuration, isVoiceSupported, useFeedback };