From 8a72d3a50d09a4d9cb8b84f65325975cc80071a4 Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Fri, 11 Apr 2025 08:40:14 +0200
Subject: [PATCH 01/12] export typeahead utils

---
 src/index.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/index.ts b/src/index.ts
index 1aed903..434f057 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -8,5 +8,9 @@ export * from "./lib/types/LabelValueOption";
 export * from "./lib/DatePickerInput";
 export * from "./lib/ColorPickerInput";
 export * from "./lib/helpers/dateUtils";
+export * from "./lib/helpers/mui";
+export * from "./lib/helpers/typeahead";
+export * from "./lib/hooks/useDebounceHook";
+export * from "./lib/hooks/useSafeNameId";
 
 export { useFormContext } from "./lib/context/FormContext";

From f8dc2b0a903de315cb0b7d6e9032d320b15674a3 Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Wed, 16 Apr 2025 12:38:57 +0200
Subject: [PATCH 02/12] integrate placeholder fix and changelog

---
 CHANGELOG.md                                             | 8 ++++++++
 .../component/Typeahead/AsyncTypeaheadInput.cy.tsx       | 6 +++---
 .../component/Typeahead/StaticTypeaheadInput.cy.tsx      | 9 +++------
 src/index.ts                                             | 1 -
 src/lib/AsyncTypeaheadInput.tsx                          | 2 +-
 src/lib/StaticTypeaheadInput.tsx                         | 2 +-
 6 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4503f74..c71d00b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Changed
+
+- Export typeahead helpers and `useDebounceHook` hook.
+
+### Fixed
+
+- Hide placeholder on multiple `AsyncTypeAheadInput` and `StaticTypeAheadInput` when at least one option is selected.
+
 ## [3.1.1] - 2025-04-10
 
 ### Fixed
