@aigne/afs-ui 1.11.0-beta.12

package/dist/web-page/renderers/action.mjs

@@ -0,0 +1,72 @@
+//#region src/web-page/renderers/action.ts
+const ACTION_JS = `
+  function _sanitizeActionHref(rawHref) {
+    if (typeof rawHref !== "string") return null;
+    var href = rawHref.trim();
+    if (!href) return null;
+    if (href.charAt(0) === "/" || href.charAt(0) === "#") return href;
+    try {
+      var parsed = new URL(href, location.href);
+      var protocol = parsed.protocol.toLowerCase();
+      if (
+        protocol === "http:" ||
+        protocol === "https:" ||
+        protocol === "mailto:" ||
+        protocol === "tel:"
+      ) {
+        return href;
+      }
+    } catch (_ex) {}
+    return null;
+  }
+
+  function renderAupAction(node) {
+    var p = node.props || {};
+    var safeHref = _sanitizeActionHref(p.href);
+    var el;
+    if (safeHref) {
+      el = document.createElement("a");
+      el.href = safeHref;
+      if (p.target) {
+        el.target = p.target;
+        if (String(p.target).toLowerCase() === "_blank") {
+          el.rel = "noopener noreferrer";
+        }
+      }
+    } else {
+      el = document.createElement("button");
+    }
+    el.className = "aup-action";
+    if (p.variant) el.setAttribute("data-variant", p.variant);
+    if (p.size) el.setAttribute("data-size", p.size);
+    // Icon before label
+    if (p.icon && _ICON_PATHS[p.icon]) {
+      var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+      svg.setAttribute("viewBox", "0 0 24 24");
+      svg.setAttribute("fill", "none");
+      svg.setAttribute("stroke", "currentColor");
+      svg.setAttribute("stroke-width", "2");
+      svg.setAttribute("stroke-linecap", "round");
+      svg.setAttribute("stroke-linejoin", "round");
+      svg.classList.add("aup-icon-svg");
+      svg.innerHTML = _ICON_PATHS[p.icon];
+      el.appendChild(svg);
+    }
+    var span = document.createElement("span");
+    span.textContent = String(p.label || "Action");
+    el.appendChild(span);
+    // Wire click event — use _fireAupEvent for proper device WS routing
+    if (node.events && node.events.click) {
+      el.onclick = function(e) {
+        if (safeHref) e.preventDefault();
+        _fireAupEvent(node.id, "click", {});
+      };
+    }
+    return el;
+  }
+
+`;
+
+//#endregion
+export { ACTION_JS };
+//# sourceMappingURL=action.mjs.map

package/dist/web-page/renderers/action.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"action.mjs","names":[],"sources":["../../../src/web-page/renderers/action.ts"],"sourcesContent":["export const ACTION_JS = `\n  function _sanitizeActionHref(rawHref) {\n    if (typeof rawHref !== \"string\") return null;\n    var href = rawHref.trim();\n    if (!href) return null;\n    if (href.charAt(0) === \"/\" || href.charAt(0) === \"#\") return href;\n    try {\n      var parsed = new URL(href, location.href);\n      var protocol = parsed.protocol.toLowerCase();\n      if (\n        protocol === \"http:\" ||\n        protocol === \"https:\" ||\n        protocol === \"mailto:\" ||\n        protocol === \"tel:\"\n      ) {\n        return href;\n      }\n    } catch (_ex) {}\n    return null;\n  }\n\n  function renderAupAction(node) {\n    var p = node.props || {};\n    var safeHref = _sanitizeActionHref(p.href);\n    var el;\n    if (safeHref) {\n      el = document.createElement(\"a\");\n      el.href = safeHref;\n      if (p.target) {\n        el.target = p.target;\n        if (String(p.target).toLowerCase() === \"_blank\") {\n          el.rel = \"noopener noreferrer\";\n        }\n      }\n    } else {\n      el = document.createElement(\"button\");\n    }\n    el.className = \"aup-action\";\n    if (p.variant) el.setAttribute(\"data-variant\", p.variant);\n    if (p.size) el.setAttribute(\"data-size\", p.size);\n    // Icon before label\n    if (p.icon && _ICON_PATHS[p.icon]) {\n      var svg = document.createElementNS(\"http://www.w3.org/2000/svg\", \"svg\");\n      svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n      svg.setAttribute(\"fill\", \"none\");\n      svg.setAttribute(\"stroke\", \"currentColor\");\n      svg.setAttribute(\"stroke-width\", \"2\");\n      svg.setAttribute(\"stroke-linecap\", \"round\");\n      svg.setAttribute(\"stroke-linejoin\", \"round\");\n      svg.classList.add(\"aup-icon-svg\");\n      svg.innerHTML = _ICON_PATHS[p.icon];\n      el.appendChild(svg);\n    }\n    var span = document.createElement(\"span\");\n    span.textContent = String(p.label || \"Action\");\n    el.appendChild(span);\n    // Wire click event — use _fireAupEvent for proper device WS routing\n    if (node.events && node.events.click) {\n      el.onclick = function(e) {\n        if (safeHref) e.preventDefault();\n        _fireAupEvent(node.id, \"click\", {});\n      };\n    }\n    return el;\n  }\n\n`;\n"],"mappings":";AAAA,MAAa,YAAY"}

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

