arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-22 07:50:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(ButtonGroup): new component (#88)

Browse Source 
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Romain Hamel
2024-05-07 11:19:25 +02:00
committed by GitHub
parent 2c5d7ccf70
commit 43066fd9ea
12 changed files with 317 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/runtime/components/Input.vue
View File

@@ -45,7 +45,7 @@ export interface InputSlots {
<script lang="ts" setup>
import { ref, computed, onMounted } from 'vue'
import { useComponentIcons, useFormField } from '#imports'
import { useComponentIcons, useFormField, useButtonGroup } from '#imports'
import { UIcon, UAvatar } from '#components'
import { looseToNumber } from '#ui/utils'
@@ -60,20 +60,21 @@ const slots = defineSlots<InputSlots>()
const [modelValue, modelModifiers] = defineModel<string | number>()
const { emitFormBlur, emitFormInput, size, color, id, name, disabled } = useFormField<InputProps>(props)
const { emitFormBlur, emitFormInput, size: formGroupSize, color, id, name, disabled } = useFormField<InputProps>(props)
const { orientation, size: buttonGroupSize } = useButtonGroup<InputProps>(props)
const { isLeading, isTrailing, leadingIconName, trailingIconName, avatarSize } = useComponentIcons<InputProps>(props)
// const { size: sizeButtonGroup, rounded } = useInjectButtonGroup({ ui, props })
// const size = computed(() => sizeButtonGroup.value || sizeFormGroup.value)
const inputSize = computed(() => buttonGroupSize.value || formGroupSize.value)
const ui = computed(() => tv({ extend: input, slots: props.ui })({
type: props.type as InputVariants['type'],
color: color.value,
variant: props.variant,
size: size?.value,
size: inputSize?.value,
loading: props.loading,
leading: isLeading.value || !!slots.leading,
trailing: isTrailing.value || !!slots.trailing
trailing: isTrailing.value || !!slots.trailing,
buttonGroup: orientation.value
}))
const inputRef = ref<HTMLInputElement | null>(null)