@feedvalue/react 0.1.1 → 0.1.4

package/README.md

@@ -153,9 +153,46 @@ export function FeedbackForm() {
 }
 ```
 
+### Custom Fields
+
+Custom fields allow you to collect structured data beyond the main feedback message. **Custom fields must be defined in your widget configuration on the FeedValue dashboard before use.**
+
+1. Go to your widget settings in the FeedValue dashboard
+2. Add custom fields with types: `text`, `email`, or `emoji`
+3. Use `customFieldValues` when submitting:
+
+```tsx
+'use client';
+
+import { useFeedValue } from '@feedvalue/react';
+
+export function DetailedFeedback() {
+  const { submit, isReady } = useFeedValue();
+
+  const handleSubmit = async () => {
+    await submit({
+      message: 'Detailed feedback',
+      customFieldValues: {
+        // Field IDs must match those defined in your widget configuration
+        name: 'John Doe',
+        category: 'feature',
+      },
+    });
+  };
+
+  return (
+    <button onClick={handleSubmit} disabled={!isReady}>
+      Submit Feedback
+    </button>
+  );
+}
+```
+
+> **Important**: The field IDs in `customFieldValues` must match the field IDs defined in your widget configuration on the dashboard.
+
 ### User Identification
 
-User data is automatically included with feedback submissions:
+Attach user context to feedback submissions. This data is **not shown in the widget UI** but is stored with the submission and visible in your FeedValue dashboard:
 
 ```tsx
 'use client';
@@ -183,6 +220,10 @@ export function UserIdentifier({ user }) {
 }
 ```
 
+> **User Data vs Custom Fields**
+> - **User data** (`identify`/`setData`): Hidden from users, automatically attached to submissions. Use for internal context like user IDs, subscription plans, etc.
+> - **Custom fields** (`customFieldValues`): Shown as form inputs in the widget. Users fill these in themselves. Must be defined in widget configuration first.
+
 ## API Reference
 
 ### `<FeedValueProvider>`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@feedvalue/react",
-  "version": "0.1.1",
+  "version": "0.1.4",
   "description": "FeedValue React SDK - Provider, Hooks, and Components for React 18+",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -23,35 +23,25 @@
     "README.md"
   ],
   "sideEffects": false,
-  "scripts": {
-    "build": "tsup",
-    "dev": "tsup --watch",
-    "lint": "eslint src",
-    "test": "vitest run",
-    "test:watch": "vitest",
-    "test:coverage": "vitest run --coverage",
-    "typecheck": "tsc --noEmit",
-    "clean": "rm -rf dist"
-  },
   "peerDependencies": {
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
   },
   "dependencies": {
-    "@feedvalue/core": "workspace:^"
+    "@feedvalue/core": "^0.1.2"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.1.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
-    "@vitest/coverage-v8": "^2.1.0",
-    "happy-dom": "^15.11.0",
+    "@vitest/coverage-v8": "^4.0.18",
+    "happy-dom": "^20.3.9",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "tsup": "^8.3.0",
     "typescript": "^5.7.0",
-    "vitest": "^2.1.0"
+    "vitest": "^4.0.18"
   },
   "publishConfig": {
     "access": "public"
@@ -77,5 +67,15 @@
   ],
   "engines": {
     "node": ">=18"
+  },
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "lint": "eslint src",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:coverage": "vitest run --coverage",
+    "typecheck": "tsc --noEmit",
+    "clean": "rm -rf dist"
   }
-}
+}