THOLOT DECHENE Matthieu
d7bf038fdd
All checks were successful
Release / release (push) Successful in 1m6s
## Résumé Release de `develop` vers `main` pour déclencher `semantic-release` (publication sur Gitea Packages). Inclut : - **#37** — `feat(input-rich-text) : ajout d'un éditeur de texte riche basé sur TipTap v3` Le commit `feat:` déclenchera un bump **minor** (rétrocompatible). ## Test plan - [x] Tests verts sur `develop` (315/315) - [x] Lint OK (0 erreur sur les fichiers ajoutés) - [x] Histoire build OK - [ ] Vérifier le run du workflow `release.yml` après merge - [ ] Vérifier la nouvelle version publiée sur Gitea Packages Co-authored-by: kevin <kevin@yuno.malio.fr> Co-authored-by: tristan <tristan@yuno.malio.fr> Co-authored-by: Kevin Boudet <kevin@yuno.malio.fr> Reviewed-on: #38
92 lines
2.8 KiB
Vue
92 lines
2.8 KiB
Vue
<template>
|
|
<div class="grid grid-cols-1 items-start gap-6 p-4 lg:grid-cols-2">
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Simple</h2>
|
|
<MalioInputRichText
|
|
v-model="simpleValue"
|
|
label="Note"
|
|
placeholder="Écrire ici…"
|
|
/>
|
|
<pre class="mt-3 overflow-auto rounded bg-m-bg p-2 text-xs">{{ simpleValue }}</pre>
|
|
</div>
|
|
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Avec contenu initial + hint</h2>
|
|
<MalioInputRichText
|
|
v-model="hintValue"
|
|
label="Description"
|
|
hint="Tu peux mettre en forme avec la barre d'outils"
|
|
/>
|
|
</div>
|
|
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Erreur</h2>
|
|
<MalioInputRichText
|
|
v-model="errorValue"
|
|
label="Compte-rendu"
|
|
error="Le compte-rendu doit faire au moins 20 caractères"
|
|
/>
|
|
</div>
|
|
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Succès</h2>
|
|
<MalioInputRichText
|
|
v-model="successValue"
|
|
label="Compte-rendu"
|
|
success="Compte-rendu validé"
|
|
/>
|
|
</div>
|
|
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Readonly</h2>
|
|
<MalioInputRichText
|
|
v-model="readonlyValue"
|
|
label="Note (lecture seule)"
|
|
readonly
|
|
/>
|
|
</div>
|
|
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Disabled</h2>
|
|
<MalioInputRichText
|
|
v-model="disabledValue"
|
|
label="Note (désactivée)"
|
|
disabled
|
|
/>
|
|
</div>
|
|
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Affichage seul (editable=false)</h2>
|
|
<MalioInputRichText
|
|
:model-value="readonlyValue"
|
|
:editable="false"
|
|
/>
|
|
</div>
|
|
|
|
<div class="rounded-lg border p-4">
|
|
<h2 class="mb-4 text-xl font-bold">Sortie HTML</h2>
|
|
<MalioInputRichText
|
|
v-model="htmlValue"
|
|
label="Article"
|
|
output-format="html"
|
|
min-height="200px"
|
|
placeholder="Tape ici, la sortie sera en HTML…"
|
|
/>
|
|
<pre class="mt-3 overflow-auto rounded bg-m-bg p-2 text-xs">{{ htmlValue }}</pre>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import {ref} from 'vue'
|
|
import MalioInputRichText from '../../../../app/components/malio/input/InputRichText.vue'
|
|
|
|
const simpleValue = ref('')
|
|
const hintValue = ref('## Titre\n\nUn paragraphe avec du **gras**, de l\'*italique* et un [lien](https://malio.fr).')
|
|
const errorValue = ref('Trop court')
|
|
const successValue = ref('Tout est bon de mon côté.')
|
|
const readonlyValue = ref('## Compte-rendu\n\n- Point 1\n- Point 2\n\n> Citation importante')
|
|
const disabledValue = ref('Contenu indisponible.')
|
|
const htmlValue = ref('<p>Contenu <strong>riche</strong>.</p>')
|
|
</script>
|