@agentaily/design-system 0.5.0 → 0.7.0

package/dist/components/settings/IntegrationSettings.js

@@ -1,688 +0,0 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import React, { useState, useRef, useEffect } from "react";
-import { Alert } from "../feedback/Alert.js";
-import { Badge } from "../display/Badge.js";
-import { BrandMark } from "../utilities/BrandMark.js";
-import { Button } from "../buttons/Button.js";
-import { HelpSteps } from "./HelpSteps.js";
-import { Icon } from "../utilities/Icon.js";
-import { IconButton } from "../buttons/IconButton.js";
-import { SecretField } from "../inputs/SecretField.js";
-import { Select } from "../inputs/Select.js";
-import { Spinner } from "../feedback/Spinner.js";
-import { StatusPill } from "../display/StatusPill.js";
-import { Switch } from "../inputs/Switch.js";
-import { TestRow } from "./TestRow.js";
-const AX_INTEGRATION_CSS = `
-.s-overlay { position: fixed; inset: 0; z-index: 100; display: flex; animation: s-fade var(--dur-2) var(--ease-out) both; }
-.s-modal { position: relative; flex: 1; display: flex; flex-direction: column; min-height: 0;
-  background: var(--surface-page); animation: s-rise var(--dur-3) var(--ease-out) both; }
-@keyframes s-fade { from { opacity: 0; } to { opacity: 1; } }
-@keyframes s-rise { from { opacity: 0; transform: translateY(10px) scale(0.994); } to { opacity: 1; transform: none; } }
-@media (prefers-reduced-motion: reduce) { .s-overlay, .s-modal { animation: none; } }
-
-.s-modal__bar { flex: none; display: flex; align-items: center; gap: 16px; height: 52px;
-  padding: 0 12px 0 18px; border-bottom: 1px solid var(--border-default); background: var(--surface-panel); }
-.s-modal__brand { display: flex; align-items: center; gap: 8px; }
-.s-modal__word { font-family: var(--font-mono); font-size: 15px; font-weight: 500; letter-spacing: -0.02em; color: var(--text-body); }
-.s-modal__div { color: var(--text-faint); }
-.s-modal__crumb { font-family: var(--font-mono); font-size: 13px; color: var(--text-body); }
-.s-modal__baractions { margin-left: auto; display: flex; align-items: center; gap: 12px; flex: none; }
-
-.s-modal__body { flex: 1; overflow-y: auto; min-height: 0; }
-.s-wrap { max-width: 768px; margin: 0 auto; padding: 40px 24px 48px; }
-
-.s-hero { margin-bottom: 28px; }
-.s-hero__kicker { color: var(--text-faint); margin-bottom: 12px; }
-.s-hero__h { font-family: var(--font-display); font-size: var(--text-2xl); font-weight: 500;
-  letter-spacing: var(--tracking-tight); line-height: var(--leading-tight); color: var(--text-body); margin: 0 0 10px; }
-.s-hero__p { font-size: var(--text-md); color: var(--text-muted); line-height: var(--leading-body); margin: 0; max-width: 62ch; }
-
-.s-ready { display: flex; align-items: center; gap: 14px; padding: 13px 16px; margin-bottom: 26px;
-  border: 1px solid var(--border-default); border-radius: var(--radius-3); background: var(--surface-panel); }
-.s-ready__steps { display: flex; align-items: center; gap: 7px; flex: none; }
-.s-ready__dot { width: 9px; height: 9px; border-radius: var(--radius-1); border: 1px solid var(--border-strong);
-  background: transparent; transition: background var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out); }
-.s-ready__dot.is-on { background: var(--ok); border-color: var(--ok); }
-.s-ready__txt { flex: 1; min-width: 0; font-size: var(--text-sm); color: var(--text-muted); }
-.s-ready__txt strong { color: var(--text-body); font-weight: 500; }
-.s-ready__count { font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-faint); letter-spacing: 0.04em; flex: none; }
-
-.s-cards { display: flex; flex-direction: column; gap: 18px; }
-.s-card { position: relative; background: var(--surface-card); border: 1px solid var(--border-default);
-  border-radius: var(--radius-3); overflow: hidden; transition: border-color var(--dur-2) var(--ease-out); }
-.s-card.is-ok { border-color: rgba(62, 207, 142, 0.4); }
-.s-card.is-error { border-color: rgba(229, 72, 77, 0.4); }
-.s-card__head { padding: 20px 24px 18px; }
-.s-card__toprow { display: flex; align-items: center; gap: 11px; margin-bottom: 15px; }
-.s-card__icon { flex: none; width: 30px; height: 30px; border-radius: var(--radius-2);
-  border: 1px solid var(--border-strong); background: var(--surface-raised); color: var(--text-body);
-  display: flex; align-items: center; justify-content: center; }
-.s-card__eyebrow { color: var(--text-faint); }
-.s-card__status { margin-left: auto; flex: none; }
-.s-card__title { font-family: var(--font-display); font-size: var(--text-xl); font-weight: 500;
-  letter-spacing: var(--tracking-tight); line-height: var(--leading-tight); color: var(--text-body); margin: 0; }
-.s-card__desc { font-size: var(--text-sm); color: var(--text-muted); line-height: var(--leading-snug); margin: 9px 0 0; max-width: 58ch; }
-.s-card__body { padding: 4px 24px 22px; display: flex; flex-direction: column; gap: 18px; }
-
-.s-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
-@media (max-width: 560px) { .s-row2 { grid-template-columns: 1fr; } }
-
-.s-lock { display: flex; align-items: flex-start; gap: 8px; font-size: var(--text-xs); color: var(--text-faint); line-height: var(--leading-snug); }
-.s-lock svg { flex: none; margin-top: 1px; color: var(--text-muted); }
-.s-lock strong { color: var(--text-muted); font-weight: 500; }
-
-.s-detect { display: flex; flex-direction: column; gap: 9px; padding: 13px 14px; border: 1px solid var(--border-default);
-  border-radius: var(--radius-2); background: var(--surface-page); }
-.s-detect__row { display: flex; align-items: center; gap: 10px; }
-.s-detect__k { font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--tracking-label); text-transform: uppercase;
-  color: var(--text-faint); width: 84px; flex: none; }
-.s-detect__v { font-family: var(--font-mono); font-size: var(--text-xs); color: var(--text-body); word-break: break-all; flex: 1; }
-.s-detect__ok { color: var(--ok); display: flex; align-items: center; gap: 5px; font-family: var(--font-mono); font-size: 10px;
-  letter-spacing: var(--tracking-label); text-transform: uppercase; flex: none; }
-
-.s-cap { display: flex; align-items: center; gap: 12px; padding-top: 4px; }
-.s-cap__field { display: flex; align-items: center; gap: 8px; }
-.s-cap__field .ax-input { width: 132px; }
-.s-cap.is-off { opacity: 0.5; }
-
-.s-map { width: 100%; border-collapse: collapse; font-size: var(--text-xs); }
-.s-map th { text-align: left; font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--tracking-label);
-  text-transform: uppercase; color: var(--text-faint); font-weight: 500; padding: 0 0 8px; }
-.s-map td { padding: 7px 0; border-top: 1px solid var(--border-default); color: var(--text-body); vertical-align: middle; }
-.s-map__from { color: var(--text-muted); }
-.s-map__arrow { width: 36px; color: var(--text-faint); }
-.s-map__col { font-family: var(--font-mono); }
-.s-map__tag { font-family: var(--font-mono); font-size: 9px; letter-spacing: var(--tracking-label); text-transform: uppercase;
-  color: var(--text-faint); border: 1px solid var(--border-default); border-radius: var(--radius-1); padding: 2px 5px; margin-left: 7px; }
-
-.s-sub { display: flex; align-items: center; gap: 8px; }
-.s-sub__line { flex: 1; height: 1px; background: var(--border-default); }
-
-.s-save { flex: none; border-top: 1px solid var(--border-default); background: var(--surface-panel); }
-.s-save__inner { max-width: 768px; margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; gap: 16px; }
-.s-save__status { flex: 1; min-width: 0; display: flex; align-items: center; gap: 9px; font-size: var(--text-sm); color: var(--text-muted); }
-.s-save__status svg { flex: none; }
-.s-save__actions { display: flex; align-items: center; gap: 8px; flex: none; }
-@media (max-width: 520px) { .s-wrap { padding: 24px 16px 36px; } .s-modal__baractions { gap: 6px; } }
-`;
-if (typeof document !== "undefined" && !document.getElementById("ax-integration-css")) {
-  const s = document.createElement("style");
-  s.id = "ax-integration-css";
-  s.textContent = AX_INTEGRATION_CSS;
-  document.head.appendChild(s);
-}
-const S_LS_KEY = "agentaily.integrations.v1";
-const s_sleep = (ms) => new Promise((r) => setTimeout(r, ms));
-function s_parseFeishu(url) {
-  if (!url) return null;
-  const tokenM = url.match(/\/base\/([A-Za-z0-9]+)/) || url.match(/[?&]app_token=([A-Za-z0-9]+)/);
-  const tableM = url.match(/[?&]table=([A-Za-z0-9]+)/);
-  if (!tokenM) return null;
-  return { token: tokenM[1], table: tableM ? tableM[1] : "" };
-}
-const S_FIELD_MAP = [
-  { from: "姓名", to: "姓名", tag: null },
-  { from: "手机号", to: "手机号", tag: null },
-  { from: "邮箱", to: "邮箱", tag: null },
-  { from: "报名场次", to: "场次", tag: "单选" },
-  { from: "备注", to: "备注", tag: null },
-  { from: null, to: "提交时间", tag: "自动" },
-  { from: null, to: "来源链接", tag: "自动" }
-];
-const S_DEFAULTS = {
-  dsKey: "",
-  dsModel: "deepseek-chat",
-  capOn: false,
-  cap: "200",
-  dsStatus: "idle",
-  dsResult: "",
-  appId: "",
-  secret: "",
-  link: "",
-  fsStatus: "idle",
-  fsResult: "",
-  saved: false
-};
-function s_normalize(raw) {
-  const r = raw || {};
-  return {
-    dsKey: r.dsKey || "",
-    dsModel: r.dsModel || "deepseek-chat",
-    capOn: !!r.capOn,
-    cap: r.cap || "200",
-    dsStatus: r.dsStatus === "ok" ? "ok" : "idle",
-    dsResult: r.dsResult || "",
-    appId: r.appId || "",
-    secret: r.secret || "",
-    link: r.link || "",
-    fsStatus: r.fsStatus === "ok" ? "ok" : "idle",
-    fsResult: r.fsResult || "",
-    saved: !!r.saved
-  };
-}
-function IntegrationSettings({
-  onClose,
-  showUsageCap = true,
-  storageKey = S_LS_KEY,
-  value,
-  onChange,
-  onSave,
-  onTest,
-  readiness,
-  masked
-}) {
-  const controlled = value !== void 0;
-  const load = () => {
-    try {
-      return JSON.parse(localStorage.getItem(storageKey)) || {};
-    } catch (e) {
-      return {};
-    }
-  };
-  const [localCfg, setLocalCfg] = useState(() => controlled ? S_DEFAULTS : s_normalize(load()));
-  const cfg = controlled ? { ...S_DEFAULTS, ...value } : localCfg;
-  const {
-    dsKey,
-    dsModel,
-    capOn,
-    cap,
-    dsStatus,
-    dsResult,
-    appId,
-    secret,
-    link,
-    fsStatus,
-    fsResult,
-    saved
-  } = cfg;
-  const cfgRef = useRef(cfg);
-  cfgRef.current = cfg;
-  const update = (partial) => {
-    if (controlled) {
-      if (onChange) onChange({ ...cfgRef.current, ...partial });
-    } else setLocalCfg((c) => ({ ...c, ...partial }));
-  };
-  const [dirty, setDirty] = useState(false);
-  const [saving, setSaving] = useState(false);
-  const [dsKeyEdited, setDsKeyEdited] = useState(false);
-  const [secretEdited, setSecretEdited] = useState(false);
-  useEffect(() => {
-    const onKey = (e) => {
-      if (e.key === "Escape") onClose && onClose();
-    };
-    window.addEventListener("keydown", onKey);
-    return () => window.removeEventListener("keydown", onKey);
-  }, [onClose]);
-  useEffect(() => {
-    if (controlled) return;
-    try {
-      localStorage.setItem(storageKey, JSON.stringify(localCfg));
-    } catch (e) {
-    }
-  }, [controlled, localCfg, storageKey]);
-  const parsed = s_parseFeishu(link);
-  const dsConnected = readiness ? !!readiness.deepseek : dsStatus === "ok";
-  const fsConnected = readiness ? !!readiness.feishu : fsStatus === "ok";
-  const dsPill = dsStatus === "testing" || dsStatus === "error" ? dsStatus : dsConnected ? "ok" : "idle";
-  const fsPill = fsStatus === "testing" || fsStatus === "error" ? fsStatus : fsConnected ? "ok" : "idle";
-  const readyCount = (dsConnected ? 1 : 0) + (fsConnected ? 1 : 0);
-  const allReady = dsConnected && fsConnected;
-  const maskedDs = !!(masked && masked.deepseek) && !dsKeyEdited;
-  const maskedFs = !!(masked && masked.feishu) && !secretEdited;
-  const setCfg = (partial) => {
-    update({ ...partial, saved: false });
-    setDirty(true);
-  };
-  const editDs = (key) => (v) => {
-    const patch = { [key]: v, saved: false };
-    if (cfgRef.current.dsStatus !== "idle") {
-      patch.dsStatus = "idle";
-      patch.dsResult = "";
-    }
-    update(patch);
-    setDirty(true);
-  };
-  const editFs = (key) => (v) => {
-    const patch = { [key]: v, saved: false };
-    if (cfgRef.current.fsStatus !== "idle") {
-      patch.fsStatus = "idle";
-      patch.fsResult = "";
-    }
-    update(patch);
-    setDirty(true);
-  };
-  const editDsKey = (v) => {
-    if (!dsKeyEdited) setDsKeyEdited(true);
-    editDs("dsKey")(v);
-  };
-  const editSecret = (v) => {
-    if (!secretEdited) setSecretEdited(true);
-    editFs("secret")(v);
-  };
-  const setTest = (which, status, result, finalize) => {
-    const patch = which === "deepseek" ? { dsStatus: status, dsResult: result } : { fsStatus: status, fsResult: result };
-    if (finalize) patch.saved = false;
-    update(patch);
-    if (finalize) setDirty(true);
-  };
-  const builtinTest = async (which) => {
-    if (which === "deepseek") {
-      setTest("deepseek", "testing", "", false);
-      await s_sleep(1300);
-      const k = cfgRef.current.dsKey.trim();
-      if (k.startsWith("sk-") && k.length >= 20)
-        setTest("deepseek", "ok", `连接正常 · 延迟 0.4s · ${cfgRef.current.dsModel}`, true);
-      else
-        setTest(
-          "deepseek",
-          "error",
-          k ? "密钥无效或额度不足，请核对后重试" : "请先填写 API Key",
-          true
-        );
-    } else {
-      setTest("feishu", "testing", "", false);
-      await s_sleep(1500);
-      const c = cfgRef.current;
-      const p = s_parseFeishu(c.link);
-      if (!c.appId.trim() || !c.secret.trim())
-        return setTest("feishu", "error", "缺少 App ID 或 App Secret", true);
-      if (!p) return setTest("feishu", "error", "无法识别多维表格链接，请粘贴完整 URL", true);
-      if (!p.table) return setTest("feishu", "error", "链接缺少数据表 (table) 参数", true);
-      setTest("feishu", "ok", "已连接 ·「报名登记表」· 检测到 6 个字段", true);
-    }
-  };
-  const runTest = async (which) => {
-    if (onTest) {
-      setTest(which, "testing", "", false);
-      try {
-        const res = await onTest(which);
-        const ok = !!(res && res.ok);
-        setTest(
-          which,
-          ok ? "ok" : "error",
-          res && res.message || (ok ? "连接正常" : "连接失败"),
-          true
-        );
-      } catch (e) {
-        setTest(which, "error", e && e.message || "测试失败", true);
-      }
-      return;
-    }
-    builtinTest(which);
-  };
-  const afterSaved = () => {
-    setDirty(false);
-    setDsKeyEdited(false);
-    setSecretEdited(false);
-  };
-  const doSave = async () => {
-    if (onSave) {
-      setSaving(true);
-      try {
-        await onSave(cfgRef.current);
-        update({ saved: true });
-        afterSaved();
-      } catch (e) {
-      } finally {
-        setSaving(false);
-      }
-    } else {
-      update({ saved: true });
-      afterSaved();
-    }
-  };
-  const onDiscard = () => {
-    setDsKeyEdited(false);
-    setSecretEdited(false);
-    setDirty(false);
-    if (controlled) return;
-    setLocalCfg(s_normalize(load()));
-  };
-  return /* @__PURE__ */ jsx("div", { className: "s-overlay", role: "dialog", "aria-modal": "true", "aria-label": "集成设置", children: /* @__PURE__ */ jsxs("div", { className: "s-modal", children: [
-    /* @__PURE__ */ jsxs("header", { className: "s-modal__bar", children: [
-      /* @__PURE__ */ jsxs("div", { className: "s-modal__brand", children: [
-        /* @__PURE__ */ jsx(BrandMark, { size: 16 }),
-        /* @__PURE__ */ jsx("span", { className: "s-modal__word", children: "agentaily" }),
-        /* @__PURE__ */ jsx("span", { className: "s-modal__div", children: "/" }),
-        /* @__PURE__ */ jsx("span", { className: "s-modal__crumb", children: "集成设置" })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "s-modal__baractions", children: [
-        /* @__PURE__ */ jsx(Badge, { variant: allReady ? "ok" : "neutral", dot: allReady, children: allReady ? "就绪" : "未就绪" }),
-        /* @__PURE__ */ jsx(IconButton, { label: "关闭", onClick: () => onClose && onClose(), children: /* @__PURE__ */ jsx(Icon, { name: "x", size: 16 }) })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx("main", { className: "s-modal__body", children: /* @__PURE__ */ jsxs("div", { className: "s-wrap", children: [
-      /* @__PURE__ */ jsxs("div", { className: "s-hero", children: [
-        /* @__PURE__ */ jsx("div", { className: "ax-label s-hero__kicker", children: "集成 · INTEGRATIONS" }),
-        /* @__PURE__ */ jsx("h1", { className: "s-hero__h", children: "连接你的服务" }),
-        /* @__PURE__ */ jsx("p", { className: "s-hero__p", children: "运行需要两条连接：一把驱动对话的 DeepSeek 密钥，和一张接收数据的飞书多维表格。两项都连通后即可发布。" })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "s-ready", children: [
-        /* @__PURE__ */ jsxs("div", { className: "s-ready__steps", children: [
-          /* @__PURE__ */ jsx("span", { className: "s-ready__dot" + (dsConnected ? " is-on" : "") }),
-          /* @__PURE__ */ jsx("span", { className: "s-ready__dot" + (fsConnected ? " is-on" : "") })
-        ] }),
-        /* @__PURE__ */ jsx("div", { className: "s-ready__txt", children: allReady ? /* @__PURE__ */ jsxs("span", { children: [
-          /* @__PURE__ */ jsx("strong", { children: "两项连接均已就绪。" }),
-          "保存后即可开始运行。"
-        ] }) : /* @__PURE__ */ jsxs("span", { children: [
-          "完成下方 ",
-          /* @__PURE__ */ jsx("strong", { children: "2 项" }),
-          " 连接后才能发布运行。"
-        ] }) }),
-        /* @__PURE__ */ jsxs("span", { className: "s-ready__count", children: [
-          readyCount,
-          " / 2"
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "s-cards", children: [
-        /* @__PURE__ */ jsxs(
-          "section",
-          {
-            className: "s-card" + (dsPill === "ok" ? " is-ok" : dsPill === "error" ? " is-error" : ""),
-            children: [
-              /* @__PURE__ */ jsxs("div", { className: "s-card__head", children: [
-                /* @__PURE__ */ jsxs("div", { className: "s-card__toprow", children: [
-                  /* @__PURE__ */ jsx("div", { className: "s-card__icon", children: /* @__PURE__ */ jsx(Icon, { name: "key", size: 16 }) }),
-                  /* @__PURE__ */ jsx("span", { className: "ax-label s-card__eyebrow", children: "对话引擎 · LLM" }),
-                  /* @__PURE__ */ jsx("span", { className: "s-card__status", children: /* @__PURE__ */ jsx(StatusPill, { status: dsPill }) })
-                ] }),
-                /* @__PURE__ */ jsx("h2", { className: "s-card__title", children: "DeepSeek" }),
-                /* @__PURE__ */ jsx("p", { className: "s-card__desc", children: "驱动对话式交互。用户发送的每一条消息，都通过这把密钥调用 DeepSeek 补全。" })
-              ] }),
-              /* @__PURE__ */ jsxs("div", { className: "s-card__body", children: [
-                /* @__PURE__ */ jsx(
-                  SecretField,
-                  {
-                    label: "API KEY",
-                    value: dsKey,
-                    onChange: editDsKey,
-                    placeholder: maskedDs ? "已保存 ········  ·  留空则保持不变" : "sk-xxxxxxxxxxxxxxxxxxxxxxxx",
-                    hint: maskedDs ? "已存密钥 · 留空表示不修改，输入新值即覆盖" : void 0,
-                    error: !maskedDs && dsStatus === "error" && !dsKey.trim() ? "此项必填" : void 0
-                  }
-                ),
-                /* @__PURE__ */ jsxs("div", { className: "s-lock", children: [
-                  /* @__PURE__ */ jsx(Icon, { name: "lock", size: 14 }),
-                  /* @__PURE__ */ jsxs("span", { children: [
-                    /* @__PURE__ */ jsx("strong", { children: "密钥加密存储" }),
-                    "，仅在服务端发起调用。用户",
-                    /* @__PURE__ */ jsx("strong", { children: "永远看不到、也拿不到这把密钥。" })
-                  ] })
-                ] }),
-                /* @__PURE__ */ jsx("div", { className: "s-row2", children: /* @__PURE__ */ jsxs("div", { children: [
-                  /* @__PURE__ */ jsx("label", { className: "s-field__label ax-label", children: "对话模型" }),
-                  /* @__PURE__ */ jsx(
-                    Select,
-                    {
-                      value: dsModel,
-                      onChange: (e) => editDs("dsModel")(e.target.value),
-                      options: [
-                        { value: "deepseek-chat", label: "deepseek-chat · 通用 · 快" },
-                        { value: "deepseek-reasoner", label: "deepseek-reasoner · 深度推理" }
-                      ]
-                    }
-                  )
-                ] }) }),
-                showUsageCap ? /* @__PURE__ */ jsxs(React.Fragment, { children: [
-                  /* @__PURE__ */ jsx(
-                    Alert,
-                    {
-                      variant: "warn",
-                      icon: /* @__PURE__ */ jsx(Icon, { name: "zap", size: 15 }),
-                      title: "用量由你承担",
-                      children: "每一轮对话消耗的都是你自己 DeepSeek 账户的额度。用得越多，调用越多——建议设置每月上限以防意外超支。"
-                    }
-                  ),
-                  /* @__PURE__ */ jsxs("div", { className: "s-cap" + (capOn ? "" : " is-off"), children: [
-                    /* @__PURE__ */ jsx(
-                      Switch,
-                      {
-                        label: "启用每月用量上限",
-                        checked: capOn,
-                        onChange: (e) => setCfg({ capOn: e.target.checked })
-                      }
-                    ),
-                    /* @__PURE__ */ jsxs("div", { className: "s-cap__field", style: { display: capOn ? "flex" : "none" }, children: [
-                      /* @__PURE__ */ jsx(
-                        "input",
-                        {
-                          className: "ax-input ax-input--mono",
-                          type: "text",
-                          inputMode: "numeric",
-                          value: cap,
-                          onChange: (e) => setCfg({ cap: e.target.value.replace(/[^0-9]/g, "") }),
-                          "aria-label": "每月上限（元）"
-                        }
-                      ),
-                      /* @__PURE__ */ jsx("span", { className: "s-field__hint", style: { margin: 0 }, children: "元 / 月，达到后暂停对话" })
-                    ] })
-                  ] })
-                ] }) : null,
-                /* @__PURE__ */ jsx(
-                  HelpSteps,
-                  {
-                    title: "如何获取 DeepSeek API Key？",
-                    steps: [
-                      /* @__PURE__ */ jsxs(Fragment, { children: [
-                        "登录 ",
-                        /* @__PURE__ */ jsx("code", { children: "platform.deepseek.com" }),
-                        "，进入「API Keys」页面。"
-                      ] }),
-                      /* @__PURE__ */ jsx(Fragment, { children: "点击「创建 API Key」，命名后立即复制——密钥只在创建时完整显示一次。" }),
-                      /* @__PURE__ */ jsx(Fragment, { children: "在「充值」中确认账户余额充足，对话才能持续调用。" }),
-                      /* @__PURE__ */ jsxs(Fragment, { children: [
-                        "把以 ",
-                        /* @__PURE__ */ jsx("code", { children: "sk-" }),
-                        " 开头的密钥粘贴到上方输入框。"
-                      ] })
-                    ],
-                    link: {
-                      href: "https://platform.deepseek.com",
-                      label: "打开 DeepSeek 开放平台"
-                    }
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsx(
-                TestRow,
-                {
-                  status: dsStatus,
-                  result: dsResult,
-                  onTest: () => runTest("deepseek"),
-                  disabled: !dsKey.trim() && !maskedDs,
-                  idleHint: "填写密钥后测试连通性"
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "section",
-          {
-            className: "s-card" + (fsPill === "ok" ? " is-ok" : fsPill === "error" ? " is-error" : ""),
-            children: [
-              /* @__PURE__ */ jsxs("div", { className: "s-card__head", children: [
-                /* @__PURE__ */ jsxs("div", { className: "s-card__toprow", children: [
-                  /* @__PURE__ */ jsx("div", { className: "s-card__icon", children: /* @__PURE__ */ jsx(Icon, { name: "table", size: 16 }) }),
-                  /* @__PURE__ */ jsx("span", { className: "ax-label s-card__eyebrow", children: "数据写入 · FEISHU BITABLE" }),
-                  /* @__PURE__ */ jsx("span", { className: "s-card__status", children: /* @__PURE__ */ jsx(StatusPill, { status: fsPill }) })
-                ] }),
-                /* @__PURE__ */ jsx("h2", { className: "s-card__title", children: "飞书多维表格" }),
-                /* @__PURE__ */ jsx("p", { className: "s-card__desc", children: "每次提交后，数据自动写入指定多维表格的一行。需要一个飞书自建应用的凭证，以及目标表格的链接。" })
-              ] }),
-              /* @__PURE__ */ jsxs("div", { className: "s-card__body", children: [
-                /* @__PURE__ */ jsxs("div", { className: "s-row2", children: [
-                  /* @__PURE__ */ jsxs("div", { children: [
-                    /* @__PURE__ */ jsx("label", { className: "s-field__label ax-label", children: "App ID" }),
-                    /* @__PURE__ */ jsx(
-                      "input",
-                      {
-                        className: "ax-input ax-input--mono",
-                        type: "text",
-                        value: appId,
-                        spellCheck: "false",
-                        placeholder: "cli_xxxxxxxxxxxx",
-                        onChange: (e) => editFs("appId")(e.target.value)
-                      }
-                    ),
-                    /* @__PURE__ */ jsx("p", { className: "s-field__hint", children: "应用标识，可公开。" })
-                  ] }),
-                  /* @__PURE__ */ jsx(
-                    SecretField,
-                    {
-                      label: "App Secret",
-                      value: secret,
-                      onChange: editSecret,
-                      placeholder: maskedFs ? "已保存 ········  ·  留空则保持不变" : "••••••••••••••••",
-                      hint: maskedFs ? "已存密钥 · 留空表示不修改" : "应用密钥，加密存储。"
-                    }
-                  )
-                ] }),
-                /* @__PURE__ */ jsxs("div", { children: [
-                  /* @__PURE__ */ jsx("label", { className: "s-field__label ax-label", children: "多维表格链接" }),
-                  /* @__PURE__ */ jsx(
-                    "input",
-                    {
-                      className: "ax-input",
-                      type: "text",
-                      value: link,
-                      spellCheck: "false",
-                      placeholder: "https://your-team.feishu.cn/base/bascn…?table=tbl…",
-                      onChange: (e) => editFs("link")(e.target.value)
-                    }
-                  ),
-                  /* @__PURE__ */ jsx("p", { className: "s-field__hint", children: "在多维表格右上角「分享」中复制链接粘贴即可，App Token 与数据表会自动识别。" })
-                ] }),
-                parsed ? /* @__PURE__ */ jsxs("div", { className: "s-detect", children: [
-                  /* @__PURE__ */ jsxs("div", { className: "s-detect__row", children: [
-                    /* @__PURE__ */ jsx("span", { className: "s-detect__k", children: "App Token" }),
-                    /* @__PURE__ */ jsx("span", { className: "s-detect__v", children: parsed.token }),
-                    /* @__PURE__ */ jsxs("span", { className: "s-detect__ok", children: [
-                      /* @__PURE__ */ jsx(Icon, { name: "check", size: 12 }),
-                      "已识别"
-                    ] })
-                  ] }),
-                  /* @__PURE__ */ jsxs("div", { className: "s-detect__row", children: [
-                    /* @__PURE__ */ jsx("span", { className: "s-detect__k", children: "数据表" }),
-                    /* @__PURE__ */ jsx("span", { className: "s-detect__v", children: parsed.table || "—" }),
-                    parsed.table ? /* @__PURE__ */ jsxs("span", { className: "s-detect__ok", children: [
-                      /* @__PURE__ */ jsx(Icon, { name: "check", size: 12 }),
-                      "已识别"
-                    ] }) : /* @__PURE__ */ jsxs("span", { className: "s-detect__ok", style: { color: "var(--warn)" }, children: [
-                      /* @__PURE__ */ jsx(Icon, { name: "warn", size: 12 }),
-                      "缺失"
-                    ] })
-                  ] })
-                ] }) : null,
-                /* @__PURE__ */ jsxs("div", { className: "s-lock", children: [
-                  /* @__PURE__ */ jsx(Icon, { name: "shield", size: 14 }),
-                  /* @__PURE__ */ jsxs("span", { children: [
-                    /* @__PURE__ */ jsx("strong", { children: "凭证加密存储" }),
-                    "，仅服务端用于写入数据。用户",
-                    /* @__PURE__ */ jsx("strong", { children: "无法接触你的飞书凭证或表格权限。" })
-                  ] })
-                ] }),
-                fsConnected ? /* @__PURE__ */ jsxs("div", { children: [
-                  /* @__PURE__ */ jsxs("div", { className: "s-sub", style: { marginBottom: 12 }, children: [
-                    /* @__PURE__ */ jsx("span", { className: "ax-label", children: "字段映射 · 自动" }),
-                    /* @__PURE__ */ jsx("span", { className: "s-sub__line" })
-                  ] }),
-                  /* @__PURE__ */ jsxs("table", { className: "s-map", children: [
-                    /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
-                      /* @__PURE__ */ jsx("th", { children: "字段" }),
-                      /* @__PURE__ */ jsx("th", { className: "s-map__arrow" }),
-                      /* @__PURE__ */ jsx("th", { children: "表格列" })
-                    ] }) }),
-                    /* @__PURE__ */ jsx("tbody", { children: S_FIELD_MAP.map((m, i) => /* @__PURE__ */ jsxs("tr", { children: [
-                      /* @__PURE__ */ jsx("td", { className: "s-map__from", children: m.from || /* @__PURE__ */ jsx("span", { style: { color: "var(--text-faint)" }, children: "—" }) }),
-                      /* @__PURE__ */ jsx("td", { className: "s-map__arrow", children: /* @__PURE__ */ jsx(Icon, { name: "arrow", size: 14 }) }),
-                      /* @__PURE__ */ jsxs("td", { children: [
-                        /* @__PURE__ */ jsx("span", { className: "s-map__col", children: m.to }),
-                        m.tag ? /* @__PURE__ */ jsx("span", { className: "s-map__tag", children: m.tag }) : null
-                      ] })
-                    ] }, i)) })
-                  ] })
-                ] }) : null,
-                /* @__PURE__ */ jsx(
-                  HelpSteps,
-                  {
-                    title: "如何获取飞书应用凭证？",
-                    steps: [
-                      /* @__PURE__ */ jsxs(Fragment, { children: [
-                        "打开飞书开放平台 ",
-                        /* @__PURE__ */ jsx("code", { children: "open.feishu.cn" }),
-                        "，创建一个「企业自建应用」。"
-                      ] }),
-                      /* @__PURE__ */ jsxs(Fragment, { children: [
-                        "在「凭证与基础信息」中复制 ",
-                        /* @__PURE__ */ jsx("code", { children: "App ID" }),
-                        " 与 ",
-                        /* @__PURE__ */ jsx("code", { children: "App Secret" }),
-                        "。"
-                      ] }),
-                      /* @__PURE__ */ jsxs(Fragment, { children: [
-                        "到「权限管理」开通多维表格读写权限 ",
-                        /* @__PURE__ */ jsx("code", { children: "bitable:app" }),
-                        "，并发布版本。"
-                      ] }),
-                      /* @__PURE__ */ jsxs(Fragment, { children: [
-                        "在目标多维表格里，把这个应用添加为",
-                        /* @__PURE__ */ jsx("strong", { children: "可编辑协作者" }),
-                        "。"
-                      ] }),
-                      /* @__PURE__ */ jsx(Fragment, { children: "复制该多维表格的分享链接，粘贴到上方「多维表格链接」。" })
-                    ],
-                    link: { href: "https://open.feishu.cn", label: "打开飞书开放平台" }
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsx(
-                TestRow,
-                {
-                  status: fsStatus,
-                  result: fsResult,
-                  onTest: () => runTest("feishu"),
-                  disabled: !appId.trim() || !secret.trim() && !maskedFs || !parsed,
-                  idleHint: "填写凭证与链接后测试写入权限"
-                }
-              )
-            ]
-          }
-        )
-      ] })
-    ] }) }),
-    /* @__PURE__ */ jsx("footer", { className: "s-save", children: /* @__PURE__ */ jsxs("div", { className: "s-save__inner", children: [
-      /* @__PURE__ */ jsx("div", { className: "s-save__status", children: !allReady ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Icon, { name: "info", size: 15, style: { color: "var(--text-faint)" } }),
-        /* @__PURE__ */ jsx("span", { children: "完成两项连接后即可保存并启用。" })
-      ] }) : saved ? /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Icon, { name: "check", size: 15, style: { color: "var(--ok)" } }),
-        /* @__PURE__ */ jsx("span", { children: "已保存 · 已启用对话与数据写入。" })
-      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(Icon, { name: "zap", size: 15, style: { color: "var(--text-muted)" } }),
-        /* @__PURE__ */ jsx("span", { children: "配置已就绪，保存后立即生效。" })
-      ] }) }),
-      /* @__PURE__ */ jsxs("div", { className: "s-save__actions", children: [
-        /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "md", disabled: !dirty, onClick: onDiscard, children: "放弃更改" }),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "primary",
-            size: "md",
-            icon: saving ? /* @__PURE__ */ jsx(Spinner, { size: "sm" }) : /* @__PURE__ */ jsx(Icon, { name: "save", size: 14 }),
-            disabled: !allReady || !dirty || saving,
-            "aria-busy": saving || void 0,
-            onClick: doSave,
-            children: "保存配置"
-          }
-        )
-      ] })
-    ] }) })
-  ] }) });
-}
-export {
-  IntegrationSettings
-};
-//# sourceMappingURL=IntegrationSettings.js.map