arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-27 10:20:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(Select): new component (#92)

Browse Source
This commit is contained in:
Benjamin Canac
2024-05-07 22:58:56 +02:00
committed by GitHub
parent 4a123906d0
commit 1942b8e117
60 changed files with 3068 additions and 692 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/runtime/composables/useComponentIcons.ts
View File

@@ -1,12 +1,9 @@
import { computed } from 'vue'
import { useAppConfig } from '#imports'
import type { AvatarProps } from '#ui/types'
import type { GetObjectField } from '#ui/types/utils'
export interface UseComponentIconsProps {
/** Display an avatar. */
avatar?: AvatarProps
/** Display an icon. */
/** Display an icon based on the `leading` and `trailing` props. */
icon?: string
/** When `true`, the icon will be displayed on the left side. */
leading?: boolean
@@ -28,7 +25,7 @@ export interface UseComponentIconsProps {
export function useComponentIcons<T>(props: UseComponentIconsProps & { size: GetObjectField<T, 'size'> }) {
const appConfig = useAppConfig()
const isLeading = computed(() => !!props.avatar || (props.icon && props.leading) || (props.icon && !props.trailing) || (props.loading && !props.trailing && !props.trailingIcon) || !!props.leadingIcon)
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(() => {
@@ -46,21 +43,10 @@ export function useComponentIcons<T>(props: UseComponentIconsProps & { size: Get
return props.trailingIcon || props.icon
})
const avatarSize = computed<AvatarProps['size']>(() => {
return ({
xs: '3xs' as const,
sm: '3xs' as const,
md: '2xs' as const,
lg: '2xs' as const,
xl: 'xs' as const
})[props.size || 'md']
})
return {
isLeading,
isTrailing,
leadingIconName,
trailingIconName,
avatarSize
trailingIconName
}
}