diff --git a/src/components/cascadeselect/CascadeSelect.d.ts b/src/components/cascadeselect/CascadeSelect.d.ts
index e7189e6d9..a89bf2893 100644
--- a/src/components/cascadeselect/CascadeSelect.d.ts
+++ b/src/components/cascadeselect/CascadeSelect.d.ts
@@ -1,12 +1,16 @@
 import { VNode } from 'vue';
 
+type CascadeSelectOptionLabelType = string | ((data: any) => string) | undefined;
+type CascadeSelectOptionValueType = string | ((data: any) => any) | undefined;
+type CascadeSelectOptionChildrenType = string[] | string | ((data: any) => any[]) | undefined;
+
 interface CascadeSelectProps {
     modelValue?: any;
     options?: any[];
-    optionLabel?: string;
-    optionValue?: any;
-    optionGroupLabel?: string;
-    optionGroupChildren?: string[];
+    optionLabel?: CascadeSelectOptionLabelType;
+    optionValue?: CascadeSelectOptionValueType;
+    optionGroupLabel?: CascadeSelectOptionLabelType;
+    optionGroupChildren?: CascadeSelectOptionChildrenType;
     placeholder?: string;
     disabled?: boolean;
     dataKey?: string;
diff --git a/src/components/dropdown/Dropdown.d.ts b/src/components/dropdown/Dropdown.d.ts
index 2f7efd3ff..246dde1fd 100755
--- a/src/components/dropdown/Dropdown.d.ts
+++ b/src/components/dropdown/Dropdown.d.ts
@@ -1,16 +1,19 @@
 import { VNode } from 'vue';
 import VirtualScrollerProps from '../virtualscroller';
 
+type DropdownOptionLabelType = string | ((data: any) => string) | undefined;
+type DropdownOptionValueType = string | ((data: any) => any) | undefined;
 type DropdownOptionDisabledType = string | ((data: any) => boolean) | undefined;
+type DropdownOptionChildrenType = string | ((data: any) => any[]) | undefined;
 
 interface DropdownProps {
     modelValue?: any;
     options?: any[];
-    optionLabel?: string;
-    optionValue?: any;
+    optionLabel?: DropdownOptionLabelType;
+    optionValue?: DropdownOptionValueType;
     optionDisabled?: DropdownOptionDisabledType;
-    optionGroupLabel?: string;
-    optionGroupChildren?: string;
+    optionGroupLabel?: DropdownOptionLabelType;
+    optionGroupChildren?: DropdownOptionChildrenType;
     scrollHeight?: string;
     filter?: boolean;
     filterPlaceholder?: string;
diff --git a/src/components/listbox/Listbox.d.ts b/src/components/listbox/Listbox.d.ts
index 35979dfff..9c17c61d8 100755
--- a/src/components/listbox/Listbox.d.ts
+++ b/src/components/listbox/Listbox.d.ts
@@ -1,16 +1,19 @@
 import { VNode } from 'vue';
 import VirtualScrollerProps from '../virtualscroller';
 
+type ListboxOptionLabelType = string | ((data: any) => string) | undefined;
+type ListboxOptionValueType = string | ((data: any) => any) | undefined;
 type ListboxOptionDisabledType = string | ((data: any) => boolean) | undefined;
+type ListboxOptionChildrenType = string | ((data: any) => any[]) | undefined;
 
 interface ListboxProps {
     modelValue?: any;
     options?: any[];
-    optionLabel?: string;
-    optionValue?: any;
+    optionLabel?: ListboxOptionLabelType;
+    optionValue?: ListboxOptionValueType;
     optionDisabled?: ListboxOptionDisabledType;
-    optionGroupLabel?: string;
-    optionGroupChildren?: string;
+    optionGroupLabel?: ListboxOptionLabelType;
+    optionGroupChildren?: ListboxOptionChildrenType;
     listStyle?: string;
     disabled?: boolean;
     dataKey?: string;
diff --git a/src/components/multiselect/MultiSelect.d.ts b/src/components/multiselect/MultiSelect.d.ts
index 1eeab73d0..da06d1152 100755
--- a/src/components/multiselect/MultiSelect.d.ts
+++ b/src/components/multiselect/MultiSelect.d.ts
@@ -1,16 +1,19 @@
 import { VNode } from 'vue';
 import VirtualScrollerProps from '../virtualscroller';
 
+type MultiSelectOptionLabelType = string | ((data: any) => string) | undefined;
+type MultiSelectOptionValueType = string | ((data: any) => any) | undefined;
 type MultiSelectOptionDisabledType = string | ((data: any) => boolean) | undefined;
+type MultiSelectOptionChildrenType = string | ((data: any) => any[]) | undefined;
 
 interface MultiSelectProps {
     modelValue?: any;
     options?: any[];
-    optionLabel?: string;
-    optionValue?: any;
+    optionLabel?: MultiSelectOptionLabelType;
+    optionValue?: MultiSelectOptionValueType;
     optionDisabled?: MultiSelectOptionDisabledType;
-    optionGroupLabel?: string;
-    optionGroupChildren?: string;
+    optionGroupLabel?: MultiSelectOptionLabelType;
+    optionGroupChildren?: MultiSelectOptionChildrenType;
     scrollHeight?: string;
     placeholder?: string;
     disabled?: boolean;
diff --git a/src/components/selectbutton/SelectButton.d.ts b/src/components/selectbutton/SelectButton.d.ts
index 4f6921010..a2e57e738 100755
--- a/src/components/selectbutton/SelectButton.d.ts
+++ b/src/components/selectbutton/SelectButton.d.ts
@@ -1,10 +1,12 @@
+type SelectButtonOptionLabelType = string | ((data: any) => string) | undefined;
+type SelectButtonOptionValueType = string | ((data: any) => any) | undefined;
 type SelectButtonOptionDisabledType = string | ((data: any) => boolean) | undefined;
 
 interface SelectButtonProps {
     modelValue?: any;
     options?: any[];
-    optionLabel?: string;
-    optionValue?: any;
+    optionLabel?: SelectButtonOptionLabelType;
+    optionValue?: SelectButtonOptionValueType;
     optionDisabled?: SelectButtonOptionDisabledType;
     multiple?: boolean;
     disabled?: boolean;
diff --git a/src/views/dropdown/DropdownDoc.vue b/src/views/dropdown/DropdownDoc.vue
index 4a66e7b2e..40c42f301 100755
--- a/src/views/dropdown/DropdownDoc.vue
+++ b/src/views/dropdown/DropdownDoc.vue
@@ -145,13 +145,13 @@ export default {
                     </tr>
                     <tr>
                         <td>optionLabel</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the label of an option.</td>
                     </tr>
                     <tr>
                         <td>optionValue</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the value of an option, defaults to the option itself when not defined.</td>
                     </tr>
@@ -163,13 +163,13 @@ export default {
                     </tr>
                     <tr>
                         <td>optionGroupLabel</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the label of an option group.</td>
                     </tr>
                     <tr>
                         <td>optionGroupChildren</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function that refers to the children options of option group.</td>
                     </tr>
diff --git a/src/views/multiselect/MultiSelectDoc.vue b/src/views/multiselect/MultiSelectDoc.vue
index aa618d015..f17b19aee 100755
--- a/src/views/multiselect/MultiSelectDoc.vue
+++ b/src/views/multiselect/MultiSelectDoc.vue
@@ -154,13 +154,13 @@ export default {
                     </tr>
                     <tr>
                         <td>optionLabel</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the label of an option.</td>
                     </tr>
                     <tr>
                         <td>optionValue</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the value of an option, defaults to the option itself when not defined.</td>
                     </tr>
@@ -172,13 +172,13 @@ export default {
                     </tr>
                     <tr>
                         <td>optionGroupLabel</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the label of an option group.</td>
                     </tr>
                     <tr>
                         <td>optionGroupChildren</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function that refers to the children options of option group.</td>
                     </tr>
diff --git a/src/views/selectbutton/SelectButtonDoc.vue b/src/views/selectbutton/SelectButtonDoc.vue
index ae4715c19..0800fb544 100755
--- a/src/views/selectbutton/SelectButtonDoc.vue
+++ b/src/views/selectbutton/SelectButtonDoc.vue
@@ -84,13 +84,13 @@ export default {
                     </tr>
                     <tr>
                         <td>optionLabel</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the label of an option.</td>
                     </tr>
                     <tr>
                         <td>optionValue</td>
-                        <td>string</td>
+                        <td>string | function</td>
                         <td>null</td>
                         <td>Property name or getter function to use as the value of an option, defaults to the option itself when not defined.</td>
                     </tr>