@@ -0,0 +1,160 @@
+
+//#region src/web-page/renderers/broadcast.ts
+const BROADCAST_JS = `
+  // ── Broadcast Primitive ──
+  // Expands semantic roles into standard AUP nodes, then delegates to renderAupView.
+
+  var _BROADCAST_ROLE_MAP = {
+    "live-badge":       { type: "text", props: { mode: "badge" } },
+    "clock":            { type: "text", props: {} },
+    "viewer-count":     { type: "text", props: {} },
+    "alert":            { type: "text", props: {} },
+    "headline":         { type: "text", props: {} },
+    "hashtag":          { type: "text", props: {} },
+    "speaker-bar":      { type: "view", props: { layout: "column" } },
+    "lower-third":      { type: "view", props: { layout: "column" } },
+    "data-widget":      { type: "view", props: { layout: "column" } },
+    "featured-comment": { type: "view", props: { layout: "column" } },
+    "score-bug":        { type: "view", props: { layout: "column" } },
+    "logo":             { type: "media", props: {} },
+    "ticker":           { type: "ticker", props: {} }
+  };
+
+  var _BROADCAST_PLACEMENTS = {
+    _default: {
+      "live-badge": "top-start",
+      "clock": "top-end",
+      "viewer-count": "top-center",
+      "speaker-bar": "lower-start",
+      "lower-third": "lower-center",
+      "alert": "lower-start",
+      "headline": "lower-center",
+      "ticker": "ticker",
+      "logo": "lower-end",
+      "score-bug": "mid-end",
+      "data-widget": "mid-end",
+      "hashtag": "bottom-end",
+      "featured-comment": "mid-center"
+    },
+    apple: {
+      "live-badge": "top-end",
+      "clock": "top-start"
+    }
+  };
+
+  function _resolveBroadcastPlacements(theme) {
+    var themeName = typeof theme === "string" ? theme : "_default";
+    var base = _BROADCAST_PLACEMENTS._default;
+    var overrides = _BROADCAST_PLACEMENTS[themeName];
+    if (!overrides || themeName === "_default") return base;
+    var merged = {};
+    for (var k in base) { if (base.hasOwnProperty(k)) merged[k] = base[k]; }
+    for (var k2 in overrides) { if (overrides.hasOwnProperty(k2)) merged[k2] = overrides[k2]; }
+    return merged;
+  }
+
+  function _expandBroadcastChild(child, region) {
+    var role = child.role;
+    var mapping = _BROADCAST_ROLE_MAP[role];
+    if (!mapping) return null;
+
+    var nodeType = mapping.type;
+    var nodeProps = {};
+    for (var pk in mapping.props) { if (mapping.props.hasOwnProperty(pk)) nodeProps[pk] = mapping.props[pk]; }
+    nodeProps.region = region;
+    nodeProps.role = role;
+
+    // Logo: if src is present, use media; otherwise view
+    if (role === "logo") {
+      if (child.src) {
+        nodeType = "media";
+        nodeProps.src = child.src;
+        if (child.alt) nodeProps.alt = child.alt;
+        if (child.size) nodeProps.size = child.size;
+      } else {
+        nodeType = "view";
+      }
+    }
+
+    // Ticker: wrap items in a ticker node inside a view
+    if (role === "ticker") {
+      var tickerItems = child.items || [];
+      var tickerChildren = [];
+      for (var ti = 0; ti < tickerItems.length; ti++) {
+        tickerChildren.push({ type: "text", props: { content: tickerItems[ti] } });
+      }
+      var tickerProps = {};
+      if (child.intent) tickerProps.intent = child.intent;
+      if (child.mode) tickerProps.mode = child.mode;
+      if (child.speed) tickerProps.speed = child.speed;
+      return {
+        type: "view",
+        props: { region: region },
+        children: [{
+          type: "ticker",
+          props: tickerProps,
+          children: tickerChildren
+        }]
+      };
+    }
+
+    // Simple text roles: text prop → content
+    if (nodeType === "text") {
+      if (child.text) nodeProps.content = child.text;
+      return { type: "text", props: nodeProps };
+    }
+
+    // Compound view roles (speaker-bar, lower-third, data-widget, featured-comment, score-bug)
+    if (nodeType === "view") {
+      var viewChildren = [];
+      // lines[] → text children
+      if (child.lines && child.lines.length) {
+        for (var li = 0; li < child.lines.length; li++) {
+          viewChildren.push({ type: "text", props: { content: child.lines[li] } });
+        }
+      }
+      // Passthrough children[] — already-expanded AUP nodes
+      if (child.children && child.children.length) {
+        viewChildren = viewChildren.concat(child.children);
+      }
+      return { type: "view", props: nodeProps, children: viewChildren };
+    }
+
+    // Media (logo with src)
+    if (nodeType === "media") {
+      return { type: "media", props: nodeProps };
+    }
+
+    return null;
+  }
+
+  function renderAupBroadcast(node) {
+    var p = node.props || {};
+    var theme = p.theme || "minimal";
+    var placements = _resolveBroadcastPlacements(theme);
+
+    var viewNode = {
+      type: "view",
+      props: { layout: "overlay-grid", theme: theme },
+      children: []
+    };
+
+    // Forward background
+    if (p.background) viewNode.props.background = p.background;
+
+    var children = node.children || [];
+    for (var i = 0; i < children.length; i++) {
+      var child = children[i];
+      var role = child.role;
+      if (!role) continue;
+      var region = child.at || (placements[role] || "mid-center");
+      var expanded = _expandBroadcastChild(child, region);
+      if (expanded) viewNode.children.push(expanded);
+    }
+
+    return renderAupView(viewNode);
+  }
+`;
+
+//#endregion
+exports.BROADCAST_JS = BROADCAST_JS;

