@aigne/afs-ui 1.11.0-beta.12

package/dist/web-page/renderers/natal-chart.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"natal-chart.mjs","names":[],"sources":["../../../src/web-page/renderers/natal-chart.ts"],"sourcesContent":["export const NATAL_CHART_JS = `\n  // ── Natal Chart Primitive (@astrodraw/astrochart v3) ──\n  var _astroChartLoaded = false;\n\n  function _setNatalStatus(el, message) {\n    el.innerHTML = \"\";\n    var status = document.createElement(\"div\");\n    status.className = \"aup-natal-chart-loading\";\n    status.textContent = message;\n    el.appendChild(status);\n  }\n\n  function _appendCell(row, value, strong) {\n    var td = document.createElement(\"td\");\n    if (strong) {\n      var bold = document.createElement(\"strong\");\n      bold.textContent = value;\n      td.appendChild(bold);\n    } else {\n      td.textContent = value;\n    }\n    row.appendChild(td);\n  }\n\n  function _appendHead(table, headers) {\n    var thead = document.createElement(\"thead\");\n    var tr = document.createElement(\"tr\");\n    for (var i = 0; i < headers.length; i++) {\n      var th = document.createElement(\"th\");\n      th.textContent = headers[i];\n      tr.appendChild(th);\n    }\n    thead.appendChild(tr);\n    table.appendChild(thead);\n  }\n\n  function renderAupNatalChart(node) {\n    var el = document.createElement(\"div\");\n    el.className = \"aup-natal-chart\";\n    var p = node.props || {};\n    var variant = p.variant || \"radix\"; // \"radix\" | \"transit\" | \"aspects-table\" | \"planets-table\"\n    var height = p.height || \"500px\";\n    var width = parseInt(p.width) || 500;\n    var chartSize = parseInt(p.size) || Math.min(width, 500);\n\n    // Data format: { planets: {\"Sun\":[degrees], \"Moon\":[degrees], ...}, cusps: [12 house cusps] }\n    var data = p.data || null;\n\n    // ── Aspects / Planets table mode (no chart rendering, calculation only) ──\n    if (variant === \"aspects-table\" || variant === \"planets-table\") {\n      if (!data || !data.planets) {\n        _setNatalStatus(el, \"No chart data provided\");\n        return el;\n      }\n\n      if (variant === \"planets-table\") {\n        var planetsDiv = document.createElement(\"div\");\n        planetsDiv.className = \"aup-natal-planets\";\n        var tbl = document.createElement(\"table\");\n        _appendHead(tbl, [\"Planet\", \"Longitude\", \"Sign\", \"Degree in Sign\"]);\n        var tbody = document.createElement(\"tbody\");\n        var SIGNS = [\"Aries\",\"Taurus\",\"Gemini\",\"Cancer\",\"Leo\",\"Virgo\",\"Libra\",\"Scorpio\",\"Sagittarius\",\"Capricorn\",\"Aquarius\",\"Pisces\"];\n        for (var planet in data.planets) {\n          if (data.planets.hasOwnProperty(planet)) {\n            var deg = Number(data.planets[planet] && data.planets[planet][0]);\n            if (!isFinite(deg)) continue;\n            var signIdx = Math.floor(deg / 30) % 12;\n            if (signIdx < 0) signIdx += 12;\n            var degInSign = ((deg % 30) + 30) % 30;\n            var row = document.createElement(\"tr\");\n            _appendCell(row, String(planet), true);\n            _appendCell(row, deg.toFixed(2) + \"\\\\u00B0\");\n            _appendCell(row, SIGNS[signIdx]);\n            _appendCell(row, degInSign.toFixed(2) + \"\\\\u00B0\");\n            tbody.appendChild(row);\n          }\n        }\n        tbl.appendChild(tbody);\n        planetsDiv.appendChild(tbl);\n        el.appendChild(planetsDiv);\n      }\n\n      if (variant === \"aspects-table\") {\n        // Inline aspect calculation (no library needed — port of AspectCalculator core logic)\n        var ASPECTS_DEF = { conjunction: { degree: 0, orbit: 10 }, square: { degree: 90, orbit: 8 }, trine: { degree: 120, orbit: 8 }, opposition: { degree: 180, orbit: 10 }, sextile: { degree: 60, orbit: 6 } };\n        var aspectsList = [];\n        var planetNames = Object.keys(data.planets);\n        for (var i = 0; i < planetNames.length; i++) {\n          for (var j = i + 1; j < planetNames.length; j++) {\n            var pA = planetNames[i], pB = planetNames[j];\n            var degA = Number(data.planets[pA] && data.planets[pA][0]);\n            var degB = Number(data.planets[pB] && data.planets[pB][0]);\n            if (!isFinite(degA) || !isFinite(degB)) continue;\n            var gap = Math.abs(degA - degB);\n            if (gap > 180) gap = 360 - gap;\n            for (var aspName in ASPECTS_DEF) {\n              var asp = ASPECTS_DEF[aspName];\n              var orbitMin = asp.degree - asp.orbit / 2, orbitMax = asp.degree + asp.orbit / 2;\n              if (gap >= orbitMin && gap <= orbitMax) {\n                var precisionNum = Math.abs(gap - asp.degree);\n                aspectsList.push({\n                  from: pA,\n                  to: pB,\n                  aspect: aspName,\n                  precision: precisionNum.toFixed(2),\n                  precisionNum: precisionNum,\n                });\n              }\n            }\n          }\n        }\n        aspectsList.sort(function(a, b) { return a.precisionNum - b.precisionNum; });\n\n        var aspDiv = document.createElement(\"div\");\n        aspDiv.className = \"aup-natal-aspects\";\n        var aspTbl = document.createElement(\"table\");\n        _appendHead(aspTbl, [\"Planet\", \"Aspect\", \"Planet\", \"Orb\"]);\n        var aspBody = document.createElement(\"tbody\");\n        for (var k = 0; k < aspectsList.length; k++) {\n          var a = aspectsList[k];\n          var aspRow = document.createElement(\"tr\");\n          _appendCell(aspRow, String(a.from));\n          _appendCell(aspRow, String(a.aspect), true);\n          _appendCell(aspRow, String(a.to));\n          _appendCell(aspRow, String(a.precision) + \"\\\\u00B0\");\n          aspBody.appendChild(aspRow);\n        }\n        aspTbl.appendChild(aspBody);\n        aspDiv.appendChild(aspTbl);\n        el.appendChild(aspDiv);\n      }\n\n      return el;\n    }\n\n    // ── SVG Chart mode — lazy-load @astrodraw/astrochart from CDN ──\n    el.style.minHeight = height;\n    _setNatalStatus(el, \"Loading natal chart...\");\n\n    if (!data || !data.planets || !data.cusps) {\n      _setNatalStatus(\n        el,\n        \"No chart data provided. Expected: { planets: {Sun: [deg], ...}, cusps: [12 values] }\",\n      );\n      return el;\n    }\n\n    var CDN_URL = \"https://cdn.jsdelivr.net/npm/@astrodraw/astrochart@3.0.2/dist/astrochart.js\";\n\n    function _initChart() {\n      el.innerHTML = \"\";\n      var chartContainerId = \"aup-natal-\" + (node.id || Math.random().toString(36).slice(2));\n      var container = document.createElement(\"div\");\n      container.id = chartContainerId;\n      container.style.cssText = \"display: flex; justify-content: center;\";\n      el.appendChild(container);\n\n      // Detect dark mode\n      var bgHex = getComputedStyle(document.documentElement).getPropertyValue(\"--bg\").trim();\n      var isDark = false;\n      if (bgHex && bgHex.charAt(0) === \"#\") {\n        var r = parseInt(bgHex.slice(1, 3), 16) || 0;\n        var g = parseInt(bgHex.slice(3, 5), 16) || 0;\n        var b = parseInt(bgHex.slice(5, 7), 16) || 0;\n        isDark = (r + g + b) / 3 < 128;\n      }\n\n      var chartSettings = {\n        COLOR_BACKGROUND: \"transparent\",\n        POINTS_COLOR: isDark ? \"#e2e8f0\" : \"#1e293b\",\n        SIGNS_COLOR: isDark ? \"#cbd5e1\" : \"#334155\",\n        CIRCLE_COLOR: isDark ? \"#475569\" : \"#94a3b8\",\n        LINE_COLOR: isDark ? \"#475569\" : \"#94a3b8\",\n        CUSPS_FONT_COLOR: isDark ? \"#94a3b8\" : \"#64748b\",\n        SYMBOL_AXIS_FONT_COLOR: isDark ? \"#e2e8f0\" : \"#1e293b\",\n      };\n      if (p.settings) {\n        for (var sk in p.settings) {\n          if (p.settings.hasOwnProperty(sk)) chartSettings[sk] = p.settings[sk];\n        }\n      }\n\n      try {\n        var astroLib = window.astrochart;\n        if (!astroLib || !astroLib.Chart) {\n          _setNatalStatus(el, \"AstroChart library not loaded\");\n          return;\n        }\n        var chart = new astroLib.Chart(chartContainerId, chartSize, chartSize, chartSettings);\n        var radix = chart.radix(data);\n        radix.aspects();\n\n        // Transit overlay\n        if (variant === \"transit\" && p.transitData) {\n          var transit = radix.transit(p.transitData);\n          transit.aspects();\n        }\n      } catch (err) {\n        var errMsg = err && err.message ? err.message : String(err);\n        _setNatalStatus(el, \"Chart error: \" + errMsg);\n      }\n    }\n\n    if (_astroChartLoaded || window.astrochart) {\n      _astroChartLoaded = true;\n      _initChart();\n    } else {\n      loadScript(CDN_URL, function() {\n        _astroChartLoaded = true;\n        _initChart();\n      });\n    }\n\n    return el;\n  }\n\n`;\n"],"mappings":";AAAA,MAAa,iBAAiB"}

