feat(radio) : prop contentClass pour piloter la disposition des radios
This commit is contained in:
@@ -93,6 +93,11 @@ describe('MalioRadioGroup', () => {
|
||||
expect(wrapper.get('[role="radiogroup"]').classes()).toContain('min-h-[3rem]')
|
||||
})
|
||||
|
||||
it('contentClass est fusionné sur la zone des radios', () => {
|
||||
const wrapper = mountGroup({inline: true, contentClass: 'justify-between'})
|
||||
expect(wrapper.get('[role="radiogroup"]').classes()).toContain('justify-between')
|
||||
})
|
||||
|
||||
it('accepte des radios via le slot par défaut', () => {
|
||||
const wrapper = mount(RadioGroupForTest, {
|
||||
props: {modelValue: 'b'},
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
:aria-labelledby="label ? `${groupId}-label` : undefined"
|
||||
:aria-invalid="hasError || undefined"
|
||||
:aria-describedby="describedBy"
|
||||
:class="contentClass"
|
||||
:class="contentZoneClass"
|
||||
>
|
||||
<MalioRadioButton
|
||||
v-for="(option, index) in options"
|
||||
@@ -74,6 +74,7 @@ const props = withDefaults(
|
||||
success?: string
|
||||
reserveMessageSpace?: boolean
|
||||
groupClass?: string
|
||||
contentClass?: string
|
||||
inputClass?: string
|
||||
labelClass?: string
|
||||
}>(),
|
||||
@@ -91,6 +92,7 @@ const props = withDefaults(
|
||||
success: '',
|
||||
reserveMessageSpace: true,
|
||||
groupClass: '',
|
||||
contentClass: '',
|
||||
inputClass: '',
|
||||
labelClass: '',
|
||||
},
|
||||
@@ -136,10 +138,13 @@ provide(radioGroupContextKey, {
|
||||
describedBy,
|
||||
})
|
||||
|
||||
const contentClass = computed(() =>
|
||||
props.inline
|
||||
? 'flex flex-wrap items-center gap-x-6 min-h-[3rem]'
|
||||
: 'flex flex-col gap-y-1',
|
||||
const contentZoneClass = computed(() =>
|
||||
twMerge(
|
||||
props.inline
|
||||
? 'flex flex-wrap items-center gap-x-6 min-h-[3rem]'
|
||||
: 'flex flex-col gap-y-1',
|
||||
props.contentClass,
|
||||
),
|
||||
)
|
||||
|
||||
const mergedGroupClass = computed(() => twMerge('w-full', props.groupClass))
|
||||
|
||||
Reference in New Issue
Block a user