tristan bc31d94719 feat(ui) : MalioDate/DateTime — event update:rawValue pour validation back-autoritative (#MUI-44) (#74)
## MUI-44 — Exposer la saisie brute invalide (`@update:rawValue`)

Suite de MUI-43. Une app consommatrice (Starseed/ERP) fait de la **validation back-autoritative** : plutôt que bloquer le submit côté front, elle transmet la saisie invalide au serveur qui renvoie un `422` mappé inline. Or `MalioDate`/`MalioDateTime` **avalent** la saisie invalide (ni `modelValue`, ni texte brut) → le parent ne peut rien envoyer.

### Changements
- Nouvel emit `(e: 'update:rawValue', value: string)` sur `Date.vue` et `DateTime.vue`, émis à chaque commit :
  - saisie **invalide** (non parsable ou hors `min`/`max`) → chaîne brute trimmée telle que tapée (ex. `"32/13/2026"`), **sans** emit `update:modelValue` ;
  - saisie **valide ou vide**, **clear**, **sélection au calendrier** (+ réglage d'heure pour DateTime) → `''`.
- Canal **séparé** : `modelValue` reste `string` ISO `| null` (affichage + round-trip). Le parent construit son payload via `valid ? modelValue : rawValue`.

### Tests (TDD)
6 cas ajoutés par composant : malformé, hors bornes, valide, vidé, clear, sélection calendrier. Suite complète **987 ✓**, ESLint 0 erreur.

### Doc
`COMPONENTS.md` (paragraphe + Events + exemples) et `CHANGELOG.md` (entrée MUI-44) à jour.

### Hors périmètre
`DateRange`/`DateWeek` (pas de saisie texte libre). Branchement Starseed (`collectDenormalizationErrors`, `useFormErrors`) traité côté ERP.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Reviewed-on: #74
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>
2026-06-12 07:38:22 +00:00
2026-02-19 10:48:42 +01:00
2026-02-19 10:58:13 +01:00
2026-02-19 10:48:42 +01:00
2026-02-19 10:48:42 +01:00
2026-02-19 10:48:42 +01:00
2026-02-19 10:48:42 +01:00
2026-02-19 11:18:36 +01:00

Malio UI Layer (Nuxt)

Layer Nuxt partageable pour centraliser des composants UI et les réutiliser dans plusieurs projets.

Le layer est à la racine du repo.
Le dossier .playground/ sert à tester localement les composants du layer.

Commandes utiles

Installation

npm install

Développement local (playground)

Préparer les fichiers Nuxt générés du playground (utile pour TypeScript + ESLint) :

npm run dev:prepare

Lancer le playground :

npm run dev

Qualité

Lancer le linter :

npm run lint

Build / preview

Build de production du playground :

npm run build

Génération statique du playground :

npm run generate

Prévisualiser le build :

npm run preview

Livraison / publication du layer (CI)

La publication est automatique via .gitea/workflows/release.yml sur push main / master.

Le job CI :

  1. Installe les dépendances
  2. Lance npm run dev:prepare
  3. Lance npm run lint
  4. Lance semantic-release (version automatique + publish sur Gitea Packages)

Les versions sont calculées via Conventional Commits :

  • fix: ... -> patch (1.0.0 -> 1.0.1)
  • feat: ... -> minor (1.0.0 -> 1.1.0)
  • feat!: ... ou BREAKING CHANGE: -> major (1.0.0 -> 2.0.0)

Secrets requis dans le repo Gitea :

  • NPM_TOKEN : token avec droits publish package
  • RELEASE_TOKEN : token avec droits write repo (tags/releases)

Commande locale utile avant push :

npm pack --dry-run

Tester un composant dans le playground

Le playground étend déjà le layer via .playground/nuxt.config.ts.

Exemple rapide :

  1. Créer un composant dans le layer
    Fichier app/components/malio/Badge.vue
<template>
  <span class="inline-flex rounded-full bg-gray-900 px-2 py-1 text-xs text-white">
    {{ label }}
  </span>
</template>

<script setup lang="ts">
withDefaults(defineProps<{ label?: string }>(), {
  label: 'Badge',
})
</script>
  1. Lutiliser dans le playground
    Fichier .playground/pages/index.vue
<template>
  <div class="p-6 space-y-4">
    <MalioBadge label="Nouveau composant" />
  </div>
</template>
  1. Lancer le playground
npm run dev

Utiliser ce layer dans un autre projet Nuxt

1) Configurer le .npmrc du projet consommateur

Option simple :

@malio:registry=https://gitea.malio.fr/api/packages/MALIO-DEV/npm/

Puis :

export NPM_TOKEN=TON_TOKEN_GITEA

2) Installer le package

npm install @malio/layer-ui

3) Étendre le layer

Dans nuxt.config.ts du projet consommateur :

export default defineNuxtConfig({
  extends: ['@malio/layer-ui'],
})
S
Description
No description provided
Readme 2.6 MiB
Languages
Vue 58.7%
TypeScript 40.6%
CSS 0.4%
Shell 0.2%