FontPickerRoot
FontPickerRoot предоставляет поиск и асинхронный список семейств шрифтов без навязанного оформления. Компонент построен на Reka UI Combobox; приложение может заменить кнопку открытия, поле поиска, строки списка, отметку выбора и пустое состояние через слоты.
Props
| Prop | Default | Type |
|---|---|---|
listFamilies*Асинхронный источник доступных семейств шрифтов. | — | () => Promise<string[]> |
triggerClassНеобязательный класс стандартной кнопки открытия. | — | string | undefined |
contentClassНеобязательный класс содержимого списка. | — | string | undefined |
itemClassНеобязательный класс строк списка. | — | string | undefined |
searchClassНеобязательный класс поля поиска. | — | string | undefined |
viewportClassНеобязательный класс прокручиваемой области. | — | string | undefined |
emptyClassНеобязательный класс пустого состояния. | — | string | undefined |
emptySearchTextТекст, когда поиск не дал результатов. | — | string | undefined |
emptyFontsTextТекст, когда шрифты недоступны. | — | string | undefined |
emptyFontsHintДополнительная подсказка при отсутствии шрифтов. | — | string | undefined |
Model
| Prop | Default | Type |
|---|---|---|
v-model*Выбранное семейство шрифта. | — | string |
Events
| Event | Payload | Description |
|---|---|---|
selectВызывается после выбора семейства. | family: string | Вызывается после выбора семейства. |
Пример
vue
<FontPickerRoot v-model="fontFamily" :list-families="listFamilies">
<template #trigger="{ value }">
<button class="w-full truncate">{{ value }}</button>
</template>
</FontPickerRoot>