package/dist/web-page/renderers/broadcast.mjs

@@ -0,0 +1,160 @@
+//#region src/web-page/renderers/broadcast.ts
+const BROADCAST_JS = `
+  // ── Broadcast Primitive ──
+  // Expands semantic roles into standard AUP nodes, then delegates to renderAupView.
+
+  var _BROADCAST_ROLE_MAP = {
+    "live-badge":       { type: "text", props: { mode: "badge" } },
+    "clock":            { type: "text", props: {} },
+    "viewer-count":     { type: "text", props: {} },
+    "alert":            { type: "text", props: {} },
+    "headline":         { type: "text", props: {} },
+    "hashtag":          { type: "text", props: {} },
+    "speaker-bar":      { type: "view", props: { layout: "column" } },
+    "lower-third":      { type: "view", props: { layout: "column" } },
+    "data-widget":      { type: "view", props: { layout: "column" } },
+    "featured-comment": { type: "view", props: { layout: "column" } },
+    "score-bug":        { type: "view", props: { layout: "column" } },
+    "logo":             { type: "media", props: {} },
+    "ticker":           { type: "ticker", props: {} }
+  };
+
+  var _BROADCAST_PLACEMENTS = {
+    _default: {
+      "live-badge": "top-start",
+      "clock": "top-end",
+      "viewer-count": "top-center",
+      "speaker-bar": "lower-start",
+      "lower-third": "lower-center",
+      "alert": "lower-start",
+      "headline": "lower-center",
+      "ticker": "ticker",
+      "logo": "lower-end",
+      "score-bug": "mid-end",
+      "data-widget": "mid-end",
+      "hashtag": "bottom-end",
+      "featured-comment": "mid-center"
+    },
+    apple: {
+      "live-badge": "top-end",
+      "clock": "top-start"
+    }
+  };
+
+  function _resolveBroadcastPlacements(theme) {
+    var themeName = typeof theme === "string" ? theme : "_default";
+    var base = _BROADCAST_PLACEMENTS._default;
+    var overrides = _BROADCAST_PLACEMENTS[themeName];
+    if (!overrides || themeName === "_default") return base;
+    var merged = {};
+    for (var k in base) { if (base.hasOwnProperty(k)) merged[k] = base[k]; }
+    for (var k2 in overrides) { if (overrides.hasOwnProperty(k2)) merged[k2] = overrides[k2]; }
+    return merged;
+  }
+
+  function _expandBroadcastChild(child, region) {
+    var role = child.role;
+    var mapping = _BROADCAST_ROLE_MAP[role];
+    if (!mapping) return null;
+
+    var nodeType = mapping.type;
+    var nodeProps = {};
+    for (var pk in mapping.props) { if (mapping.props.hasOwnProperty(pk)) nodeProps[pk] = mapping.props[pk]; }
+    nodeProps.region = region;
+    nodeProps.role = role;
+
+    // Logo: if src is present, use media; otherwise view
+    if (role === "logo") {
+      if (child.src) {
+        nodeType = "media";
+        nodeProps.src = child.src;
+        if (child.alt) nodeProps.alt = child.alt;
+        if (child.size) nodeProps.size = child.size;
+      } else {
+        nodeType = "view";
+      }
+    }
+
+    // Ticker: wrap items in a ticker node inside a view
+    if (role === "ticker") {
+      var tickerItems = child.items || [];
+      var tickerChildren = [];
+      for (var ti = 0; ti < tickerItems.length; ti++) {
+        tickerChildren.push({ type: "text", props: { content: tickerItems[ti] } });
+      }
+      var tickerProps = {};
+      if (child.intent) tickerProps.intent = child.intent;
+      if (child.mode) tickerProps.mode = child.mode;
+      if (child.speed) tickerProps.speed = child.speed;
+      return {
+        type: "view",
+        props: { region: region },
+        children: [{
+          type: "ticker",
+          props: tickerProps,
+          children: tickerChildren
+        }]
+      };
+    }
+
+    // Simple text roles: text prop → content
+    if (nodeType === "text") {
+      if (child.text) nodeProps.content = child.text;
+      return { type: "text", props: nodeProps };
+    }
+
+    // Compound view roles (speaker-bar, lower-third, data-widget, featured-comment, score-bug)
+    if (nodeType === "view") {
+      var viewChildren = [];
+      // lines[] → text children
+      if (child.lines && child.lines.length) {
+        for (var li = 0; li < child.lines.length; li++) {
+          viewChildren.push({ type: "text", props: { content: child.lines[li] } });
+        }
+      }
+      // Passthrough children[] — already-expanded AUP nodes
+      if (child.children && child.children.length) {
+        viewChildren = viewChildren.concat(child.children);
+      }
+      return { type: "view", props: nodeProps, children: viewChildren };
+    }
+
+    // Media (logo with src)
+    if (nodeType === "media") {
+      return { type: "media", props: nodeProps };
+    }
+
+    return null;
+  }
+
+  function renderAupBroadcast(node) {
+    var p = node.props || {};
+    var theme = p.theme || "minimal";
+    var placements = _resolveBroadcastPlacements(theme);
+
+    var viewNode = {
+      type: "view",
+      props: { layout: "overlay-grid", theme: theme },
+      children: []
+    };
+
+    // Forward background
+    if (p.background) viewNode.props.background = p.background;
+
+    var children = node.children || [];
+    for (var i = 0; i < children.length; i++) {
+      var child = children[i];
+      var role = child.role;
+      if (!role) continue;
+      var region = child.at || (placements[role] || "mid-center");
+      var expanded = _expandBroadcastChild(child, region);
+      if (expanded) viewNode.children.push(expanded);
+    }
+
+    return renderAupView(viewNode);
+  }
+`;
+
+//#endregion
+export { BROADCAST_JS };
+//# sourceMappingURL=broadcast.mjs.map

