Composables

useComponentIcons

Source
Resolve leading/trailing/loading icon props the same way every Vy UI kit component does.

Overview

useComponentIcons (from @vyui/kit) powers the icon / leadingIcon / trailingIcon / loading prop convention used across kit components like Input and Button.

import { useComponentIcons } from '@vyui/kit'

const { isLeading, isTrailing, leadingIconName, trailingIconName } = useComponentIcons(props)

Behavior

  • icon routes leading unless trailing is set.
  • loading takes precedence and swaps in appConfig.ui.icons.loading (or a loadingIcon override).
  • leadingIcon / trailingIcon win over icon when both are set, since they pin a side explicitly.

Returns

PropertyTypeDescription
isLeadingComputedRef<boolean>Whether a leading icon should render.
isTrailingComputedRef<boolean>Whether a trailing icon should render.
leadingIconNameComputedRef<string | undefined>Resolved leading icon name.
trailingIconNameComputedRef<string | undefined>Resolved trailing icon name.

When to use it

Most app authors won't call this directly — it's mainly useful if you're building your own component that wants the same icon-prop ergonomics as the kit.