@icen.ai/ui 0.8.0 → 0.9.0

package/dist/behaviors/kb-access.mjs

@@ -0,0 +1,569 @@
+// src/behaviors/ai-core.ts
+var svg = (body) => `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${body}</svg>`;
+var ICON_TERMINAL = svg('<path d="m4 17 6-6-6-6"/><path d="M12 19h8"/>');
+var ICON_FILE = svg(
+  '<path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z"/><path d="M14 2v4a2 2 0 0 0 2 2h4"/>'
+);
+var ICON_FILE_PEN = svg(
+  '<path d="M12.5 22H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8l5 5v3.5"/><path d="M14 2v4a2 2 0 0 0 2 2h4"/><path d="M19 6.5 16.5 4"/><path d="M21.378 16.626a1 1 0 0 0-3.004-3.004l-4.01 4.012a2 2 0 0 0-.506.854l-.837 2.87a.5.5 0 0 0 .62.62l2.87-.837a2 2 0 0 0 .854-.506z"/>'
+);
+var ICON_FILE_PLUS = svg(
+  '<path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z"/><path d="M14 2v4a2 2 0 0 0 2 2h4"/><path d="M9 15h6"/><path d="M12 12v6"/>'
+);
+var ICON_TRASH = svg(
+  '<path d="M3 6h18"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/><path d="M10 11v6"/><path d="M14 11v6"/>'
+);
+var ICON_SEARCH = svg('<circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/>');
+var ICON_FOLDER_SEARCH = svg(
+  '<path d="M11 20H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H20a2 2 0 0 1 2 2v4"/><circle cx="17" cy="17" r="3"/><path d="m21 21-1.9-1.9"/>'
+);
+var ICON_SCAN_SEARCH = svg(
+  '<path d="M3 7V5a2 2 0 0 1 2-2h2"/><path d="M17 3h2a2 2 0 0 1 2 2v2"/><path d="M21 17v2a2 2 0 0 1-2 2h-2"/><path d="M7 21H5a2 2 0 0 1-2-2v-2"/><circle cx="12" cy="12" r="3"/><path d="m16 16-1.9-1.9"/>'
+);
+var ICON_GLOBE = svg(
+  '<circle cx="12" cy="12" r="10"/><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"/><path d="M2 12h20"/>'
+);
+var ICON_DOWNLOAD = svg(
+  '<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><path d="m7 10 5 5 5-5"/><path d="M12 15V3"/>'
+);
+var ICON_BLOCKS = svg(
+  '<rect width="7" height="7" x="4" y="4" rx="1"/><rect width="7" height="7" x="13" y="4" rx="1"/><rect width="7" height="7" x="4" y="13" rx="1"/><rect width="7" height="7" x="13" y="13" rx="1"/>'
+);
+var ICON_ZAP = svg(
+  '<path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"/>'
+);
+var ICON_LIST = svg(
+  '<path d="M3 12h.01"/><path d="M3 18h.01"/><path d="M3 6h.01"/><path d="M8 12h13"/><path d="M8 18h13"/><path d="M8 6h13"/>'
+);
+var ICON_LIST_CHECKS = svg(
+  '<path d="m3 17 2 2 4-4"/><path d="m3 7 2 2 4-4"/><path d="M13 6h8"/><path d="M13 12h8"/><path d="M13 18h8"/>'
+);
+var ICON_BOT = svg(
+  '<path d="M12 8V4H8"/><rect width="16" height="12" x="4" y="8" rx="2"/><path d="M2 14h2"/><path d="M20 14h2"/><path d="M15 13v2"/><path d="M9 13v2"/>'
+);
+var ICON_CHART = svg(
+  '<path d="M3 3v18h18"/><path d="M7 15l4-6 3 4 5-8"/>'
+);
+var ICON_FILE_TEXT = svg(
+  '<path d="M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z"/><path d="M14 2v4a2 2 0 0 0 2 2h4"/><path d="M10 9H8"/><path d="M16 13H8"/><path d="M16 17H8"/>'
+);
+function isObj(v) {
+  return typeof v === "object" && v !== null;
+}
+function pickStr(input, keys) {
+  if (!isObj(input)) return void 0;
+  for (const k of keys) {
+    const v = input[k];
+    if (typeof v === "string" && v) return v;
+  }
+  return void 0;
+}
+function pickNum(src, keys) {
+  if (!isObj(src)) return void 0;
+  for (const k of keys) {
+    const v = src[k];
+    if (typeof v === "number" && Number.isFinite(v)) return v;
+  }
+  return void 0;
+}
+function firstLine(s, max = 80) {
+  const line = s.split("\n", 1)[0]?.trim() ?? "";
+  return line.length > max ? `${line.slice(0, max)}\u2026` : line;
+}
+function filePathOf(input) {
+  return pickStr(input, ["file_path", "path", "file", "filename"]);
+}
+var summarizePath = (input) => filePathOf(input);
+function summarizeRead(input) {
+  const p = filePathOf(input);
+  if (!p) return void 0;
+  const offset = pickNum(input, ["offset", "start_line"]);
+  if (offset == null) return p;
+  const limit = pickNum(input, ["limit", "end_line"]);
+  return limit != null ? `${p}:${offset}-${offset + limit}` : `${p}:${offset}`;
+}
+function summarizeShell(input) {
+  const cmd = typeof input === "string" ? input : pickStr(input, ["command", "cmd", "script"]);
+  return cmd ? firstLine(cmd) : void 0;
+}
+function summarizeGrep(input) {
+  const pattern = pickStr(input, ["pattern", "regex", "query"]);
+  const p = filePathOf(input);
+  if (pattern) return p ? `${firstLine(pattern, 40)} \xB7 ${p}` : firstLine(pattern);
+  return p;
+}
+var sum = (fn) => {
+  return (input) => fn(input) ?? "";
+};
+var BUILTIN_KINDS = {
+  shell: { label: "\u547D\u4EE4", icon: ICON_TERMINAL, tint: "accent", summarize: sum(summarizeShell) },
+  read: { label: "\u8BFB\u53D6", icon: ICON_FILE, tint: "info", summarize: sum(summarizeRead) },
+  edit: { label: "\u7F16\u8F91", icon: ICON_FILE_PEN, tint: "warning", summarize: sum(summarizePath) },
+  write: { label: "\u5199\u5165", icon: ICON_FILE_PLUS, tint: "warning", summarize: sum(summarizePath) },
+  rm: { label: "\u5220\u9664", icon: ICON_TRASH, tint: "error", summarize: sum(summarizePath) },
+  grep: { label: "\u641C\u7D22", icon: ICON_SEARCH, tint: "info", summarize: sum(summarizeGrep) },
+  glob: { label: "\u5339\u914D", icon: ICON_FOLDER_SEARCH, tint: "info", summarize: sum((i) => pickStr(i, ["pattern", "glob", "path"])) },
+  browser: { label: "\u6D4F\u89C8", icon: ICON_GLOBE, tint: "accent", summarize: sum((i) => pickStr(i, ["url", "uri", "target"])) },
+  search: { label: "\u68C0\u7D22", icon: ICON_SCAN_SEARCH, tint: "accent", summarize: sum((i) => pickStr(i, ["query", "q", "pattern"])) },
+  fetch: { label: "\u8BF7\u6C42", icon: ICON_DOWNLOAD, tint: "info", summarize: sum((i) => pickStr(i, ["url", "uri", "endpoint"])) },
+  mcp: { label: "MCP", icon: ICON_BLOCKS, tint: "muted", summarize: sum((i) => pickStr(i, ["tool", "method", "name"])) },
+  skill: { label: "\u6280\u80FD", icon: ICON_ZAP, tint: "accent", summarize: sum((i) => pickStr(i, ["skill", "name", "command"])) },
+  todo: {
+    label: "\u5F85\u529E",
+    icon: ICON_LIST,
+    tint: "info",
+    summarize: sum((input) => {
+      const items = input && typeof input === "object" && Array.isArray(input.items) ? input.items : Array.isArray(input) ? input : [];
+      const done = items.filter((it) => it?.status === "done").length;
+      return items.length > 0 ? `${done}/${items.length} \u5B8C\u6210` : "";
+    })
+  },
+  plan: { label: "\u8BA1\u5212", icon: ICON_LIST_CHECKS, tint: "info" },
+  subagent: { label: "\u5B50\u4EE3\u7406", icon: ICON_BOT, tint: "accent", summarize: sum((i) => pickStr(i, ["task", "description", "prompt", "message", "subagent_type"])) },
+  note: { label: "\u7B14\u8BB0", icon: ICON_FILE_TEXT, tint: "muted" },
+  chart: { label: "\u56FE\u8868", icon: ICON_CHART, tint: "info", summarize: sum((i) => pickStr(i, ["title", "name"])) }
+};
+var kindRegistry = new Map(Object.entries(BUILTIN_KINDS));
+function h(tag, className, text) {
+  const node = document.createElement(tag);
+  if (className) node.className = className;
+  if (text != null) node.textContent = text;
+  return node;
+}
+function svgIcon(svg2) {
+  if (typeof document === "undefined" || typeof DOMParser === "undefined") return null;
+  let parsed;
+  try {
+    parsed = new DOMParser().parseFromString(svg2, "image/svg+xml");
+  } catch {
+    return null;
+  }
+  const root = parsed.documentElement;
+  if (!root || root.tagName.toLowerCase() !== "svg" || parsed.querySelector("parsererror")) {
+    return null;
+  }
+  const sanitize = (el) => {
+    for (const attr of Array.from(el.attributes)) {
+      const name = attr.name.toLowerCase();
+      if (name.startsWith("on")) el.removeAttribute(attr.name);
+      if ((name === "href" || name === "xlink:href") && attr.value.trim().toLowerCase().startsWith("javascript:")) {
+        el.removeAttribute(attr.name);
+      }
+    }
+    for (const child of Array.from(el.children)) {
+      const tag = child.tagName.toLowerCase();
+      if (tag === "script" || tag === "foreignobject") {
+        child.remove();
+        continue;
+      }
+      sanitize(child);
+    }
+  };
+  sanitize(root);
+  return document.importNode(root, true);
+}
+
+// src/behaviors/kb-core.ts
+var ic = (label, d) => ({ label, icon: `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">${d}</svg>` });
+var BUILTIN_SOURCE_TYPES = {
+  doc: ic("\u6587\u6863", '<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/>'),
+  web: ic("\u7F51\u9875", '<circle cx="12" cy="12" r="10"/><path d="M2 12h20"/><path d="M12 2a15 15 0 0 1 0 20 15 15 0 0 1 0-20z"/>'),
+  wiki: ic("\u77E5\u8BC6\u5E93", '<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/>'),
+  sheet: ic("\u8868\u683C", '<rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18M3 15h18M9 3v18M15 3v18"/>'),
+  db: ic("\u6570\u636E\u5E93", '<ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M3 5v14c0 1.7 4 3 9 3s9-1.3 9-3V5"/><path d="M3 12c0 1.7 4 3 9 3s9-1.3 9-3"/>'),
+  ticket: ic("\u5DE5\u5355", '<path d="M3 9V7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v2a2 2 0 0 0 0 6v2a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-2a2 2 0 0 0 0-6z"/><path d="M13 5v14"/>'),
+  code: ic("\u4EE3\u7801", '<path d="m16 18 6-6-6-6"/><path d="m8 6-6 6 6 6"/>'),
+  api: ic("\u63A5\u53E3", '<path d="M4 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v3a2 2 0 0 0 0 4v3a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-3a2 2 0 0 0 0-4z"/>'),
+  image: ic("\u56FE\u7247", '<rect x="3" y="3" width="18" height="18" rx="2"/><circle cx="9" cy="9" r="2"/><path d="m21 15-4.6-4.6a2 2 0 0 0-2.8 0L3 21"/>'),
+  mail: ic("\u90AE\u4EF6", '<rect x="2" y="4" width="20" height="16" rx="2"/><path d="m22 7-10 7L2 7"/>')
+};
+var sourceTypeRegistry = new Map(Object.entries(BUILTIN_SOURCE_TYPES));
+var KB_ROLES = ["viewer", "commenter", "editor", "owner"];
+function kbRoleLabel(r) {
+  return r === "viewer" ? "\u53EF\u67E5\u770B" : r === "commenter" ? "\u53EF\u8BC4\u8BBA" : r === "editor" ? "\u53EF\u7F16\u8F91" : r === "owner" ? "\u8D1F\u8D23\u4EBA" : "\u65E0\u6743\u9650";
+}
+var KB_ACCESS_STATES = [
+  "idle",
+  "requested",
+  "pending_review",
+  "granted",
+  "expiring",
+  "expired",
+  "denied",
+  "revoked"
+];
+function kbAccessStateLabel(s) {
+  return {
+    idle: "\u672A\u7533\u8BF7",
+    requested: "\u5DF2\u63D0\u4EA4",
+    pending_review: "\u5F85\u5BA1\u6279",
+    granted: "\u5DF2\u5F00\u901A",
+    expiring: "\u5373\u5C06\u5230\u671F",
+    expired: "\u5DF2\u8FC7\u671F",
+    denied: "\u672A\u901A\u8FC7",
+    revoked: "\u5DF2\u6536\u56DE"
+  }[s] ?? s;
+}
+function normalizeAccessRequest(raw) {
+  const r = raw;
+  const state = KB_ACCESS_STATES.includes(r.state) ? r.state : "idle";
+  const str = (v) => typeof v === "string" && v ? v : void 0;
+  return {
+    id: String(r.id ?? ""),
+    requester: String(r.requester ?? ""),
+    resource: String(r.resource ?? ""),
+    role: KB_ROLES.includes(r.role) ? r.role : "viewer",
+    reason: str(r.reason),
+    state,
+    submittedAt: str(r.submittedAt) ?? (/* @__PURE__ */ new Date()).toISOString(),
+    approverNote: str(r.approverNote),
+    decidedBy: str(r.decidedBy),
+    decidedAt: str(r.decidedAt),
+    expiresAt: str(r.expiresAt)
+  };
+}
+function relativeTime(input, now = /* @__PURE__ */ new Date()) {
+  const t = input instanceof Date ? input.getTime() : typeof input === "number" ? input : Date.parse(input);
+  if (!Number.isFinite(t)) return typeof input === "string" ? input : "\u2014";
+  const diff = now.getTime() - t;
+  const MIN = 6e4, HOUR = 36e5, DAY = 864e5;
+  if (diff < MIN) return "\u521A\u521A";
+  if (diff < HOUR) return `${Math.floor(diff / MIN)} \u5206\u949F\u524D`;
+  if (diff < DAY) return `${Math.floor(diff / HOUR)} \u5C0F\u65F6\u524D`;
+  if (diff < 30 * DAY) return `${Math.floor(diff / DAY)} \u5929\u524D`;
+  const d = new Date(t);
+  const ymd = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
+  return ymd;
+}
+
+// src/behaviors/events.ts
+function emitIcen(source, type, detail) {
+  return source.dispatchEvent(
+    new CustomEvent(type, { detail, bubbles: true, composed: true, cancelable: true })
+  );
+}
+
+// src/behaviors/kb-access.ts
+var ico = (d) => `<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">${d}</svg>`;
+var ICON_LOCK = ico('<rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/>');
+var ICON_USER_SWITCH = ico('<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="m16 11 2 2 4-4"/>');
+var EXPIRING_WINDOW_MS = 7 * 864e5;
+var REQUESTABLE_ROLES = ["viewer", "commenter", "editor"];
+var MIN_MS = 6e4;
+var HOUR_MS = 36e5;
+var DAY_MS = 864e5;
+function untilText(at, now) {
+  if (!at) return "";
+  const t = Date.parse(at);
+  if (!Number.isFinite(t)) return "";
+  const diff = t - now.getTime();
+  if (diff <= 0) return "\u5DF2\u5230\u671F";
+  if (diff < HOUR_MS) return `${Math.max(1, Math.floor(diff / MIN_MS))} \u5206\u949F\u540E`;
+  if (diff < DAY_MS) return `${Math.floor(diff / HOUR_MS)} \u5C0F\u65F6\u540E`;
+  return `${Math.floor(diff / DAY_MS)} \u5929\u540E`;
+}
+function parseTs(at) {
+  if (!at) return null;
+  const t = Date.parse(at);
+  return Number.isFinite(t) ? t : null;
+}
+function createKbAccess(el, opts) {
+  const host = el;
+  if (typeof document === "undefined") {
+    const snapshot = normalizeAccessRequest(opts.request);
+    return {
+      setState: () => void 0,
+      getState: () => ({ ...snapshot }),
+      destroy: () => void 0
+    };
+  }
+  host.__icenKbAccess?.destroy();
+  const mode = opts.mode === "approver" ? "approver" : "requester";
+  let req = normalizeAccessRequest(opts.request);
+  let destroyed = false;
+  let formOpen = false;
+  let formRole = REQUESTABLE_ROLES.includes(req.role) ? req.role : "viewer";
+  let formDuration = "";
+  let formReason = "";
+  const deriveExpiry = () => {
+    if (req.state !== "granted" && req.state !== "expiring") return;
+    const t = parseTs(req.expiresAt);
+    if (t == null) return;
+    const now = Date.now();
+    if (t <= now) {
+      req = { ...req, state: "expired" };
+      emitIcen(host, "icen:kb-access-expire", { id: req.id });
+      return;
+    }
+    if (t - now <= EXPIRING_WINDOW_MS && req.state === "granted") {
+      req = { ...req, state: "expiring" };
+    }
+  };
+  const submitForm = (form) => {
+    const reasonEl = form.querySelector(".kb-access-reason");
+    const durationEl = form.querySelector(".kb-access-duration");
+    const reason = reasonEl?.value.trim() ?? "";
+    const days = Number(durationEl?.value ?? "");
+    const expiresAt = Number.isFinite(days) && days > 0 ? new Date(Date.now() + days * DAY_MS).toISOString() : void 0;
+    formReason = reason;
+    formDuration = durationEl?.value ?? "";
+    req = normalizeAccessRequest({
+      ...req,
+      role: formRole,
+      reason: reason || void 0,
+      expiresAt,
+      state: "requested",
+      submittedAt: (/* @__PURE__ */ new Date()).toISOString()
+    });
+    formOpen = false;
+    emitIcen(host, "icen:kb-access-request", { request: { ...req } });
+    opts.onRequest?.({ ...req });
+    render();
+  };
+  const decide = (decision, role) => {
+    req = normalizeAccessRequest({
+      ...req,
+      state: decision === "approve" ? "granted" : "denied",
+      role: decision === "approve" && role && KB_ROLES.includes(role) ? role : req.role,
+      decidedAt: (/* @__PURE__ */ new Date()).toISOString()
+    });
+    emitIcen(host, "icen:kb-access-decide", {
+      id: req.id,
+      decision,
+      role: decision === "approve" ? req.role : void 0
+    });
+    opts.onDecide?.(req.id, decision, decision === "approve" ? req.role : void 0);
+    render();
+  };
+  const ghostBtn = (label, attr, title) => {
+    const btn = h("button", "kb-access-btn kb-access-btn--ghost", label);
+    btn.type = "button";
+    btn.setAttribute(attr, "");
+    if (title) btn.setAttribute("aria-label", title);
+    return btn;
+  };
+  const buildDeniedCard = () => {
+    const card = h("div", "kb-access-denied");
+    const title = h("div", "kb-access-title");
+    const lock = svgIcon(ICON_LOCK);
+    if (lock) title.appendChild(lock);
+    title.appendChild(h("span", void 0, req.resource || "\u53D7\u9650\u5185\u5BB9"));
+    card.appendChild(title);
+    card.appendChild(h("p", "kb-access-why", opts.deniedHint ?? "\u6B64\u5185\u5BB9\u4EC5\u5BF9\u6388\u6743\u8005\u5F00\u653E"));
+    card.appendChild(h("div", "kb-access-owner", `\u8D1F\u8D23\u4EBA\uFF1A${req.approverNote || "\u5185\u5BB9\u8D1F\u8D23\u4EBA"}`));
+    const actions = h("div", "kb-access-actions");
+    const primary = h("button", "kb-access-btn", "\u7533\u8BF7\u8BBF\u95EE");
+    primary.type = "button";
+    primary.dataset.accessRequest = "";
+    primary.setAttribute("aria-label", `\u7533\u8BF7\u8BBF\u95EE ${req.resource || "\u8BE5\u5185\u5BB9"}`);
+    primary.addEventListener("click", () => {
+      formOpen = !formOpen;
+      render();
+    });
+    actions.appendChild(primary);
+    const switchBtn = ghostBtn("\u5207\u6362\u8EAB\u4EFD", "data-access-switch", "\u5207\u6362\u8EAB\u4EFD\u540E\u91CD\u65B0\u68C0\u67E5\u6743\u9650");
+    const switchIcon = svgIcon(ICON_USER_SWITCH);
+    if (switchIcon) switchBtn.prepend(switchIcon);
+    switchBtn.addEventListener("click", () => opts.onSwitchIdentity?.());
+    actions.appendChild(switchBtn);
+    card.appendChild(actions);
+    return card;
+  };
+  const buildForm = () => {
+    const form = h("form", "kb-access-form");
+    form.hidden = !formOpen;
+    const reason = document.createElement("textarea");
+    reason.className = "kb-access-reason";
+    reason.value = formReason;
+    reason.placeholder = "\u8BF4\u660E\u4E1A\u52A1\u539F\u56E0\uFF08\u5BA1\u6279\u4EBA\u53EF\u89C1\uFF09";
+    reason.setAttribute("aria-label", "\u7533\u8BF7\u7406\u7531");
+    reason.rows = 3;
+    form.appendChild(reason);
+    const roles = h("div", "kb-access-roles");
+    roles.setAttribute("role", "group");
+    roles.setAttribute("aria-label", "\u7533\u8BF7\u89D2\u8272");
+    for (const r of REQUESTABLE_ROLES) {
+      const chip = h("button", `kb-access-role${formRole === r ? " is-on" : ""}`, kbRoleLabel(r));
+      chip.type = "button";
+      chip.dataset.role = r;
+      chip.setAttribute("aria-pressed", String(formRole === r));
+      chip.addEventListener("click", () => {
+        formRole = r;
+        render();
+      });
+      roles.appendChild(chip);
+    }
+    form.appendChild(roles);
+    const durationRow = h("label", "kb-access-duration-row");
+    durationRow.appendChild(h("span", void 0, "\u8BBF\u95EE\u65F6\u957F"));
+    const duration = h("select", "kb-access-duration");
+    for (const [value, label] of [
+      ["", "\u6C38\u4E45"],
+      ["7", "7 \u5929"],
+      ["30", "30 \u5929"]
+    ]) {
+      const o = h("option", void 0, label);
+      o.value = value;
+      duration.appendChild(o);
+    }
+    duration.value = formDuration;
+    duration.setAttribute("aria-label", "\u8BBF\u95EE\u65F6\u957F");
+    durationRow.appendChild(duration);
+    form.appendChild(durationRow);
+    form.appendChild(h("div", "kb-meta kb-access-route", `\u8BF7\u6C42\u5C06\u53D1\u9001\u7ED9\uFF1A${req.approverNote || "\u5185\u5BB9\u8D1F\u8D23\u4EBA"}`));
+    const submit = h("button", "kb-access-submit", "\u63D0\u4EA4\u7533\u8BF7");
+    submit.type = "submit";
+    submit.dataset.accessSubmit = "";
+    form.appendChild(submit);
+    form.addEventListener("submit", (e) => {
+      e.preventDefault();
+      submitForm(form);
+    });
+    return form;
+  };
+  const buildStateRow = () => {
+    const row = h("div", "kb-access-state");
+    const chip = h("span", "kb-chip", kbAccessStateLabel(req.state));
+    chip.dataset.state = req.state;
+    row.appendChild(chip);
+    const countdown = untilText(req.expiresAt, /* @__PURE__ */ new Date());
+    if ((req.state === "granted" || req.state === "expiring") && countdown) {
+      row.appendChild(h("span", "kb-num kb-access-countdown", `${countdown}\u5230\u671F`));
+    }
+    if (req.state === "requested" || req.state === "pending_review") {
+      row.appendChild(h("span", "kb-meta", `\u7B49\u5F85 ${req.approverNote || "\u5185\u5BB9\u8D1F\u8D23\u4EBA"} \u5BA1\u6279`));
+      return row;
+    }
+    if (req.state === "expiring") {
+      const renew = h("button", "kb-access-act", "\u7533\u8BF7\u7EED\u671F");
+      renew.type = "button";
+      renew.dataset.accessRenew = "";
+      renew.addEventListener("click", () => {
+        formOpen = true;
+        render();
+      });
+      row.appendChild(renew);
+      return row;
+    }
+    if (req.state === "expired") {
+      const reapply = h("button", "kb-access-act", "\u91CD\u65B0\u7533\u8BF7");
+      reapply.type = "button";
+      reapply.dataset.accessReapply = "";
+      reapply.addEventListener("click", () => {
+        formOpen = true;
+        render();
+      });
+      row.appendChild(reapply);
+      return row;
+    }
+    if (req.state === "denied") {
+      row.appendChild(h("span", "kb-meta", "\u672A\u901A\u8FC7\u2014\u2014\u53EF\u8C03\u6574\u7406\u7531\u540E\u91CD\u65B0\u7533\u8BF7"));
+      const reapply = h("button", "kb-access-act", "\u91CD\u65B0\u7533\u8BF7");
+      reapply.type = "button";
+      reapply.dataset.accessReapply = "";
+      reapply.addEventListener("click", () => {
+        formOpen = true;
+        render();
+      });
+      row.appendChild(reapply);
+      return row;
+    }
+    if (req.state === "revoked") {
+      row.appendChild(h("span", "kb-meta", "\u8BBF\u95EE\u5DF2\u88AB\u6536\u56DE"));
+      const reapply = h("button", "kb-access-act", "\u91CD\u65B0\u7533\u8BF7");
+      reapply.type = "button";
+      reapply.dataset.accessReapply = "";
+      reapply.addEventListener("click", () => {
+        formOpen = true;
+        render();
+      });
+      row.appendChild(reapply);
+    }
+    return row;
+  };
+  const buildQueue = () => {
+    const queue = h("div", "kb-access-queue");
+    const card = h("div", "kb-access-req");
+    card.appendChild(h("span", "kb-access-req-user", req.requester || "\u672A\u77E5\u8BF7\u6C42\u4EBA"));
+    card.appendChild(h("span", "kb-access-req-resource", req.resource || "\u53D7\u9650\u5185\u5BB9"));
+    card.appendChild(h("span", "kb-chip kb-access-req-role", kbRoleLabel(req.role)));
+    if (req.reason) card.appendChild(h("span", "kb-meta kb-access-req-reason", req.reason));
+    card.appendChild(h("span", "kb-num kb-access-req-at", relativeTime(req.submittedAt)));
+    const pending = req.state === "idle" || req.state === "requested" || req.state === "pending_review";
+    if (pending) {
+      const actions = h("span", "kb-access-req-actions");
+      const roleSel = h("select", "kb-access-approve-role");
+      roleSel.setAttribute("aria-label", "\u6279\u51C6\u89D2\u8272");
+      for (const r of REQUESTABLE_ROLES) {
+        const o = h("option", void 0, `\u6279\u51C6\u4E3A${kbRoleLabel(r)}`);
+        o.value = r;
+        roleSel.appendChild(o);
+      }
+      roleSel.value = REQUESTABLE_ROLES.includes(req.role) ? req.role : "viewer";
+      actions.appendChild(roleSel);
+      const approve = ghostBtn("\u6279\u51C6", "data-access-approve", "\u6279\u51C6\u8BE5\u8BBF\u95EE\u7533\u8BF7");
+      approve.addEventListener("click", () => decide("approve", roleSel.value));
+      actions.appendChild(approve);
+      const note = document.createElement("textarea");
+      note.className = "kb-access-note";
+      note.placeholder = "\u7ED9\u8BF7\u6C42\u4EBA\u7684\u7559\u8A00\uFF08\u53EF\u9009\uFF09";
+      note.rows = 1;
+      note.setAttribute("aria-label", "\u62D2\u7EDD\u7559\u8A00\uFF08\u53EF\u9009\uFF09");
+      actions.appendChild(note);
+      const deny = ghostBtn("\u62D2\u7EDD", "data-access-deny", "\u62D2\u7EDD\u8BE5\u8BBF\u95EE\u7533\u8BF7");
+      deny.addEventListener("click", () => decide("deny"));
+      actions.appendChild(deny);
+      card.appendChild(actions);
+    } else {
+      const decided = req.state === "granted" || req.state === "expiring" ? `\u5DF2\u6279\u51C6 \xB7 ${kbRoleLabel(req.role)}` : kbAccessStateLabel(req.state);
+      const echo = h("span", "kb-meta kb-access-req-decided", decided);
+      if (req.decidedAt) echo.appendChild(h("span", "kb-num", ` \xB7 ${relativeTime(req.decidedAt)}`));
+      card.appendChild(echo);
+    }
+    queue.appendChild(card);
+    return queue;
+  };
+  const render = () => {
+    if (destroyed) return;
+    deriveExpiry();
+    const doc = host.ownerDocument;
+    const active = doc.activeElement;
+    const focusInForm = active instanceof HTMLElement && host.contains(active) && active.closest(".kb-access-form") != null;
+    const prevReason = host.querySelector(".kb-access-reason");
+    if (prevReason) formReason = prevReason.value;
+    const prevDuration = host.querySelector(".kb-access-duration");
+    if (prevDuration) formDuration = prevDuration.value;
+    host.className = mode === "approver" ? "kb-access kb-access--approver" : "kb-access";
+    host.dataset.state = req.state;
+    host.replaceChildren();
+    if (mode === "approver") {
+      host.append(buildQueue(), buildStateRow());
+    } else {
+      const grantedLike = req.state === "granted" || req.state === "expiring";
+      if (!grantedLike) host.appendChild(buildDeniedCard());
+      const form = buildForm();
+      host.appendChild(form);
+      host.appendChild(buildStateRow());
+      if (formOpen && focusInForm) form.querySelector(".kb-access-reason")?.focus();
+    }
+  };
+  const setState = (next) => {
+    if (destroyed) return;
+    req = normalizeAccessRequest(typeof next === "string" ? { ...req, state: next } : { ...req, ...next });
+    render();
+  };
+  const destroy = () => {
+    if (destroyed) return;
+    destroyed = true;
+    host.replaceChildren();
+    host.classList.remove("kb-access", "kb-access--approver");
+    delete host.dataset.state;
+    delete host.__icenKbAccess;
+  };
+  host.__icenKbAccess = { destroy };
+  render();
+  return { setState, getState: () => ({ ...req }), destroy };
+}
+export {
+  createKbAccess
+};

