mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
feat(useComponentIcons): extract repetitive logic
This commit is contained in:
41
src/runtime/composables/useComponentIcons.ts
Normal file
41
src/runtime/composables/useComponentIcons.ts
Normal file
@@ -0,0 +1,41 @@
|
||||
import { computed } from 'vue'
|
||||
import { useAppConfig } from '#app'
|
||||
|
||||
export interface UseComponentIconsProps {
|
||||
icon?: string
|
||||
leading?: boolean
|
||||
leadingIcon?: string
|
||||
trailing?: boolean
|
||||
trailingIcon?: string
|
||||
loading?: boolean
|
||||
loadingIcon?: string
|
||||
}
|
||||
|
||||
export function useComponentIcons (props: UseComponentIconsProps) {
|
||||
const appConfig = useAppConfig()
|
||||
|
||||
const isLeading = computed(() => (props.icon && props.leading) || (props.icon && !props.trailing) || (props.loading && !props.trailing && !props.trailingIcon) || !!props.leadingIcon)
|
||||
const isTrailing = computed(() => (props.icon && props.trailing) || (props.loading && props.trailing) || !!props.trailingIcon)
|
||||
|
||||
const leadingIconName = computed(() => {
|
||||
if (props.loading) {
|
||||
return props.loadingIcon || appConfig.ui.icons.loading
|
||||
}
|
||||
|
||||
return props.leadingIcon || props.icon
|
||||
})
|
||||
const trailingIconName = computed(() => {
|
||||
if (props.loading && !isLeading.value) {
|
||||
return props.loadingIcon || appConfig.ui.icons.loading
|
||||
}
|
||||
|
||||
return props.trailingIcon || props.icon
|
||||
})
|
||||
|
||||
return {
|
||||
isLeading,
|
||||
isTrailing,
|
||||
leadingIconName,
|
||||
trailingIconName
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user