Phase 1.1 : mise en page et edition visuelle des noeuds
Evolution incrementale : aucun changement d'architecture, aucune fonctionnalite retiree, compatibilite .mmap v1 et IndexedDB preservee. Modele (format v2) - MindMapNode gagne `layout`, `iconStyle` et `branch`, tous optionnels. - NodeStyle gagne fontFamily, verticalAlign, lineHeight et shadow. - MapSettings gagne layoutSpacing, snapToGrid, snapGrid et alignmentGuides. - Un champ absent signifie "herite du theme" : rien n'est ecrit dans le document pour materialiser un defaut, donc les cartes deja stockees restent lisibles telles quelles. Migration v1 -> v2 : style.width devient layout.width, toujours lu en repli par le resolveur. Mise en page - Nouveau resolveur de style qui fusionne theme et personnalisations. - Taille automatique fidele au contenu, taille personnalisee bornee, redimensionnement a la souris via NodeResizer. - Padding horizontal et vertical, retour a la ligne, largeur maximale du texte, interligne, police, alignement horizontal et vertical, ombre. - Icones : emojis conserves, bibliotheque Lucide ajoutee, position, taille et espacement configurables. Multi-selection - Barre contextuelle d'alignement (6 axes) et de distribution (2 axes). - Application d'un reglage a toute la selection, avec etat "Mixte". Style - Copier / coller / reinitialiser le style, au clavier et par clic droit. Auto-layout - Espacement parent/enfant et entre branches configurable, presets Compact, Normal et Aere. Le layout reste declenche uniquement a la demande. Historique - Une seule entree par redimensionnement complet, par alignement, par distribution, par application multiple et par collage de style. Panneau Proprietes - Reorganise en cinq sections repliables dont l'etat est conserve pendant la session. Vraies icones d'alignement, tooltips et aria-labels partout. Corrections - Largeur des noeuds : word-break et overflow-wrap:anywhere ramenaient la largeur min-content a un caractere, ce qui faisait s'effondrer tous les noeuds automatiques. - Largeur auto en max-content bornee, pour qu'une phrase longue occupe la largeur maximale au lieu de former une colonne etroite. Tests - 85 tests vitest (43 -> 85) et 31 tests pytest (25 -> 31). Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
68
README.md
68
README.md
@@ -226,11 +226,28 @@ double-clic, undo/redo, copier/coller, duplication, sauvegarde automatique.
|
||||
Bezier, branches repliables avec compteur d'elements masques.
|
||||
|
||||
**Auto-layout**, uniquement sur demande : mind map droite, mind map gauche,
|
||||
arbre horizontal, arbre vertical.
|
||||
arbre horizontal, arbre vertical. L'espacement est configurable (distance
|
||||
parent/enfant et espacement entre branches), avec les presets Compact, Normal
|
||||
et Aere. Modifier l'espacement ne deplace rien tant que l'organisation n'est pas
|
||||
relancee.
|
||||
|
||||
**Proprietes du noeud** : texte, couleurs de fond/texte/bordure, forme
|
||||
(rectangle, arrondi, capsule, cercle), taille du texte, gras, italique,
|
||||
alignement, icone, URL ouverte dans un nouvel onglet, note.
|
||||
**Proprietes du noeud**, regroupees en sections repliables (Contenu,
|
||||
Typographie, Apparence, Mise en page, Branche) : texte, icone, URL, notes ;
|
||||
police, taille, gras, italique, alignement horizontal et vertical, interligne ;
|
||||
couleurs de fond/texte/bordure, forme (rectangle, arrondi, capsule, cercle),
|
||||
ombre ; taille automatique ou personnalisee, largeur, hauteur, padding
|
||||
horizontal et vertical, retour a la ligne, largeur maximale du texte ; style,
|
||||
epaisseur et couleur de la branche. Un reglage s'applique a toute la selection,
|
||||
avec un etat *Mixte* quand les valeurs different.
|
||||
|
||||
**Mise en page visuelle** : redimensionnement des noeuds a la souris (une seule
|
||||
annulation par redimensionnement), taille automatique qui epouse le contenu,
|
||||
alignement et distribution d'une multi-selection, aimantation sur la grille,
|
||||
guides d'alignement pendant le deplacement, copier / coller / reinitialiser le
|
||||
style (Ctrl+Maj+C, Ctrl+Maj+V), menu contextuel par clic droit.
|
||||
|
||||
**Bibliotheque d'icones** : emojis et icones integrees (Lucide), avec position
|
||||
(gauche, droite, au-dessus), taille et espacement configurables.
|
||||
|
||||
**Themes** : Default, Minimal, Dark, Midnight, Ocean, Forest, Pastel,
|
||||
Monochrome, Blueprint. Plus un mode clair/sombre pour l'interface. Changer de
|
||||
@@ -265,6 +282,8 @@ l'application chargee.
|
||||
| `Ctrl+C` | Copier |
|
||||
| `Ctrl+V` | Coller |
|
||||
| `Ctrl+D` | Dupliquer |
|
||||
| `Ctrl+Maj+C` | Copier le style du noeud |
|
||||
| `Ctrl+Maj+V` | Coller le style sur la selection |
|
||||
| `Ctrl+A` | Tout selectionner |
|
||||
| `Ctrl+S` | Sauvegarde explicite |
|
||||
| `Ctrl+F` | Rechercher dans la carte |
|
||||
@@ -278,6 +297,12 @@ l'application chargee.
|
||||
Un `.mmap` est un fichier **JSON UTF-8** contenant le document complet de la
|
||||
carte. Il ne contient jamais de jeton de partage.
|
||||
|
||||
Le format est en **version 2**. Les fichiers v1 restent lisibles : tous les
|
||||
champs ajoutes en v2 (`layout`, `iconStyle`, `branch`, reglages d'espacement)
|
||||
sont optionnels et un champ absent signifie simplement *herite du theme*. La
|
||||
seule transformation appliquee a l'import d'un fichier v1 est le deplacement de
|
||||
`style.width` vers `layout.width`.
|
||||
|
||||
```json
|
||||
{
|
||||
"version": 1,
|
||||
@@ -296,7 +321,26 @@ carte. Il ne contient jamais de jeton de partage.
|
||||
"icon": "\ud83d\udda5\ufe0f",
|
||||
"url": "https://exemple.fr",
|
||||
"note": "Texte libre",
|
||||
"style": { "backgroundColor": "#eef2ff", "shape": "rounded" }
|
||||
"style": {
|
||||
"backgroundColor": "#eef2ff",
|
||||
"shape": "rounded",
|
||||
"textAlign": "center",
|
||||
"verticalAlign": "middle",
|
||||
"lineHeight": 1.35,
|
||||
"fontFamily": "sans",
|
||||
"shadow": "soft"
|
||||
},
|
||||
"layout": {
|
||||
"widthMode": "fixed",
|
||||
"width": 240,
|
||||
"heightMode": "auto",
|
||||
"paddingX": 14,
|
||||
"paddingY": 8,
|
||||
"wrap": true,
|
||||
"maxTextWidth": 260
|
||||
},
|
||||
"iconStyle": { "kind": "emoji", "position": "left", "size": 16, "gap": 8 },
|
||||
"branch": { "style": "bezier", "width": 2, "color": "#94a3b8" }
|
||||
}
|
||||
],
|
||||
"edges": [{ "id": "e-a-b", "source": "a", "target": "b" }],
|
||||
@@ -305,7 +349,11 @@ carte. Il ne contient jamais de jeton de partage.
|
||||
"theme": "default",
|
||||
"layout": "mindmap-right",
|
||||
"branchStyle": "bezier",
|
||||
"showGrid": true
|
||||
"showGrid": true,
|
||||
"layoutSpacing": { "parentGap": 100, "siblingGap": 50 },
|
||||
"snapToGrid": false,
|
||||
"snapGrid": 20,
|
||||
"alignmentGuides": true
|
||||
}
|
||||
}
|
||||
```
|
||||
@@ -498,6 +546,13 @@ de boucle, recherche, auto-layout, lecture seule), assainissement des URL.
|
||||
- **Migrations de schema SQLite** : la V1 initialise le schema avec
|
||||
`create_all`, une seule table. Alembic n'est pas utilise ; il faudra
|
||||
l'introduire au premier changement de schema.
|
||||
- **Guides d'alignement** : ils apparaissent pendant un deplacement lorsqu'un
|
||||
bord ou un centre coincide (a 6 px pres) avec celui d'un autre noeud. Ils sont
|
||||
purement visuels : ils n'aimantent pas le noeud. Pour aimanter, activez
|
||||
*Aimanter sur la grille*.
|
||||
- **Alignement vertical** : il n'a d'effet visible que si le noeud est plus haut
|
||||
que son texte, c'est-a-dire avec une hauteur fixe ou un padding vertical
|
||||
important.
|
||||
- **Mobile** : consultation et edition basique fonctionnent, mais l'interface
|
||||
est concue pour desktop et tablette.
|
||||
- **Aucun compte utilisateur** : c'est voulu. Pas de connexion, pas de
|
||||
@@ -520,6 +575,7 @@ n'est utilisee.
|
||||
| dagre | MIT |
|
||||
| html-to-image | MIT |
|
||||
| jsPDF | MIT |
|
||||
| lucide-react | ISC |
|
||||
| Vite, Tailwind CSS, TypeScript, ESLint, Vitest | MIT |
|
||||
| FastAPI, Starlette, Pydantic, SQLAlchemy, Uvicorn | MIT / BSD |
|
||||
|
||||
|
||||
Reference in New Issue
Block a user