diff --git a/package-lock.json b/package-lock.json
index ef70d4d6..c6a0ccad 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4088,7 +4088,8 @@
       "optional": true,
       "os": [
         "android"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-android-arm64": {
       "version": "4.27.3",
@@ -4102,7 +4103,8 @@
       "optional": true,
       "os": [
         "android"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
       "version": "4.27.3",
@@ -4116,7 +4118,8 @@
       "optional": true,
       "os": [
         "darwin"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-darwin-x64": {
       "version": "4.27.3",
@@ -4130,7 +4133,8 @@
       "optional": true,
       "os": [
         "darwin"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-freebsd-arm64": {
       "version": "4.27.3",
@@ -4144,7 +4148,8 @@
       "optional": true,
       "os": [
         "freebsd"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-freebsd-x64": {
       "version": "4.27.3",
@@ -4158,7 +4163,8 @@
       "optional": true,
       "os": [
         "freebsd"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
       "version": "4.27.3",
@@ -4172,7 +4178,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-arm-musleabihf": {
       "version": "4.27.3",
@@ -4186,7 +4193,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
       "version": "4.27.3",
@@ -4200,7 +4208,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
       "version": "4.27.3",
@@ -4214,7 +4223,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-powerpc64le-gnu": {
       "version": "4.27.3",
@@ -4228,7 +4238,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
       "version": "4.27.3",
@@ -4242,7 +4253,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-s390x-gnu": {
       "version": "4.27.3",
@@ -4256,7 +4268,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
       "version": "4.27.3",
@@ -4270,7 +4283,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
       "version": "4.27.3",
@@ -4284,7 +4298,8 @@
       "optional": true,
       "os": [
         "linux"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
       "version": "4.27.3",
@@ -4298,7 +4313,8 @@
       "optional": true,
       "os": [
         "win32"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
       "version": "4.27.3",
@@ -4312,7 +4328,8 @@
       "optional": true,
       "os": [
         "win32"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
       "version": "4.27.3",
@@ -4326,7 +4343,8 @@
       "optional": true,
       "os": [
         "win32"
-      ]
+      ],
+      "peer": true
     },
     "node_modules/@rushstack/node-core-library": {
       "version": "5.10.0",
@@ -9125,6 +9143,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
@@ -13008,6 +13027,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13025,6 +13045,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13042,6 +13063,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13059,6 +13081,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13076,6 +13099,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13093,6 +13117,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13110,6 +13135,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13127,6 +13153,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13144,6 +13171,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13161,6 +13189,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13178,6 +13207,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13195,6 +13225,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13212,6 +13243,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13229,6 +13261,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13246,6 +13279,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13263,6 +13297,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13280,6 +13315,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13297,6 +13333,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13314,6 +13351,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -13331,6 +13369,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=14.0.0"
       }
@@ -14407,7 +14446,7 @@
       "version": "5.6.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.6.3.tgz",
       "integrity": "sha512-hjcS1mhfuyi4WW8IWtjP7brDrG2cuDZukyrYrSauoXGNgx0S7zceP07adYkJycEr56BOUTNPzbInooiN3fn1qw==",
-      "dev": true,
+      "devOptional": true,
       "license": "Apache-2.0",
       "bin": {
         "tsc": "bin/tsc",
@@ -14973,6 +15012,7 @@
       "os": [
         "aix"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -14990,6 +15030,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15007,6 +15048,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15024,6 +15066,7 @@
       "os": [
         "android"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15041,6 +15084,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15058,6 +15102,7 @@
       "os": [
         "darwin"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15075,6 +15120,7 @@
       "os": [
         "freebsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15092,6 +15138,7 @@
       "os": [
         "freebsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15109,6 +15156,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15126,6 +15174,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15143,6 +15192,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15160,6 +15210,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15177,6 +15228,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15194,6 +15246,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15211,6 +15264,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15228,6 +15282,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15245,6 +15300,7 @@
       "os": [
         "linux"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15262,6 +15318,7 @@
       "os": [
         "netbsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15279,6 +15336,7 @@
       "os": [
         "openbsd"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15296,6 +15354,7 @@
       "os": [
         "sunos"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15313,6 +15372,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15330,6 +15390,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -15347,6 +15408,7 @@
       "os": [
         "win32"
       ],
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
diff --git a/packages/core/src/components/inputs/BaseSelect/BaseSelect.spec.ts b/packages/core/src/components/inputs/BaseSelect/BaseSelect.spec.ts
index f5c66252..6416f52d 100644
--- a/packages/core/src/components/inputs/BaseSelect/BaseSelect.spec.ts
+++ b/packages/core/src/components/inputs/BaseSelect/BaseSelect.spec.ts
@@ -44,7 +44,8 @@ describe('BaseSelect.vue', () => {
       const expectedOptions = [
         new SelectOption('key1', 'label1'),
         new SelectOption('key2', 'label2'),
-        new SelectOption('key3', 'label3')
+        new SelectOption('key3', 'label3'),
+        new SelectOption(true, 'true')
       ]
       await wrapper.setProps({ options: expectedOptions })
 
@@ -55,6 +56,8 @@ describe('BaseSelect.vue', () => {
       expect(options.at(1).text()).toBe(expectedOptions[1].label)
       expect(options.at(2).attributes('value')).toBe(expectedOptions[2].key)
       expect(options.at(2).text()).toBe(expectedOptions[2].label)
+      expect(options.at(3).attributes('value')).toBe(expectedOptions[3].key?.toString())
+      expect(options.at(3).text()).toBe(expectedOptions[3].label)
     })
     it(':optionsLabel - options label not rendered if not set', async () => {
       const expectedOptionsLabel = ''
diff --git a/packages/core/src/components/inputs/BaseSelect/BaseSelect.vue b/packages/core/src/components/inputs/BaseSelect/BaseSelect.vue
index f03088eb..20156941 100644
--- a/packages/core/src/components/inputs/BaseSelect/BaseSelect.vue
+++ b/packages/core/src/components/inputs/BaseSelect/BaseSelect.vue
@@ -1,7 +1,17 @@
 <template>
   <BaseInputWrapper>
-    <select :name="name" :id="name" @change="handleChange" v-model="value">
-      <option v-if="optionsLabel" value="" disabled selected>
+    <select
+      :name="name"
+      :id="name"
+      @change="handleChange"
+      v-model="value"
+    >
+      <option
+        v-if="optionsLabel"
+        value=""
+        disabled
+        selected
+      >
         {{ optionsLabel }}
       </option>
       <option
@@ -13,7 +23,10 @@
       </option>
     </select>
     <label :for="name">{{ label }}</label>
-    <span class="error" v-if="errorMessage && meta.touched">
+    <span
+      class="error"
+      v-if="errorMessage && meta.touched"
+    >
       {{ errorMessage }}
     </span>
   </BaseInputWrapper>
@@ -25,7 +38,7 @@ import { toRef } from 'vue'
 import BaseInputWrapper from '@core/components/inputs/BaseInputWrapper/BaseInputWrapper.vue'
 import { SelectOption } from '@core/components/inputs/BaseSelect/selectOption'
 
-type InputValue = string | number | null
+type InputValue = string | number | boolean | null
 
 const props = withDefaults(
   defineProps<{
@@ -66,9 +79,9 @@ const getLabel = (option: string | SelectOption<LabelType>) => {
   return option
 }
 
-const getValue = (option: string | SelectOption<LabelType>) => {
+const getValue = (option: string | SelectOption<LabelType>): string | number | undefined => {
   if (option instanceof SelectOption) {
-    return option.key
+    return option.key as string | number | undefined
   }
   return option
 }
diff --git a/packages/core/src/components/inputs/BaseSelect/selectOption.ts b/packages/core/src/components/inputs/BaseSelect/selectOption.ts
index c0ce6921..840fb158 100644
--- a/packages/core/src/components/inputs/BaseSelect/selectOption.ts
+++ b/packages/core/src/components/inputs/BaseSelect/selectOption.ts
@@ -1,10 +1,15 @@
 export class SelectOption<LabelType> {
-  readonly key: string | number | null
+  readonly key: string | number | boolean | null
   readonly label: LabelType
   readonly img?: string
   readonly icon?: string
 
-  constructor(key: string | number | null, label: LabelType, img?: string, icon?: string) {
+  constructor(
+    key: string | number | boolean | null,
+    label: LabelType,
+    img?: string,
+    icon?: string
+  ) {
     this.key = key
     this.label = label
     this.img = img
diff --git a/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.spec.ts b/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.spec.ts
index 731b0aaf..3c4b189e 100644
--- a/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.spec.ts
+++ b/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.spec.ts
@@ -238,5 +238,30 @@ describe('MultiselectInput', () => {
       await multiselect.vm.$emit('remove', new SelectOption('2', 'option2'))
       expect(wrapper.emitted('update:modelValue')[2]).toStrictEqual([[]])
     })
+
+    it('selects a boolean option and checks modelValue', async () => {
+      const options = [
+        new SelectOption('1', 'One'),
+        new SelectOption('2', 'Two'),
+        new SelectOption(true, 'True Option')
+      ]
+      wrapper = mount(MultiselectInput, {
+        global: {
+          stubs: ['MultiselectInput']
+        },
+        props: {
+          id: 'test-select-input',
+          label: 'Merchants',
+          options,
+          entityName: 'Optionen'
+        }
+      })
+
+      const multiselect = wrapper.findComponent(Multiselect)
+
+      await multiselect.vm.$emit('select', new SelectOption(true, 'True Option'))
+
+      expect(wrapper.emitted('update:modelValue')[0]).toStrictEqual([[true]])
+    })
   })
 })
diff --git a/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.stories.ts b/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.stories.ts
index 281d9782..2cfb8e7c 100644
--- a/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.stories.ts
+++ b/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.stories.ts
@@ -23,6 +23,7 @@ Default.args = {
   label: 'Option',
   entityName: 'Optionen',
   options: [
+    new SelectOption(true, 'True options'),
     new SelectOption('option1', 'Option 1'),
     new SelectOption('option2', 'Option 2'),
     new SelectOption('option3', 'Option 3'),
@@ -58,3 +59,16 @@ Icons.args = {
     new SelectOption('option5', 'Option 5', '', 'bi-5-circle')
   ]
 }
+
+export const NotSearchable = Template.bind({})
+NotSearchable.args = {
+  id: 'select-input',
+  label: 'Option',
+  entityName: 'Optionen',
+  searchable: false,
+  options: [
+    new SelectOption(true, 'True Option'),
+    new SelectOption('option1', 'Option One'),
+    new SelectOption('option2', 'Option Two')
+  ]
+}
diff --git a/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.vue b/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.vue
index f1aee09b..c585b664 100644
--- a/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.vue
+++ b/packages/core/src/components/inputs/MultiselectInput/MultiselectInput.vue
@@ -22,6 +22,8 @@
       @remove="removeOption"
       :open-direction="'bottom'"
       :class="{ 'has-content': selectedOptions.length > 0 }"
+      :searchable="searchable"
+      :placeholder="label"
     >
       <template
         v-for="(_, name) in $slots"
@@ -124,17 +126,22 @@ const props = withDefaults(
      * The name of the entity that is being selected.
      */
     entityName?: string
+    /**
+     * Search function is enabled
+     */
+    searchable?: boolean
   }>(),
   {
     error: '',
-    entityName: 'Optionen'
+    entityName: 'Optionen',
+    searchable: true
   }
 )
 
 /**
  * The currently selected value as a `string`, initially `undefined`.
  */
-const modelValue = defineModel<(string | number | null)[]>({
+const modelValue = defineModel<(string | number | boolean | null)[]>({
   default: []
 })
 const selectedOptions = ref<SelectOption<Ref<LabelType>>[]>([])
@@ -147,14 +154,14 @@ onMounted(() => {
         accumulator: { [key: string]: SelectOption<LabelType> },
         selectOption: SelectOption<LabelType>
       ) => {
-        accumulator[selectOption.key || ''] = selectOption
+        accumulator[String(selectOption.key) || ''] = selectOption
         return accumulator
       },
       {}
     )
     selectedOptions.value = modelValue.value.map((key) => {
       if (key == null) return
-      return optionsMap[key]
+      return optionsMap[String(key)]
     }) as SelectOption<LabelType>[]
   } else {
     selectedOptions.value = defaultOption || []
@@ -173,7 +180,7 @@ watch(
           accumulator: { [key: string]: SelectOption<LabelType> },
           selectOption: SelectOption<LabelType>
         ) => {
-          accumulator[selectOption.key || ''] = selectOption
+          accumulator[String(selectOption.key) || ''] = selectOption
           return accumulator
         },
         {}
@@ -181,7 +188,7 @@ watch(
       selectedOptions.value = newValue
         .map((key) => {
           if (key === null) return ''
-          return optionsMap[key]
+          return optionsMap[String(key)]
         })
         .filter((option): option is SelectOption<LabelType> => option !== undefined)
     }
diff --git a/packages/core/src/components/inputs/SelectInput/SelectInput.spec.js b/packages/core/src/components/inputs/SelectInput/SelectInput.spec.js
index 74196ee4..7ef187bd 100644
--- a/packages/core/src/components/inputs/SelectInput/SelectInput.spec.js
+++ b/packages/core/src/components/inputs/SelectInput/SelectInput.spec.js
@@ -200,5 +200,30 @@ describe('SelectInput', () => {
       expect(option.exists()).toBe(true)
       expect(option.classes()).toContain('icon-class-1')
     })
+
+    it('selects a boolean option and checks modelValue', async () => {
+      const options = [
+        new SelectOption('1', 'One'),
+        new SelectOption('2', 'Two'),
+        new SelectOption(true, 'True Option')
+      ]
+      wrapper = mount(SelectInput, {
+        global: {
+          stubs: ['MultiselectInput']
+        },
+        props: {
+          id: 'test-select-input',
+          label: 'Merchants',
+          options,
+          entityName: 'Optionen'
+        }
+      })
+
+      const multiselect = wrapper.findComponent(Multiselect)
+
+      await multiselect.vm.$emit('select', new SelectOption(true, 'True Option'))
+
+      expect(wrapper.emitted('update:modelValue')[0]).toStrictEqual([true])
+    })
   })
 })
diff --git a/packages/core/src/components/inputs/SelectInput/SelectInput.stories.js b/packages/core/src/components/inputs/SelectInput/SelectInput.stories.js
index 5678059a..0a5534a7 100644
--- a/packages/core/src/components/inputs/SelectInput/SelectInput.stories.js
+++ b/packages/core/src/components/inputs/SelectInput/SelectInput.stories.js
@@ -23,7 +23,11 @@ Default.args = {
   label: 'Option',
   entityName: 'Optionen',
   placeholder: 'Choose option',
-  options: [new SelectOption('option1', 'Option One'), new SelectOption('option2', 'Option Two')]
+  options: [
+    new SelectOption(true, 'All options'),
+    new SelectOption('option1', 'Option One'),
+    new SelectOption('option2', 'Option Two')
+  ]
 }
 
 export const Images = Template.bind({})
@@ -53,3 +57,24 @@ Icons.args = {
     new SelectOption('option5', 'Option 5', '', 'bi-5-circle')
   ]
 }
+
+export const Booleans = Template.bind({})
+Booleans.args = {
+  id: 'select-input',
+  label: 'Option',
+  entityName: 'Optionen',
+  options: [new SelectOption(true, 'Wahr', '', ''), new SelectOption(false, 'Falsch', '', '')]
+}
+
+export const NotSearchable = Template.bind({})
+NotSearchable.args = {
+  id: 'select-input',
+  label: 'Option',
+  entityName: 'Optionen',
+  searchable: false,
+  options: [
+    new SelectOption(true, 'All options'),
+    new SelectOption('option1', 'Option One'),
+    new SelectOption('option2', 'Option Two')
+  ]
+}
diff --git a/packages/core/src/components/inputs/SelectInput/SelectInput.vue b/packages/core/src/components/inputs/SelectInput/SelectInput.vue
index 1d9321fc..3735f9d2 100644
--- a/packages/core/src/components/inputs/SelectInput/SelectInput.vue
+++ b/packages/core/src/components/inputs/SelectInput/SelectInput.vue
@@ -2,6 +2,7 @@
   <div
     class="floating-input-group"
     :class="{ 'single-select-input': true, 'has-content': selectedOption }"
+    :style="{ width: `${maxLabelWidth}px` }"
   >
     <multiselect
       :id="id"
@@ -18,6 +19,8 @@
       v-bind="$attrs"
       :open-direction="'bottom'"
       @select="updateModelValue"
+      :searchable="searchable"
+      :placeholder="label"
     >
       <template
         v-for="(_, name) in $slots"
@@ -113,39 +116,72 @@ const props = withDefaults(
      * The name of the entity that is being selected.
      */
     entityName?: string
+    /**
+     * Search function is enabled
+     */
+    searchable?: boolean
   }>(),
   {
     error: '',
-    entityName: 'Optionen'
+    entityName: 'Optionen',
+    searchable: true
   }
 )
 
 /**
  * The currently selected value as a `string`, initially `undefined`.
  */
-const modelValue = defineModel<string | undefined | null | number>()
+const modelValue = defineModel<string | number | boolean | undefined | null>()
 const selectedOption = ref<SelectOption<LabelType>>()
 
 const optionsMap = computed(() =>
   props.options.reduce(
     (acc, option) => {
-      acc[option.key || ''] = option
+      acc[String(option.key)] = option
       return acc
     },
     {} as { [key: string]: SelectOption<LabelType> }
   )
 )
 
+const maxLabelWidth = computed(() => {
+  const canvas = document.createElement('canvas')
+  const context = canvas.getContext('2d')
+  if (!context) return 0
+
+  context.font = '20px GothamNarrow, Helvetica, sans-serif'
+
+  const labelWidth = context.measureText(props.label).width
+  const optionsWidth = Math.max(
+    ...props.options.map((option) => context.measureText(String(option.label)).width)
+  )
+  const noOptionWidth = context.measureText(`Keine ${props.entityName} vorhanden`).width
+
+  const padding = 48
+  return Math.max(labelWidth, optionsWidth, noOptionWidth) + padding
+})
+
 onMounted(() => {
-  selectedOption.value =
-    modelValue.value != null ? optionsMap.value[modelValue.value] : props.defaultOption
+  if (
+    typeof modelValue.value === 'string' ||
+    typeof modelValue.value === 'number' ||
+    typeof modelValue.value === 'boolean'
+  ) {
+    selectedOption.value = optionsMap.value[String(modelValue.value)] || props.defaultOption
+  }
   if (selectedOption.value) updateModelValue(selectedOption.value)
 })
 
 watch(
   () => modelValue.value,
   (newValue) => {
-    if (newValue != null) selectedOption.value = optionsMap.value[newValue]
+    if (
+      typeof newValue === 'string' ||
+      typeof newValue === 'number' ||
+      typeof newValue === 'boolean'
+    ) {
+      selectedOption.value = optionsMap.value[String(newValue)]
+    }
   }
 )
 
@@ -176,7 +212,7 @@ const updateModelValue = (option: SelectOption<LabelType>) => {
   display: grid;
   position: relative;
   gap: var(--space-sm);
-  height: calc(var(--input-field-height) + 5px);
+  width: fit-content;
 
   .option__container {
     display: flex;
@@ -235,11 +271,18 @@ const updateModelValue = (option: SelectOption<LabelType>) => {
     transform: translateY(0%);
     font-size: var(--_label-size);
     padding-left: calc(var(--space-sm) + var(--space-xs));
+    z-index: 9999;
   }
 
   :deep(.multiselect) {
     .multiselect__placeholder {
-      display: none;
+      color: transparent;
+      font-size: var(--_input-size);
+      padding-block-end: var(--space-sm);
+      padding-block-start: calc(var(--_label-size) + var(--space-xs));
+      line-height: 1;
+
+      margin: 0;
     }
 
     input::placeholder,
@@ -252,8 +295,8 @@ const updateModelValue = (option: SelectOption<LabelType>) => {
       padding-left: var(--space-sm);
     }
     .multiselect__single {
-      padding-left: var(--space-xs);
-      padding-top: var(--space-sm);
+      padding-block-end: var(--space-sm);
+      padding-block-start: calc(var(--_label-size) + var(--space-xs));
       margin: 0;
     }
 
@@ -288,16 +331,26 @@ const updateModelValue = (option: SelectOption<LabelType>) => {
       border-inline: var(--focus-border);
       border-bottom: var(--focus-border);
     }
+
+    .multiselect__select {
+      height: 100%;
+    }
+
+    .multiselect__input {
+      padding-block-end: var(--space-sm);
+      padding-block-start: calc(var(--_label-size) + var(--space-xs));
+    }
   }
 
   :deep(.multiselect--active) {
+    position: absolute;
+
     .multiselect__tags {
       border-radius: var(--_input-border-radius) var(--_input-border-radius) 0 0;
     }
   }
 }
 
-/* For WebKit browsers (Chrome, Safari) */
 ::-webkit-scrollbar {
   width: 12px;
 }
@@ -307,14 +360,13 @@ const updateModelValue = (option: SelectOption<LabelType>) => {
 }
 
 ::-webkit-scrollbar-thumb {
-  background-color: rgba(0, 0, 0, 0.5); /* Adjust the color and opacity as needed */
+  background-color: rgba(0, 0, 0, 0.5);
   border-radius: 10px;
   border: 3px solid transparent;
 }
 
-/* For Firefox */
 * {
   scrollbar-width: thin;
-  scrollbar-color: rgba(0, 0, 0, 0.5) transparent; /* Adjust the color and opacity as needed */
+  scrollbar-color: rgba(0, 0, 0, 0.5) transparent;
 }
 </style>