package/dist/web-page/renderers/broadcast.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"broadcast.mjs","names":[],"sources":["../../../src/web-page/renderers/broadcast.ts"],"sourcesContent":["export const BROADCAST_JS = `\n  // ── Broadcast Primitive ──\n  // Expands semantic roles into standard AUP nodes, then delegates to renderAupView.\n\n  var _BROADCAST_ROLE_MAP = {\n    \"live-badge\":       { type: \"text\", props: { mode: \"badge\" } },\n    \"clock\":            { type: \"text\", props: {} },\n    \"viewer-count\":     { type: \"text\", props: {} },\n    \"alert\":            { type: \"text\", props: {} },\n    \"headline\":         { type: \"text\", props: {} },\n    \"hashtag\":          { type: \"text\", props: {} },\n    \"speaker-bar\":      { type: \"view\", props: { layout: \"column\" } },\n    \"lower-third\":      { type: \"view\", props: { layout: \"column\" } },\n    \"data-widget\":      { type: \"view\", props: { layout: \"column\" } },\n    \"featured-comment\": { type: \"view\", props: { layout: \"column\" } },\n    \"score-bug\":        { type: \"view\", props: { layout: \"column\" } },\n    \"logo\":             { type: \"media\", props: {} },\n    \"ticker\":           { type: \"ticker\", props: {} }\n  };\n\n  var _BROADCAST_PLACEMENTS = {\n    _default: {\n      \"live-badge\": \"top-start\",\n      \"clock\": \"top-end\",\n      \"viewer-count\": \"top-center\",\n      \"speaker-bar\": \"lower-start\",\n      \"lower-third\": \"lower-center\",\n      \"alert\": \"lower-start\",\n      \"headline\": \"lower-center\",\n      \"ticker\": \"ticker\",\n      \"logo\": \"lower-end\",\n      \"score-bug\": \"mid-end\",\n      \"data-widget\": \"mid-end\",\n      \"hashtag\": \"bottom-end\",\n      \"featured-comment\": \"mid-center\"\n    },\n    apple: {\n      \"live-badge\": \"top-end\",\n      \"clock\": \"top-start\"\n    }\n  };\n\n  function _resolveBroadcastPlacements(theme) {\n    var themeName = typeof theme === \"string\" ? theme : \"_default\";\n    var base = _BROADCAST_PLACEMENTS._default;\n    var overrides = _BROADCAST_PLACEMENTS[themeName];\n    if (!overrides || themeName === \"_default\") return base;\n    var merged = {};\n    for (var k in base) { if (base.hasOwnProperty(k)) merged[k] = base[k]; }\n    for (var k2 in overrides) { if (overrides.hasOwnProperty(k2)) merged[k2] = overrides[k2]; }\n    return merged;\n  }\n\n  function _expandBroadcastChild(child, region) {\n    var role = child.role;\n    var mapping = _BROADCAST_ROLE_MAP[role];\n    if (!mapping) return null;\n\n    var nodeType = mapping.type;\n    var nodeProps = {};\n    for (var pk in mapping.props) { if (mapping.props.hasOwnProperty(pk)) nodeProps[pk] = mapping.props[pk]; }\n    nodeProps.region = region;\n    nodeProps.role = role;\n\n    // Logo: if src is present, use media; otherwise view\n    if (role === \"logo\") {\n      if (child.src) {\n        nodeType = \"media\";\n        nodeProps.src = child.src;\n        if (child.alt) nodeProps.alt = child.alt;\n        if (child.size) nodeProps.size = child.size;\n      } else {\n        nodeType = \"view\";\n      }\n    }\n\n    // Ticker: wrap items in a ticker node inside a view\n    if (role === \"ticker\") {\n      var tickerItems = child.items || [];\n      var tickerChildren = [];\n      for (var ti = 0; ti < tickerItems.length; ti++) {\n        tickerChildren.push({ type: \"text\", props: { content: tickerItems[ti] } });\n      }\n      var tickerProps = {};\n      if (child.intent) tickerProps.intent = child.intent;\n      if (child.mode) tickerProps.mode = child.mode;\n      if (child.speed) tickerProps.speed = child.speed;\n      return {\n        type: \"view\",\n        props: { region: region },\n        children: [{\n          type: \"ticker\",\n          props: tickerProps,\n          children: tickerChildren\n        }]\n      };\n    }\n\n    // Simple text roles: text prop → content\n    if (nodeType === \"text\") {\n      if (child.text) nodeProps.content = child.text;\n      return { type: \"text\", props: nodeProps };\n    }\n\n    // Compound view roles (speaker-bar, lower-third, data-widget, featured-comment, score-bug)\n    if (nodeType === \"view\") {\n      var viewChildren = [];\n      // lines[] → text children\n      if (child.lines && child.lines.length) {\n        for (var li = 0; li < child.lines.length; li++) {\n          viewChildren.push({ type: \"text\", props: { content: child.lines[li] } });\n        }\n      }\n      // Passthrough children[] — already-expanded AUP nodes\n      if (child.children && child.children.length) {\n        viewChildren = viewChildren.concat(child.children);\n      }\n      return { type: \"view\", props: nodeProps, children: viewChildren };\n    }\n\n    // Media (logo with src)\n    if (nodeType === \"media\") {\n      return { type: \"media\", props: nodeProps };\n    }\n\n    return null;\n  }\n\n  function renderAupBroadcast(node) {\n    var p = node.props || {};\n    var theme = p.theme || \"minimal\";\n    var placements = _resolveBroadcastPlacements(theme);\n\n    var viewNode = {\n      type: \"view\",\n      props: { layout: \"overlay-grid\", theme: theme },\n      children: []\n    };\n\n    // Forward background\n    if (p.background) viewNode.props.background = p.background;\n\n    var children = node.children || [];\n    for (var i = 0; i < children.length; i++) {\n      var child = children[i];\n      var role = child.role;\n      if (!role) continue;\n      var region = child.at || (placements[role] || \"mid-center\");\n      var expanded = _expandBroadcastChild(child, region);\n      if (expanded) viewNode.children.push(expanded);\n    }\n\n    return renderAupView(viewNode);\n  }\n`;\n"],"mappings":";AAAA,MAAa,eAAe"}

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

