Пытаюсь переопределить стили primeVue, почему не переопределяются стили mouseEvent?

Question

[Илья]

Я пытаюсь переопределить стили Primevue, в документации набрел на следующую страницу https://primevue.org/checkbox/#api.checkbox.types....
получил следующую структуру

:pt="{

        box: {
          class: modelValue ? 'bg-primary  border-1 border-gray-200' : 'hover:bg-gray-700  ',
        },
        icon:{
          class: 'size-3.5'
        },
        input:{
          class: 'bg-teal-50 hover:border-dotted'
        }
      }"

Однако ни одно переопределения стиля hover не применяется может быть кто-то сталкивался?

Answer 1

[orazbaevayan]

Попробуйте добавить параметр unstyled
Пример:

<AutoComplete
      v-model="model"
      dropdown
      :suggestions="filteredItems"
      @complete="searchItems"
      unstyled
      :pt="{
        root: {
          class: 'w-full'
        },
        pcInputText: {
          root: {
            class: 'block w-full rounded-md border-0 py-2 pr-10 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6'
          }
        },
        dropdown: {
          class: 'absolute inset-y-0 right-0 flex items-center px-3'
        },
        listContainer: {
          class: 'z-30 absolute mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-base shadow-lg ring-1 ring-black/5 focus:outline-none sm:text-sm'
        },
        option: {
          class: 'relative cursor-default select-none py-2 pl-4 pr-4 text-gray-900 hover:bg-indigo-600 hover:text-white'
        },
        emptyMessage: {
          class: 'relative cursor-default select-none py-2 pl-4 pr-4 text-gray-900 hover:bg-indigo-600 hover:text-white',
        },
      }"
    />