package/dist/behaviors/kb-acl.d.mts

@@ -0,0 +1,50 @@
+import { KbAclEntry, KbSubject } from './kb-core.js';
+import './ai-core.js';
+
+/** kb-acl 面板数据快照（renderKbAcl 入参；normalizeAclModel 宽进严出） */
+interface KbAclModel {
+    /** 资源名（标题栏呈现） */
+    resource: string;
+    /** 父级链（近 → 远，面包式「继承自 A / B」） */
+    parentChain: string[];
+    /** 已停止继承（banner 警示态 + 头部按钮变「恢复继承」） */
+    broken: boolean;
+    /** 子项脱离继承的例外摘要（is-partial 态文案）；null/缺省 = 无例外 */
+    exceptions?: {
+        label: string;
+        count: number;
+    } | null;
+    /** 直接授权行（deny 行渲染时置顶） */
+    entries: KbAclEntry[];
+    /** 链接访问行（subject.kind = link） */
+    links: KbAclEntry[];
+    /** 不去重暴露面计数（「对 N 人可见」过度授权警示）；缺省/null = 不渲染 */
+    exposureCount?: number | null;
+}
+/** renderKbAcl 的回调通道（与 icen:kb-acl-* 事件双通道） */
+interface KbAclRenderOptions {
+    /** 「授予访问」点击（data-acl-grant） */
+    onGrant?: () => void;
+    /** 行移除点击（data-acl-remove；system 行 CSS 隐藏 + 委托二次拒绝，不会触发） */
+    onRemove?: (subject: KbSubject) => void;
+    /** 「停止继承」（data-acl-break） */
+    onBreak?: () => void;
+    /** 「恢复继承」（data-acl-restore） */
+    onRestore?: () => void;
+}
+/** 素对象 → KbAclModel（宽进严出：entries/links 逐条 normalizeAclEntry） */
+declare function normalizeAclModel(raw: KbAclModel | Record<string, unknown>): KbAclModel;
+/**
+ * 渲染文档权限面板（快照；返回挂载容器 el）。结构见文件头 DOM 契约；
+ * 行级交互不在此绑定——统一走 initKbAcl 的 root 级委托（幂等，返回销毁）。
+ */
+declare function renderKbAcl(el: HTMLElement, model: KbAclModel | Record<string, unknown>, opts?: KbAclRenderOptions): HTMLElement;
+/**
+ * 初始化 kb-acl 面板交互（root 级 click 委托，默认 document；幂等标记 __icenKbAclInit，
+ * 返回销毁函数，销毁后可重新 init）。命中 data-acl-grant / data-acl-remove /
+ * data-acl-break / data-acl-restore 时派 icen:kb-acl-* 事件并回调 renderKbAcl 登记的 opts
+ * （双通道）。is-system 行的移除钮在委托层二次拒绝（CSS 隐藏是第一重）。
+ */
+declare function initKbAcl(root?: ParentNode): () => void;
+
+export { type KbAclModel, type KbAclRenderOptions, initKbAcl, normalizeAclModel, renderKbAcl };