package/dist/web-page/renderers/overlay.cjs

@@ -0,0 +1,531 @@
+
+//#region src/web-page/renderers/overlay.ts
+const OVERLAY_JS = `
+  function renderAupOverlay(node) {
+    var el = document.createElement("div");
+    el.className = "aup-overlay";
+    var p = node.props || {};
+    var s = node.state || {};
+    var mode = p.mode || "dialog";
+
+    if (s.open) el.classList.add("open");
+
+    var _intentIcons = { info: "\u2139\uFE0F", success: "\u2705", error: "\u274C", warning: "\u26A0\uFE0F" };
+
+    if (mode === "toast") {
+      var toast = document.createElement("div");
+      toast.className = "aup-overlay-toast";
+      var intent = p.intent || "";
+      if (intent) toast.setAttribute("data-intent", intent);
+      // Position: top-right, top-center, top-left, bottom-right (default), bottom-center, bottom-left
+      var position = p.position || "bottom-right";
+      toast.setAttribute("data-position", position);
+
+      // Body row: icon + content + close
+      var body = document.createElement("div");
+      body.className = "aup-toast-body";
+
+      // Icon: intent-based default, custom emoji/name, or image URL
+      var _toastIcons = { info: "\u2139\uFE0F", success: "\u2705", error: "\u274C", warning: "\u26A0\uFE0F" };
+      var iconVal = p.icon !== undefined ? (_toastIcons[p.icon] || p.icon) : (intent ? _toastIcons[intent] || _toastIcons.info : null);
+      if (iconVal && iconVal !== "false" && iconVal !== false) {
+        var iconEl = document.createElement("div");
+        iconEl.className = "aup-toast-icon";
+        if (typeof iconVal === "string" && (iconVal.startsWith("http") || iconVal.startsWith("/"))) {
+          var img = document.createElement("img");
+          img.src = iconVal;
+          img.alt = "";
+          iconEl.appendChild(img);
+        } else {
+          iconEl.textContent = String(iconVal);
+        }
+        body.appendChild(iconEl);
+      }
+
+      // Content: title + message, or children
+      var contentEl = document.createElement("div");
+      contentEl.className = "aup-toast-content";
+      if (p.title) {
+        var titleEl = document.createElement("div");
+        titleEl.className = "aup-toast-title";
+        titleEl.textContent = _escapeHtml(String(p.title));
+        contentEl.appendChild(titleEl);
+      }
+      if (p.message) {
+        var msgEl = document.createElement("div");
+        msgEl.className = "aup-toast-message";
+        msgEl.textContent = _escapeHtml(String(p.message));
+        contentEl.appendChild(msgEl);
+      }
+      if (node.children) {
+        node.children.forEach(function(child) {
+          var childEl = renderAupNode(child);
+          if (childEl) contentEl.appendChild(childEl);
+        });
+      }
+      body.appendChild(contentEl);
+
+      // Close button (always present unless dismissible: false AND duration > 0)
+      var dismissible = p.dismissible !== false && p.dismissible !== "false";
+      var duration = p.duration !== undefined ? parseInt(String(p.duration)) : 5000;
+      if (dismissible) {
+        var closeBtn = document.createElement("button");
+        closeBtn.className = "aup-toast-close";
+        closeBtn.textContent = "\u2715";
+        closeBtn.title = "Dismiss";
+        closeBtn.onclick = function() {
+          toast.classList.add("exiting");
+          setTimeout(function() { el.classList.remove("open"); }, 250);
+          _fireAupEvent(node.id, "dismiss", {});
+        };
+        body.appendChild(closeBtn);
+      }
+      toast.appendChild(body);
+
+      // Timer bar (auto-dismiss)
+      if (duration > 0 && s.open) {
+        var timerTrack = document.createElement("div");
+        timerTrack.className = "aup-toast-timer";
+        var timerBar = document.createElement("div");
+        timerBar.className = "aup-toast-timer-bar";
+        timerBar.style.width = "100%";
+        timerTrack.appendChild(timerBar);
+        toast.appendChild(timerTrack);
+        // Animate bar from 100% to 0%
+        requestAnimationFrame(function() {
+          timerBar.style.transitionDuration = duration + "ms";
+          timerBar.style.width = "0%";
+        });
+        setTimeout(function() {
+          toast.classList.add("exiting");
+          setTimeout(function() { el.classList.remove("open"); }, 250);
+        }, duration);
+      }
+      el.appendChild(toast);
+
+    } else if (mode === "drawer") {
+      var backdrop = document.createElement("div");
+      backdrop.className = "aup-overlay-backdrop";
+      el.appendChild(backdrop);
+      var drawer = document.createElement("div");
+      drawer.className = "aup-overlay-drawer " + (p.side === "left" ? "left" : "right");
+      if (node.children) {
+        node.children.forEach(function(child) {
+          var childEl = renderAupNode(child);
+          if (childEl) drawer.appendChild(childEl);
+        });
+      }
+      el.appendChild(drawer);
+
+    } else if (mode === "alert" || mode === "confirm") {
+      var backdrop = document.createElement("div");
+      backdrop.className = "aup-overlay-backdrop";
+      el.appendChild(backdrop);
+      var box = document.createElement("div");
+      box.className = "aup-overlay-alert";
+      var intent = p.intent || "info";
+      // Icon
+      if (p.icon !== false) {
+        var icon = document.createElement("div");
+        icon.className = "aup-alert-icon";
+        icon.setAttribute("data-intent", intent);
+        icon.textContent = p.icon || _intentIcons[intent] || _intentIcons.info;
+        box.appendChild(icon);
+      }
+      if (p.title) {
+        var t = document.createElement("div");
+        t.className = "aup-alert-title";
+        t.textContent = _escapeHtml(String(p.title));
+        box.appendChild(t);
+      }
+      if (p.message) {
+        var m = document.createElement("div");
+        m.className = "aup-alert-message";
+        m.textContent = _escapeHtml(String(p.message));
+        box.appendChild(m);
+      }
+      // Children (optional extra content)
+      if (node.children) {
+        node.children.forEach(function(child) {
+          var childEl = renderAupNode(child);
+          if (childEl) box.appendChild(childEl);
+        });
+      }
+      var acts = document.createElement("div");
+      acts.className = "aup-alert-actions";
+      if (mode === "confirm") {
+        var cancelBtn = document.createElement("button");
+        cancelBtn.className = "aup-alert-btn secondary";
+        cancelBtn.textContent = p.cancelLabel || "Cancel";
+        cancelBtn.onclick = function() {
+          el.classList.remove("open");
+          _fireAupEvent(node.id, "cancel", {});
+        };
+        acts.appendChild(cancelBtn);
+      }
+      var okBtn = document.createElement("button");
+      okBtn.className = "aup-alert-btn " + (intent === "error" && mode === "confirm" ? "danger" : "primary");
+      okBtn.textContent = p.confirmLabel || (mode === "confirm" ? "Confirm" : "OK");
+      okBtn.onclick = function() {
+        el.classList.remove("open");
+        _fireAupEvent(node.id, "confirm", {});
+      };
+      acts.appendChild(okBtn);
+      box.appendChild(acts);
+      el.appendChild(box);
+
+    } else if (mode === "hud") {
+      var backdrop = document.createElement("div");
+      backdrop.className = "aup-overlay-backdrop";
+      backdrop.style.background = "rgba(0,0,0,0.3)";
+      el.appendChild(backdrop);
+      var hud = document.createElement("div");
+      hud.className = "aup-overlay-hud";
+      // Icon or spinner
+      if (p.icon === "spinner" || !p.icon) {
+        var spinner = document.createElement("div");
+        spinner.className = "aup-hud-spinner";
+        hud.appendChild(spinner);
+      } else {
+        var ic = document.createElement("div");
+        ic.className = "aup-hud-icon";
+        ic.textContent = p.icon;
+        hud.appendChild(ic);
+      }
+      if (p.message) {
+        var msg = document.createElement("div");
+        msg.className = "aup-hud-message";
+        msg.textContent = _escapeHtml(String(p.message));
+        hud.appendChild(msg);
+      }
+      if (p.subtitle) {
+        var sub = document.createElement("div");
+        sub.className = "aup-hud-sub";
+        sub.textContent = _escapeHtml(String(p.subtitle));
+        hud.appendChild(sub);
+      }
+      if (typeof p.progress === "number") {
+        var bar = document.createElement("div");
+        bar.className = "aup-hud-progress";
+        var fill = document.createElement("div");
+        fill.className = "aup-hud-progress-bar";
+        fill.style.width = Math.max(0, Math.min(100, p.progress)) + "%";
+        bar.appendChild(fill);
+        hud.appendChild(bar);
+      }
+      el.appendChild(hud);
+
+    } else if (mode === "choice") {
+      var backdrop = document.createElement("div");
+      backdrop.className = "aup-overlay-backdrop";
+      el.appendChild(backdrop);
+      var box = document.createElement("div");
+      box.className = "aup-overlay-choice";
+
+      // Normalize steps: single-question → steps[0], multi-step → steps array
+      var steps = Array.isArray(p.steps) ? p.steps : [p];
+      var totalSteps = steps.length;
+      var currentStep = 0;
+      // Per-step answers: [ { selected: {idx: true}, other: "" }, ... ]
+      var answers = steps.map(function() { return { selected: {}, other: "" }; });
+
+      // Stepper dots (only for multi-step)
+      var stepperEl = null;
+      if (totalSteps > 1) {
+        stepperEl = document.createElement("div");
+        stepperEl.className = "aup-choice-stepper";
+        box.appendChild(stepperEl);
+      }
+
+      // Content container (swapped per step)
+      var bodyEl = document.createElement("div");
+      bodyEl.className = "aup-choice-step-body";
+      box.appendChild(bodyEl);
+
+      // Footer
+      var footer = document.createElement("div");
+      footer.className = "aup-choice-footer";
+      box.appendChild(footer);
+
+      function renderStep(stepIdx) {
+        var step = steps[stepIdx];
+        var multi = !!step.multiSelect;
+        var options = Array.isArray(step.options) ? step.options : [];
+        var ans = answers[stepIdx];
+
+        // Update stepper dots
+        if (stepperEl) {
+          stepperEl.innerHTML = "";
+          for (var di = 0; di < totalSteps; di++) {
+            var dot = document.createElement("div");
+            dot.className = "aup-choice-dot" + (di === stepIdx ? " active" : di < stepIdx ? " done" : "");
+            stepperEl.appendChild(dot);
+          }
+          var stepLabel = document.createElement("span");
+          stepLabel.className = "aup-choice-step-label";
+          stepLabel.textContent = (stepIdx + 1) + " / " + totalSteps;
+          stepperEl.appendChild(stepLabel);
+        }
+
+        // Rebuild body
+        bodyEl.innerHTML = "";
+        bodyEl.className = "aup-choice-step-body";
+        // Force re-trigger animation
+        void bodyEl.offsetWidth;
+        bodyEl.className = "aup-choice-step-body";
+
+        // Header
+        var hdr = document.createElement("div");
+        hdr.className = "aup-choice-header";
+        if (step.header) {
+          var tag = document.createElement("span");
+          tag.className = "aup-choice-tag";
+          tag.textContent = _escapeHtml(String(step.header));
+          hdr.appendChild(tag);
+        }
+        if (step.question || step.title) {
+          var q = document.createElement("div");
+          q.className = "aup-choice-question";
+          q.textContent = _escapeHtml(String(step.question || step.title));
+          hdr.appendChild(q);
+        }
+        if (step.hint) {
+          var h = document.createElement("div");
+          h.className = "aup-choice-hint";
+          h.textContent = _escapeHtml(String(step.hint));
+          hdr.appendChild(h);
+        }
+        bodyEl.appendChild(hdr);
+
+        // Options
+        var optionsDiv = document.createElement("div");
+        optionsDiv.className = "aup-choice-options";
+        options.forEach(function(opt, idx) {
+          var btn = document.createElement("button");
+          btn.className = "aup-choice-option" + (ans.selected[idx] ? " selected" : "");
+          var indicator = document.createElement("div");
+          indicator.className = multi ? "aup-choice-check" : "aup-choice-radio";
+          btn.appendChild(indicator);
+          var content = document.createElement("div");
+          var lbl = document.createElement("div");
+          lbl.className = "aup-choice-label";
+          lbl.textContent = _escapeHtml(String(opt.label || opt));
+          content.appendChild(lbl);
+          if (opt.description) {
+            var desc = document.createElement("div");
+            desc.className = "aup-choice-desc";
+            desc.textContent = _escapeHtml(String(opt.description));
+            content.appendChild(desc);
+          }
+          btn.appendChild(content);
+          btn.onclick = function() {
+            if (multi) {
+              ans.selected[idx] = !ans.selected[idx];
+              btn.classList.toggle("selected", !!ans.selected[idx]);
+            } else {
+              ans.selected = {};
+              ans.selected[idx] = true;
+              optionsDiv.querySelectorAll(".aup-choice-option").forEach(function(b) { b.classList.remove("selected"); });
+              btn.classList.add("selected");
+            }
+          };
+          optionsDiv.appendChild(btn);
+        });
+        bodyEl.appendChild(optionsDiv);
+
+        // "Other" free text
+        if (step.allowOther !== false) {
+          var otherDiv = document.createElement("div");
+          otherDiv.className = "aup-choice-other";
+          var otherInput = document.createElement("input");
+          otherInput.placeholder = step.otherPlaceholder || "Other...";
+          otherInput.value = ans.other || "";
+          otherInput.oninput = function() { ans.other = otherInput.value; };
+          otherDiv.appendChild(otherInput);
+          bodyEl.appendChild(otherDiv);
+        }
+
+        // Footer
+        footer.innerHTML = "";
+        if (p.cancelLabel !== false) {
+          var cancelBtn = document.createElement("button");
+          cancelBtn.className = "aup-alert-btn secondary";
+          cancelBtn.textContent = p.cancelLabel || "Skip";
+          cancelBtn.onclick = function() {
+            el.classList.remove("open");
+            _fireAupEvent(node.id, "cancel", {});
+          };
+          footer.appendChild(cancelBtn);
+        }
+        // Spacer pushes nav buttons to right
+        var spacer = document.createElement("div");
+        spacer.className = "spacer";
+        footer.appendChild(spacer);
+        // Back button (step > 0)
+        if (stepIdx > 0) {
+          var backBtn = document.createElement("button");
+          backBtn.className = "aup-alert-btn secondary";
+          backBtn.textContent = "Back";
+          backBtn.onclick = function() { currentStep--; renderStep(currentStep); };
+          footer.appendChild(backBtn);
+        }
+        // Next or Submit
+        var isLast = stepIdx === totalSteps - 1;
+        var nextBtn = document.createElement("button");
+        nextBtn.className = "aup-alert-btn primary";
+        nextBtn.textContent = isLast ? (p.submitLabel || "Submit") : "Next";
+        nextBtn.onclick = function() {
+          if (!isLast) {
+            currentStep++;
+            renderStep(currentStep);
+          } else {
+            // Collect all answers
+            var result = answers.map(function(a, si) {
+              var stepOpts = Array.isArray(steps[si].options) ? steps[si].options : [];
+              var picks = [];
+              stepOpts.forEach(function(opt, idx) {
+                if (a.selected[idx]) picks.push(opt.value || opt.label || opt);
+              });
+              return { selected: picks, other: a.other || null };
+            });
+            el.classList.remove("open");
+            // Single-step: send flat result, multi-step: send answers array
+            var data = totalSteps === 1 ? result[0] : { answers: result };
+            _fireAupEvent(node.id, "select", data);
+          }
+        };
+        footer.appendChild(nextBtn);
+      }
+
+      // Multi-step: measure all steps offscreen, lock body to tallest
+      if (totalSteps > 1) {
+        // Render into a hidden clone to measure without flicker
+        var measurer = document.createElement("div");
+        measurer.style.cssText = "position:absolute;visibility:hidden;pointer-events:none;left:-9999px;top:0;";
+        measurer.className = "aup-overlay-choice";
+        document.body.appendChild(measurer);
+        var measureBody = document.createElement("div");
+        measureBody.className = "aup-choice-step-body";
+        measurer.appendChild(measureBody);
+        var maxH = 0;
+        for (var si = 0; si < totalSteps; si++) {
+          var mStep = steps[si];
+          measureBody.innerHTML = "";
+          // Header
+          var mHdr = document.createElement("div");
+          mHdr.className = "aup-choice-header";
+          if (mStep.header) { var mt = document.createElement("span"); mt.className = "aup-choice-tag"; mt.textContent = String(mStep.header); mHdr.appendChild(mt); }
+          if (mStep.question || mStep.title) { var mq = document.createElement("div"); mq.className = "aup-choice-question"; mq.textContent = String(mStep.question || mStep.title); mHdr.appendChild(mq); }
+          if (mStep.hint) { var mh = document.createElement("div"); mh.className = "aup-choice-hint"; mh.textContent = String(mStep.hint); mHdr.appendChild(mh); }
+          measureBody.appendChild(mHdr);
+          // Options
+          var mOpts = document.createElement("div"); mOpts.className = "aup-choice-options";
+          (Array.isArray(mStep.options) ? mStep.options : []).forEach(function(opt) {
+            var mb = document.createElement("button"); mb.className = "aup-choice-option";
+            var mi = document.createElement("div"); mi.className = "aup-choice-radio"; mb.appendChild(mi);
+            var mc = document.createElement("div");
+            var ml = document.createElement("div"); ml.className = "aup-choice-label"; ml.textContent = String(opt.label || opt); mc.appendChild(ml);
+            if (opt.description) { var md = document.createElement("div"); md.className = "aup-choice-desc"; md.textContent = String(opt.description); mc.appendChild(md); }
+            mb.appendChild(mc); mOpts.appendChild(mb);
+          });
+          measureBody.appendChild(mOpts);
+          // Other
+          if (mStep.allowOther !== false) { var mo = document.createElement("div"); mo.className = "aup-choice-other"; var moI = document.createElement("input"); mo.appendChild(moI); measureBody.appendChild(mo); }
+          var h = measureBody.offsetHeight;
+          if (h > maxH) maxH = h;
+        }
+        document.body.removeChild(measurer);
+        bodyEl.style.minHeight = maxH + "px";
+      }
+      renderStep(0);
+      el.appendChild(box);
+
+    } else if (mode === "popover") {
+      var popover = document.createElement("div");
+      popover.className = "aup-overlay-popover";
+      if (node.children) {
+        node.children.forEach(function(child) {
+          var childEl = renderAupNode(child);
+          if (childEl) popover.appendChild(childEl);
+        });
+      }
+      el.appendChild(popover);
+      // Position relative to anchor after DOM insertion
+      if (s.open && p.anchor) {
+        requestAnimationFrame(function() {
+          var anchor = document.querySelector('[data-aup-id="' + p.anchor + '"]');
+          if (!anchor) return;
+          var r = anchor.getBoundingClientRect();
+          var pos = p.position || "bottom";
+          popover.style.position = "fixed";
+          popover.style.zIndex = "9999";
+          if (pos === "bottom" || pos === "bottom-start") {
+            popover.style.left = r.left + "px";
+            popover.style.top = (r.bottom + 4) + "px";
+          } else if (pos === "top" || pos === "top-start") {
+            popover.style.left = r.left + "px";
+            popover.style.bottom = (window.innerHeight - r.top + 4) + "px";
+          } else if (pos === "right") {
+            popover.style.left = (r.right + 4) + "px";
+            popover.style.top = r.top + "px";
+          } else if (pos === "left") {
+            popover.style.right = (window.innerWidth - r.left + 4) + "px";
+            popover.style.top = r.top + "px";
+          } else {
+            popover.style.left = r.left + "px";
+            popover.style.top = (r.bottom + 4) + "px";
+          }
+        });
+      }
+      // Light dismiss: click outside or Escape
+      if (s.open) {
+        var _popDismiss = function(e) {
+          if (!popover.contains(e.target)) {
+            el.classList.remove("open");
+            document.removeEventListener("mousedown", _popDismiss);
+            document.removeEventListener("keydown", _popEsc);
+            _fireAupEvent(node.id, "dismiss", {});
+          }
+        };
+        var _popEsc = function(e) {
+          if (e.key === "Escape") {
+            el.classList.remove("open");
+            document.removeEventListener("mousedown", _popDismiss);
+            document.removeEventListener("keydown", _popEsc);
+            _fireAupEvent(node.id, "dismiss", {});
+          }
+        };
+        setTimeout(function() {
+          document.addEventListener("mousedown", _popDismiss);
+          document.addEventListener("keydown", _popEsc);
+        }, 0);
+      }
+
+    } else {
+      // dialog (default)
+      var backdrop = document.createElement("div");
+      backdrop.className = "aup-overlay-backdrop";
+      el.appendChild(backdrop);
+      var dialog = document.createElement("div");
+      dialog.className = "aup-overlay-dialog";
+      if (p.title) {
+        var title = document.createElement("div");
+        title.className = "aup-overlay-dialog-title";
+        title.textContent = _escapeHtml(String(p.title));
+        dialog.appendChild(title);
+      }
+      if (node.children) {
+        node.children.forEach(function(child) {
+          var childEl = renderAupNode(child);
+          if (childEl) dialog.appendChild(childEl);
+        });
+      }
+      el.appendChild(dialog);
+    }
+    return el;
+  }
+
+`;
+
+//#endregion
+exports.OVERLAY_JS = OVERLAY_JS;