feat(InputMenu/SelectMenu): add support for dot notation in by prop (#2607)

src/runtime/components/forms/InputMenu.vue

@@ -293,6 +293,24 @@ export default defineComponent({
 
     const size = computed(() => sizeButtonGroup.value ?? sizeFormGroup.value)
 
+    const by = computed(() => {
+      if (!props.by) return undefined
+
+      if (typeof props.by === 'function') {
+        return props.by
+      }
+
+      const key = props.by
+      const hasDot = key.indexOf('.')
+      if (hasDot > 0) {
+        return (a: any, z: any) => {
+          return accessor(a, key) === accessor(z, key)
+        }
+      }
+
+      return key
+    })
+
     const internalQuery = ref('')
     const query = computed({
       get() {
@@ -305,9 +323,7 @@ export default defineComponent({
     })
 
     const label = computed(() => {
-      if (!props.modelValue) {
-        return
-      }
+      if (!props.modelValue) return null
 
       function getValue(value: any) {
         if (props.valueAttribute) {
@@ -318,7 +334,7 @@ export default defineComponent({
       }
 
       function compareValues(value1: any, value2: any) {
-        if (props.by && typeof value1 === 'object' && typeof value2 === 'object') {
+        if (by.value && typeof by.value !== 'function' && typeof value1 === 'object' && typeof value2 === 'object') {
           return isEqual(value1[props.by], value2[props.by])
         }
         return isEqual(value1, value2)
@@ -507,7 +523,9 @@ export default defineComponent({
       query,
       accessor,
       onUpdate,
-      onQueryChange
+      onQueryChange,
+      // eslint-disable-next-line vue/no-dupe-keys
+      by
     }
   }
 })