@tekkare/romulus 0.1.219 → 0.1.221

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.16.0"
   },
-  "version": "0.1.218",
+  "version": "0.1.220",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/assets/styles/tokens.css

@@ -1 +1 @@
-:root{--sidebar-w:220px;--sidebar-collapsed-w:56px;--rsidebar-w:280px;--rsidebar-collapsed-w:76px;--topbar-h:56px;--topbar-merged-h:0px;--tabs-h:46px;--analysis-header-h:124px;--sourcebar-h:38px;--filterbar-h:56px;--color-primary:#2100ad;--color-primary-hover:#1a0088;--color-secondary:#6b3fff;--color-accent-soft:#b485ff;--color-violet-pale:#d6ccff;--color-healthcare:#4164ee;--color-discovery:#07816f;--color-pharma:#f7520e;--color-databank:#e04380;--color-healthcare-active:#3451d4;--color-discovery-active:#066b5c;--color-pharma-active:#d9470c;--color-databank-active:#c73a6f;--color-pharma-soft:#ff7942;--healthcare-rgb:65,100,238;--discovery-rgb:7,129,111;--pharma-rgb:247,82,14;--databank-rgb:224,67,128;--surface-rgb:255,255,255;--shadow-rgb:30,41,59;--color-accent-teal:#00d4a8;--color-notification:#e59;--color-text-inverse:#fff;--color-success:#16a34a;--color-success-bg:#dcfce7;--color-warning:#d97706;--color-warning-bg:#fef3c7;--color-danger:#dc2626;--color-danger-bg:#fee2e2;--color-info:#4164ee;--color-info-bg:#dbeafe;--bg-app:#eef1f5;--bg-surface:#fff;--bg-surface-2:#fbfbfd;--bg-surface-3:#f5f5f9;--bg-hover:#eef1fe;--border-default:#dbdef0;--border-soft:#f0f1f7;--text-primary:#1e293b;--text-secondary:#525670;--text-muted:#878ca6;--brand-rgb:33,0,173;--chart-cat-1:#2100ad;--chart-cat-2:#00a38e;--chart-cat-3:#e67e22;--chart-cat-4:#d63384;--chart-cat-5:#4164ee;--chart-cat-6:#16a34a;--space-2:2px;--space-4:4px;--space-6:6px;--space-8:8px;--space-10:10px;--space-12:12px;--space-16:16px;--space-20:20px;--space-24:24px;--space-32:32px;--space-40:40px;--space-48:48px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:10px;--radius-2xl:12px;--radius-pill:999px;--font-10:10px;--font-11:11px;--font-12:12px;--font-13:13px;--font-14:14px;--font-16:16px;--font-18:18px;--font-22:22px;--font-24:24px;--font-32:32px;--weight-normal:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--font-serif:"Caudex",Georgia,serif;--font-sans:"Figtree",system-ui,sans-serif;--font-mono:"SF Mono",Menlo,monospace;--shadow-xs:0 1px 2px rgba(30,41,59,.04);--shadow-sm:0 2px 6px rgba(30,41,59,.06),0 1px 2px rgba(30,41,59,.03);--shadow-md:0 4px 12px rgba(30,41,59,.06),0 1px 3px rgba(30,41,59,.04);--shadow-lg:0 8px 24px rgba(30,41,59,.12);--shadow-focus:0 0 0 3px rgba(107,63,255,.14);--duration-instant:100ms;--duration-fast:150ms;--duration-base:240ms;--duration-slow:400ms;--duration-slowest:600ms;--ease-out:cubic-bezier(.2,0,0,1);--ease-in-out:cubic-bezier(.4,0,.2,1);--ease-spring:cubic-bezier(.5,1.6,.4,1);--z-base:1;--z-sticky:20;--z-header:30;--z-drawer:40;--z-modal:50;--z-toast:60;--z-help:70}body.night{--color-primary:#9b7cff;--color-secondary:#b485ff;--color-accent-soft:#d6ccff;--color-healthcare:#7aa0ff;--color-discovery:#2ecc71;--color-pharma:#ff8c00;--color-databank:#f472b6;--color-healthcare-active:#4164ee;--color-discovery-active:#07816f;--color-pharma-active:#f7520e;--color-databank-active:#e04380;--healthcare-rgb:122,160,255;--discovery-rgb:46,204,113;--pharma-rgb:255,140,0;--databank-rgb:244,114,182;--surface-rgb:26,26,36;--shadow-rgb:0,0,0;--bg-app:#0e0e14;--bg-surface:#1a1a24;--bg-surface-2:#232330;--bg-surface-3:#2a2a38;--bg-hover:#2d2a42;--border-default:#45455c;--border-soft:#32323f;--text-primary:#f5f6fa;--text-secondary:#cfd3e5;--text-muted:#8a90a8;--brand-rgb:155,124,255;--color-success:#6fe8c5;--color-success-bg:rgba(0,212,168,.18);--color-warning:#fbbf24;--color-warning-bg:rgba(245,158,11,.18);--color-danger:#fca5a5;--color-danger-bg:rgba(239,68,68,.18);--color-info:#7aa0ff;--color-info-bg:rgba(65,100,238,.18);--chart-cat-1:#9b7cff;--chart-cat-2:#6fe8c5;--chart-cat-3:#fbbf24;--chart-cat-4:#f472b6;--chart-cat-5:#7b9ef5;--chart-cat-6:#bef264;background:var(--bg-app);color:var(--text-primary);color-scheme:dark}body.text-small{--font-10:9px;--font-11:10px;--font-12:11px;--font-13:12px;--font-14:13px;--font-16:15px;--font-18:17px;--font-22:20px;--font-24:22px;--font-32:29px}body.text-large{--font-10:11px;--font-11:12px;--font-12:13px;--font-13:15px;--font-14:16px;--font-16:18px;--font-18:20px;--font-22:25px;--font-24:27px;--font-32:36px}body.text-xl{--font-10:12px;--font-11:13px;--font-12:15px;--font-13:16px;--font-14:18px;--font-16:20px;--font-18:22px;--font-22:28px;--font-24:30px;--font-32:40px}body.density-compact{--space-4:3px;--space-6:4px;--space-8:6px;--space-10:8px;--space-12:9px;--space-16:12px;--space-20:15px;--space-24:18px;--space-32:24px;--space-40:30px;--space-48:36px}body.high-contrast:not(.night){--text-primary:#000;--text-secondary:#1a1a24;--text-muted:#2f2f40;--border-default:#000;--border-soft:#525670;--bg-app:#fff;--bg-surface:#fff;--bg-surface-2:#fff;--bg-surface-3:#f0f1f7;--bg-hover:#ffe56b;--color-primary:#1100a0;--color-primary-hover:#0a0070;--color-secondary:#5028d8;--color-success:#006b2c;--color-warning:#8c4500;--color-danger:#a60000;--color-info:#0040c8}body.night.high-contrast{--text-primary:#fff;--text-secondary:#f5f6fa;--text-muted:#cfd3e5;--border-default:#fff;--border-soft:#b8bcd0;--bg-app:#000;--bg-surface:#000;--bg-surface-2:#000;--bg-surface-3:#000;--bg-hover:#ffe56b;--color-primary:#d6ccff;--color-primary-hover:#fff;--color-secondary:#e5daff;--color-accent-soft:#fff;--color-success:#6fe8c5;--color-warning:#fbbf24;--color-danger:#fca5a5;--color-info:#7aa0ff;--brand-rgb:214,204,255}body.reduce-motion *,body.reduce-motion :after,body.reduce-motion :before{animation:none!important;scroll-behavior:auto!important;transition:none!important}body.cvd-deutera .pane,body.cvd-deutera .rm-cvd-target,body.cvd-deutera .rm-shell,body.cvd-deutera .rsidebar,body.cvd-deutera .sidebar,body.cvd-deutera>.rm-action-bar__overlay,body.cvd-deutera>.rm-drawer,body.cvd-deutera>.rm-drawer-overlay,body.cvd-deutera>.rm-modal-overlay{filter:url(#a11y-deutera)}body.cvd-protan .pane,body.cvd-protan .rm-cvd-target,body.cvd-protan .rm-shell,body.cvd-protan .rsidebar,body.cvd-protan .sidebar,body.cvd-protan>.rm-action-bar__overlay,body.cvd-protan>.rm-drawer,body.cvd-protan>.rm-drawer-overlay,body.cvd-protan>.rm-modal-overlay{filter:url(#a11y-protan)}body.cvd-tritan .pane,body.cvd-tritan .rm-cvd-target,body.cvd-tritan .rm-shell,body.cvd-tritan .rsidebar,body.cvd-tritan .sidebar,body.cvd-tritan>.rm-action-bar__overlay,body.cvd-tritan>.rm-drawer,body.cvd-tritan>.rm-drawer-overlay,body.cvd-tritan>.rm-modal-overlay{filter:url(#a11y-tritan)}body.cvd-mono .pane,body.cvd-mono .rm-cvd-target,body.cvd-mono .rm-shell,body.cvd-mono .rsidebar,body.cvd-mono .sidebar,body.cvd-mono>.rm-action-bar__overlay,body.cvd-mono>.rm-drawer,body.cvd-mono>.rm-drawer-overlay,body.cvd-mono>.rm-modal-overlay{filter:url(#a11y-mono)}:root{--r-color-primary-50:#f0f4ff;--r-color-primary-100:#dce5fd;--r-color-primary-200:#b9cbfb;--r-color-primary-300:#96b0f9;--r-color-primary-400:#7395f5;--r-color-primary-500:#5a7ef2;--r-color-primary-600:var(--color-healthcare);--r-color-primary-700:#3451d4;--r-color-primary-800:#283fb0;--r-color-primary-900:#1c2d8a;--r-color-gray-50:#f9fafb;--r-color-gray-100:#f3f4f6;--r-color-gray-200:#e5e7eb;--r-color-gray-300:#d1d5db;--r-color-gray-400:#9ca3af;--r-color-gray-500:#6b7280;--r-color-gray-600:#4b5563;--r-color-gray-700:#374151;--r-color-gray-800:#1f2937;--r-color-gray-900:#111827;--r-color-gray-950:#030712;--r-color-success-500:var(--color-success);--r-color-success-600:#16a34a;--r-color-warning-500:#f59e0b;--r-color-warning-600:var(--color-warning);--r-color-danger-500:#ef4444;--r-color-danger-600:var(--color-danger);--r-color-white:#fff;--r-color-black:#000;--r-font-family:var(--font-sans);--r-font-mono:var(--font-mono);--r-text-xs:0.75rem;--r-text-sm:0.875rem;--r-text-base:1rem;--r-text-lg:1.125rem;--r-text-xl:1.25rem;--r-text-2xl:1.5rem;--r-text-3xl:1.875rem;--r-text-4xl:2.25rem;--r-font-weight-normal:var(--weight-normal);--r-font-weight-medium:var(--weight-medium);--r-font-weight-semibold:var(--weight-semibold);--r-font-weight-bold:var(--weight-bold);--r-leading-tight:1.25;--r-leading-normal:1.5;--r-leading-relaxed:1.75;--r-space-0:0;--r-space-1:var(--space-4);--r-space-2:var(--space-8);--r-space-3:var(--space-12);--r-space-4:var(--space-16);--r-space-5:var(--space-20);--r-space-6:var(--space-24);--r-space-8:var(--space-32);--r-space-10:var(--space-40);--r-space-12:var(--space-48);--r-radius-none:0;--r-radius-sm:var(--radius-sm);--r-radius-md:var(--radius-md);--r-radius-lg:var(--radius-lg);--r-radius-xl:0.75rem;--r-radius-2xl:1rem;--r-radius-full:var(--radius-pill);--r-shadow-xs:0 1px 2px 0 rgba(0,0,0,.05);--r-shadow-sm:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--r-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--r-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--r-shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--r-transition-fast:var(--duration-fast) var(--ease-in-out);--r-transition-base:200ms var(--ease-in-out);--r-transition-slow:var(--duration-slow) var(--ease-in-out)}
+:root{--sidebar-w:220px;--sidebar-collapsed-w:56px;--rsidebar-w:280px;--rsidebar-collapsed-w:76px;--topbar-h:56px;--topbar-merged-h:0px;--tabs-h:46px;--analysis-header-h:124px;--sourcebar-h:38px;--filterbar-h:56px;--color-primary:#2100ad;--color-primary-hover:#1a0088;--color-secondary:#6b3fff;--color-accent-soft:#b485ff;--color-violet-pale:#d6ccff;--color-healthcare:#4164ee;--color-discovery:#07816f;--color-pharma:#f7520e;--color-databank:#e04380;--color-healthcare-active:#3451d4;--color-discovery-active:#066b5c;--color-pharma-active:#d9470c;--color-databank-active:#c73a6f;--color-pharma-soft:#ff7942;--healthcare-rgb:65,100,238;--discovery-rgb:7,129,111;--pharma-rgb:247,82,14;--databank-rgb:224,67,128;--surface-rgb:255,255,255;--shadow-rgb:30,41,59;--color-accent-teal:#00d4a8;--color-notification:#e59;--color-text-inverse:#fff;--color-success:#16a34a;--color-success-bg:#dcfce7;--color-warning:#d97706;--color-warning-bg:#fef3c7;--color-danger:#dc2626;--color-danger-bg:#fee2e2;--color-info:#4164ee;--color-info-bg:#dbeafe;--bg-app:#eef1f5;--bg-surface:#fff;--bg-surface-2:#fbfbfd;--bg-surface-3:#f5f5f9;--bg-hover:#eef1fe;--border-default:#dbdef0;--border-soft:#f0f1f7;--text-primary:#1e293b;--text-secondary:#525670;--text-muted:#878ca6;--brand-rgb:33,0,173;--chart-cat-1:#2100ad;--chart-cat-2:#00a38e;--chart-cat-3:#e67e22;--chart-cat-4:#d63384;--chart-cat-5:#4164ee;--chart-cat-6:#16a34a;--rm-text-c-gray:#6b7280;--rm-text-c-red:#b91c1c;--rm-text-c-orange:#c2410c;--rm-text-c-amber:#a16207;--rm-text-c-green:#15803d;--rm-text-c-teal:#0f766e;--rm-text-c-blue:#1d4ed8;--rm-text-c-violet:#6d28d9;--rm-text-c-pink:#be185d;--rm-text-bg-gray:hsla(220,9%,46%,.16);--rm-text-bg-red:rgba(239,68,68,.18);--rm-text-bg-orange:rgba(249,115,22,.2);--rm-text-bg-amber:rgba(250,204,21,.32);--rm-text-bg-green:rgba(34,197,94,.2);--rm-text-bg-teal:rgba(20,184,166,.2);--rm-text-bg-blue:rgba(59,130,246,.18);--rm-text-bg-violet:rgba(139,92,246,.18);--rm-text-bg-pink:rgba(236,72,153,.18);--space-2:2px;--space-4:4px;--space-6:6px;--space-8:8px;--space-10:10px;--space-12:12px;--space-16:16px;--space-20:20px;--space-24:24px;--space-32:32px;--space-40:40px;--space-48:48px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:10px;--radius-2xl:12px;--radius-pill:999px;--font-10:10px;--font-11:11px;--font-12:12px;--font-13:13px;--font-14:14px;--font-16:16px;--font-18:18px;--font-22:22px;--font-24:24px;--font-32:32px;--weight-normal:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--font-serif:"Caudex",Georgia,serif;--font-sans:"Figtree",system-ui,sans-serif;--font-mono:"SF Mono",Menlo,monospace;--shadow-xs:0 1px 2px rgba(30,41,59,.04);--shadow-sm:0 2px 6px rgba(30,41,59,.06),0 1px 2px rgba(30,41,59,.03);--shadow-md:0 4px 12px rgba(30,41,59,.06),0 1px 3px rgba(30,41,59,.04);--shadow-lg:0 8px 24px rgba(30,41,59,.12);--shadow-focus:0 0 0 3px rgba(107,63,255,.14);--duration-instant:100ms;--duration-fast:150ms;--duration-base:240ms;--duration-slow:400ms;--duration-slowest:600ms;--ease-out:cubic-bezier(.2,0,0,1);--ease-in-out:cubic-bezier(.4,0,.2,1);--ease-spring:cubic-bezier(.5,1.6,.4,1);--z-base:1;--z-sticky:20;--z-header:30;--z-drawer:40;--z-modal:50;--z-toast:60;--z-help:70}body.night{--color-primary:#9b7cff;--color-secondary:#b485ff;--color-accent-soft:#d6ccff;--color-healthcare:#7aa0ff;--color-discovery:#2ecc71;--color-pharma:#ff8c00;--color-databank:#f472b6;--color-healthcare-active:#4164ee;--color-discovery-active:#07816f;--color-pharma-active:#f7520e;--color-databank-active:#e04380;--healthcare-rgb:122,160,255;--discovery-rgb:46,204,113;--pharma-rgb:255,140,0;--databank-rgb:244,114,182;--surface-rgb:26,26,36;--shadow-rgb:0,0,0;--bg-app:#0e0e14;--bg-surface:#1a1a24;--bg-surface-2:#232330;--bg-surface-3:#2a2a38;--bg-hover:#2d2a42;--border-default:#45455c;--border-soft:#32323f;--text-primary:#f5f6fa;--text-secondary:#cfd3e5;--text-muted:#8a90a8;--brand-rgb:155,124,255;--color-success:#6fe8c5;--color-success-bg:rgba(0,212,168,.18);--color-warning:#fbbf24;--color-warning-bg:rgba(245,158,11,.18);--color-danger:#fca5a5;--color-danger-bg:rgba(239,68,68,.18);--color-info:#7aa0ff;--color-info-bg:rgba(65,100,238,.18);--chart-cat-1:#9b7cff;--chart-cat-2:#6fe8c5;--chart-cat-3:#fbbf24;--chart-cat-4:#f472b6;--chart-cat-5:#7b9ef5;--chart-cat-6:#bef264;--rm-text-c-gray:#9ca3af;--rm-text-c-red:#fca5a5;--rm-text-c-orange:#fdba74;--rm-text-c-amber:#fde047;--rm-text-c-green:#86efac;--rm-text-c-teal:#5eead4;--rm-text-c-blue:#93c5fd;--rm-text-c-violet:#c4b5fd;--rm-text-c-pink:#f9a8d4;--rm-text-bg-gray:rgba(156,163,175,.22);--rm-text-bg-red:hsla(0,91%,71%,.24);--rm-text-bg-orange:rgba(251,146,60,.24);--rm-text-bg-amber:rgba(250,204,21,.24);--rm-text-bg-green:rgba(74,222,128,.22);--rm-text-bg-teal:rgba(45,212,191,.22);--rm-text-bg-blue:rgba(96,165,250,.24);--rm-text-bg-violet:rgba(167,139,250,.26);--rm-text-bg-pink:rgba(244,114,182,.24);background:var(--bg-app);color:var(--text-primary);color-scheme:dark}body.text-small{--font-10:9px;--font-11:10px;--font-12:11px;--font-13:12px;--font-14:13px;--font-16:15px;--font-18:17px;--font-22:20px;--font-24:22px;--font-32:29px}body.text-large{--font-10:11px;--font-11:12px;--font-12:13px;--font-13:15px;--font-14:16px;--font-16:18px;--font-18:20px;--font-22:25px;--font-24:27px;--font-32:36px}body.text-xl{--font-10:12px;--font-11:13px;--font-12:15px;--font-13:16px;--font-14:18px;--font-16:20px;--font-18:22px;--font-22:28px;--font-24:30px;--font-32:40px}body.density-compact{--space-4:3px;--space-6:4px;--space-8:6px;--space-10:8px;--space-12:9px;--space-16:12px;--space-20:15px;--space-24:18px;--space-32:24px;--space-40:30px;--space-48:36px}body.high-contrast:not(.night){--text-primary:#000;--text-secondary:#1a1a24;--text-muted:#2f2f40;--border-default:#000;--border-soft:#525670;--bg-app:#fff;--bg-surface:#fff;--bg-surface-2:#fff;--bg-surface-3:#f0f1f7;--bg-hover:#ffe56b;--color-primary:#1100a0;--color-primary-hover:#0a0070;--color-secondary:#5028d8;--color-success:#006b2c;--color-warning:#8c4500;--color-danger:#a60000;--color-info:#0040c8}body.night.high-contrast{--text-primary:#fff;--text-secondary:#f5f6fa;--text-muted:#cfd3e5;--border-default:#fff;--border-soft:#b8bcd0;--bg-app:#000;--bg-surface:#000;--bg-surface-2:#000;--bg-surface-3:#000;--bg-hover:#ffe56b;--color-primary:#d6ccff;--color-primary-hover:#fff;--color-secondary:#e5daff;--color-accent-soft:#fff;--color-success:#6fe8c5;--color-warning:#fbbf24;--color-danger:#fca5a5;--color-info:#7aa0ff;--brand-rgb:214,204,255}body.reduce-motion *,body.reduce-motion :after,body.reduce-motion :before{animation:none!important;scroll-behavior:auto!important;transition:none!important}body.cvd-deutera .pane,body.cvd-deutera .rm-cvd-target,body.cvd-deutera .rm-shell,body.cvd-deutera .rsidebar,body.cvd-deutera .sidebar,body.cvd-deutera>.rm-action-bar__overlay,body.cvd-deutera>.rm-drawer,body.cvd-deutera>.rm-drawer-overlay,body.cvd-deutera>.rm-modal-overlay{filter:url(#a11y-deutera)}body.cvd-protan .pane,body.cvd-protan .rm-cvd-target,body.cvd-protan .rm-shell,body.cvd-protan .rsidebar,body.cvd-protan .sidebar,body.cvd-protan>.rm-action-bar__overlay,body.cvd-protan>.rm-drawer,body.cvd-protan>.rm-drawer-overlay,body.cvd-protan>.rm-modal-overlay{filter:url(#a11y-protan)}body.cvd-tritan .pane,body.cvd-tritan .rm-cvd-target,body.cvd-tritan .rm-shell,body.cvd-tritan .rsidebar,body.cvd-tritan .sidebar,body.cvd-tritan>.rm-action-bar__overlay,body.cvd-tritan>.rm-drawer,body.cvd-tritan>.rm-drawer-overlay,body.cvd-tritan>.rm-modal-overlay{filter:url(#a11y-tritan)}body.cvd-mono .pane,body.cvd-mono .rm-cvd-target,body.cvd-mono .rm-shell,body.cvd-mono .rsidebar,body.cvd-mono .sidebar,body.cvd-mono>.rm-action-bar__overlay,body.cvd-mono>.rm-drawer,body.cvd-mono>.rm-drawer-overlay,body.cvd-mono>.rm-modal-overlay{filter:url(#a11y-mono)}:root{--r-color-primary-50:#f0f4ff;--r-color-primary-100:#dce5fd;--r-color-primary-200:#b9cbfb;--r-color-primary-300:#96b0f9;--r-color-primary-400:#7395f5;--r-color-primary-500:#5a7ef2;--r-color-primary-600:var(--color-healthcare);--r-color-primary-700:#3451d4;--r-color-primary-800:#283fb0;--r-color-primary-900:#1c2d8a;--r-color-gray-50:#f9fafb;--r-color-gray-100:#f3f4f6;--r-color-gray-200:#e5e7eb;--r-color-gray-300:#d1d5db;--r-color-gray-400:#9ca3af;--r-color-gray-500:#6b7280;--r-color-gray-600:#4b5563;--r-color-gray-700:#374151;--r-color-gray-800:#1f2937;--r-color-gray-900:#111827;--r-color-gray-950:#030712;--r-color-success-500:var(--color-success);--r-color-success-600:#16a34a;--r-color-warning-500:#f59e0b;--r-color-warning-600:var(--color-warning);--r-color-danger-500:#ef4444;--r-color-danger-600:var(--color-danger);--r-color-white:#fff;--r-color-black:#000;--r-font-family:var(--font-sans);--r-font-mono:var(--font-mono);--r-text-xs:0.75rem;--r-text-sm:0.875rem;--r-text-base:1rem;--r-text-lg:1.125rem;--r-text-xl:1.25rem;--r-text-2xl:1.5rem;--r-text-3xl:1.875rem;--r-text-4xl:2.25rem;--r-font-weight-normal:var(--weight-normal);--r-font-weight-medium:var(--weight-medium);--r-font-weight-semibold:var(--weight-semibold);--r-font-weight-bold:var(--weight-bold);--r-leading-tight:1.25;--r-leading-normal:1.5;--r-leading-relaxed:1.75;--r-space-0:0;--r-space-1:var(--space-4);--r-space-2:var(--space-8);--r-space-3:var(--space-12);--r-space-4:var(--space-16);--r-space-5:var(--space-20);--r-space-6:var(--space-24);--r-space-8:var(--space-32);--r-space-10:var(--space-40);--r-space-12:var(--space-48);--r-radius-none:0;--r-radius-sm:var(--radius-sm);--r-radius-md:var(--radius-md);--r-radius-lg:var(--radius-lg);--r-radius-xl:0.75rem;--r-radius-2xl:1rem;--r-radius-full:var(--radius-pill);--r-shadow-xs:0 1px 2px 0 rgba(0,0,0,.05);--r-shadow-sm:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--r-shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);--r-shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--r-shadow-xl:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--r-transition-fast:var(--duration-fast) var(--ease-in-out);--r-transition-base:200ms var(--ease-in-out);--r-transition-slow:var(--duration-slow) var(--ease-in-out)}

package/dist/runtime/components/RichTextEditor.vue

@@ -0,0 +1,810 @@
+<!--
+  RmRichTextEditor - editeur de texte enrichi facon Notion, sur Tiptap.
+
+  A ne pas confondre avec RmNoteEditor, qui redige les notes a blocs types du
+  panneau « Notes ». Celui-ci produit un document libre : le JSON de Tiptap
+  (`v-model`), que l'appelant enregistre tel quel.
+
+  Ce qu'il sait faire :
+  - gras, italique, souligne, barre, code, liens ;
+  - couleurs de texte et surlignage, dans une palette limitee qui se relit de
+    jour comme de nuit (variables CSS enregistrees dans le document) ;
+  - titres, listes, cases a cocher, citation, bloc de code, separateur,
+    tableaux (ajout et retrait de lignes et de colonnes) ;
+  - un menu `/` pour inserer un bloc ;
+  - un menu `@` qui cite un membre (`members`), une ressource
+    (`searchResources`) ou pose un lien vers une page (`pages`), et propose de
+    creer la page tapee (`createPage`) ;
+  - Alt+Haut / Alt+Bas deplacent le bloc courant (pas de poignee de glisser :
+    l'extension Tiptap exige la pile de collaboration Yjs).
+
+  L'editeur ne sait rien de ce qu'il cite : un clic sur une mention ou un lien
+  de page emet `open-resource`, `open-member` ou `open-page`, a l'appelant de
+  naviguer.
+
+  Noeuds ecrits dans le document, que le serveur peut relire :
+  - `mention` : `attrs.kind` ("user" | "resource"), `id`, `label`,
+    `resourceType` (ressource seulement) ;
+  - `noteLink` : `attrs.noteId`, `label`, `icon`.
+-->
+<script setup lang="ts">
+import { computed, onBeforeUnmount, reactive, ref, watch } from 'vue'
+import { EditorContent, useEditor } from '@tiptap/vue-3'
+import { Extension, Node, mergeAttributes, type Editor, type Range } from '@tiptap/core'
+import { PluginKey } from '@tiptap/pm/state'
+import StarterKit from '@tiptap/starter-kit'
+import { Color, TextStyle } from '@tiptap/extension-text-style'
+import Highlight from '@tiptap/extension-highlight'
+import { TableKit } from '@tiptap/extension-table'
+import { TaskItem, TaskList } from '@tiptap/extension-list'
+import { Placeholder } from '@tiptap/extensions'
+import Mention from '@tiptap/extension-mention'
+import Suggestion, { type SuggestionProps } from '@tiptap/suggestion'
+import {
+  RM_RICH_TEXT_COLORS,
+  mentionItems,
+  moveBlock,
+  richTextColor,
+  richTextHighlight,
+  slashItems,
+  type RmRichTextColor,
+  type RmRichTextMember,
+  type RmRichTextMentionItem,
+  type RmRichTextPage,
+  type RmRichTextResource,
+  type RmRichTextSlashItem,
+} from '../utils/richText'
+
+const props = withDefaults(
+  defineProps<{
+    modelValue?: Record<string, unknown> | null
+    editable?: boolean
+    placeholder?: string
+    /** Les membres que `@` peut citer. Vide : pas de mention de personne. */
+    members?: RmRichTextMember[]
+    /** Les pages vers lesquelles `@` pose un lien. */
+    pages?: RmRichTextPage[]
+    /** Cherche les ressources citables pour une saisie. Absent : pas de ressources. */
+    searchResources?: (query: string) => Promise<RmRichTextResource[]>
+    /** Cree une page du nom tape et la rend. Absent : pas de creation. */
+    createPage?: (title: string) => Promise<RmRichTextPage>
+    /** Affiche la barre d'outils. */
+    toolbar?: boolean
+  }>(),
+  {
+    modelValue: null,
+    editable: true,
+    placeholder: 'Écrivez, ou tapez « / » pour insérer un bloc, « @ » pour citer…',
+    members: () => [],
+    pages: () => [],
+    searchResources: undefined,
+    createPage: undefined,
+    toolbar: true,
+  },
+)
+
+const emit = defineEmits<{
+  'update:modelValue': [value: Record<string, unknown>]
+  'open-page': [id: string]
+  'open-member': [id: string]
+  'open-resource': [resource: { id: string; resourceType: string }]
+}>()
+
+// ---------------------------------------------------------------------------
+// Menus flottants (`/` et `@`) : un seul etat, rendu par le template.
+// ---------------------------------------------------------------------------
+
+type MenuKind = 'slash' | 'mention'
+type MenuItem = RmRichTextSlashItem | RmRichTextMentionItem
+const menu = reactive({
+  open: false,
+  kind: 'slash' as MenuKind,
+  items: [] as MenuItem[],
+  index: 0,
+  loading: false,
+  style: {} as Record<string, string>,
+})
+let menuCommand: ((item: MenuItem) => void) | null = null
+
+function placeMenu(rect: DOMRect | null | undefined) {
+  if (!rect) return
+  const vh = window.innerHeight
+  const below = vh - rect.bottom
+  const left = Math.max(8, Math.min(rect.left, window.innerWidth - 300))
+  menu.style =
+    below < 280 && rect.top > below
+      ? { position: 'fixed', left: `${left}px`, bottom: `${vh - rect.top + 6}px` }
+      : { position: 'fixed', left: `${left}px`, top: `${rect.bottom + 6}px` }
+}
+
+function menuRenderer(kind: MenuKind) {
+  return () => ({
+    onStart(p: SuggestionProps<MenuItem>) {
+      menu.kind = kind
+      menu.items = p.items
+      menu.index = 0
+      menu.open = true
+      menuCommand = p.command
+      placeMenu(p.clientRect?.())
+    },
+    onUpdate(p: SuggestionProps<MenuItem>) {
+      menu.items = p.items
+      menu.index = 0
+      menuCommand = p.command
+      placeMenu(p.clientRect?.())
+    },
+    onKeyDown({ event }: { event: KeyboardEvent }) {
+      if (!menu.open) return false
+      const count = Math.max(1, menu.items.length)
+      if (event.key === 'ArrowDown') {
+        menu.index = (menu.index + 1) % count
+        return true
+      }
+      if (event.key === 'ArrowUp') {
+        menu.index = (menu.index - 1 + count) % count
+        return true
+      }
+      if (event.key === 'Enter' || event.key === 'Tab') {
+        const item = menu.items[menu.index]
+        if (!item) return false
+        pick(item)
+        return true
+      }
+      if (event.key === 'Escape') {
+        menu.open = false
+        return true
+      }
+      return false
+    },
+    onExit() {
+      menu.open = false
+      menuCommand = null
+    },
+  })
+}
+
+function pick(item: MenuItem) {
+  menuCommand?.(item)
+  menu.open = false
+}
+
+// Les ressources se cherchent chez l'appelant : la derniere reponse gagne.
+let resourceTicket = 0
+async function findResources(query: string): Promise<RmRichTextResource[]> {
+  if (!props.searchResources || query.trim().length < 2) return []
+  const ticket = ++resourceTicket
+  menu.loading = true
+  try {
+    const found = await props.searchResources(query.trim())
+    return ticket === resourceTicket ? found : []
+  } catch {
+    return []
+  } finally {
+    if (ticket === resourceTicket) menu.loading = false
+  }
+}
+
+// ---------------------------------------------------------------------------
+// Extensions
+// ---------------------------------------------------------------------------
+
+/** Lien vers une autre page. */
+const NoteLink = Node.create({
+  name: 'noteLink',
+  group: 'inline',
+  inline: true,
+  atom: true,
+  selectable: true,
+  addAttributes() {
+    return {
+      noteId: { default: null, parseHTML: (el) => el.getAttribute('data-note-id') },
+      label: { default: '', parseHTML: (el) => el.getAttribute('data-label') },
+      icon: { default: null, parseHTML: (el) => el.getAttribute('data-icon') },
+    }
+  },
+  parseHTML() {
+    return [{ tag: 'span[data-note-link]' }]
+  },
+  renderHTML({ node, HTMLAttributes }) {
+    return [
+      'span',
+      mergeAttributes(HTMLAttributes, {
+        'data-note-link': '',
+        'data-note-id': node.attrs.noteId,
+        'data-label': node.attrs.label,
+        class: 'rm-rte-pagelink',
+      }),
+      `${node.attrs.icon ? `${node.attrs.icon} ` : ''}${node.attrs.label || 'Page sans titre'}`,
+    ]
+  },
+  renderText({ node }) {
+    return node.attrs.label
+  },
+})
+
+/** Mention d'un membre ou d'une ressource ; `@` ouvre aussi les pages. */
+const RichMention = Mention.extend({
+  addAttributes() {
+    return {
+      ...this.parent?.(),
+      kind: { default: 'user', parseHTML: (el) => el.getAttribute('data-kind') },
+      resourceType: { default: null, parseHTML: (el) => el.getAttribute('data-resource-type') },
+    }
+  },
+}).configure({
+  renderHTML({ node }) {
+    return [
+      'span',
+      {
+        'data-type': 'mention',
+        'data-kind': node.attrs.kind,
+        'data-id': node.attrs.id,
+        'data-label': node.attrs.label,
+        ...(node.attrs.resourceType && { 'data-resource-type': node.attrs.resourceType }),
+        class: `rm-rte-mention rm-rte-mention--${node.attrs.kind}`,
+      },
+      `@${node.attrs.label ?? node.attrs.id}`,
+    ]
+  },
+  renderText({ node }) {
+    return `@${node.attrs.label ?? node.attrs.id}`
+  },
+  suggestion: {
+    char: '@',
+    pluginKey: new PluginKey('rmRichTextMention'),
+    allowSpaces: true,
+    items: async ({ query }: { query: string }) =>
+      mentionItems({
+        query,
+        members: props.members,
+        pages: props.pages,
+        resources: await findResources(query),
+        canCreatePage: !!props.createPage,
+      }),
+    command: ({ editor, range, props: item }) => {
+      void insertMention(editor, range, item as unknown as RmRichTextMentionItem)
+    },
+    render: menuRenderer('mention'),
+  },
+})
+
+async function insertMention(editor: Editor, range: Range, item: RmRichTextMentionItem) {
+  if (item.kind === 'create-page') {
+    if (!props.createPage) return
+    editor.chain().focus().deleteRange(range).run()
+    const page = await props.createPage(item.label)
+    editor
+      .chain()
+      .focus()
+      .insertContent([
+        { type: 'noteLink', attrs: { noteId: page.id, label: page.label, icon: page.icon ?? null } },
+        { type: 'text', text: ' ' },
+      ])
+      .run()
+    return
+  }
+  const node =
+    item.kind === 'page'
+      ? { type: 'noteLink', attrs: { noteId: item.id, label: item.label, icon: item.icon ?? null } }
+      : {
+          type: 'mention',
+          attrs: {
+            kind: item.kind,
+            id: item.id,
+            label: item.label,
+            resourceType: item.kind === 'resource' ? item.resourceType : null,
+          },
+        }
+  editor.chain().focus().deleteRange(range).insertContent([node, { type: 'text', text: ' ' }]).run()
+}
+
+function runSlash(editor: Editor, range: Range, key: string) {
+  const chain = editor.chain().focus().deleteRange(range)
+  switch (key) {
+    case 'paragraph': chain.setParagraph().run(); break
+    case 'h1': chain.setHeading({ level: 1 }).run(); break
+    case 'h2': chain.setHeading({ level: 2 }).run(); break
+    case 'h3': chain.setHeading({ level: 3 }).run(); break
+    case 'bullet': chain.toggleBulletList().run(); break
+    case 'ordered': chain.toggleOrderedList().run(); break
+    case 'task': chain.toggleTaskList().run(); break
+    case 'quote': chain.toggleBlockquote().run(); break
+    case 'code': chain.toggleCodeBlock().run(); break
+    case 'table': chain.insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run(); break
+    case 'divider': chain.setHorizontalRule().run(); break
+    case 'mention': chain.insertContent('@').run(); break
+  }
+}
+
+/** Le menu `/` et le deplacement de bloc au clavier. */
+const RichCommands = Extension.create({
+  name: 'rmRichTextCommands',
+  addKeyboardShortcuts() {
+    return {
+      'Alt-ArrowUp': () => this.editor.commands.command(moveBlock(-1)),
+      'Alt-ArrowDown': () => this.editor.commands.command(moveBlock(1)),
+    }
+  },
+  addProseMirrorPlugins() {
+    return [
+      Suggestion<RmRichTextSlashItem>({
+        editor: this.editor,
+        char: '/',
+        pluginKey: new PluginKey('rmRichTextSlash'),
+        items: ({ query }) => slashItems(query),
+        command: ({ editor, range, props: item }) => runSlash(editor, range, item.key),
+        render: menuRenderer('slash') as any,
+      }),
+    ]
+  },
+})
+
+let lastEmitted = ''
+
+const editor = useEditor({
+  content: props.modelValue ?? '',
+  editable: props.editable,
+  extensions: [
+    StarterKit.configure({
+      heading: { levels: [1, 2, 3] },
+      link: { openOnClick: false, autolink: true, HTMLAttributes: { rel: 'noopener noreferrer', target: '_blank' } },
+    }),
+    TextStyle,
+    Color,
+    Highlight.configure({ multicolor: true }),
+    TableKit.configure({ table: { resizable: false } }),
+    TaskList,
+    TaskItem.configure({ nested: true }),
+    Placeholder.configure({ placeholder: () => props.placeholder }),
+    NoteLink,
+    RichMention,
+    RichCommands,
+  ],
+  onUpdate: ({ editor: e }) => {
+    const json = e.getJSON()
+    lastEmitted = JSON.stringify(json)
+    emit('update:modelValue', json)
+  },
+})
+
+// Un document qui change du dehors (autre page chargee) remplace le contenu ;
+// l'echo de notre propre `update:modelValue` ne le touche pas.
+watch(
+  () => props.modelValue,
+  (value) => {
+    const e = editor.value
+    if (!e) return
+    const next = JSON.stringify(value ?? null)
+    if (next === lastEmitted || next === JSON.stringify(e.getJSON())) return
+    lastEmitted = next
+    e.commands.setContent(value ?? '', { emitUpdate: false })
+  },
+)
+watch(() => props.editable, (value) => editor.value?.setEditable(value))
+
+onBeforeUnmount(() => editor.value?.destroy())
+
+// Un clic sur une mention ou un lien de page : a l'appelant de naviguer.
+function onClick(event: MouseEvent) {
+  const target = (event.target as HTMLElement).closest<HTMLElement>('[data-note-link], .rm-rte-mention')
+  if (!target) return
+  if (target.hasAttribute('data-note-link')) {
+    const id = target.getAttribute('data-note-id')
+    if (id) emit('open-page', id)
+    return
+  }
+  const id = target.getAttribute('data-id')
+  if (!id) return
+  if (target.getAttribute('data-kind') === 'resource') {
+    emit('open-resource', { id, resourceType: target.getAttribute('data-resource-type') ?? '' })
+  } else {
+    emit('open-member', id)
+  }
+}
+
+// ---------------------------------------------------------------------------
+// Barre d'outils
+// ---------------------------------------------------------------------------
+
+// L'etat de l'editeur n'est pas reactif pour Vue : un `computed` qui lit
+// `isActive` garderait sa premiere valeur. Chaque transaction avance ce
+// compteur, et les etats derives le lisent pour se recalculer.
+const tick = ref(0)
+watch(editor, (e) => e?.on('transaction', () => tick.value++), { immediate: true })
+
+const inTable = computed(() => tick.value >= 0 && !!editor.value?.isActive('table'))
+const blockStyle = computed(() => {
+  const e = editor.value
+  if (!e || tick.value < 0) return 'paragraph'
+  for (const level of [1, 2, 3] as const) if (e.isActive('heading', { level })) return `h${level}`
+  return 'paragraph'
+})
+
+function setBlockStyle(value: string) {
+  const chain = editor.value?.chain().focus()
+  if (!chain) return
+  if (value === 'paragraph') chain.setParagraph().run()
+  else chain.setHeading({ level: Number(value.slice(1)) as 1 | 2 | 3 }).run()
+}
+
+const colorsOpen = ref(false)
+const colorsButton = ref<HTMLElement>()
+const colorsPanel = ref<HTMLElement>()
+const colorsStyle = ref<Record<string, string>>({})
+
+function toggleColors() {
+  colorsOpen.value = !colorsOpen.value
+  const rect = colorsButton.value?.getBoundingClientRect()
+  if (rect) colorsStyle.value = { position: 'fixed', left: `${rect.left}px`, top: `${rect.bottom + 6}px` }
+}
+
+function setColor(key: RmRichTextColor | null) {
+  const chain = editor.value?.chain().focus()
+  if (!chain) return
+  if (key) chain.setColor(richTextColor(key)).run()
+  else chain.unsetColor().run()
+  colorsOpen.value = false
+}
+
+function setHighlight(key: RmRichTextColor | null) {
+  const chain = editor.value?.chain().focus()
+  if (!chain) return
+  if (key) chain.setHighlight({ color: richTextHighlight(key) }).run()
+  else chain.unsetHighlight().run()
+  colorsOpen.value = false
+}
+
+const linkOpen = ref(false)
+const linkUrl = ref('')
+const linkInput = ref<HTMLInputElement>()
+
+function openLink() {
+  linkUrl.value = (editor.value?.getAttributes('link').href as string | undefined) ?? ''
+  linkOpen.value = true
+  setTimeout(() => linkInput.value?.focus())
+}
+
+function applyLink() {
+  const chain = editor.value?.chain().focus().extendMarkRange('link')
+  if (!chain) return
+  const url = linkUrl.value.trim()
+  if (!url) chain.unsetLink().run()
+  else chain.setLink({ href: /^[a-z][a-z0-9+.-]*:/i.test(url) ? url : `https://${url}` }).run()
+  linkOpen.value = false
+}
+
+function onDocumentPointer(event: PointerEvent) {
+  const target = event.target as globalThis.Node
+  if (colorsOpen.value && !colorsPanel.value?.contains(target) && !colorsButton.value?.contains(target)) {
+    colorsOpen.value = false
+  }
+}
+if (typeof document !== 'undefined') document.addEventListener('pointerdown', onDocumentPointer)
+onBeforeUnmount(() => document.removeEventListener('pointerdown', onDocumentPointer))
+
+const marks = [
+  { name: 'bold', icon: 'TextB', label: 'Gras (Ctrl+B)', run: (e: Editor) => e.chain().focus().toggleBold().run() },
+  { name: 'italic', icon: 'TextItalic', label: 'Italique (Ctrl+I)', run: (e: Editor) => e.chain().focus().toggleItalic().run() },
+  { name: 'underline', icon: 'TextUnderline', label: 'Souligné (Ctrl+U)', run: (e: Editor) => e.chain().focus().toggleUnderline().run() },
+  { name: 'strike', icon: 'TextStrikethrough', label: 'Barré', run: (e: Editor) => e.chain().focus().toggleStrike().run() },
+  { name: 'code', icon: 'Code', label: 'Code', run: (e: Editor) => e.chain().focus().toggleCode().run() },
+]
+
+const blocks = [
+  { name: 'bulletList', icon: 'ListBullets', label: 'Liste à puces', run: (e: Editor) => e.chain().focus().toggleBulletList().run() },
+  { name: 'orderedList', icon: 'ListNumbers', label: 'Liste numérotée', run: (e: Editor) => e.chain().focus().toggleOrderedList().run() },
+  { name: 'taskList', icon: 'ListChecks', label: 'Liste de tâches', run: (e: Editor) => e.chain().focus().toggleTaskList().run() },
+  { name: 'blockquote', icon: 'Quotes', label: 'Citation', run: (e: Editor) => e.chain().focus().toggleBlockquote().run() },
+]
+
+/**
+ * Les gestes sur un tableau, par groupes. Ils vivent dans un menu pose
+ * au-dessus du tableau, pas dans la barre d'outils : en haut de l'editeur,
+ * elle sort de l'ecran des que la note est longue, et l'on cherchait les
+ * boutons la ou l'on ecrit.
+ */
+const tableGroups: Array<Array<{ key: string; icon: string; label: string; run: (e: Editor) => boolean; can?: (e: Editor) => boolean; active?: (e: Editor) => boolean }>> = [
+  [
+    { key: 'row-before', icon: 'RowsPlusTop', label: 'Insérer une ligne au-dessus', run: (e) => e.chain().focus().addRowBefore().run() },
+    { key: 'row-after', icon: 'RowsPlusBottom', label: 'Insérer une ligne en dessous', run: (e) => e.chain().focus().addRowAfter().run() },
+    { key: 'col-before', icon: 'ColumnsPlusLeft', label: 'Insérer une colonne à gauche', run: (e) => e.chain().focus().addColumnBefore().run() },
+    { key: 'col-after', icon: 'ColumnsPlusRight', label: 'Insérer une colonne à droite', run: (e) => e.chain().focus().addColumnAfter().run() },
+  ],
+  [
+    { key: 'header-row', icon: 'TextHOne', label: "Ligne d'en-tête", run: (e) => e.chain().focus().toggleHeaderRow().run(), active: (e) => isHeaderRow(e) },
+    { key: 'merge', icon: 'ArrowsInLineHorizontal', label: 'Fusionner les cellules sélectionnées', run: (e) => e.chain().focus().mergeCells().run(), can: (e) => e.can().mergeCells() },
+    { key: 'split', icon: 'ArrowsOutLineHorizontal', label: 'Scinder la cellule', run: (e) => e.chain().focus().splitCell().run(), can: (e) => e.can().splitCell() },
+  ],
+  [
+    { key: 'del-row', icon: 'Rows', label: 'Supprimer la ligne', run: (e) => e.chain().focus().deleteRow().run() },
+    { key: 'del-col', icon: 'Columns', label: 'Supprimer la colonne', run: (e) => e.chain().focus().deleteColumn().run() },
+    { key: 'del-table', icon: 'Trash', label: 'Supprimer le tableau', run: (e) => e.chain().focus().deleteTable().run() },
+  ],
+]
+
+/** La premiere ligne du tableau courant est-elle une ligne d'en-tete ? */
+function isHeaderRow(e: Editor) {
+  const { $from } = e.state.selection
+  for (let depth = $from.depth; depth > 0; depth--) {
+    const node = $from.node(depth)
+    if (node.type.name === 'table') return node.firstChild?.firstChild?.type.name === 'tableHeader'
+  }
+  return false
+}
+
+// Le menu du tableau suit le tableau : place a chaque transaction, et tant
+// qu'il est ouvert, a chaque defilement (la page defile dans un conteneur).
+const tableMenuStyle = ref<Record<string, string>>({})
+function tableElement(): HTMLElement | null {
+  const e = editor.value
+  if (!e || !e.isActive('table')) return null
+  const { node } = e.view.domAtPos(e.state.selection.from)
+  const el = node.nodeType === 1 ? (node as HTMLElement) : node.parentElement
+  return el?.closest('table') ?? null
+}
+function placeTableMenu() {
+  const rect = tableElement()?.getBoundingClientRect()
+  if (!rect) return
+  // Au-dessus du tableau ; dessous quand son haut est sorti de l'ecran.
+  const above = rect.top - 46
+  const top = above >= 8 ? above : Math.min(rect.bottom + 6, window.innerHeight - 52)
+  tableMenuStyle.value = { position: 'fixed', left: `${Math.max(8, rect.left)}px`, top: `${top}px` }
+}
+const showTableMenu = computed(() => props.editable && inTable.value)
+watch(editor, (e) => e?.on('transaction', placeTableMenu), { immediate: true })
+watch(showTableMenu, (open) => {
+  if (typeof window === 'undefined') return
+  if (open) {
+    placeTableMenu()
+    window.addEventListener('scroll', placeTableMenu, true)
+    window.addEventListener('resize', placeTableMenu)
+  } else {
+    window.removeEventListener('scroll', placeTableMenu, true)
+    window.removeEventListener('resize', placeTableMenu)
+  }
+})
+onBeforeUnmount(() => {
+  window.removeEventListener('scroll', placeTableMenu, true)
+  window.removeEventListener('resize', placeTableMenu)
+})
+
+defineExpose({ editor })
+
+const GROUP_LABEL: Record<RmRichTextMentionItem['kind'], string> = {
+  user: 'Personnes',
+  resource: 'Ressources',
+  page: 'Pages',
+  'create-page': 'Nouvelle page',
+}
+const MENTION_ICON: Record<RmRichTextMentionItem['kind'], string> = {
+  user: 'User',
+  resource: 'Pill',
+  page: 'FileText',
+  'create-page': 'Plus',
+}
+const asSlash = (item: MenuItem) => item as RmRichTextSlashItem
+const asMention = (item: MenuItem) => item as RmRichTextMentionItem
+const itemKey = (item: MenuItem) => ('kind' in item ? `${item.kind}-${item.id}` : `slash-${item.key}`)
+const showGroup = (i: number) =>
+  menu.kind === 'mention' && (i === 0 || asMention(menu.items[i]!).kind !== asMention(menu.items[i - 1]!).kind)
+</script>
+
+<template>
+  <div class="rm-rte" :class="{ 'rm-rte--readonly': !editable }">
+    <div v-if="toolbar && editable && editor" class="rm-rte__toolbar" role="toolbar" aria-label="Mise en forme">
+      <select
+        class="rm-rte__style"
+        :value="blockStyle"
+        aria-label="Style du paragraphe"
+        @change="setBlockStyle(($event.target as HTMLSelectElement).value)"
+      >
+        <option value="paragraph">Texte</option>
+        <option value="h1">Titre 1</option>
+        <option value="h2">Titre 2</option>
+        <option value="h3">Titre 3</option>
+      </select>
+      <span class="rm-rte__sep" />
+      <button
+        v-for="mark in marks"
+        :key="mark.name"
+        type="button"
+        class="rm-rte__btn"
+        :class="{ 'is-active': editor.isActive(mark.name) }"
+        :aria-pressed="editor.isActive(mark.name)"
+        :title="mark.label"
+        :aria-label="mark.label"
+        @click="mark.run(editor)"
+      >
+        <RmIcon :name="mark.icon" :size="16" />
+      </button>
+      <button
+        ref="colorsButton"
+        type="button"
+        class="rm-rte__btn"
+        :class="{ 'is-active': colorsOpen }"
+        title="Couleur du texte et surlignage"
+        aria-label="Couleur du texte et surlignage"
+        :aria-expanded="colorsOpen"
+        @click="toggleColors"
+      >
+        <RmIcon name="Palette" :size="16" />
+      </button>
+      <button
+        type="button"
+        class="rm-rte__btn"
+        :class="{ 'is-active': editor.isActive('link') }"
+        title="Lien"
+        aria-label="Lien"
+        @click="openLink"
+      >
+        <RmIcon name="Link" :size="16" />
+      </button>
+      <span class="rm-rte__sep" />
+      <button
+        v-for="block in blocks"
+        :key="block.name"
+        type="button"
+        class="rm-rte__btn"
+        :class="{ 'is-active': editor.isActive(block.name) }"
+        :aria-pressed="editor.isActive(block.name)"
+        :title="block.label"
+        :aria-label="block.label"
+        @click="block.run(editor)"
+      >
+        <RmIcon :name="block.icon" :size="16" />
+      </button>
+      <button
+        type="button"
+        class="rm-rte__btn"
+        title="Insérer un tableau"
+        aria-label="Insérer un tableau"
+        :disabled="inTable"
+        @click="editor.chain().focus().insertTable({ rows: 3, cols: 3, withHeaderRow: true }).run()"
+      >
+        <RmIcon name="Table" :size="16" />
+      </button>
+      <form v-if="linkOpen" class="rm-rte__link" @submit.prevent="applyLink">
+        <input
+          ref="linkInput"
+          v-model="linkUrl"
+          type="text"
+          placeholder="https://… (vide pour retirer le lien)"
+          aria-label="Adresse du lien"
+          @keydown.escape.prevent="linkOpen = false"
+        >
+        <button type="submit" class="rm-rte__btn" aria-label="Appliquer le lien" title="Appliquer">
+          <RmIcon name="Check" :size="16" />
+        </button>
+      </form>
+    </div>
+
+    <EditorContent :editor="editor" class="rm-rte__content" @click="onClick" />
+
+    <Teleport to="body" :disabled="!showTableMenu">
+      <div
+        v-if="showTableMenu && editor"
+        class="rm-rte__layer rm-rte__tablemenu"
+        :style="tableMenuStyle"
+        role="toolbar"
+        aria-label="Tableau"
+        @mousedown.prevent
+      >
+        <template v-for="(group, g) in tableGroups" :key="g">
+          <span v-if="g" class="rm-rte__sep" />
+          <button
+            v-for="action in group"
+            :key="action.key"
+            type="button"
+            class="rm-rte__btn"
+            :class="{ 'is-active': action.active?.(editor) }"
+            :aria-pressed="action.active ? action.active(editor) : undefined"
+            :disabled="action.can ? !action.can(editor) : false"
+            :title="action.label"
+            :aria-label="action.label"
+            @click="action.run(editor)"
+          >
+            <RmIcon :name="action.icon" :size="16" />
+          </button>
+        </template>
+      </div>
+    </Teleport>
+
+    <Teleport to="body" :disabled="!colorsOpen">
+      <div
+        v-if="colorsOpen && editor"
+        ref="colorsPanel"
+        class="rm-rte__layer"
+        :style="colorsStyle"
+      >
+        <div class="rm-rte__layer-title">Couleur du texte</div>
+        <div class="rm-rte__swatches">
+          <button type="button" class="rm-rte-swatch" title="Par défaut" aria-label="Couleur par défaut" @click="setColor(null)">A</button>
+          <button
+            v-for="color in RM_RICH_TEXT_COLORS"
+            :key="color.key"
+            type="button"
+            class="rm-rte-swatch"
+            :style="{ color: richTextColor(color.key) }"
+            :title="color.label"
+            :aria-label="`Texte ${color.label.toLowerCase()}`"
+            @click="setColor(color.key)"
+          >
+            A
+          </button>
+        </div>
+        <div class="rm-rte__layer-title">Surlignage</div>
+        <div class="rm-rte__swatches">
+          <button type="button" class="rm-rte-swatch" title="Aucun" aria-label="Sans surlignage" @click="setHighlight(null)">
+            <RmIcon name="Prohibit" :size="14" />
+          </button>
+          <button
+            v-for="color in RM_RICH_TEXT_COLORS"
+            :key="color.key"
+            type="button"
+            class="rm-rte-swatch"
+            :style="{ background: richTextHighlight(color.key) }"
+            :title="color.label"
+            :aria-label="`Surlignage ${color.label.toLowerCase()}`"
+            @click="setHighlight(color.key)"
+          />
+        </div>
+      </div>
+    </Teleport>
+
+    <Teleport to="body" :disabled="!menu.open">
+      <div
+        v-if="menu.open"
+        class="rm-rte__layer rm-rte__menu"
+        :style="menu.style"
+        role="listbox"
+        :aria-label="menu.kind === 'slash' ? 'Insérer un bloc' : 'Citer'"
+        @mousedown.prevent
+      >
+        <div v-if="!menu.items.length" class="rm-rte__empty">
+          {{ menu.loading ? 'Recherche…' : 'Aucun résultat' }}
+        </div>
+        <template v-for="(item, i) in menu.items" :key="itemKey(item)">
+          <div v-if="showGroup(i)" class="rm-rte__group">
+            {{ GROUP_LABEL[asMention(item).kind] }}
+          </div>
+          <button
+            type="button"
+            role="option"
+            class="rm-rte__item"
+            :class="{ 'is-active': i === menu.index }"
+            :aria-selected="i === menu.index"
+            @mouseenter="menu.index = i"
+            @click="pick(item)"
+          >
+            <template v-if="menu.kind === 'slash'">
+              <span class="rm-rte__item-icon"><RmIcon :name="asSlash(item).icon" :size="16" /></span>
+              <span class="rm-rte__item-text">
+                <span>{{ asSlash(item).label }}</span>
+                <small>{{ asSlash(item).hint }}</small>
+              </span>
+            </template>
+            <template v-else>
+              <span class="rm-rte__item-icon">
+                <template v-if="asMention(item).kind === 'page' && (asMention(item) as RmRichTextPage).icon">
+                  {{ (asMention(item) as RmRichTextPage).icon }}
+                </template>
+                <RmIcon v-else :name="MENTION_ICON[asMention(item).kind]" :size="16" />
+              </span>
+              <span class="rm-rte__item-text">
+                <span>
+                  {{ asMention(item).kind === 'create-page' ? `Créer la page « ${asMention(item).label} »` : asMention(item).label }}
+                </span>
+                <small v-if="'hint' in item && item.hint">{{ item.hint }}</small>
+              </span>
+            </template>
+          </button>
+        </template>
+        <div v-if="menu.loading && menu.items.length" class="rm-rte__empty">Recherche des ressources…</div>
+      </div>
+    </Teleport>
+  </div>
+</template>
+
+<style scoped>
+.rm-rte{color:var(--text-primary);display:flex;flex-direction:column;font-family:var(--font-sans);min-height:0}.rm-rte__toolbar{align-items:center;background:var(--bg-surface);border:1px solid var(--border-soft);border-radius:var(--radius-md);display:flex;flex-wrap:wrap;gap:var(--space-2);padding:var(--space-4);position:sticky;top:0;z-index:var(--z-sticky,20)}.rm-rte__sep{background:var(--border-soft);height:20px;margin:0 var(--space-4);width:1px}.rm-rte__style{background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;font:inherit;font-size:var(--font-13);height:28px;padding:0 var(--space-6)}.rm-rte__style:hover{background:var(--bg-hover)}.rm-rte__btn{align-items:center;background:transparent;border:0;border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;display:inline-flex;height:28px;justify-content:center;width:28px}.rm-rte__btn:hover:not(:disabled){background:var(--bg-hover);color:var(--text-primary)}.rm-rte__btn.is-active{background:var(--color-accent-soft);color:var(--color-primary)}.rm-rte__btn:disabled{cursor:default;opacity:.4}.rm-rte__btn:focus-visible,.rm-rte__style:focus-visible{box-shadow:var(--shadow-focus);outline:none}.rm-rte__link{align-items:center;display:flex;flex:1 1 220px;gap:var(--space-4)}.rm-rte__link input{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-primary);flex:1;font:inherit;font-size:var(--font-13);height:28px;padding:0 var(--space-8)}.rm-rte__content{flex:1;min-height:0}.rm-rte__content :deep(.ProseMirror){font-size:var(--font-14);line-height:1.65;min-height:240px;outline:none;overflow-wrap:anywhere;padding:var(--space-16) var(--space-4)}.rm-rte--readonly .rm-rte__content :deep(.ProseMirror){min-height:0}.rm-rte__content :deep(.ProseMirror>*+*){margin-top:.6em}.rm-rte__content :deep(h1){font-family:var(--font-serif);font-size:var(--font-24);font-weight:var(--weight-bold);line-height:1.25;margin:1.2em 0 0}.rm-rte__content :deep(h2){font-size:var(--font-18);font-weight:var(--weight-semibold);line-height:1.3;margin:1.1em 0 0}.rm-rte__content :deep(h3){font-size:var(--font-16);font-weight:var(--weight-semibold);margin:1em 0 0}.rm-rte__content :deep(.ProseMirror>:first-child){margin-top:0}.rm-rte__content :deep(p){margin:0}.rm-rte__content :deep(ol),.rm-rte__content :deep(ul){margin:0;padding-left:1.4em}.rm-rte__content :deep(a){color:var(--color-primary);text-decoration:underline;text-underline-offset:2px}.rm-rte__content :deep(code){background:var(--bg-surface-3);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.9em;padding:.1em .35em}.rm-rte__content :deep(pre){background:var(--bg-surface-3);border-radius:var(--radius-md);overflow-x:auto;padding:var(--space-12)}.rm-rte__content :deep(pre code){background:none;padding:0}.rm-rte__content :deep(blockquote){border-left:3px solid var(--border-default);color:var(--text-secondary);margin:0;padding-left:var(--space-12)}.rm-rte__content :deep(hr){border:0;border-top:1px solid var(--border-default);margin:1.2em 0}.rm-rte__content :deep(mark){border-radius:2px;color:inherit;padding:0 .1em}.rm-rte__content :deep(ul[data-type=taskList]){list-style:none;padding-left:.2em}.rm-rte__content :deep(ul[data-type=taskList] li){align-items:flex-start;display:flex;gap:var(--space-8)}.rm-rte__content :deep(ul[data-type=taskList] li>label){margin-top:.2em}.rm-rte__content :deep(ul[data-type=taskList] li>div){flex:1}.rm-rte__content :deep(ul[data-type=taskList] li[data-checked=true]>div){color:var(--text-muted);text-decoration:line-through}.rm-rte__content :deep(input[type=checkbox]){accent-color:var(--color-primary)}.rm-rte__content :deep(.tableWrapper){overflow-x:auto}.rm-rte__content :deep(table){border-collapse:collapse;table-layout:fixed;width:100%}.rm-rte__content :deep(td),.rm-rte__content :deep(th){border:1px solid var(--border-default);min-width:80px;padding:var(--space-6) var(--space-8);position:relative;vertical-align:top}.rm-rte__content :deep(th){background:var(--bg-surface-2);font-weight:var(--weight-semibold);text-align:left}.rm-rte__content :deep(.selectedCell):after{background:var(--color-accent-soft);content:"";inset:0;opacity:.5;pointer-events:none;position:absolute}.rm-rte__content :deep(p.is-editor-empty:first-child):before{color:var(--text-muted);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.rm-rte__content :deep(.rm-rte-mention),.rm-rte__content :deep(.rm-rte-pagelink){border-radius:var(--radius-sm);cursor:pointer;display:inline-block;font-weight:var(--weight-medium);padding:0 .35em;white-space:nowrap}.rm-rte__content :deep(.rm-rte-mention--user){background:var(--color-accent-soft);color:var(--color-primary)}.rm-rte__content :deep(.rm-rte-mention--resource){background:var(--rm-text-bg-teal);color:var(--rm-text-c-teal)}.rm-rte__content :deep(.rm-rte-pagelink){color:var(--text-primary);text-decoration:underline;text-decoration-color:var(--border-default);text-underline-offset:3px}.rm-rte__content :deep(.rm-rte-pagelink:hover){background:var(--bg-hover)}.rm-rte__content :deep(.ProseMirror-selectednode){box-shadow:var(--shadow-focus)}.rm-rte__layer{background:var(--bg-surface);border:1px solid var(--border-soft);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--font-13);padding:var(--space-6);z-index:var(--z-popover,1000)}.rm-rte__tablemenu{align-items:center;display:flex;gap:var(--space-2);padding:var(--space-4)}.rm-rte__menu{max-height:320px;overflow-y:auto;width:290px}.rm-rte__group,.rm-rte__layer-title{color:var(--text-muted);font-size:var(--font-11);font-weight:var(--weight-semibold);letter-spacing:.04em;padding:var(--space-6) var(--space-8) var(--space-2);text-transform:uppercase}.rm-rte__item{align-items:center;background:transparent;border:0;border-radius:var(--radius-sm);color:inherit;cursor:pointer;display:flex;font:inherit;gap:var(--space-8);padding:var(--space-6) var(--space-8);text-align:left;width:100%}.rm-rte__item.is-active{background:var(--bg-hover)}.rm-rte__item-icon{align-items:center;background:var(--bg-surface-2);border:1px solid var(--border-soft);border-radius:var(--radius-sm);color:var(--text-secondary);display:inline-flex;flex:none;height:28px;justify-content:center;width:28px}.rm-rte__item-text{display:flex;flex-direction:column;min-width:0}.rm-rte__item-text>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rm-rte__item-text small{color:var(--text-muted);font-size:var(--font-11)}.rm-rte__empty{color:var(--text-muted);padding:var(--space-8)}.rm-rte__swatches{display:grid;gap:var(--space-4);grid-template-columns:repeat(5,28px);padding:var(--space-4) var(--space-6) var(--space-6)}.rm-rte-swatch{align-items:center;background:var(--bg-surface);border:1px solid var(--border-soft);border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;display:inline-flex;font-weight:var(--weight-semibold);height:28px;justify-content:center;width:28px}.rm-rte-swatch:hover{border-color:var(--border-default);box-shadow:var(--shadow-xs)}
+</style>

package/dist/runtime/utils/richText.d.ts

@@ -0,0 +1,121 @@
+/**
+ * Ce que RmRichTextEditor sait sans dependre de Vue : la palette, les entrees du
+ * menu `/`, le filtre des suggestions `@` et le deplacement d'un bloc.
+ *
+ * Les couleurs sont enregistrees dans le document sous forme de variable CSS
+ * (`var(--rm-text-c-blue)`), jamais en hexadecimal : la meme note se relit de
+ * jour comme de nuit, la variable change de valeur avec le theme.
+ */
+import type { EditorState, Transaction } from '@tiptap/pm/state';
+export declare const RM_RICH_TEXT_COLORS: readonly [{
+    readonly key: "gray";
+    readonly label: "Gris";
+}, {
+    readonly key: "red";
+    readonly label: "Rouge";
+}, {
+    readonly key: "orange";
+    readonly label: "Orange";
+}, {
+    readonly key: "amber";
+    readonly label: "Jaune";
+}, {
+    readonly key: "green";
+    readonly label: "Vert";
+}, {
+    readonly key: "teal";
+    readonly label: "Turquoise";
+}, {
+    readonly key: "blue";
+    readonly label: "Bleu";
+}, {
+    readonly key: "violet";
+    readonly label: "Violet";
+}, {
+    readonly key: "pink";
+    readonly label: "Rose";
+}];
+export type RmRichTextColor = (typeof RM_RICH_TEXT_COLORS)[number]['key'];
+/** La valeur ecrite dans le document pour une couleur de texte. */
+export declare const richTextColor: (key: RmRichTextColor) => string;
+/** La valeur ecrite dans le document pour un surlignage. */
+export declare const richTextHighlight: (key: RmRichTextColor) => string;
+/** Un membre que `@` peut citer. */
+export interface RmRichTextMember {
+    id: string;
+    label: string;
+    hint?: string;
+}
+/** Une ressource que `@` peut citer (une fiche, une marque). */
+export interface RmRichTextResource {
+    id: string;
+    resourceType: string;
+    label: string;
+    hint?: string;
+}
+/** Une page vers laquelle `@` peut poser un lien. */
+export interface RmRichTextPage {
+    id: string;
+    label: string;
+    icon?: string | null;
+}
+/** Une entree du menu `@`, toutes familles confondues. */
+export type RmRichTextMentionItem = {
+    kind: 'user';
+    id: string;
+    label: string;
+    hint?: string;
+} | {
+    kind: 'resource';
+    id: string;
+    resourceType: string;
+    label: string;
+    hint?: string;
+} | {
+    kind: 'page';
+    id: string;
+    label: string;
+    icon?: string | null;
+} | {
+    kind: 'create-page';
+    id: string;
+    label: string;
+};
+/** Vrai quand `query` est vide ou figure dans `label` (sans accents ni casse). */
+export declare function matchesQuery(label: string, query: string): boolean;
+/**
+ * Le menu `@` : les membres, puis les pages, filtres par la saisie, au plus
+ * `limit` de chaque ; les ressources arrivent deja filtrees par l'appelant.
+ * La derniere entree propose de creer la page tapee quand aucune ne porte
+ * exactement ce nom.
+ */
+export declare function mentionItems(input: {
+    query: string;
+    members: RmRichTextMember[];
+    pages: RmRichTextPage[];
+    resources: RmRichTextResource[];
+    canCreatePage: boolean;
+    limit?: number;
+}): RmRichTextMentionItem[];
+/** Une entree du menu `/`. `run` recoit la chaine de commandes Tiptap. */
+export interface RmRichTextSlashItem {
+    key: string;
+    label: string;
+    hint: string;
+    icon: string;
+    keywords: string[];
+}
+export declare const RM_RICH_TEXT_SLASH_ITEMS: RmRichTextSlashItem[];
+/** Les entrees du menu `/` dont le libelle ou un mot-cle contient la saisie. */
+export declare function slashItems(query: string): RmRichTextSlashItem[];
+/**
+ * Commande ProseMirror : echange le bloc de premier niveau qui porte le
+ * curseur avec son voisin (`-1` au-dessus, `1` au-dessous). Le curseur suit le
+ * bloc. Remplace la poignee de glisser-deposer, dont l'extension Tiptap exige
+ * la pile de collaboration (Yjs).
+ */
+export declare function moveBlock(direction: -1 | 1): ({ state, tr, dispatch }: {
+    state: EditorState;
+    tr: Transaction;
+    dispatch?: (tr: Transaction) => void;
+}) => boolean;

package/dist/runtime/utils/richText.js

@@ -0,0 +1,68 @@
+import { TextSelection } from "@tiptap/pm/state";
+export const RM_RICH_TEXT_COLORS = [
+  { key: "gray", label: "Gris" },
+  { key: "red", label: "Rouge" },
+  { key: "orange", label: "Orange" },
+  { key: "amber", label: "Jaune" },
+  { key: "green", label: "Vert" },
+  { key: "teal", label: "Turquoise" },
+  { key: "blue", label: "Bleu" },
+  { key: "violet", label: "Violet" },
+  { key: "pink", label: "Rose" }
+];
+export const richTextColor = (key) => `var(--rm-text-c-${key})`;
+export const richTextHighlight = (key) => `var(--rm-text-bg-${key})`;
+const fold = (text) => text.normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase();
+export function matchesQuery(label, query) {
+  return !query || fold(label).includes(fold(query.trim()));
+}
+export function mentionItems(input) {
+  const { query, limit = 5 } = input;
+  const users = input.members.filter((m) => matchesQuery(m.label, query)).slice(0, limit).map((m) => ({ kind: "user", ...m }));
+  const pages = input.pages.filter((p) => matchesQuery(p.label, query)).slice(0, limit).map((p) => ({ kind: "page", ...p }));
+  const resources = input.resources.slice(0, limit).map((r) => ({ kind: "resource", ...r }));
+  const title = query.trim();
+  const exists = input.pages.some((p) => fold(p.label) === fold(title));
+  const create = input.canCreatePage && title && !exists ? [{ kind: "create-page", id: "__create__", label: title }] : [];
+  return [...users, ...resources, ...pages, ...create];
+}
+export const RM_RICH_TEXT_SLASH_ITEMS = [
+  { key: "paragraph", label: "Texte", hint: "Un paragraphe simple", icon: "TextT", keywords: ["texte", "paragraphe"] },
+  { key: "h1", label: "Titre 1", hint: "Grand titre de section", icon: "TextHOne", keywords: ["titre", "h1"] },
+  { key: "h2", label: "Titre 2", hint: "Titre moyen", icon: "TextHTwo", keywords: ["titre", "h2"] },
+  { key: "h3", label: "Titre 3", hint: "Petit titre", icon: "TextHThree", keywords: ["titre", "h3"] },
+  { key: "bullet", label: "Liste \xE0 puces", hint: "Une liste simple", icon: "ListBullets", keywords: ["liste", "puces"] },
+  { key: "ordered", label: "Liste num\xE9rot\xE9e", hint: "Une liste ordonn\xE9e", icon: "ListNumbers", keywords: ["liste", "numero"] },
+  { key: "task", label: "Liste de t\xE2ches", hint: "Des cases \xE0 cocher", icon: "ListChecks", keywords: ["tache", "todo", "case"] },
+  { key: "quote", label: "Citation", hint: "Un passage cit\xE9", icon: "Quotes", keywords: ["citation", "quote"] },
+  { key: "code", label: "Code", hint: "Un bloc de code", icon: "Code", keywords: ["code"] },
+  { key: "table", label: "Tableau", hint: "Trois colonnes, trois lignes", icon: "Table", keywords: ["tableau", "table"] },
+  { key: "divider", label: "S\xE9parateur", hint: "Une ligne horizontale", icon: "Minus", keywords: ["separateur", "ligne"] },
+  { key: "mention", label: "Mention ou lien", hint: "Une personne, une ressource, une page", icon: "At", keywords: ["mention", "lien", "page", "personne"] }
+];
+export function slashItems(query) {
+  return RM_RICH_TEXT_SLASH_ITEMS.filter(
+    (item) => matchesQuery(item.label, query) || item.keywords.some((k) => matchesQuery(k, query))
+  );
+}
+export function moveBlock(direction) {
+  return ({ state, tr, dispatch }) => {
+    const { doc, selection } = state;
+    const index = selection.$from.index(0);
+    const target = index + direction;
+    if (target < 0 || target >= doc.childCount) return false;
+    let start = 0;
+    for (let i = 0; i < index; i++) start += doc.child(i).nodeSize;
+    const node = doc.child(index);
+    const offset = selection.from - start;
+    const neighbor = doc.child(target);
+    const at = direction < 0 ? start - neighbor.nodeSize : start + neighbor.nodeSize;
+    if (dispatch) {
+      tr.delete(start, start + node.nodeSize);
+      tr.insert(at, node);
+      tr.setSelection(TextSelection.near(tr.doc.resolve(Math.min(at + offset, tr.doc.content.size))));
+      dispatch(tr.scrollIntoView());
+    }
+    return true;
+  };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/romulus",
-  "version": "0.1.219",
+  "version": "0.1.221",
   "description": "Romulus Design System - Nuxt module by Tekkare",
   "license": "MIT",
   "type": "module",
@@ -31,8 +31,19 @@
     "test": "vitest run"
   },
   "dependencies": {
+    "@floating-ui/dom": "^1.8.0",
     "@nuxt/kit": "^3.16.0",
     "@phosphor-icons/vue": "^2.2.1",
+    "@tiptap/extension-highlight": "^3.31.4",
+    "@tiptap/extension-list": "^3.31.4",
+    "@tiptap/extension-mention": "^3.31.4",
+    "@tiptap/extension-table": "^3.31.4",
+    "@tiptap/extension-text-style": "^3.31.4",
+    "@tiptap/extensions": "^3.31.4",
+    "@tiptap/pm": "^3.31.4",
+    "@tiptap/starter-kit": "^3.31.4",
+    "@tiptap/suggestion": "^3.31.4",
+    "@tiptap/vue-3": "^3.31.4",
     "echarts": "^5.6.0",
     "html2canvas-pro": "^1.6.7",
     "jspdf": "^4.2.0",