diff --git a/cypress/cypress/component/Typeahead/AsyncTypeaheadInput.cy.tsx b/cypress/cypress/component/Typeahead/AsyncTypeaheadInput.cy.tsx
index 99dbe00..05f8998 100644
--- a/cypress/cypress/component/Typeahead/AsyncTypeaheadInput.cy.tsx
+++ b/cypress/cypress/component/Typeahead/AsyncTypeaheadInput.cy.tsx
@@ -641,9 +641,6 @@ it("placeholder", () => {
         onSubmit={() => {
           // Nothing to do
         }}
-        defaultValues={{
-          [name]: simpleOptions,
-        }}
       >
         <AsyncTypeaheadInput
           multiple
@@ -662,7 +659,10 @@ it("placeholder", () => {
       </Form>
     </div>,
   );
+
   cy.get(`#${name}`).should("have.attr", "placeholder", placeholder);
+  simpleOptions.slice(0, 2).forEach((option) => selectOption(name, option));
+  cy.get(`#${name}`).should("not.have.attr", "placeholder");
 });
 
 it("test on input change", () => {
diff --git a/cypress/cypress/component/Typeahead/StaticTypeaheadInput.cy.tsx b/cypress/cypress/component/Typeahead/StaticTypeaheadInput.cy.tsx
index 8ec1066..ad64378 100644
--- a/cypress/cypress/component/Typeahead/StaticTypeaheadInput.cy.tsx
+++ b/cypress/cypress/component/Typeahead/StaticTypeaheadInput.cy.tsx
@@ -398,12 +398,7 @@ it("placeholder", () => {
 
   cy.mount(
     <div className="p-4">
-      <Form
-        onSubmit={cy.spy().as("onSubmitSpy")}
-        defaultValues={{
-          [name]: simpleOptions,
-        }}
-      >
+      <Form onSubmit={cy.spy().as("onSubmitSpy")}>
         <StaticTypeaheadInput multiple name={name} label={name} options={simpleOptions} placeholder={placeholder} />
         <input type="submit" className="mt-4" />
       </Form>
@@ -411,6 +406,8 @@ it("placeholder", () => {
   );
 
   cy.get(`#${name}`).should("have.attr", "placeholder", placeholder);
+  simpleOptions.slice(0, 2).forEach((option) => selectOption(name, option));
+  cy.get(`#${name}`).should("not.have.attr", "placeholder");
 });
 
 it("test on input change", () => {
diff --git a/src/index.ts b/src/index.ts
index 434f057..8831d0a 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -11,6 +11,5 @@ export * from "./lib/helpers/dateUtils";
 export * from "./lib/helpers/mui";
 export * from "./lib/helpers/typeahead";
 export * from "./lib/hooks/useDebounceHook";
-export * from "./lib/hooks/useSafeNameId";
 
 export { useFormContext } from "./lib/context/FormContext";
diff --git a/src/lib/AsyncTypeaheadInput.tsx b/src/lib/AsyncTypeaheadInput.tsx
index 42f8662..c2892a2 100644
--- a/src/lib/AsyncTypeaheadInput.tsx
+++ b/src/lib/AsyncTypeaheadInput.tsx
@@ -206,7 +206,7 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
             hideValidationMessage={hideValidationMessage}
             useBootstrapStyle={useBootstrapStyle}
             helpText={helpText}
-            placeholder={placeholder}
+            placeholder={multiple && value.length > 0 ? undefined : placeholder}
             paginationIcon={paginationIcon}
             paginationText={paginationText}
             variant={variant}
diff --git a/src/lib/StaticTypeaheadInput.tsx b/src/lib/StaticTypeaheadInput.tsx
index b72e47c..ad59824 100644
--- a/src/lib/StaticTypeaheadInput.tsx
+++ b/src/lib/StaticTypeaheadInput.tsx
@@ -169,7 +169,7 @@ const StaticTypeaheadInput = <T extends FieldValues>(props: StaticTypeaheadInput
             hideValidationMessage={hideValidationMessage}
             useBootstrapStyle={useBootstrapStyle}
             helpText={helpText}
-            placeholder={placeholder}
+            placeholder={multiple && value.length > 0 ? undefined : placeholder}
             paginationIcon={paginationIcon}
             paginationText={paginationText}
             variant={variant}

From a8573843aaf2a7d2b9f1de219c05ce930b328464 Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Wed, 16 Apr 2025 15:27:23 +0200
Subject: [PATCH 03/12] adjust typescript

---
 src/lib/AsyncTypeaheadInput.tsx  | 10 ++++++----
 src/lib/StaticTypeaheadInput.tsx |  4 +++-
 src/lib/helpers/typeahead.tsx    | 20 ++++++++++----------
 src/lib/hooks/useDebounceHook.ts |  4 ++--
 4 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/lib/AsyncTypeaheadInput.tsx b/src/lib/AsyncTypeaheadInput.tsx
index c2892a2..cab92da 100644
--- a/src/lib/AsyncTypeaheadInput.tsx
+++ b/src/lib/AsyncTypeaheadInput.tsx
@@ -69,8 +69,8 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
     autocompleteProps,
   } = props;
 
-  const [options, setOptions] = useState<TypeaheadOption[]>(defaultOptions);
-  const [value, setValue] = useState<TypeaheadOption[]>(defaultSelected);
+  const [options, setOptions] = useState<TypeaheadOptions>(defaultOptions);
+  const [value, setValue] = useState<TypeaheadOptions>(defaultSelected);
   const [page, setPage] = useState(1);
   const [loadMoreOptions, setLoadMoreOptions] = useState(limitResults !== undefined && limitResults < defaultOptions.length);
   const { name, id } = useSafeNameId(props.name ?? "", props.id);
@@ -107,7 +107,7 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
           defaultSelected.map((x) => (typeof x === "string" ? x : x.value)),
         );
       },
-      updateValues: (options: TypeaheadOption[]) => {
+      updateValues: (options: TypeaheadOptions) => {
         const values = convertAutoCompleteOptionsToStringArray(options);
         const finalValue = multiple ? values : values[0];
         setValue(options);
@@ -171,7 +171,9 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
           field.onBlur();
         }}
         onChange={(_e, value) => {
-          const optionsArray = value ? (Array.isArray(value) ? value : [value]) : undefined;
+          // value is typed as Autocomplete<Value> (aka TypeaheadOption) or an array of Autocomplete<Value> (aka TypeaheadOption[])
+          // however, the component is not intended to be used with mixed types
+          const optionsArray = value ? (Array.isArray(value) ? value : [value]) as TypeaheadOptions : undefined;
           setValue(optionsArray ?? []);
           const values = convertAutoCompleteOptionsToStringArray(optionsArray);
           const finalValue = multiple ? values : values[0];
diff --git a/src/lib/StaticTypeaheadInput.tsx b/src/lib/StaticTypeaheadInput.tsx
index ad59824..715281a 100644
--- a/src/lib/StaticTypeaheadInput.tsx
+++ b/src/lib/StaticTypeaheadInput.tsx
@@ -140,7 +140,9 @@ const StaticTypeaheadInput = <T extends FieldValues>(props: StaticTypeaheadInput
           field.onBlur();
         }}
         onChange={(_, value) => {
-          const optionsArray = value ? (Array.isArray(value) ? value : [value]) : undefined;
+          // value is typed as Autocomplete<Value> (aka TypeaheadOption) or an array of Autocomplete<Value> (aka TypeaheadOption[])
+          // however, the component is not intended to be used with mixed types
+          const optionsArray = value ? (Array.isArray(value) ? value : [value]) as TypeaheadOptions : undefined;
           const values = convertAutoCompleteOptionsToStringArray(optionsArray);
           const finalValue = multiple ? values : values[0];
           clearErrors(field.name);
diff --git a/src/lib/helpers/typeahead.tsx b/src/lib/helpers/typeahead.tsx
index 7aef6be..de85e7a 100644
--- a/src/lib/helpers/typeahead.tsx
+++ b/src/lib/helpers/typeahead.tsx
@@ -1,12 +1,12 @@
 import { AutocompleteRenderOptionState } from "@mui/material/Autocomplete";
 import { LabelValueOption } from "../types/LabelValueOption";
-import { TypeaheadOption } from "../types/Typeahead";
+import { TypeaheadOption, TypeaheadOptions } from "../types/Typeahead";
 import AutosuggestHighlightMatch from "autosuggest-highlight/match";
 import AutosuggestHighlightParse from "autosuggest-highlight/parse";
 
-const isStringArray = (options: TypeaheadOption[]): boolean => options.length > 0 && options.every((value) => typeof value === "string");
+const isStringArray = (options: TypeaheadOptions): boolean => options.length > 0 && (options as TypeaheadOption[]).every((value) => typeof value === "string");
 
-const convertAutoCompleteOptionsToStringArray = (options: TypeaheadOption[] | undefined): string[] => {
+const convertAutoCompleteOptionsToStringArray = (options: TypeaheadOptions | undefined): string[] => {
   if (!options) {
     return [];
   }
@@ -18,29 +18,29 @@ const convertAutoCompleteOptionsToStringArray = (options: TypeaheadOption[] | un
   return (options as LabelValueOption[]).map((option) => option.value) as string[];
 };
 
-const getSingleAutoCompleteValue = (options: TypeaheadOption[], fieldValue: string | number | undefined): TypeaheadOption[] => {
+const getSingleAutoCompleteValue = (options: TypeaheadOptions, fieldValue: string | number | undefined): TypeaheadOptions => {
   if (fieldValue == undefined) {
     return [];
   }
-  return options.filter((x) =>
+  return (options as TypeaheadOption[]).filter((x) =>
     // loose equality check to handle different types between form value and option value
     typeof x === "string" ? x == fieldValue : x.value == fieldValue,
-  );
+  ) as TypeaheadOptions;
 };
 
-const getMultipleAutoCompleteValue = (options: TypeaheadOption[], fieldValue: (string | number)[] | undefined): TypeaheadOption[] => {
+const getMultipleAutoCompleteValue = (options: TypeaheadOptions, fieldValue: (string | number)[] | undefined): TypeaheadOptions => {
   if (fieldValue == undefined) {
     return [];
   }
-  return options.filter((x) =>
+  return (options as TypeaheadOption[]).filter((x: TypeaheadOption) =>
     typeof x === "string"
       ? fieldValue.includes(x)
       : // ensure that form values matches options values even if they are of different types
         fieldValue.map(String).includes(String(x.value as string | number)),
-  );
+  ) as TypeaheadOptions;
 };
 
-const sortOptionsByGroup = (options: TypeaheadOption[]): TypeaheadOption[] =>
+const sortOptionsByGroup = (options: TypeaheadOptions): TypeaheadOptions =>
   options.sort((x, y) => (typeof x === "string" ? x : x.group?.name ?? "").localeCompare(typeof y === "string" ? y : y.group?.name ?? ""));
 
 const groupOptions = (option: TypeaheadOption): string => (typeof option === "string" ? option : option.group?.name ?? "");
diff --git a/src/lib/hooks/useDebounceHook.ts b/src/lib/hooks/useDebounceHook.ts
index c97f72c..31d4595 100644
--- a/src/lib/hooks/useDebounceHook.ts
+++ b/src/lib/hooks/useDebounceHook.ts
@@ -1,12 +1,12 @@
 import { useEffect, useRef, useState } from "react";
-import { TypeaheadOption, TypeaheadOptions } from "../types/Typeahead";
+import { TypeaheadOptions } from "../types/Typeahead";
 
 interface DebounceSearch {
   query: string;
   delay: number;
 }
 
-const useDebounceHook = (queryFn: (query: string) => Promise<TypeaheadOptions>, setOptions: (results: TypeaheadOption[]) => void) => {
+const useDebounceHook = (queryFn: (query: string) => Promise<TypeaheadOptions>, setOptions: (results: TypeaheadOptions) => void) => {
   const queryRef = useRef("");
   const [isLoading, setIsLoading] = useState(false);
   const [debounceSearch, setDebounceSearch] = useState<DebounceSearch | undefined>(undefined);

From e1267ef282dd50afce477920d143f4a4ee555a8c Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Mon, 28 Apr 2025 09:34:08 +0200
Subject: [PATCH 04/12] prepare-pr

---
 CHANGELOG.md                     | 1 +
 src/lib/AsyncTypeaheadInput.tsx  | 2 +-
 src/lib/StaticTypeaheadInput.tsx | 2 +-
 src/lib/helpers/typeahead.tsx    | 5 +++--
 4 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index c71d00b..dc11842 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - Export typeahead helpers and `useDebounceHook` hook.
+- Typeahead helpers return type from `TypeaheadOption[]` to `TypeaheadOptions`, since typeaheads are not intended to be used with mixed `string` and `LabelValueOption` options.
 
 ### Fixed
 
diff --git a/src/lib/AsyncTypeaheadInput.tsx b/src/lib/AsyncTypeaheadInput.tsx
index cab92da..c2850f3 100644
--- a/src/lib/AsyncTypeaheadInput.tsx
+++ b/src/lib/AsyncTypeaheadInput.tsx
@@ -173,7 +173,7 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
         onChange={(_e, value) => {
           // value is typed as Autocomplete<Value> (aka TypeaheadOption) or an array of Autocomplete<Value> (aka TypeaheadOption[])
           // however, the component is not intended to be used with mixed types
-          const optionsArray = value ? (Array.isArray(value) ? value : [value]) as TypeaheadOptions : undefined;
+          const optionsArray = value ? ((Array.isArray(value) ? value : [value]) as TypeaheadOptions) : undefined;
           setValue(optionsArray ?? []);
           const values = convertAutoCompleteOptionsToStringArray(optionsArray);
           const finalValue = multiple ? values : values[0];
diff --git a/src/lib/StaticTypeaheadInput.tsx b/src/lib/StaticTypeaheadInput.tsx
index 715281a..9e29134 100644
--- a/src/lib/StaticTypeaheadInput.tsx
+++ b/src/lib/StaticTypeaheadInput.tsx
@@ -142,7 +142,7 @@ const StaticTypeaheadInput = <T extends FieldValues>(props: StaticTypeaheadInput
         onChange={(_, value) => {
           // value is typed as Autocomplete<Value> (aka TypeaheadOption) or an array of Autocomplete<Value> (aka TypeaheadOption[])
           // however, the component is not intended to be used with mixed types
-          const optionsArray = value ? (Array.isArray(value) ? value : [value]) as TypeaheadOptions : undefined;
+          const optionsArray = value ? ((Array.isArray(value) ? value : [value]) as TypeaheadOptions) : undefined;
           const values = convertAutoCompleteOptionsToStringArray(optionsArray);
           const finalValue = multiple ? values : values[0];
           clearErrors(field.name);
diff --git a/src/lib/helpers/typeahead.tsx b/src/lib/helpers/typeahead.tsx
index de85e7a..d552b32 100644
--- a/src/lib/helpers/typeahead.tsx
+++ b/src/lib/helpers/typeahead.tsx
@@ -4,7 +4,8 @@ import { TypeaheadOption, TypeaheadOptions } from "../types/Typeahead";
 import AutosuggestHighlightMatch from "autosuggest-highlight/match";
 import AutosuggestHighlightParse from "autosuggest-highlight/parse";
 
-const isStringArray = (options: TypeaheadOptions): boolean => options.length > 0 && (options as TypeaheadOption[]).every((value) => typeof value === "string");
+const isStringArray = (options: TypeaheadOptions): boolean =>
+  options.length > 0 && (options as TypeaheadOption[]).every((value) => typeof value === "string");
 
 const convertAutoCompleteOptionsToStringArray = (options: TypeaheadOptions | undefined): string[] => {
   if (!options) {
@@ -32,7 +33,7 @@ const getMultipleAutoCompleteValue = (options: TypeaheadOptions, fieldValue: (st
   if (fieldValue == undefined) {
     return [];
   }
-  return (options as TypeaheadOption[]).filter((x: TypeaheadOption) =>
+  return (options as TypeaheadOption[]).filter((x) =>
     typeof x === "string"
       ? fieldValue.includes(x)
       : // ensure that form values matches options values even if they are of different types

From 12211f1448a0b73a6d7b8e9795a8e7633706d4ae Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Wed, 30 Apr 2025 11:41:20 +0200
Subject: [PATCH 05/12] fixed

---
 CHANGELOG.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index dc11842..99f5cb1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,11 +10,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - Export typeahead helpers and `useDebounceHook` hook.
-- Typeahead helpers return type from `TypeaheadOption[]` to `TypeaheadOptions`, since typeaheads are not intended to be used with mixed `string` and `LabelValueOption` options.
 
 ### Fixed
 
 - Hide placeholder on multiple `AsyncTypeAheadInput` and `StaticTypeAheadInput` when at least one option is selected.
+- Typeahead helpers return type from `TypeaheadOption[]` to `TypeaheadOptions`, since typeaheads are not intended to be used with mixed `string` and `LabelValueOption` options.
 
 ## [3.1.1] - 2025-04-10
 

From 827933f10a0385b4f14e926fecf68a5fb0eb03da Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Tue, 21 Oct 2025 13:12:35 +0200
Subject: [PATCH 06/12] try

---
 src/lib/components/Input/InputInternal.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/Input/InputInternal.tsx b/src/lib/components/Input/InputInternal.tsx
index 892591d..5171e46 100644
--- a/src/lib/components/Input/InputInternal.tsx
+++ b/src/lib/components/Input/InputInternal.tsx
@@ -43,6 +43,7 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
   } = useFormContext();
 
   const { ref, ...rest } = register(name, {
+    disabled: formDisabled || disabled, // FIXME this one unregister on submit
     setValueAs: (value: string) => (value === UNDEFINED_OPTION_VALUE ? undefined : value),
   });
 
@@ -69,7 +70,7 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
         maxLength={maxLength}
         rows={textAreaRows}
         multiple={multiple}
-        disabled={formDisabled || disabled}
+        disabled={formDisabled || disabled} // this one just disables the input
         plaintext={plainText}
         style={plainText ? { color: "black", marginLeft: 10, ...style } : { ...style }}
         placeholder={placeholder}

From 87ed553c113c1aa2d3f5545140b630b334e37bdc Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Tue, 21 Oct 2025 14:55:54 +0200
Subject: [PATCH 07/12] x

---
 src/lib/components/Input/InputInternal.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/lib/components/Input/InputInternal.tsx b/src/lib/components/Input/InputInternal.tsx
index 5171e46..aca684a 100644
--- a/src/lib/components/Input/InputInternal.tsx
+++ b/src/lib/components/Input/InputInternal.tsx
@@ -70,7 +70,7 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
         maxLength={maxLength}
         rows={textAreaRows}
         multiple={multiple}
-        disabled={formDisabled || disabled} // this one just disables the input
+        // disabled={formDisabled || disabled} // this one just disables the input
         plaintext={plainText}
         style={plainText ? { color: "black", marginLeft: 10, ...style } : { ...style }}
         placeholder={placeholder}

From 7fc7ff47b13b297744208b526870d4481b9ed0b5 Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Tue, 21 Oct 2025 15:55:05 +0200
Subject: [PATCH 08/12] try on controllers

---
 src/lib/AsyncTypeaheadInput.tsx                | 3 ++-
 src/lib/DatePickerInput.tsx                    | 1 +
 src/lib/FormattedInput.tsx                     | 1 +
 src/lib/RatingInput.tsx                        | 1 +
 src/lib/StaticTypeaheadInput.tsx               | 4 +++-
 src/lib/components/ColorPicker/ColorPicker.tsx | 1 +
 6 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/lib/AsyncTypeaheadInput.tsx b/src/lib/AsyncTypeaheadInput.tsx
index 26a1b84..8128288 100644
--- a/src/lib/AsyncTypeaheadInput.tsx
+++ b/src/lib/AsyncTypeaheadInput.tsx
@@ -83,6 +83,7 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
   const { name, id } = useSafeNameId(props.name ?? "", props.id);
   const { setDebounceSearch, isLoading } = useDebounceHook(queryFn, setOptions);
   const { control, disabled: formDisabled, getFieldState, setValue: setFormValue } = useFormContext();
+  const isDisabled = useMemo(() => formDisabled || disabled, [formDisabled, disabled]);
 
   validateFixedOptions(fixedOptions, multiple, autocompleteProps, withFixedOptionsInValue, value);
 
@@ -91,6 +92,7 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
   } = useController({
     name,
     control,
+    shouldUnregister: isDisabled,
     rules: {
       validate: {
         required: () => getFieldState(name)?.error?.message,
@@ -98,7 +100,6 @@ const AsyncTypeaheadInput = <T extends FieldValues>(props: AsyncTypeaheadInputPr
     },
   });
 
-  const isDisabled = useMemo(() => formDisabled || disabled, [formDisabled, disabled]);
   const paginatedOptions = useMemo(
     () => (limitResults === undefined ? options : options.slice(0, page * limitResults)),
     [limitResults, page, options],
diff --git a/src/lib/DatePickerInput.tsx b/src/lib/DatePickerInput.tsx
index c25d664..045fecb 100644
--- a/src/lib/DatePickerInput.tsx
+++ b/src/lib/DatePickerInput.tsx
@@ -129,6 +129,7 @@ const DatePickerInput = <T extends FieldValues>(props: DatePickerInputProps<T>)
   return (
     <Controller
       control={control}
+      shouldUnregister={isDisabled}
       name={name}
       render={({ field, fieldState: { error } }) => (
         <FormGroupLayout<T, DatePickerRenderAddonProps>
diff --git a/src/lib/FormattedInput.tsx b/src/lib/FormattedInput.tsx
index c931b3b..fdeb238 100644
--- a/src/lib/FormattedInput.tsx
+++ b/src/lib/FormattedInput.tsx
@@ -46,6 +46,7 @@ const FormattedInput = <T extends FieldValues>(props: FormattedInputProps<T>) =>
     <Controller
       control={control}
       name={name}
+      shouldUnregister={isDisabled}
       render={({ field: { name, onBlur, onChange, ref, value }, fieldState: { error } }) => {
         const commonProps: NumericFormatProps = {
           name: name,
diff --git a/src/lib/RatingInput.tsx b/src/lib/RatingInput.tsx
index d245758..88c858b 100644
--- a/src/lib/RatingInput.tsx
+++ b/src/lib/RatingInput.tsx
@@ -29,6 +29,7 @@ const RatingInput = <T extends FieldValues>(props: RatingInputProps<T>) => {
   return (
     <Controller
       control={control}
+      shouldUnregister={disabled || formDisabled}
       name={props.name}
       render={({ field: { value, onBlur, onChange, ...fieldRest } }) => (
         <FormGroupLayout
diff --git a/src/lib/StaticTypeaheadInput.tsx b/src/lib/StaticTypeaheadInput.tsx
index e31f963..763022c 100644
--- a/src/lib/StaticTypeaheadInput.tsx
+++ b/src/lib/StaticTypeaheadInput.tsx
@@ -72,11 +72,14 @@ const StaticTypeaheadInput = <T extends FieldValues>(props: StaticTypeaheadInput
 
   const { name, id } = useSafeNameId(props.name ?? "", props.id);
   const { control, disabled: formDisabled, getFieldState, clearErrors, watch } = useFormContext();
+  const isDisabled = useMemo(() => formDisabled || disabled, [formDisabled, disabled]);
+
   const {
     field: { ref, ...field },
   } = useController({
     name,
     control,
+    shouldUnregister: isDisabled,
     rules: {
       validate: {
         required: () => getFieldState(name)?.error?.message,
@@ -84,7 +87,6 @@ const StaticTypeaheadInput = <T extends FieldValues>(props: StaticTypeaheadInput
     },
   });
 
-  const isDisabled = useMemo(() => formDisabled || disabled, [formDisabled, disabled]);
   const paginatedOptions = useMemo(
     () => (limitResults === undefined ? options : options.slice(0, page * limitResults)),
     [limitResults, page, options],
diff --git a/src/lib/components/ColorPicker/ColorPicker.tsx b/src/lib/components/ColorPicker/ColorPicker.tsx
index 65b7168..ee17ade 100644
--- a/src/lib/components/ColorPicker/ColorPicker.tsx
+++ b/src/lib/components/ColorPicker/ColorPicker.tsx
@@ -56,6 +56,7 @@ const ColorPicker = <T extends FieldValues>(props: ColorPickerInputProps<T>) =>
   } = useController({
     name,
     control,
+    shouldUnregister: true,
     rules: {
       validate: {
         required: () => getFieldState(name)?.error?.message,

From 3444ee1a2238c0f5934ae9c8615db668a83333d3 Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Thu, 23 Oct 2025 15:37:37 +0200
Subject: [PATCH 09/12] x

---
 src/lib/components/Input/InputInternal.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/lib/components/Input/InputInternal.tsx b/src/lib/components/Input/InputInternal.tsx
index aca684a..ed92815 100644
--- a/src/lib/components/Input/InputInternal.tsx
+++ b/src/lib/components/Input/InputInternal.tsx
@@ -43,7 +43,7 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
   } = useFormContext();
 
   const { ref, ...rest } = register(name, {
-    disabled: formDisabled || disabled, // FIXME this one unregister on submit
+    // disabled: formDisabled || disabled, // FIXME this one unregister on submit
     setValueAs: (value: string) => (value === UNDEFINED_OPTION_VALUE ? undefined : value),
   });
 
@@ -70,7 +70,7 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
         maxLength={maxLength}
         rows={textAreaRows}
         multiple={multiple}
-        // disabled={formDisabled || disabled} // this one just disables the input
+        disabled={formDisabled || disabled} // this one just disables the input
         plaintext={plainText}
         style={plainText ? { color: "black", marginLeft: 10, ...style } : { ...style }}
         placeholder={placeholder}
@@ -93,7 +93,7 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
             if (onChange) {
               onChange(e);
             }
-
+            console.log("event-->", e);
             await rest.onChange(e);
           })();
         }}

From 91909295e231161b147aca66678f5ee22b45ca4d Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Thu, 23 Oct 2025 16:08:39 +0200
Subject: [PATCH 10/12] x

---
 src/lib/components/Input/InputInternal.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/Input/InputInternal.tsx b/src/lib/components/Input/InputInternal.tsx
index ed92815..1f6e1e9 100644
--- a/src/lib/components/Input/InputInternal.tsx
+++ b/src/lib/components/Input/InputInternal.tsx
@@ -89,11 +89,15 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
           })();
         }}
         onChange={(e) => {
+          console.log("event before the IIFE-->", e);
+
           void (async () => {
             if (onChange) {
               onChange(e);
             }
-            console.log("event-->", e);
+
+            console.log("event after the IIFE-->", e);
+
             await rest.onChange(e);
           })();
         }}

From c10c124f172855b6c3b929095b80a1b53ac44478 Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Thu, 23 Oct 2025 16:29:21 +0200
Subject: [PATCH 11/12] drop console

---
 rollup.config.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/rollup.config.mjs b/rollup.config.mjs
index 563e5af..9bb3c6f 100644
--- a/rollup.config.mjs
+++ b/rollup.config.mjs
@@ -26,7 +26,7 @@ const plugins = [
   terser({
     output: { comments: false },
     compress: {
-      drop_console: true,
+      drop_console: false,
     },
   }),
 ];

From 8c25499d2279417c82c2c9196fdc72584518f296 Mon Sep 17 00:00:00 2001
From: Michele Masciave <michele.masciave@neolution.ch>
Date: Thu, 23 Oct 2025 16:57:11 +0200
Subject: [PATCH 12/12] x

---
 src/lib/components/Input/InputInternal.tsx | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/lib/components/Input/InputInternal.tsx b/src/lib/components/Input/InputInternal.tsx
index 1f6e1e9..98b45d0 100644
--- a/src/lib/components/Input/InputInternal.tsx
+++ b/src/lib/components/Input/InputInternal.tsx
@@ -92,13 +92,20 @@ const InputInternal = <T extends FieldValues>(props: InputProps<T>) => {
           console.log("event before the IIFE-->", e);
 
           void (async () => {
-            if (onChange) {
-              onChange(e);
-            }
+            // if (onChange) {
+            //   onChange(e);
+            // }
 
-            console.log("event after the IIFE-->", e);
+            // setTimeout(async () => {
+            //   console.log("event after the IIFE-->", e);
+            // }, 1000);
 
             await rest.onChange(e);
+
+            if (onChange) {
+              console.log("calling custom onChange", e);
+              onChange(e);
+            }
           })();
         }}
         onKeyDown={onKeyDown}