);
}
// --- Step walker: handles drilling into nested questions for one step ---
function StepWalker({ step, value, onUpdate, onComplete, gotoNextStep, gotoPrevStep, nextStepLabel, visibilityCtx }) {
// value is an array of selections {questionId, optId, opt}
// we walk forward until we hit a leaf (option with no .next)
const path = value || [];
// determine current question by walking the tree
let q = step;
for (const sel of path) {
if (q.options) {
const opt = q.options.find((o) => o.id === sel.optId);
if (!opt || !opt.next) {q = null;break;}
q = opt.next;
}
}
// synthèse step?
if (step.id === "synthese") {
return null; // handled elsewhere
}
if (!q) {
// we reached a leaf; show summary mini panel
const leaf = path[path.length - 1];
return (
{step.title}
Choix enregistré.
Récapitulatif
{path.map((p, i) =>
{p.questionLabel}{p.optLabel}
)}
);
}
return (
{
const newPath = [...path, {
questionId: q.question || step.id,
questionLabel: q.title || step.title,
optId: opt.id,
optLabel: opt.label,
alert: !!opt.alert,
acts: opt.acts || [],
hasNext: !!opt.next // permet de savoir si l'étape est complète (feuille atteinte)
}];
onUpdate(newPath);
}}
onBack={() => onUpdate(path.slice(0, -1))} />);
}
window.TreeStepper = TreeStepper;
window.RecapRail = RecapRail;
window.StepWalker = StepWalker;
window.ChoiceIcon = ChoiceIcon;
// ============================================================
// MiniDentalChart — compact 2-row schema used in the decision tree
// Shows planned state per tooth + which implants have their tree
// filled / partial / to-do. Click an implant to navigate to it.
// ============================================================
function MiniDentalChart({ planning, currentImplant, onSelectImplant, treeData, treeStepsCount }) {
// FDI rows, panoramic convention (viewer left = patient right)
const upperRow = [18, 17, 16, 15, 14, 13, 12, 11, 21, 22, 23, 24, 25, 26, 27, 28];
const lowerRow = [48, 47, 46, 45, 44, 43, 42, 41, 31, 32, 33, 34, 35, 36, 37, 38];
function stateOf(p) {
if (!p) return "natural";
const pr = p.prothese || {};
// Implant prend la priorité visuelle sur absent/extraction
if (pr.implant) return "implant";
if (pr.couronne) return "crown";
if (pr.bridge) return "bridge";
if (p.programme === "absente") return "absent";
if (p.programme === "extraction") return "extraction";
return "natural";
}
function treeProgress(num) {
const tdi = treeData?.perImplant?.[num];
if (!tdi) return { done: 0, total: treeStepsCount };
return { done: Object.keys(tdi).length, total: treeStepsCount };
}
function glyphFor(state) {
const stroke = "currentColor";
switch (state) {
case "implant":
return (
);
case "crown":
return (
);
case "bridge":
return (
);
case "extraction":
return (
);
case "absent":
return (
);
default:
return (
);
}
}
function ToothCell({ num, midlineLeft }) {
const p = planning[num];
const state = stateOf(p);
const isImplant = state === "implant";
// Membre d'un groupe plural (pontic) : affiché comme implant mais sans arbre
const isGroupMember = !!p?.implant_group_root;
const isSelectable = isImplant && !isGroupMember;
const isCurrent = currentImplant === num;
const { done, total } = treeProgress(num);
const hasBlock26 = isImplant && !isGroupMember && (() => {
const tdi = treeData?.perImplant?.[num];
if (!tdi) return false;
return Object.values(tdi).some((path) =>
(path || []).some((p2) => (p2.acts || []).includes(26))
);
})();
let badge = null;
if (isImplant && !isGroupMember) {
if (hasBlock26) {
badge =