@dev-fastn-ai/react-core 2.4.3 → 2.4.5

package/README.md

@@ -603,15 +603,7 @@ For fields of type `select` or `multi-select`, use the `useFieldOptions` hook to
 ```tsx
 import { useFieldOptions } from "@fastn-ai/react-core";
 
-interface SelectFieldProps {
-  field: any;
-  value: any;
-  onChange: (value: any) => void;
-  isMulti?: boolean;
-  context?: any;
-}
-
-function SelectField({ field, value, onChange, isMulti = false, context }: SelectFieldProps) {
+function SelectField({ field, value, onChange, isMulti = false }) {
   const {
     options,
     loading,
@@ -621,9 +613,9 @@ function SelectField({ field, value, onChange, isMulti = false, context }: Selec
     error,
     search,
     totalLoadedOptions,
-  } = useFieldOptions(field, context);
+  } = useFieldOptions(field);
 
-  function handleInputChange(e: React.ChangeEvent<HTMLInputElement>) {
+  function handleInputChange(e) {
     search(e.target.value);
   }
 
@@ -631,7 +623,7 @@ function SelectField({ field, value, onChange, isMulti = false, context }: Selec
     if (hasNext && !loadingMore) loadMore();
   }
 
-  function handleSelectChange(selectedOptions: Array<{ label: string; value: any }>) {
+  function handleSelectChange(selectedOptions) {
     if (isMulti) {
       // For multi-select, value should be an array of { label, value } objects
       const selectedValues = selectedOptions.map(option => ({
@@ -672,12 +664,12 @@ function SelectField({ field, value, onChange, isMulti = false, context }: Selec
       
       <select
         multiple={isMulti}
-        value={isMulti ? (value || []).map((v: any) => v.value) : (value?.value || '')}
-        onChange={(e: React.ChangeEvent<HTMLSelectElement>) => {
+        value={isMulti ? (value || []).map(v => v.value) : (value?.value || '')}
+        onChange={(e) => {
           if (isMulti) {
             const selectedOptions = Array.from(e.target.selectedOptions).map(option => {
               const opt = options.find(o => o.value === option.value);
-              return { label: opt?.label || '', value: opt?.value };
+              return { label: opt.label, value: opt.value };
             });
             handleSelectChange(selectedOptions);
           } else {
@@ -721,52 +713,6 @@ function SelectField({ field, value, onChange, isMulti = false, context }: Selec
 }
 ```
 
-#### **Using Context with Select Fields**
-
-The `useFieldOptions` hook now supports passing context data to the `getOptions` and `loadMore` methods. This is useful when you need to pass additional form data or parameters to filter or customize the options:
-
-```tsx
-function SelectFieldWithContext({ field, value, onChange, formData }) {
-  // Pass form data as context to the hook
-  const context = formData; // This will be passed to getOptions and loadMore
-  
-  const {
-    options,
-    loading,
-    loadingMore,
-    hasNext,
-    loadMore,
-    error,
-    search,
-    totalLoadedOptions,
-  } = useFieldOptions(field, context);
-
-  // ... rest of the component logic remains the same
-}
-```
-
-**When to use context:**
-- When options depend on other form field values
-- When you need to pass authentication tokens or user-specific data
-- When implementing cascading dropdowns (e.g., country → state → city)
-- When options need to be filtered based on current form state
-
-**Example with cascading dropdowns:**
-```tsx
-function CascadingSelectField({ field, value, onChange, parentValue }) {
-  // Create context with parent field value
-  const context = {
-    parentField: parentValue,
-    // Add other relevant form data
-  };
-  
-  const { options, loading, error, search } = useFieldOptions(field, context);
-  
-  // The getOptions method in your field.optionsSource will receive this context
-  // and can use it to filter options based on the parent selection
-}
-```
-
 ### **Google Drive Picker Fields**
 
 For Google Drive file picker fields, handle the file selection flow. These fields also work with `{ label, value }` objects:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dev-fastn-ai/react-core",
-  "version": "2.4.3",
+  "version": "2.4.5",
   "description": "React hooks and components for integrating Fastn AI connector marketplace into your applications. Built on top of @fastn-ai/core with React Query for optimal performance.",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",