[#MUI-10] Création d'un composant bouton (#19)

| Numéro du ticket | Titre du ticket |
|------------------|-----------------|
|                  |                 |

## Description de la PR

## Modification du .env

## Check list

- [ ] Pas de régression
- [ ] TU/TI/TF rédigée
- [ ] TU/TI/TF OK
- [ ] CHANGELOG modifié

Reviewed-on: #19
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>
This commit was merged in pull request #19.
This commit is contained in:
2026-03-24 10:12:28 +00:00
committed by Autin
parent 968b7087b5
commit e76337502a
16 changed files with 631 additions and 50 deletions

View File

@@ -40,7 +40,7 @@
data-test="icon"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success' : iconColor,
iconPositionClass,
@@ -53,7 +53,7 @@
:id="`${inputId}-describedby`"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success'
: 'text-m-muted',
@@ -143,7 +143,7 @@ const mergedInputClass = computed(() =>
isFilled.value ? 'border-black' : 'border-m-muted',
disabled.value ? 'cursor-not-allowed text-black/60 [&:not(:placeholder-shown)]:border-m-muted border-m-muted' : 'cursor-text',
hasError.value
? 'border-m-error focus:border-m-error [&:not(:placeholder-shown)]:border-m-error'
? 'border-m-danger focus:border-m-danger [&:not(:placeholder-shown)]:border-m-danger'
: hasSuccess.value
? 'border-m-success focus:border-m-success [&:not(:placeholder-shown)]:border-m-success'
: 'focus:border-m-primary',
@@ -159,7 +159,7 @@ const mergedLabelClass = computed(() =>
shouldFloatLabel.value ? '-translate-y-[1.25rem] peer-focus:-translate-y-[1.55rem] scale-90' : '',
disabled.value ? 'peer-[&:not(:placeholder-shown):not(:focus)]:text-black/60' : '',
hasError.value
? 'text-m-error'
? 'text-m-danger'
: hasSuccess.value
? 'text-m-success'
: 'peer-placeholder-shown:text-m-muted peer-[&:not(:placeholder-shown):not(:focus)]:text-black peer-focus:text-m-primary',

View File

@@ -54,7 +54,7 @@
:id="`${inputId}-describedby`"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success'
: 'text-m-muted',
@@ -180,7 +180,7 @@ const mergedInputClass = computed(() =>
' peer h-[22px] min-w-0 border bg-white text-center outline-none placeholder:text-transparent text-lg border-x-0 border-black',
props.disabled ? 'cursor-not-allowed text-black/60' : 'cursor-text',
hasError.value
? 'border-m-error focus:border-m-error [&:not(:placeholder-shown)]:border-m-error'
? 'border-m-danger focus:border-m-danger [&:not(:placeholder-shown)]:border-m-danger'
: hasSuccess.value
? 'border-m-success focus:border-m-success [&:not(:placeholder-shown)]:border-m-success'
: '',
@@ -191,7 +191,7 @@ const mergedInputClass = computed(() =>
const mergedLabelClass = computed(() =>
twMerge(
'cursor-pointer text-black mr-4 text-[18px]',
hasError.value ? 'text-m-error' : '',
hasError.value ? 'text-m-danger' : '',
hasSuccess.value ? 'text-m-success' : '',
props.disabled ? 'cursor-not-allowed text-black/60' : '',
props.labelClass,
@@ -203,7 +203,7 @@ const mergedButtonMinusClass = computed(() =>
'h-[22px] w-[40px] border border-black rounded-s-[3px]',
isMinusDisabled.value ? 'cursor-not-allowed text-black/60' : 'cursor-pointer',
hasError.value
? 'border-m-error'
? 'border-m-danger'
: hasSuccess.value
? 'border-m-success'
: '',
@@ -215,7 +215,7 @@ const mergedButtonPlusClass = computed(() =>
'h-[22px] w-[40px] border border-black rounded-e-[3px]',
isPlusDisabled.value ? 'cursor-not-allowed text-black/60' : 'cursor-pointer',
hasError.value
? 'border-m-error'
? 'border-m-danger'
: hasSuccess.value
? 'border-m-success'
: '',

View File

@@ -39,7 +39,7 @@
data-test="icon"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success' : 'text-m-muted',
'cursor-pointer absolute right-[10px] top-1/2 -translate-y-1/2',
@@ -53,7 +53,7 @@
:id="`${inputId}-describedby`"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success'
: 'text-m-muted',
@@ -142,7 +142,7 @@ const mergedInputClass = computed(() =>
isFilled.value ? 'border-black' : 'border-m-muted',
disabled.value ? 'cursor-not-allowed text-black/60 [&:not(:placeholder-shown)]:border-m-muted border-m-muted' : 'cursor-text',
hasError.value
? 'border-m-error focus:border-m-error [&:not(:placeholder-shown)]:border-m-error'
? 'border-m-danger focus:border-m-danger [&:not(:placeholder-shown)]:border-m-danger'
: hasSuccess.value
? 'border-m-success focus:border-m-success [&:not(:placeholder-shown)]:border-m-success'
: 'focus:border-m-primary',
@@ -158,7 +158,7 @@ const mergedLabelClass = computed(() =>
shouldFloatLabel.value ? '-translate-y-[1.25rem] peer-focus:-translate-y-[1.55rem] scale-90' : '',
disabled.value ? 'peer-[&:not(:placeholder-shown):not(:focus)]:text-black/60' : '',
hasError.value
? 'text-m-error'
? 'text-m-danger'
: hasSuccess.value
? 'text-m-success'
: 'peer-placeholder-shown:text-m-muted peer-[&:not(:placeholder-shown):not(:focus)]:text-black peer-focus:text-m-primary',

View File

@@ -12,7 +12,7 @@
isFilled ? 'border-black' : 'border-m-muted',
disabled ? 'cursor-not-allowed text-black/60 border-m-muted' : 'cursor-text',
hasError
? 'border-m-error focus:border-m-error focus:pl-[11px]'
? 'border-m-danger focus:border-m-danger focus:pl-[11px]'
: hasSuccess
? 'border-m-success focus:border-m-success focus:pl-[11px]'
: 'focus:border-m-primary focus:pl-[11px]',
@@ -43,7 +43,7 @@
shouldFloatLabel ? '-translate-y-[1.30rem] scale-90' : '',
disabled ? 'text-black/60' : '',
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success'
: isFocused ? 'text-m-primary' : shouldFloatLabel ? 'text-black' : 'text-m-muted',
@@ -67,7 +67,7 @@
:id="`${inputId}-describedby`"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success'
: 'text-m-muted',

View File

@@ -43,7 +43,7 @@
data-test="icon"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success' : 'text-m-muted',
'pointer-events-none absolute right-[10px] top-1/2 -translate-y-1/2',
@@ -56,7 +56,7 @@
:id="`${inputId}-describedby`"
:class="[
hasError
? 'text-m-error'
? 'text-m-danger'
: hasSuccess
? 'text-m-success'
: 'text-m-muted',
@@ -131,7 +131,7 @@ const mergedInputClass = computed(() =>
isFilled.value ? 'border-black' : 'border-m-muted',
disabled.value ? 'cursor-not-allowed text-black/60 [&:not(:placeholder-shown)]:border-m-muted border-m-muted' : 'cursor-pointer',
hasError.value
? 'border-m-error focus:border-m-error [&:not(:placeholder-shown)]:border-m-error'
? 'border-m-danger focus:border-m-danger [&:not(:placeholder-shown)]:border-m-danger'
: hasSuccess.value
? 'border-m-success focus:border-m-success [&:not(:placeholder-shown)]:border-m-success'
: 'focus:border-m-primary',
@@ -147,7 +147,7 @@ const mergedLabelClass = computed(() =>
shouldFloatLabel.value ? '-translate-y-[1.25rem] peer-focus:-translate-y-[1.55rem] scale-90' : '',
disabled.value ? 'peer-[&:not(:placeholder-shown):not(:focus)]:text-black/60' : '',
hasError.value
? 'text-m-error'
? 'text-m-danger'
: hasSuccess.value
? 'text-m-success'
: 'peer-placeholder-shown:text-m-muted peer-[&:not(:placeholder-shown):not(:focus)]:text-black peer-focus:text-m-primary',