@@ -0,0 +1,137 @@
+
+//#region src/web-page/renderers/calendar.ts
+const CALENDAR_JS = `
+  // ── Calendar Primitive (Pure CSS/JS) ──
+  function renderAupCalendar(node) {
+    var el = document.createElement("div");
+    el.className = "aup-calendar";
+    var p = node.props || {};
+    var mode = p.mode || "month";
+    var events = p.events || [];
+    var currentDate = new Date();
+
+    if (mode === "month" || mode === "week" || mode === "day") {
+      renderMonthView();
+    } else if (mode === "agenda") {
+      renderAgendaView();
+    }
+
+    function renderMonthView() {
+      el.innerHTML = "";
+      var header = document.createElement("div");
+      header.className = "aup-calendar-header";
+      var prevBtn = document.createElement("button");
+      prevBtn.textContent = "\\u25C0";
+      prevBtn.onclick = function() { currentDate.setMonth(currentDate.getMonth() - 1); renderMonthView(); };
+      var nextBtn = document.createElement("button");
+      nextBtn.textContent = "\\u25B6";
+      nextBtn.onclick = function() { currentDate.setMonth(currentDate.getMonth() + 1); renderMonthView(); };
+      var title = document.createElement("span");
+      title.className = "aup-calendar-title";
+      title.textContent = currentDate.toLocaleDateString(p.locale || undefined, { year: "numeric", month: "long" });
+      header.appendChild(prevBtn);
+      header.appendChild(title);
+      header.appendChild(nextBtn);
+      el.appendChild(header);
+
+      var grid = document.createElement("div");
+      grid.className = "aup-calendar-grid";
+
+      var dayNames = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+      for (var d = 0; d < 7; d++) {
+        var dh = document.createElement("div");
+        dh.className = "aup-calendar-day-header";
+        dh.textContent = dayNames[d];
+        grid.appendChild(dh);
+      }
+
+      var year = currentDate.getFullYear();
+      var month = currentDate.getMonth();
+      var firstDay = new Date(year, month, 1).getDay();
+      var daysInMonth = new Date(year, month + 1, 0).getDate();
+      var today = new Date();
+
+      // Previous month padding
+      var prevMonthDays = new Date(year, month, 0).getDate();
+      for (var i = firstDay - 1; i >= 0; i--) {
+        var dayEl = document.createElement("div");
+        dayEl.className = "aup-calendar-day other-month";
+        dayEl.textContent = String(prevMonthDays - i);
+        grid.appendChild(dayEl);
+      }
+
+      // Current month days
+      for (var day = 1; day <= daysInMonth; day++) {
+        var dayEl = document.createElement("div");
+        dayEl.className = "aup-calendar-day";
+        if (day === today.getDate() && month === today.getMonth() && year === today.getFullYear()) {
+          dayEl.classList.add("today");
+        }
+        dayEl.textContent = String(day);
+
+        // Events on this day
+        var dateStr = year + "-" + String(month + 1).padStart(2, "0") + "-" + String(day).padStart(2, "0");
+        for (var e = 0; e < events.length; e++) {
+          if (events[e].date === dateStr) {
+            var evtEl = document.createElement("span");
+            evtEl.className = "aup-calendar-event";
+            evtEl.setAttribute("data-intent", events[e].intent || "info");
+            evtEl.textContent = _escapeHtml(String(events[e].label || ""));
+            dayEl.appendChild(evtEl);
+          }
+        }
+        grid.appendChild(dayEl);
+      }
+
+      // Next month padding
+      var totalCells = firstDay + daysInMonth;
+      var remaining = (7 - (totalCells % 7)) % 7;
+      for (var i = 1; i <= remaining; i++) {
+        var dayEl = document.createElement("div");
+        dayEl.className = "aup-calendar-day other-month";
+        dayEl.textContent = String(i);
+        grid.appendChild(dayEl);
+      }
+
+      el.appendChild(grid);
+    }
+
+    function renderAgendaView() {
+      el.innerHTML = "";
+      var header = document.createElement("div");
+      header.className = "aup-calendar-header";
+      var title = document.createElement("span");
+      title.className = "aup-calendar-title";
+      title.textContent = "Agenda";
+      header.appendChild(title);
+      el.appendChild(header);
+
+      var sorted = events.slice().sort(function(a, b) { return (a.date || "").localeCompare(b.date || ""); });
+      if (sorted.length === 0) {
+        var empty = document.createElement("div");
+        empty.style.cssText = "color: var(--dim); text-align: center; padding: 20px;";
+        empty.textContent = "No events";
+        el.appendChild(empty);
+      } else {
+        for (var i = 0; i < sorted.length; i++) {
+          var item = document.createElement("div");
+          item.style.cssText = "display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--border);";
+          var date = document.createElement("span");
+          date.style.cssText = "font-size: 0.8em; color: var(--dim); min-width: 80px;";
+          date.textContent = sorted[i].date || "";
+          var label = document.createElement("span");
+          label.textContent = _escapeHtml(String(sorted[i].label || ""));
+          item.appendChild(date);
+          item.appendChild(label);
+          el.appendChild(item);
+        }
+      }
+    }
+
+    return el;
+  }
+
+`;
+
+//#endregion
+exports.CALENDAR_JS = CALENDAR_JS;