@david-xpn/llm-ui-feedback 0.1.0 → 0.1.1

package/README.md

@@ -45,6 +45,7 @@ That's it. A floating `+` button appears in the bottom-right corner. Click it to
 | `position` | `'bottom-right' \| 'bottom-left' \| 'top-right' \| 'top-left'` | `'bottom-right'` | Corner position for the floating button |
 | `buttonColor` | `string` | `'#3b82f6'` | Hex color for the FAB button |
 | `hotkey` | `string` | `undefined` | Keyboard shortcut to toggle pick mode (e.g. `'Alt+F'`) |
+| `enabled` | `boolean` | `true` | Whether the widget is rendered. Use to conditionally show the widget. |
 
 ### Example with all props
 
@@ -56,6 +57,21 @@ That's it. A floating `+` button appears in the bottom-right corner. Click it to
 />
 ```
 
+### Conditional rendering
+
+Use the `enabled` prop to control when the widget is visible:
+
+```tsx
+// Only on localhost
+<FeedbackWidget enabled={location.hostname === 'localhost'} />
+
+// Only for admins
+<FeedbackWidget enabled={user.isSuperAdmin} />
+
+// Only in dev/staging
+<FeedbackWidget enabled={process.env.NODE_ENV !== 'production'} />
+```
+
 ## How It Works
 
 1. User clicks the `+` floating button to enter **pick mode**

package/dist/index.d.mts

@@ -14,10 +14,41 @@ interface FeedbackEntry {
     elementText: string;
     comment: string;
     screenshot: string | null;
+    /** S3 object key for backends that store screenshots separately. */
+    screenshotKey?: string;
     prompt: string;
+    feedbackGroupId?: string;
+}
+interface Draft {
+    id: string;
+    timestamp: string;
+    url: string;
+    componentPath: string;
+    components: ComponentInfo[];
+    elementText: string;
+    comment: string;
+    screenshotKey?: string;
+    prompt: string;
+    createdBy: string;
+    createdByEmail?: string;
+    createdByName?: string;
+}
+type FeedbackGroupStatus = 'created' | 'in_progress' | 'resolved' | 'skipped' | 'will_not_do';
+interface FeedbackGroup {
+    id: string;
+    title: string;
+    createdAt: string;
+    createdBy: string;
+    createdByEmail?: string;
+    createdByName?: string;
+    status?: FeedbackGroupStatus;
+    shareToken?: string;
+    entryCount?: number;
 }
 interface CapturedContext {
     url: string;
+    urlPath: string;
+    reportedAt: string;
     componentPath: string;
     components: ComponentInfo[];
     elementText: string;
@@ -26,17 +57,17 @@ interface CapturedContext {
 }
 
 interface FeedbackWidgetProps {
-    /** Corner position for the floating buttons. Default: 'bottom-right' */
+    /** Tenant identifier — required. */
+    clientId: string;
+    /** Backend API URL. Defaults to the production Lambda Function URL. */
+    apiUrl?: string;
+    /** Corner position for the floating button. Default: 'bottom-right' */
     position?: WidgetPosition;
-    /** Hex color for the FAB and badge accent. Default: '#3b82f6' */
+    /** Hex color for the FAB accent. Default: '#3b82f6' */
     buttonColor?: string;
-    /** Keyboard shortcut to toggle pick mode, e.g. 'Alt+F'. No default (opt-in only). */
+    /** Keyboard shortcut to toggle the panel, e.g. 'Alt+F'. No default (opt-in only). */
     hotkey?: string;
 }
-declare function FeedbackWidget({ position, buttonColor, hotkey, }?: FeedbackWidgetProps): React.ReactPortal;
-
-declare function loadEntries(): FeedbackEntry[];
-declare function deleteEntry(id: string): void;
-declare function clearEntries(): void;
+declare function FeedbackWidget({ clientId, apiUrl, position, buttonColor, hotkey, }: FeedbackWidgetProps): React.ReactPortal | null;
 
-export { type CapturedContext, type ComponentInfo, type FeedbackEntry, FeedbackWidget, type FeedbackWidgetProps, type WidgetPosition, clearEntries, deleteEntry, loadEntries };
+export { type CapturedContext, type ComponentInfo, type Draft, type FeedbackEntry, type FeedbackGroup, FeedbackWidget, type FeedbackWidgetProps, type WidgetPosition };

package/dist/index.d.ts

@@ -14,10 +14,41 @@ interface FeedbackEntry {
     elementText: string;
     comment: string;
     screenshot: string | null;
+    /** S3 object key for backends that store screenshots separately. */
+    screenshotKey?: string;
     prompt: string;
+    feedbackGroupId?: string;
+}
+interface Draft {
+    id: string;
+    timestamp: string;
+    url: string;
+    componentPath: string;
+    components: ComponentInfo[];
+    elementText: string;
+    comment: string;
+    screenshotKey?: string;
+    prompt: string;
+    createdBy: string;
+    createdByEmail?: string;
+    createdByName?: string;
+}
+type FeedbackGroupStatus = 'created' | 'in_progress' | 'resolved' | 'skipped' | 'will_not_do';
+interface FeedbackGroup {
+    id: string;
+    title: string;
+    createdAt: string;
+    createdBy: string;
+    createdByEmail?: string;
+    createdByName?: string;
+    status?: FeedbackGroupStatus;
+    shareToken?: string;
+    entryCount?: number;
 }
 interface CapturedContext {
     url: string;
+    urlPath: string;
+    reportedAt: string;
     componentPath: string;
     components: ComponentInfo[];
     elementText: string;
@@ -26,17 +57,17 @@ interface CapturedContext {
 }
 
 interface FeedbackWidgetProps {
-    /** Corner position for the floating buttons. Default: 'bottom-right' */
+    /** Tenant identifier — required. */
+    clientId: string;
+    /** Backend API URL. Defaults to the production Lambda Function URL. */
+    apiUrl?: string;
+    /** Corner position for the floating button. Default: 'bottom-right' */
     position?: WidgetPosition;
-    /** Hex color for the FAB and badge accent. Default: '#3b82f6' */
+    /** Hex color for the FAB accent. Default: '#3b82f6' */
     buttonColor?: string;
-    /** Keyboard shortcut to toggle pick mode, e.g. 'Alt+F'. No default (opt-in only). */
+    /** Keyboard shortcut to toggle the panel, e.g. 'Alt+F'. No default (opt-in only). */
     hotkey?: string;
 }
-declare function FeedbackWidget({ position, buttonColor, hotkey, }?: FeedbackWidgetProps): React.ReactPortal;
-
-declare function loadEntries(): FeedbackEntry[];
-declare function deleteEntry(id: string): void;
-declare function clearEntries(): void;
+declare function FeedbackWidget({ clientId, apiUrl, position, buttonColor, hotkey, }: FeedbackWidgetProps): React.ReactPortal | null;
 
-export { type CapturedContext, type ComponentInfo, type FeedbackEntry, FeedbackWidget, type FeedbackWidgetProps, type WidgetPosition, clearEntries, deleteEntry, loadEntries };
+export { type CapturedContext, type ComponentInfo, type Draft, type FeedbackEntry, type FeedbackGroup, FeedbackWidget, type FeedbackWidgetProps, type WidgetPosition };