fix: reset base components to use default props

src/components/input/MultiSelect.vue

@@ -9,7 +9,7 @@
   -->
   <MultiSelect
     v-model="selectedItems"
-    v-bind="{ ...$attrs, options: filteredOptions }"
+    v-bind="$attrs"
     option-label="name"
     unstyled
     :max-selected-labels="0"
@@ -100,12 +100,11 @@
 </template>
 
 <script setup lang="ts">
-import Fuse from 'fuse.js'
 import Button from 'primevue/button'
 import MultiSelect, {
   MultiSelectPassThroughMethodOptions
 } from 'primevue/multiselect'
-import { computed, toRefs, useAttrs } from 'vue'
+import { computed } from 'vue'
 
 import SearchBox from '@/components/input/SearchBox.vue'
 import { usePopoverSizing } from '@/composables/usePopoverSizing'
@@ -139,7 +138,6 @@ interface Props {
   // Note: options prop is intentionally omitted.
   // It's passed via $attrs to maximize PrimeVue API compatibility
 }
-const props = defineProps<Props>()
 const {
   label,
   showSearchBox = false,
@@ -154,7 +152,7 @@ const {
 const selectedItems = defineModel<Option[]>({
   required: true
 })
-const searchQuery = defineModel<string>('searchQuery', { default: '' })
+const searchQuery = defineModel<string>('searchQuery')
 const selectedCount = computed(() => selectedItems.value.length)
 
 const popoverStyle = usePopoverSizing({
@@ -185,14 +183,9 @@ const pt = computed(() => ({
   dropdown: {
     class: 'flex shrink-0 cursor-pointer items-center justify-center px-3'
   },
-  listContainer: {
-    style: 'max-height: 460px;'
-  },
   header: () => ({
     class:
-      showSearchBox.value || showSelectedCount.value || showClearButton.value
+      showSearchBox || showSelectedCount || showClearButton ? 'block' : 'hidden'
-        ? 'block'
-        : 'hidden'
   }),
   // Overlay & list visuals unchanged
   overlay: {

src/components/widget/nav/NavIcon.vue

@@ -1,5 +1,5 @@
 <template>
-  <i :class="icon" class="text-xs text-neutral" />
+  <i :class="icon" class="text-sm text-neutral" />
 </template>
 
 <script setup lang="ts">

src/components/widget/nav/NavItem.vue

@@ -27,45 +27,4 @@ const { icon, active, onClick } = defineProps<{
   active?: boolean
   onClick: () => void
 }>()
-
-// Icon map matching getCategoryIcon function exactly
-const iconMap = {
-  // Main categories
-  list: ILucideList,
-  'graduation-cap': ILucideGraduationCap,
-
-  // Generation types
-  image: ILucideImage,
-  film: ILucideFilm,
-  box: ILucideBox,
-  'volume-2': ILucideVolume2,
-
-  // API and models
-  'hand-coins': ILucideHandCoins,
-
-  // LLMs and AI
-  'message-square-text': ILucideMessageSquareText,
-
-  // Performance and hardware
-  zap: ILucideZap,
-  command: ILucideCommand,
-
-  // Training
-  dumbbell: ILucideDumbbell,
-
-  // Extensions and tools
-  puzzle: ILucidePuzzle,
-  wrench: ILucideWrench,
-
-  // Fallbacks for common patterns
-  'maximize-2': ILucideMaximize2,
-  'sliders-horizontal': ILucideSlidersHorizontal,
-  'layout-grid': ILucideLayoutGrid,
-  folder: ILucideFolder
-}
-
-const iconComponent = computed(() => {
-  if (!icon) return ILucideFolder
-  return iconMap[icon as keyof typeof iconMap] || ILucideFolder
-})
 </script>