dishui 0.0.46 → 0.0.48

package/dist/components/pro/Flow/panels/DataInspectorSection.js

@@ -0,0 +1,436 @@
+import u from "../../../Button/index.js";
+import j from "../../../Input/index.js";
+import y from "../../../Label/index.js";
+import f from "../../../Select/index.js";
+import { DATA_CHART_PALETTE as w, applyCsvText as $, labelFor as z, makeDefaultDataConfig as E, matrixToTable as G, numericFields as W, parseCsv as X, parseDataFile as q, toCsv as J } from "../nodes/dataUtils.js";
+import { ExpandableTextarea as K } from "./ExpandableTextarea.js";
+import { useEffect as Q, useMemo as Z, useRef as O, useState as U } from "react";
+import { Fragment as N, jsx as s, jsxs as n } from "react/jsx-runtime";
+var ee = [
+  {
+    value: "string",
+    label: "文本"
+  },
+  {
+    value: "number",
+    label: "数值"
+  },
+  {
+    value: "date",
+    label: "日期"
+  },
+  {
+    value: "boolean",
+    label: "布尔"
+  }
+], le = [
+  {
+    value: "bar",
+    label: "柱状图"
+  },
+  {
+    value: "barHorizontal",
+    label: "横向柱状图"
+  },
+  {
+    value: "line",
+    label: "折线图"
+  },
+  {
+    value: "area",
+    label: "面积图"
+  },
+  {
+    value: "scatter",
+    label: "散点图"
+  },
+  {
+    value: "pie",
+    label: "饼图"
+  }
+], te = [
+  {
+    value: "top",
+    label: "上方"
+  },
+  {
+    value: "bottom",
+    label: "下方"
+  },
+  {
+    value: "left",
+    label: "左侧"
+  },
+  {
+    value: "right",
+    label: "右侧"
+  }
+], se = {
+  columns: [],
+  rows: [],
+  view: "table"
+};
+function ue({ node: h, onUpdateData: b }) {
+  const t = h.data.dataConfig ?? se, x = O(null), p = (e) => {
+    b(h.id, "dataConfig", {
+      ...t,
+      ...e
+    });
+  }, m = Z(() => J(t.columns, t.rows), [t.columns, t.rows]), [A, k] = U(m), g = O(m);
+  Q(() => {
+    m !== g.current && (g.current = m, k(m));
+  }, [m]);
+  const I = (e) => {
+    e !== g.current && (g.current = e, b(h.id, "dataConfig", $(t, e)));
+  }, V = async (e) => {
+    try {
+      const l = await q(e);
+      if (l.columns.length === 0) {
+        window.alert("未能从文件中解析出任何数据。");
+        return;
+      }
+      b(h.id, "dataConfig", E(l, e.name));
+    } catch (l) {
+      window.alert(`解析失败：${l?.message ?? l}`);
+    }
+  }, F = (e, l) => {
+    const o = t.columns.map((r, i) => i === e ? {
+      ...r,
+      ...l
+    } : r);
+    p({ columns: o });
+  }, D = () => {
+    const e = new Set(t.columns.map((v) => v.key));
+    let l = "col", o = 1;
+    for (; e.has(l); ) l = `col_${o++}`;
+    const r = [...t.columns, {
+      key: l,
+      label: l,
+      type: "string"
+    }], i = t.rows.map((v) => ({
+      ...v,
+      [l]: ""
+    }));
+    p({
+      columns: r,
+      rows: i
+    });
+  }, R = (e) => {
+    const l = t.columns[e], o = t.columns.filter((c, _) => _ !== e), r = t.rows.map((c) => {
+      const { [l.key]: _, ...Y } = c;
+      return Y;
+    }), i = t.chart ? {
+      ...t.chart,
+      xField: t.chart.xField === l.key ? o.find((c) => c.type !== "number")?.key ?? o[0]?.key : t.chart.xField,
+      yFields: (t.chart.yFields ?? []).filter((c) => c !== l.key)
+    } : t.chart, v = t.pivot ? {
+      ...t.pivot,
+      rowFields: t.pivot.rowFields.filter((c) => c !== l.key),
+      colFields: t.pivot.colFields.filter((c) => c !== l.key),
+      values: t.pivot.values.filter((c) => c.field !== l.key)
+    } : t.pivot;
+    p({
+      columns: o,
+      rows: r,
+      chart: i,
+      pivot: v
+    });
+  }, L = () => {
+    const e = window.prompt("粘贴 CSV 文本（第一行为表头）：");
+    if (!e) return;
+    const l = G(X(e));
+    if (l.columns.length === 0) {
+      window.alert("未能解析出数据。");
+      return;
+    }
+    b(h.id, "dataConfig", E(l));
+  }, T = W(t.columns), a = t.chart ?? { type: "bar" }, d = (e) => p({ chart: {
+    ...a,
+    ...e
+  } }), M = (e, l) => {
+    d({ seriesColors: {
+      ...a.seriesColors ?? {},
+      [e]: l
+    } });
+  }, B = (e) => {
+    const l = { ...a.seriesColors ?? {} };
+    delete l[e], d({ seriesColors: Object.keys(l).length ? l : void 0 });
+  }, S = a.palette?.length ? a.palette : w, H = (e, l) => {
+    const o = w.map((r, i) => i === e ? l : a.palette?.[i] ?? r);
+    d({ palette: o });
+  }, C = t.pivot ?? {
+    enabled: !1,
+    rowFields: [],
+    colFields: [],
+    values: []
+  }, P = (e) => p({ pivot: {
+    ...C,
+    ...e
+  } });
+  return /* @__PURE__ */ n("div", {
+    className: "flow-inspector-section",
+    children: [
+      /* @__PURE__ */ s("div", {
+        className: "flow-inspector-section-title",
+        children: "Data"
+      }),
+      /* @__PURE__ */ n("div", {
+        className: "flow-inspector-row",
+        children: [
+          /* @__PURE__ */ s("input", {
+            ref: x,
+            type: "file",
+            accept: ".csv,.tsv,.txt,.xlsx,.xlsm,text/csv",
+            hidden: !0,
+            onChange: (e) => {
+              const l = e.target.files?.[0];
+              e.target.value = "", l && V(l);
+            }
+          }),
+          /* @__PURE__ */ s(u, {
+            size: "xs",
+            variant: "neutral",
+            onClick: () => x.current?.click(),
+            children: "上传 CSV / Excel"
+          }),
+          /* @__PURE__ */ s(u, {
+            size: "xs",
+            variant: "ghost",
+            onClick: L,
+            children: "粘贴 CSV"
+          })
+        ]
+      }),
+      t.sourceName && /* @__PURE__ */ n("div", {
+        className: "flow-inspector-help",
+        children: ["来源：", t.sourceName]
+      }),
+      /* @__PURE__ */ n("div", {
+        className: "flow-inspector-row",
+        children: [/* @__PURE__ */ s(y, {
+          size: "xs",
+          className: "flow-inspector-label",
+          children: "视图"
+        }), /* @__PURE__ */ s(f, {
+          options: [{
+            value: "table",
+            label: "表格 / 透视"
+          }, {
+            value: "chart",
+            label: "图表"
+          }],
+          value: t.view,
+          onChange: (e) => p({ view: e })
+        })]
+      }),
+      /* @__PURE__ */ n("div", {
+        className: "flow-inspector-subtitle",
+        children: [
+          "列配置（",
+          t.columns.length,
+          "）"
+        ]
+      }),
+      t.columns.map((e, l) => /* @__PURE__ */ n("div", {
+        className: "flow-data-col-row",
+        children: [
+          /* @__PURE__ */ s(j, {
+            size: "xs",
+            value: e.label ?? e.key,
+            placeholder: "列名",
+            onChange: (o) => F(l, { label: o.target.value }),
+            className: "flex-1"
+          }),
+          /* @__PURE__ */ s(f, {
+            options: ee,
+            value: e.type,
+            onChange: (o) => F(l, { type: o })
+          }),
+          /* @__PURE__ */ s(u, {
+            size: "xs",
+            variant: "ghost",
+            onClick: () => R(l),
+            children: "✕"
+          })
+        ]
+      }, l)),
+      /* @__PURE__ */ s("div", {
+        className: "flow-inspector-row",
+        children: /* @__PURE__ */ s(u, {
+          size: "xs",
+          variant: "ghost",
+          onClick: D,
+          children: "+ 添加列"
+        })
+      }),
+      /* @__PURE__ */ n("div", {
+        className: "flow-inspector-subtitle",
+        children: [
+          "数据（CSV · ",
+          t.rows.length,
+          " 行）"
+        ]
+      }),
+      /* @__PURE__ */ s(K, {
+        label: "CSV 数据（首行为表头）",
+        value: A,
+        onChange: k,
+        onBlur: I,
+        rows: 8,
+        placeholder: `类别,数值
+A,30
+B,45`
+      }),
+      /* @__PURE__ */ s("div", {
+        className: "flow-inspector-help",
+        children: "直接编辑 CSV 文本，失焦或关闭全屏后生效。已有列的类型会保留。"
+      }),
+      t.view === "chart" && /* @__PURE__ */ n(N, { children: [
+        /* @__PURE__ */ s("div", {
+          className: "flow-inspector-subtitle",
+          children: "图表配置"
+        }),
+        /* @__PURE__ */ n("div", {
+          className: "flow-inspector-row",
+          children: [/* @__PURE__ */ s(y, {
+            size: "xs",
+            className: "flow-inspector-label",
+            children: "类型"
+          }), /* @__PURE__ */ s(f, {
+            options: le,
+            value: a.type,
+            onChange: (e) => d({ type: e })
+          })]
+        }),
+        /* @__PURE__ */ n("div", {
+          className: "flow-inspector-row",
+          children: [/* @__PURE__ */ s(y, {
+            size: "xs",
+            className: "flow-inspector-label",
+            children: a.type === "scatter" ? "X 字段" : "类别轴"
+          }), /* @__PURE__ */ s(f, {
+            options: t.columns.map((e) => ({
+              value: e.key,
+              label: e.label ?? e.key
+            })),
+            value: a.xField ?? "",
+            onChange: (e) => d({ xField: typeof e == "string" ? e : String(e) })
+          })]
+        }),
+        /* @__PURE__ */ s("div", {
+          className: "flow-inspector-subtitle-sm",
+          children: a.type === "scatter" || a.type === "pie" ? "数值字段" : "数值字段（可多选，多系列）"
+        }),
+        T.length === 0 && /* @__PURE__ */ s("div", {
+          className: "flow-inspector-help",
+          children: "没有数值列，请先将某列类型设为「数值」。"
+        }),
+        T.map((e) => {
+          const l = (a.yFields ?? []).includes(e), o = a.type === "scatter" || a.type === "pie";
+          return /* @__PURE__ */ n("label", {
+            className: "flow-data-field-toggle",
+            children: [/* @__PURE__ */ s("input", {
+              type: o ? "radio" : "checkbox",
+              className: o ? "radio radio-xs radio-primary" : "checkbox checkbox-xs checkbox-primary",
+              checked: l,
+              onChange: (r) => {
+                if (o) {
+                  d({ yFields: [e] });
+                  return;
+                }
+                const i = new Set(a.yFields ?? []);
+                r.target.checked ? i.add(e) : i.delete(e), d({ yFields: Array.from(i) });
+              }
+            }), /* @__PURE__ */ s("span", { children: z(t.columns, e) })]
+          }, e);
+        }),
+        (a.yFields ?? []).length > 0 && a.type !== "pie" && /* @__PURE__ */ n(N, { children: [/* @__PURE__ */ s("div", {
+          className: "flow-inspector-subtitle-sm",
+          children: "系列颜色"
+        }), (a.yFields ?? []).map((e, l) => {
+          const o = a.seriesColors?.[e] ?? w[l % w.length], r = !!a.seriesColors?.[e];
+          return /* @__PURE__ */ n("div", {
+            className: "flow-data-color-row",
+            children: [
+              /* @__PURE__ */ s("input", {
+                type: "color",
+                value: o,
+                onChange: (i) => M(e, i.target.value)
+              }),
+              /* @__PURE__ */ s("span", {
+                className: "flow-data-color-label",
+                children: z(t.columns, e)
+              }),
+              r && /* @__PURE__ */ s(u, {
+                size: "xs",
+                variant: "ghost",
+                onClick: () => B(e),
+                children: "重置"
+              })
+            ]
+          }, e);
+        })] }),
+        a.type === "pie" && /* @__PURE__ */ n(N, { children: [
+          /* @__PURE__ */ s("div", {
+            className: "flow-inspector-subtitle-sm",
+            children: "饼图配色"
+          }),
+          /* @__PURE__ */ s("div", {
+            className: "flow-data-palette",
+            children: w.map((e, l) => /* @__PURE__ */ s("input", {
+              type: "color",
+              value: S[l % S.length],
+              onChange: (o) => H(l, o.target.value)
+            }, l))
+          }),
+          a.palette && /* @__PURE__ */ s("div", {
+            className: "flow-inspector-row",
+            children: /* @__PURE__ */ s(u, {
+              size: "xs",
+              variant: "ghost",
+              onClick: () => d({ palette: void 0 }),
+              children: "重置为默认配色"
+            })
+          })
+        ] })
+      ] }),
+      t.view === "table" && /* @__PURE__ */ n(N, { children: [
+        /* @__PURE__ */ s("div", {
+          className: "flow-inspector-subtitle",
+          children: "透视（Pivot）"
+        }),
+        /* @__PURE__ */ n("label", {
+          className: "flow-data-field-toggle",
+          children: [/* @__PURE__ */ s("input", {
+            type: "checkbox",
+            className: "toggle toggle-xs toggle-primary",
+            checked: C.enabled,
+            onChange: (e) => P({ enabled: e.target.checked })
+          }), /* @__PURE__ */ s("span", { children: "开启透视模式" })]
+        }),
+        C.enabled && /* @__PURE__ */ n("div", {
+          className: "flow-inspector-row",
+          children: [/* @__PURE__ */ s(y, {
+            size: "xs",
+            className: "flow-inspector-label",
+            children: "面板位置"
+          }), /* @__PURE__ */ s(f, {
+            options: te,
+            value: C.panelPlacement ?? "top",
+            onChange: (e) => P({ panelPlacement: e })
+          })]
+        }),
+        /* @__PURE__ */ s("div", {
+          className: "flow-inspector-help",
+          children: "透视的行/列/度量可在画布节点内的透视面板上交互拖拽调整。"
+        })
+      ] })
+    ]
+  });
+}
+export {
+  ue as DataInspectorSection,
+  ue as default
+};
+
+//# sourceMappingURL=DataInspectorSection.js.map

package/dist/components/pro/Flow/panels/DataInspectorSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataInspectorSection.js","names":[],"sources":["../../../../../src/components/pro/Flow/panels/DataInspectorSection.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState } from 'react';\nimport Input from '../../../Input';\nimport Select from '../../../Select';\nimport Button from '../../../Button';\nimport Label from '../../../Label';\nimport { ExpandableTextarea } from './ExpandableTextarea';\nimport type {\n  FlowNode,\n  FlowDataConfig,\n  FlowDataColumn,\n  FlowDataColumnType,\n  FlowDataChartType,\n  FlowDataView,\n  FlowDataPivotPanelPlacement,\n} from '../types';\nimport {\n  parseDataFile,\n  parseCsv,\n  matrixToTable,\n  makeDefaultDataConfig,\n  applyCsvText,\n  toCsv,\n  numericFields,\n  labelFor,\n  DATA_CHART_PALETTE,\n} from '../nodes/dataUtils';\n\nconst COLUMN_TYPE_OPTIONS: Array<{ value: FlowDataColumnType; label: string }> = [\n  { value: 'string', label: '文本' },\n  { value: 'number', label: '数值' },\n  { value: 'date', label: '日期' },\n  { value: 'boolean', label: '布尔' },\n];\n\nconst CHART_TYPE_OPTIONS: Array<{ value: FlowDataChartType; label: string }> = [\n  { value: 'bar', label: '柱状图' },\n  { value: 'barHorizontal', label: '横向柱状图' },\n  { value: 'line', label: '折线图' },\n  { value: 'area', label: '面积图' },\n  { value: 'scatter', label: '散点图' },\n  { value: 'pie', label: '饼图' },\n];\n\nconst PIVOT_PLACEMENT_OPTIONS: Array<{ value: FlowDataPivotPanelPlacement; label: string }> = [\n  { value: 'top', label: '上方' },\n  { value: 'bottom', label: '下方' },\n  { value: 'left', label: '左侧' },\n  { value: 'right', label: '右侧' },\n];\n\nconst EMPTY_CONFIG: FlowDataConfig = { columns: [], rows: [], view: 'table' };\n\n/**\n * Inspector controls for a Data node: upload CSV/Excel, edit columns, edit rows\n * as CSV text (with fullscreen), and configure the table (pivot) or chart view.\n */\nexport function DataInspectorSection({\n  node,\n  onUpdateData,\n}: {\n  node: FlowNode;\n  onUpdateData: (id: string, key: string, value: any) => void;\n}) {\n  const config = node.data.dataConfig ?? EMPTY_CONFIG;\n  const fileInputRef = useRef<HTMLInputElement>(null);\n\n  const update = (patch: Partial<FlowDataConfig>) => {\n    onUpdateData(node.id, 'dataConfig', { ...config, ...patch });\n  };\n\n  // ── CSV text editing (local draft, committed on blur) ────────────────────\n  // The textarea edits a CSV serialization of columns+rows. We keep a local\n  // draft so typing isn't interrupted by re-parsing; the parse (which re-infers\n  // nothing for known columns and preserves chart/pivot field refs) runs once\n  // on blur / fullscreen close. When the config changes externally (upload,\n  // paste), the draft is re-synced.\n  const csvText = useMemo(() => toCsv(config.columns, config.rows), [config.columns, config.rows]);\n  const [csvDraft, setCsvDraft] = useState(csvText);\n  const lastCommitted = useRef(csvText);\n  useEffect(() => {\n    if (csvText !== lastCommitted.current) {\n      lastCommitted.current = csvText;\n      setCsvDraft(csvText);\n    }\n  }, [csvText]);\n\n  const commitCsv = (text: string) => {\n    if (text === lastCommitted.current) return;\n    lastCommitted.current = text;\n    onUpdateData(node.id, 'dataConfig', applyCsvText(config, text));\n  };\n\n  // ── File upload ────────────────────────────────────────────────────────\n  const handleFile = async (file: File) => {\n    try {\n      const parsed = await parseDataFile(file);\n      if (parsed.columns.length === 0) {\n        window.alert('未能从文件中解析出任何数据。');\n        return;\n      }\n      onUpdateData(node.id, 'dataConfig', makeDefaultDataConfig(parsed, file.name));\n    } catch (e: any) {\n      window.alert(`解析失败：${e?.message ?? e}`);\n    }\n  };\n\n  // ── Column editing ─────────────────────────────────────────────────────\n  const setColumn = (index: number, patch: Partial<FlowDataColumn>) => {\n    const columns = config.columns.map((c, i) => (i === index ? { ...c, ...patch } : c));\n    update({ columns });\n  };\n\n  const addColumn = () => {\n    const used = new Set(config.columns.map((c) => c.key));\n    let key = 'col';\n    let n = 1;\n    while (used.has(key)) key = `col_${n++}`;\n    const columns: FlowDataColumn[] = [...config.columns, { key, label: key, type: 'string' }];\n    // pad existing rows with an empty value for the new column\n    const rows = config.rows.map((r) => ({ ...r, [key]: '' }));\n    update({ columns, rows });\n  };\n\n  const removeColumn = (index: number) => {\n    const col = config.columns[index];\n    const columns = config.columns.filter((_, i) => i !== index);\n    const rows = config.rows.map((r) => {\n      const { [col.key]: _drop, ...rest } = r;\n      return rest;\n    });\n    // prune chart/pivot references to the removed column\n    const chart = config.chart\n      ? {\n          ...config.chart,\n          xField: config.chart.xField === col.key ? columns.find((c) => c.type !== 'number')?.key ?? columns[0]?.key : config.chart.xField,\n          yFields: (config.chart.yFields ?? []).filter((f) => f !== col.key),\n        }\n      : config.chart;\n    const pivot = config.pivot\n      ? {\n          ...config.pivot,\n          rowFields: config.pivot.rowFields.filter((f) => f !== col.key),\n          colFields: config.pivot.colFields.filter((f) => f !== col.key),\n          values: config.pivot.values.filter((v) => v.field !== col.key),\n        }\n      : config.pivot;\n    update({ columns, rows, chart, pivot });\n  };\n\n  // ── Paste CSV (replace whole table) ─────────────────────────────────────\n  const pasteCsv = () => {\n    const text = window.prompt('粘贴 CSV 文本（第一行为表头）：');\n    if (!text) return;\n    const parsed = matrixToTable(parseCsv(text));\n    if (parsed.columns.length === 0) {\n      window.alert('未能解析出数据。');\n      return;\n    }\n    onUpdateData(node.id, 'dataConfig', makeDefaultDataConfig(parsed));\n  };\n\n  const nums = numericFields(config.columns);\n  const chart = config.chart ?? { type: 'bar' as FlowDataChartType };\n  const setChart = (patch: Partial<typeof chart>) => update({ chart: { ...chart, ...patch } });\n\n  const setSeriesColor = (field: string, color: string) => {\n    setChart({ seriesColors: { ...(chart.seriesColors ?? {}), [field]: color } });\n  };\n  const resetSeriesColor = (field: string) => {\n    const next = { ...(chart.seriesColors ?? {}) };\n    delete next[field];\n    setChart({ seriesColors: Object.keys(next).length ? next : undefined });\n  };\n\n  const palette = chart.palette?.length ? chart.palette : DATA_CHART_PALETTE;\n  const setPaletteColor = (i: number, color: string) => {\n    const next = DATA_CHART_PALETTE.map((c, j) => (j === i ? color : (chart.palette?.[j] ?? c)));\n    setChart({ palette: next });\n  };\n\n  const pivot = config.pivot ?? { enabled: false, rowFields: [], colFields: [], values: [] };\n  const setPivot = (patch: Partial<typeof pivot>) => update({ pivot: { ...pivot, ...patch } });\n\n  return (\n    <div className=\"flow-inspector-section\">\n      <div className=\"flow-inspector-section-title\">Data</div>\n\n      {/* Import controls */}\n      <div className=\"flow-inspector-row\">\n        <input\n          ref={fileInputRef}\n          type=\"file\"\n          accept=\".csv,.tsv,.txt,.xlsx,.xlsm,text/csv\"\n          hidden\n          onChange={(e) => {\n            const file = e.target.files?.[0];\n            e.target.value = '';\n            if (file) void handleFile(file);\n          }}\n        />\n        <Button size=\"xs\" variant=\"neutral\" onClick={() => fileInputRef.current?.click()}>\n          上传 CSV / Excel\n        </Button>\n        <Button size=\"xs\" variant=\"ghost\" onClick={pasteCsv}>\n          粘贴 CSV\n        </Button>\n      </div>\n      {config.sourceName && (\n        <div className=\"flow-inspector-help\">来源：{config.sourceName}</div>\n      )}\n\n      {/* View toggle */}\n      <div className=\"flow-inspector-row\">\n        <Label size=\"xs\" className=\"flow-inspector-label\">视图</Label>\n        <Select\n          options={[\n            { value: 'table', label: '表格 / 透视' },\n            { value: 'chart', label: '图表' },\n          ]}\n          value={config.view}\n          onChange={(v) => update({ view: v as FlowDataView })}\n        />\n      </div>\n\n      {/* Columns editor */}\n      <div className=\"flow-inspector-subtitle\">列配置（{config.columns.length}）</div>\n      {config.columns.map((col, i) => (\n        <div key={i} className=\"flow-data-col-row\">\n          <Input\n            size=\"xs\"\n            value={col.label ?? col.key}\n            placeholder=\"列名\"\n            onChange={(e) => setColumn(i, { label: e.target.value })}\n            className=\"flex-1\"\n          />\n          <Select\n            options={COLUMN_TYPE_OPTIONS}\n            value={col.type}\n            onChange={(v) => setColumn(i, { type: v as FlowDataColumnType })}\n          />\n          <Button size=\"xs\" variant=\"ghost\" onClick={() => removeColumn(i)}>\n            ✕\n          </Button>\n        </div>\n      ))}\n      <div className=\"flow-inspector-row\">\n        <Button size=\"xs\" variant=\"ghost\" onClick={addColumn}>+ 添加列</Button>\n      </div>\n\n      {/* Rows editor: CSV text with fullscreen */}\n      <div className=\"flow-inspector-subtitle\">数据（CSV · {config.rows.length} 行）</div>\n      <ExpandableTextarea\n        label=\"CSV 数据（首行为表头）\"\n        value={csvDraft}\n        onChange={setCsvDraft}\n        onBlur={commitCsv}\n        rows={8}\n        placeholder=\"类别,数值&#10;A,30&#10;B,45\"\n      />\n      <div className=\"flow-inspector-help\">\n        直接编辑 CSV 文本，失焦或关闭全屏后生效。已有列的类型会保留。\n      </div>\n\n      {/* Chart config */}\n      {config.view === 'chart' && (\n        <>\n          <div className=\"flow-inspector-subtitle\">图表配置</div>\n          <div className=\"flow-inspector-row\">\n            <Label size=\"xs\" className=\"flow-inspector-label\">类型</Label>\n            <Select\n              options={CHART_TYPE_OPTIONS}\n              value={chart.type}\n              onChange={(v) => setChart({ type: v as FlowDataChartType })}\n            />\n          </div>\n          <div className=\"flow-inspector-row\">\n            <Label size=\"xs\" className=\"flow-inspector-label\">\n              {chart.type === 'scatter' ? 'X 字段' : '类别轴'}\n            </Label>\n            <Select\n              options={config.columns.map((c) => ({ value: c.key, label: c.label ?? c.key }))}\n              value={chart.xField ?? ''}\n              onChange={(v) => setChart({ xField: typeof v === 'string' ? v : String(v) })}\n            />\n          </div>\n          <div className=\"flow-inspector-subtitle-sm\">\n            {chart.type === 'scatter' || chart.type === 'pie' ? '数值字段' : '数值字段（可多选，多系列）'}\n          </div>\n          {nums.length === 0 && (\n            <div className=\"flow-inspector-help\">没有数值列，请先将某列类型设为「数值」。</div>\n          )}\n          {nums.map((f) => {\n            const selected = (chart.yFields ?? []).includes(f);\n            const single = chart.type === 'scatter' || chart.type === 'pie';\n            return (\n              <label key={f} className=\"flow-data-field-toggle\">\n                <input\n                  type={single ? 'radio' : 'checkbox'}\n                  className={single ? 'radio radio-xs radio-primary' : 'checkbox checkbox-xs checkbox-primary'}\n                  checked={selected}\n                  onChange={(e) => {\n                    if (single) {\n                      setChart({ yFields: [f] });\n                      return;\n                    }\n                    const current = new Set(chart.yFields ?? []);\n                    if (e.target.checked) current.add(f);\n                    else current.delete(f);\n                    setChart({ yFields: Array.from(current) });\n                  }}\n                />\n                <span>{labelFor(config.columns, f)}</span>\n              </label>\n            );\n          })}\n\n          {/* Chart colors */}\n          {(chart.yFields ?? []).length > 0 && chart.type !== 'pie' && (\n            <>\n              <div className=\"flow-inspector-subtitle-sm\">系列颜色</div>\n              {(chart.yFields ?? []).map((f, i) => {\n                const color = chart.seriesColors?.[f] ?? DATA_CHART_PALETTE[i % DATA_CHART_PALETTE.length];\n                const overridden = !!chart.seriesColors?.[f];\n                return (\n                  <div key={f} className=\"flow-data-color-row\">\n                    <input\n                      type=\"color\"\n                      value={color}\n                      onChange={(e) => setSeriesColor(f, e.target.value)}\n                    />\n                    <span className=\"flow-data-color-label\">{labelFor(config.columns, f)}</span>\n                    {overridden && (\n                      <Button size=\"xs\" variant=\"ghost\" onClick={() => resetSeriesColor(f)}>\n                        重置\n                      </Button>\n                    )}\n                  </div>\n                );\n              })}\n            </>\n          )}\n          {chart.type === 'pie' && (\n            <>\n              <div className=\"flow-inspector-subtitle-sm\">饼图配色</div>\n              <div className=\"flow-data-palette\">\n                {DATA_CHART_PALETTE.map((_, i) => (\n                  <input\n                    key={i}\n                    type=\"color\"\n                    value={palette[i % palette.length]}\n                    onChange={(e) => setPaletteColor(i, e.target.value)}\n                  />\n                ))}\n              </div>\n              {chart.palette && (\n                <div className=\"flow-inspector-row\">\n                  <Button size=\"xs\" variant=\"ghost\" onClick={() => setChart({ palette: undefined })}>\n                    重置为默认配色\n                  </Button>\n                </div>\n              )}\n            </>\n          )}\n        </>\n      )}\n\n      {/* Pivot config */}\n      {config.view === 'table' && (\n        <>\n          <div className=\"flow-inspector-subtitle\">透视（Pivot）</div>\n          <label className=\"flow-data-field-toggle\">\n            <input\n              type=\"checkbox\"\n              className=\"toggle toggle-xs toggle-primary\"\n              checked={pivot.enabled}\n              onChange={(e) => setPivot({ enabled: e.target.checked })}\n            />\n            <span>开启透视模式</span>\n          </label>\n          {pivot.enabled && (\n            <div className=\"flow-inspector-row\">\n              <Label size=\"xs\" className=\"flow-inspector-label\">面板位置</Label>\n              <Select\n                options={PIVOT_PLACEMENT_OPTIONS}\n                value={pivot.panelPlacement ?? 'top'}\n                onChange={(v) => setPivot({ panelPlacement: v as FlowDataPivotPanelPlacement })}\n              />\n            </div>\n          )}\n          <div className=\"flow-inspector-help\">\n            透视的行/列/度量可在画布节点内的透视面板上交互拖拽调整。\n          </div>\n        </>\n      )}\n    </div>\n  );\n}\n\nexport default DataInspectorSection;\n"],"mappings":";;;;;;;;AA2BA,IAAM,KAA2E;AAAA,EAC/E;AAAA,IAAE,OAAO;AAAA,IAAU,OAAO;AAAA,EAAK;AAAA,EAC/B;AAAA,IAAE,OAAO;AAAA,IAAU,OAAO;AAAA,EAAK;AAAA,EAC/B;AAAA,IAAE,OAAO;AAAA,IAAQ,OAAO;AAAA,EAAK;AAAA,EAC7B;AAAA,IAAE,OAAO;AAAA,IAAW,OAAO;AAAA,EAAK;AAClC,GAEM,KAAyE;AAAA,EAC7E;AAAA,IAAE,OAAO;AAAA,IAAO,OAAO;AAAA,EAAM;AAAA,EAC7B;AAAA,IAAE,OAAO;AAAA,IAAiB,OAAO;AAAA,EAAQ;AAAA,EACzC;AAAA,IAAE,OAAO;AAAA,IAAQ,OAAO;AAAA,EAAM;AAAA,EAC9B;AAAA,IAAE,OAAO;AAAA,IAAQ,OAAO;AAAA,EAAM;AAAA,EAC9B;AAAA,IAAE,OAAO;AAAA,IAAW,OAAO;AAAA,EAAM;AAAA,EACjC;AAAA,IAAE,OAAO;AAAA,IAAO,OAAO;AAAA,EAAK;AAC9B,GAEM,KAAwF;AAAA,EAC5F;AAAA,IAAE,OAAO;AAAA,IAAO,OAAO;AAAA,EAAK;AAAA,EAC5B;AAAA,IAAE,OAAO;AAAA,IAAU,OAAO;AAAA,EAAK;AAAA,EAC/B;AAAA,IAAE,OAAO;AAAA,IAAQ,OAAO;AAAA,EAAK;AAAA,EAC7B;AAAA,IAAE,OAAO;AAAA,IAAS,OAAO;AAAA,EAAK;AAChC,GAEM,KAA+B;AAAA,EAAE,SAAS,CAAC;AAAA,EAAG,MAAM,CAAC;AAAA,EAAG,MAAM;AAAQ;AAM5E,SAAgB,GAAqB,EACnC,MAAA,GACA,cAAA,EAAA,GAIC;AACD,QAAM,IAAS,EAAK,KAAK,cAAc,IACjC,IAAe,EAAyB,IAAI,GAE5C,IAAA,CAAU,MAAmC;AACjD,IAAA,EAAa,EAAK,IAAI,cAAc;AAAA,MAAE,GAAG;AAAA,MAAQ,GAAG;AAAA,IAAM,CAAC;AAAA,EAC7D,GAQM,IAAU,EAAA,MAAc,EAAM,EAAO,SAAS,EAAO,IAAI,GAAG,CAAC,EAAO,SAAS,EAAO,IAAI,CAAC,GACzF,CAAC,GAAU,CAAA,IAAe,EAAS,CAAO,GAC1C,IAAgB,EAAO,CAAO;AACpC,EAAA,EAAA,MAAgB;AACd,IAAI,MAAY,EAAc,YAC5B,EAAc,UAAU,GACxB,EAAY,CAAO;AAAA,EAEvB,GAAG,CAAC,CAAO,CAAC;AAEZ,QAAM,IAAA,CAAa,MAAiB;AAClC,IAAI,MAAS,EAAc,YAC3B,EAAc,UAAU,GACxB,EAAa,EAAK,IAAI,cAAc,EAAa,GAAQ,CAAI,CAAC;AAAA,EAChE,GAGM,IAAa,OAAO,MAAe;AACvC,QAAI;AACF,YAAM,IAAS,MAAM,EAAc,CAAI;AACvC,UAAI,EAAO,QAAQ,WAAW,GAAG;AAC/B,eAAO,MAAM,gBAAgB;AAC7B;AAAA,MACF;AACA,MAAA,EAAa,EAAK,IAAI,cAAc,EAAsB,GAAQ,EAAK,IAAI,CAAC;AAAA,IAC9E,SAAS,GAAQ;AACf,aAAO,MAAM,QAAQ,GAAG,WAAW,CAAA,EAAG;AAAA,IACxC;AAAA,EACF,GAGM,IAAA,CAAa,GAAe,MAAmC;AACnE,UAAM,IAAU,EAAO,QAAQ,IAAA,CAAK,GAAG,MAAO,MAAM,IAAQ;AAAA,MAAE,GAAG;AAAA,MAAG,GAAG;AAAA,IAAM,IAAI,CAAE;AACnF,IAAA,EAAO,EAAE,SAAA,EAAQ,CAAC;AAAA,EACpB,GAEM,IAAA,MAAkB;AACtB,UAAM,IAAO,IAAI,IAAI,EAAO,QAAQ,IAAA,CAAK,MAAM,EAAE,GAAG,CAAC;AACrD,QAAI,IAAM,OACN,IAAI;AACR,WAAO,EAAK,IAAI,CAAG,IAAG,CAAA,IAAM,OAAO,GAAA;AACnC,UAAM,IAA4B,CAAC,GAAG,EAAO,SAAS;AAAA,MAAE,KAAA;AAAA,MAAK,OAAO;AAAA,MAAK,MAAM;AAAA,IAAS,CAAC,GAEnF,IAAO,EAAO,KAAK,IAAA,CAAK,OAAO;AAAA,MAAE,GAAG;AAAA,OAAI,CAAA,GAAM;AAAA,IAAG,EAAE;AACzD,IAAA,EAAO;AAAA,MAAE,SAAA;AAAA,MAAS,MAAA;AAAA,IAAK,CAAC;AAAA,EAC1B,GAEM,IAAA,CAAgB,MAAkB;AACtC,UAAM,IAAM,EAAO,QAAQ,CAAA,GACrB,IAAU,EAAO,QAAQ,OAAA,CAAQ,GAAG,MAAM,MAAM,CAAK,GACrD,IAAO,EAAO,KAAK,IAAA,CAAK,MAAM;AAClC,YAAM,EAAA,CAAG,EAAI,GAAA,GAAM,GAAO,GAAG,EAAA,IAAS;AACtC,aAAO;AAAA,IACT,CAAC,GAEK,IAAQ,EAAO,QACjB;AAAA,MACE,GAAG,EAAO;AAAA,MACV,QAAQ,EAAO,MAAM,WAAW,EAAI,MAAM,EAAQ,KAAA,CAAM,MAAM,EAAE,SAAS,QAAQ,GAAG,OAAO,EAAQ,CAAA,GAAI,MAAM,EAAO,MAAM;AAAA,MAC1H,UAAU,EAAO,MAAM,WAAW,CAAC,GAAG,OAAA,CAAQ,MAAM,MAAM,EAAI,GAAG;AAAA,IACnE,IACA,EAAO,OACL,IAAQ,EAAO,QACjB;AAAA,MACE,GAAG,EAAO;AAAA,MACV,WAAW,EAAO,MAAM,UAAU,OAAA,CAAQ,MAAM,MAAM,EAAI,GAAG;AAAA,MAC7D,WAAW,EAAO,MAAM,UAAU,OAAA,CAAQ,MAAM,MAAM,EAAI,GAAG;AAAA,MAC7D,QAAQ,EAAO,MAAM,OAAO,OAAA,CAAQ,MAAM,EAAE,UAAU,EAAI,GAAG;AAAA,IAC/D,IACA,EAAO;AACX,IAAA,EAAO;AAAA,MAAE,SAAA;AAAA,MAAS,MAAA;AAAA,MAAM,OAAA;AAAA,MAAO,OAAA;AAAA,IAAM,CAAC;AAAA,EACxC,GAGM,IAAA,MAAiB;AACrB,UAAM,IAAO,OAAO,OAAO,oBAAoB;AAC/C,QAAI,CAAC,EAAM;AACX,UAAM,IAAS,EAAc,EAAS,CAAI,CAAC;AAC3C,QAAI,EAAO,QAAQ,WAAW,GAAG;AAC/B,aAAO,MAAM,UAAU;AACvB;AAAA,IACF;AACA,IAAA,EAAa,EAAK,IAAI,cAAc,EAAsB,CAAM,CAAC;AAAA,EACnE,GAEM,IAAO,EAAc,EAAO,OAAO,GACnC,IAAQ,EAAO,SAAS,EAAE,MAAM,MAA2B,GAC3D,IAAA,CAAY,MAAiC,EAAO,EAAE,OAAO;AAAA,IAAE,GAAG;AAAA,IAAO,GAAG;AAAA,EAAM,EAAE,CAAC,GAErF,IAAA,CAAkB,GAAe,MAAkB;AACvD,IAAA,EAAS,EAAE,cAAc;AAAA,MAAE,GAAI,EAAM,gBAAgB,CAAC;AAAA,OAAK,CAAA,GAAQ;AAAA,IAAM,EAAE,CAAC;AAAA,EAC9E,GACM,IAAA,CAAoB,MAAkB;AAC1C,UAAM,IAAO,EAAE,GAAI,EAAM,gBAAgB,CAAC,EAAG;AAC7C,WAAO,EAAK,CAAA,GACZ,EAAS,EAAE,cAAc,OAAO,KAAK,CAAI,EAAE,SAAS,IAAO,OAAU,CAAC;AAAA,EACxE,GAEM,IAAU,EAAM,SAAS,SAAS,EAAM,UAAU,GAClD,IAAA,CAAmB,GAAW,MAAkB;AACpD,UAAM,IAAO,EAAmB,IAAA,CAAK,GAAG,MAAO,MAAM,IAAI,IAAS,EAAM,UAAU,CAAA,KAAM,CAAG;AAC3F,IAAA,EAAS,EAAE,SAAS,EAAK,CAAC;AAAA,EAC5B,GAEM,IAAQ,EAAO,SAAS;AAAA,IAAE,SAAS;AAAA,IAAO,WAAW,CAAC;AAAA,IAAG,WAAW,CAAC;AAAA,IAAG,QAAQ,CAAC;AAAA,EAAE,GACnF,IAAA,CAAY,MAAiC,EAAO,EAAE,OAAO;AAAA,IAAE,GAAG;AAAA,IAAO,GAAG;AAAA,EAAM,EAAE,CAAC;AAE3F,SACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,cAAf;AAAA,MACE,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAA+B;AAAA,MAAS,CAAA;AAAA,MAGvD,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf;AAAA,UACE,gBAAA,EAAC,SAAD;AAAA,YACE,KAAK;AAAA,YACL,MAAK;AAAA,YACL,QAAO;AAAA,YACP,QAAA;AAAA,YACA,UAAA,CAAW,MAAM;AACf,oBAAM,IAAO,EAAE,OAAO,QAAQ,CAAA;AAC9B,gBAAE,OAAO,QAAQ,IACb,KAAM,EAAgB,CAAI;AAAA,YAChC;AAAA,UACD,CAAA;AAAA,UACD,gBAAA,EAAC,GAAD;AAAA,YAAQ,MAAK;AAAA,YAAK,SAAQ;AAAA,YAAU,SAAA,MAAe,EAAa,SAAS,MAAM;AAAA,sBAAG;AAAA,UAE1E,CAAA;AAAA,UACR,gBAAA,EAAC,GAAD;AAAA,YAAQ,MAAK;AAAA,YAAK,SAAQ;AAAA,YAAQ,SAAS;AAAA,sBAAU;AAAA,UAE7C,CAAA;AAAA,QACL;AAAA;MACJ,EAAO,cACN,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf,CAAqC,OAAI,EAAO,UAAgB;AAAA;MAIlE,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf,CACE,gBAAA,EAAC,GAAD;AAAA,UAAO,MAAK;AAAA,UAAK,WAAU;AAAA,oBAAuB;AAAA,QAAS,CAAA,GAC3D,gBAAA,EAAC,GAAD;AAAA,UACE,SAAS,CACP;AAAA,YAAE,OAAO;AAAA,YAAS,OAAO;AAAA,UAAU,GACnC;AAAA,YAAE,OAAO;AAAA,YAAS,OAAO;AAAA,UAAK,CAChC;AAAA,UACA,OAAO,EAAO;AAAA,UACd,UAAA,CAAW,MAAM,EAAO,EAAE,MAAM,EAAkB,CAAC;AAAA,QACpD,CAAA,CACE;AAAA;MAGL,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf;AAAA,UAAyC;AAAA,UAAK,EAAO,QAAQ;AAAA,UAAO;AAAA,QAAM;AAAA;MACzE,EAAO,QAAQ,IAAA,CAAK,GAAK,MACxB,gBAAA,EAAC,OAAD;AAAA,QAAa,WAAU;AAAA,kBAAvB;AAAA,UACE,gBAAA,EAAC,GAAD;AAAA,YACE,MAAK;AAAA,YACL,OAAO,EAAI,SAAS,EAAI;AAAA,YACxB,aAAY;AAAA,YACZ,UAAA,CAAW,MAAM,EAAU,GAAG,EAAE,OAAO,EAAE,OAAO,MAAM,CAAC;AAAA,YACvD,WAAU;AAAA,UACX,CAAA;AAAA,UACD,gBAAA,EAAC,GAAD;AAAA,YACE,SAAS;AAAA,YACT,OAAO,EAAI;AAAA,YACX,UAAA,CAAW,MAAM,EAAU,GAAG,EAAE,MAAM,EAAwB,CAAC;AAAA,UAChE,CAAA;AAAA,UACD,gBAAA,EAAC,GAAD;AAAA,YAAQ,MAAK;AAAA,YAAK,SAAQ;AAAA,YAAQ,SAAA,MAAe,EAAa,CAAC;AAAA,sBAAG;AAAA,UAE1D,CAAA;AAAA,QACL;AAAA,SAhBK,CAgBL,CACN;AAAA,MACD,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBACb,gBAAA,EAAC,GAAD;AAAA,UAAQ,MAAK;AAAA,UAAK,SAAQ;AAAA,UAAQ,SAAS;AAAA,oBAAW;AAAA,QAAa,CAAA;AAAA,MAChE,CAAA;AAAA,MAGL,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf;AAAA,UAAyC;AAAA,UAAU,EAAO,KAAK;AAAA,UAAO;AAAA,QAAQ;AAAA;MAC9E,gBAAA,EAAC,GAAD;AAAA,QACE,OAAM;AAAA,QACN,OAAO;AAAA,QACP,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,aAAY;AAAA;AAAA;AAAA,MACb,CAAA;AAAA,MACD,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAsB;AAAA,MAEhC,CAAA;AAAA,MAGJ,EAAO,SAAS,WACf,gBAAA,EAAA,GAAA,EAAA,UAAA;AAAA,QACE,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAA0B;AAAA,QAAS,CAAA;AAAA,QAClD,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAAf,CACE,gBAAA,EAAC,GAAD;AAAA,YAAO,MAAK;AAAA,YAAK,WAAU;AAAA,sBAAuB;AAAA,UAAS,CAAA,GAC3D,gBAAA,EAAC,GAAD;AAAA,YACE,SAAS;AAAA,YACT,OAAO,EAAM;AAAA,YACb,UAAA,CAAW,MAAM,EAAS,EAAE,MAAM,EAAuB,CAAC;AAAA,UAC3D,CAAA,CACE;AAAA;QACL,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAAf,CACE,gBAAA,EAAC,GAAD;AAAA,YAAO,MAAK;AAAA,YAAK,WAAU;AAAA,sBACxB,EAAM,SAAS,YAAY,SAAS;AAAA,UAChC,CAAA,GACP,gBAAA,EAAC,GAAD;AAAA,YACE,SAAS,EAAO,QAAQ,IAAA,CAAK,OAAO;AAAA,cAAE,OAAO,EAAE;AAAA,cAAK,OAAO,EAAE,SAAS,EAAE;AAAA,YAAI,EAAE;AAAA,YAC9E,OAAO,EAAM,UAAU;AAAA,YACvB,UAAA,CAAW,MAAM,EAAS,EAAE,QAAQ,OAAO,KAAM,WAAW,IAAI,OAAO,CAAC,EAAE,CAAC;AAAA,UAC5E,CAAA,CACE;AAAA;QACL,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBACZ,EAAM,SAAS,aAAa,EAAM,SAAS,QAAQ,SAAS;AAAA,QAC1D,CAAA;AAAA,QACJ,EAAK,WAAW,KACf,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAAsB;AAAA,QAAyB,CAAA;AAAA,QAE/D,EAAK,IAAA,CAAK,MAAM;AACf,gBAAM,KAAY,EAAM,WAAW,CAAC,GAAG,SAAS,CAAC,GAC3C,IAAS,EAAM,SAAS,aAAa,EAAM,SAAS;AAC1D,iBACE,gBAAA,EAAC,SAAD;AAAA,YAAe,WAAU;AAAA,sBAAzB,CACE,gBAAA,EAAC,SAAD;AAAA,cACE,MAAM,IAAS,UAAU;AAAA,cACzB,WAAW,IAAS,iCAAiC;AAAA,cACrD,SAAS;AAAA,cACT,UAAA,CAAW,MAAM;AACf,oBAAI,GAAQ;AACV,kBAAA,EAAS,EAAE,SAAS,CAAC,CAAC,EAAE,CAAC;AACzB;AAAA,gBACF;AACA,sBAAM,IAAU,IAAI,IAAI,EAAM,WAAW,CAAC,CAAC;AAC3C,gBAAI,EAAE,OAAO,UAAS,EAAQ,IAAI,CAAC,IAC9B,EAAQ,OAAO,CAAC,GACrB,EAAS,EAAE,SAAS,MAAM,KAAK,CAAO,EAAE,CAAC;AAAA,cAC3C;AAAA,YACD,CAAA,GACD,gBAAA,EAAC,QAAD,EAAA,UAAO,EAAS,EAAO,SAAS,CAAC,EAAQ,CAAA,CACpC;AAAA,aAjBK,CAiBL;AAAA,QAEX,CAAC;AAAA,SAGC,EAAM,WAAW,CAAC,GAAG,SAAS,KAAK,EAAM,SAAS,SAClD,gBAAA,EAAA,GAAA,EAAA,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAA6B;AAAA,QAAS,CAAA,IACnD,EAAM,WAAW,CAAC,GAAG,IAAA,CAAK,GAAG,MAAM;AACnC,gBAAM,IAAQ,EAAM,eAAe,CAAA,KAAM,EAAmB,IAAI,EAAmB,MAAA,GAC7E,IAAa,CAAC,CAAC,EAAM,eAAe,CAAA;AAC1C,iBACE,gBAAA,EAAC,OAAD;AAAA,YAAa,WAAU;AAAA,sBAAvB;AAAA,cACE,gBAAA,EAAC,SAAD;AAAA,gBACE,MAAK;AAAA,gBACL,OAAO;AAAA,gBACP,UAAA,CAAW,MAAM,EAAe,GAAG,EAAE,OAAO,KAAK;AAAA,cAClD,CAAA;AAAA,cACD,gBAAA,EAAC,QAAD;AAAA,gBAAM,WAAU;AAAA,0BAAyB,EAAS,EAAO,SAAS,CAAC;AAAA,cAAQ,CAAA;AAAA,cAC1E,KACC,gBAAA,EAAC,GAAD;AAAA,gBAAQ,MAAK;AAAA,gBAAK,SAAQ;AAAA,gBAAQ,SAAA,MAAe,EAAiB,CAAC;AAAA,0BAAG;AAAA,cAE9D,CAAA;AAAA,YAEP;AAAA,aAZK,CAYL;AAAA,QAET,CAAC,CACD,EAAA,CAAA;AAAA,QAEH,EAAM,SAAS,SACd,gBAAA,EAAA,GAAA,EAAA,UAAA;AAAA,UACE,gBAAA,EAAC,OAAD;AAAA,YAAK,WAAU;AAAA,sBAA6B;AAAA,UAAS,CAAA;AAAA,UACrD,gBAAA,EAAC,OAAD;AAAA,YAAK,WAAU;AAAA,sBACZ,EAAmB,IAAA,CAAK,GAAG,MAC1B,gBAAA,EAAC,SAAD;AAAA,cAEE,MAAK;AAAA,cACL,OAAO,EAAQ,IAAI,EAAQ,MAAA;AAAA,cAC3B,UAAA,CAAW,MAAM,EAAgB,GAAG,EAAE,OAAO,KAAK;AAAA,YACnD,GAJM,CAIN,CACF;AAAA,UACE,CAAA;AAAA,UACJ,EAAM,WACL,gBAAA,EAAC,OAAD;AAAA,YAAK,WAAU;AAAA,sBACb,gBAAA,EAAC,GAAD;AAAA,cAAQ,MAAK;AAAA,cAAK,SAAQ;AAAA,cAAQ,SAAA,MAAe,EAAS,EAAE,SAAS,OAAU,CAAC;AAAA,wBAAG;AAAA,YAE3E,CAAA;AAAA,UACL,CAAA;AAAA,QAEP,EAAA,CAAA;AAAA,MAEJ,EAAA,CAAA;AAAA,MAIH,EAAO,SAAS,WACf,gBAAA,EAAA,GAAA,EAAA,UAAA;AAAA,QACE,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAA0B;AAAA,QAAc,CAAA;AAAA,QACvD,gBAAA,EAAC,SAAD;AAAA,UAAO,WAAU;AAAA,oBAAjB,CACE,gBAAA,EAAC,SAAD;AAAA,YACE,MAAK;AAAA,YACL,WAAU;AAAA,YACV,SAAS,EAAM;AAAA,YACf,UAAA,CAAW,MAAM,EAAS,EAAE,SAAS,EAAE,OAAO,QAAQ,CAAC;AAAA,UACxD,CAAA,GACD,gBAAA,EAAC,QAAD,EAAA,UAAM,SAAY,CAAA,CACb;AAAA;QACN,EAAM,WACL,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAAf,CACE,gBAAA,EAAC,GAAD;AAAA,YAAO,MAAK;AAAA,YAAK,WAAU;AAAA,sBAAuB;AAAA,UAAW,CAAA,GAC7D,gBAAA,EAAC,GAAD;AAAA,YACE,SAAS;AAAA,YACT,OAAO,EAAM,kBAAkB;AAAA,YAC/B,UAAA,CAAW,MAAM,EAAS,EAAE,gBAAgB,EAAiC,CAAC;AAAA,UAC/E,CAAA,CACE;AAAA;QAEP,gBAAA,EAAC,OAAD;AAAA,UAAK,WAAU;AAAA,oBAAsB;AAAA,QAEhC,CAAA;AAAA,MACL,EAAA,CAAA;AAAA,IAED;AAAA;AAET"}

package/dist/components/pro/Flow/panels/ExpandableTextarea.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+/**
+ * Textarea with a "fullscreen" expand button. The fullscreen overlay edits the
+ * same value; `onBlur`/`onDone` let callers commit expensive parses only when
+ * editing finishes instead of on every keystroke.
+ */
+export declare function ExpandableTextarea({ label, value, onChange, onBlur, rows, placeholder, }: {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    /** Called when the inline textarea loses focus or fullscreen is closed. */
+    onBlur?: (value: string) => void;
+    rows: number;
+    placeholder?: string;
+}): React.JSX.Element;
+export default ExpandableTextarea;

package/dist/components/pro/Flow/panels/ExpandableTextarea.js

@@ -0,0 +1,65 @@
+import c from "../../../Button/index.js";
+import p from "../../../Label/index.js";
+import { useState as u } from "react";
+import { Fragment as h, jsx as e, jsxs as a } from "react/jsx-runtime";
+function v({ label: l, value: r, onChange: s, onBlur: i, rows: d, placeholder: o }) {
+  const [f, n] = u(!1), m = () => {
+    n(!1), i?.(r);
+  };
+  return /* @__PURE__ */ a(h, { children: [/* @__PURE__ */ a("div", {
+    className: "flow-inspector-row flow-inspector-multiline",
+    children: [/* @__PURE__ */ a("div", {
+      className: "flow-inspector-field-heading",
+      children: [/* @__PURE__ */ e(p, {
+        size: "xs",
+        className: "flow-inspector-label",
+        children: l
+      }), /* @__PURE__ */ e(c, {
+        size: "xs",
+        variant: "ghost",
+        square: !0,
+        onClick: () => n(!0),
+        children: /* @__PURE__ */ e("span", {
+          "aria-label": "全屏编辑",
+          title: "全屏编辑",
+          children: "↗"
+        })
+      })]
+    }), /* @__PURE__ */ e("textarea", {
+      className: "flow-inspector-textarea",
+      value: r,
+      placeholder: o,
+      onChange: (t) => s(t.target.value),
+      onBlur: () => i?.(r),
+      rows: d,
+      spellCheck: !1
+    })]
+  }), f && /* @__PURE__ */ a("div", {
+    className: "flow-editor-fullscreen",
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-label": `${l} 全屏编辑`,
+    children: [/* @__PURE__ */ a("div", {
+      className: "flow-editor-fullscreen-header",
+      children: [/* @__PURE__ */ e("strong", { children: l }), /* @__PURE__ */ e(c, {
+        size: "sm",
+        variant: "ghost",
+        onClick: m,
+        children: "完成"
+      })]
+    }), /* @__PURE__ */ e("textarea", {
+      className: "flow-inspector-textarea flow-editor-fullscreen-input",
+      value: r,
+      placeholder: o,
+      onChange: (t) => s(t.target.value),
+      spellCheck: !1,
+      autoFocus: !0
+    })]
+  })] });
+}
+export {
+  v as ExpandableTextarea,
+  v as default
+};
+
+//# sourceMappingURL=ExpandableTextarea.js.map

package/dist/components/pro/Flow/panels/ExpandableTextarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpandableTextarea.js","names":[],"sources":["../../../../../src/components/pro/Flow/panels/ExpandableTextarea.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport Button from '../../../Button';\nimport Label from '../../../Label';\n\n/**\n * Textarea with a \"fullscreen\" expand button. The fullscreen overlay edits the\n * same value; `onBlur`/`onDone` let callers commit expensive parses only when\n * editing finishes instead of on every keystroke.\n */\nexport function ExpandableTextarea({\n  label,\n  value,\n  onChange,\n  onBlur,\n  rows,\n  placeholder,\n}: {\n  label: string;\n  value: string;\n  onChange: (value: string) => void;\n  /** Called when the inline textarea loses focus or fullscreen is closed. */\n  onBlur?: (value: string) => void;\n  rows: number;\n  placeholder?: string;\n}) {\n  const [expanded, setExpanded] = useState(false);\n\n  const closeFullscreen = () => {\n    setExpanded(false);\n    onBlur?.(value);\n  };\n\n  return (\n    <>\n      <div className=\"flow-inspector-row flow-inspector-multiline\">\n        <div className=\"flow-inspector-field-heading\">\n          <Label size=\"xs\" className=\"flow-inspector-label\">{label}</Label>\n          <Button size=\"xs\" variant=\"ghost\" square onClick={() => setExpanded(true)}>\n            <span aria-label=\"全屏编辑\" title=\"全屏编辑\">↗</span>\n          </Button>\n        </div>\n        <textarea\n          className=\"flow-inspector-textarea\"\n          value={value}\n          placeholder={placeholder}\n          onChange={(event) => onChange(event.target.value)}\n          onBlur={() => onBlur?.(value)}\n          rows={rows}\n          spellCheck={false}\n        />\n      </div>\n      {expanded && (\n        <div className=\"flow-editor-fullscreen\" role=\"dialog\" aria-modal=\"true\" aria-label={`${label} 全屏编辑`}>\n          <div className=\"flow-editor-fullscreen-header\">\n            <strong>{label}</strong>\n            <Button size=\"sm\" variant=\"ghost\" onClick={closeFullscreen}>完成</Button>\n          </div>\n          <textarea\n            className=\"flow-inspector-textarea flow-editor-fullscreen-input\"\n            value={value}\n            placeholder={placeholder}\n            onChange={(event) => onChange(event.target.value)}\n            spellCheck={false}\n            autoFocus\n          />\n        </div>\n      )}\n    </>\n  );\n}\n\nexport default ExpandableTextarea;\n"],"mappings":";;;;AASA,SAAgB,EAAmB,EACjC,OAAA,GACA,OAAA,GACA,UAAA,GACA,QAAA,GACA,MAAA,GACA,aAAA,EAAA,GASC;AACD,QAAM,CAAC,GAAU,CAAA,IAAe,EAAS,EAAK,GAExC,IAAA,MAAwB;AAC5B,IAAA,EAAY,EAAK,GACjB,IAAS,CAAK;AAAA,EAChB;AAEA,SACE,gBAAA,EAAA,GAAA,EAAA,UAAA,CACE,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,cAAf,CACE,gBAAA,EAAC,OAAD;AAAA,MAAK,WAAU;AAAA,gBAAf,CACE,gBAAA,EAAC,GAAD;AAAA,QAAO,MAAK;AAAA,QAAK,WAAU;AAAA,kBAAwB;AAAA,MAAa,CAAA,GAChE,gBAAA,EAAC,GAAD;AAAA,QAAQ,MAAK;AAAA,QAAK,SAAQ;AAAA,QAAQ,QAAA;AAAA,QAAO,SAAA,MAAe,EAAY,EAAI;AAAA,kBACtE,gBAAA,EAAC,QAAD;AAAA,UAAM,cAAW;AAAA,UAAO,OAAM;AAAA,oBAAO;AAAA,QAAO,CAAA;AAAA,MACtC,CAAA,CACL;AAAA,QACL,gBAAA,EAAC,YAAD;AAAA,MACE,WAAU;AAAA,MACH,OAAA;AAAA,MACM,aAAA;AAAA,MACb,UAAA,CAAW,MAAU,EAAS,EAAM,OAAO,KAAK;AAAA,MAChD,QAAA,MAAc,IAAS,CAAK;AAAA,MACtB,MAAA;AAAA,MACN,YAAY;AAAA,IACb,CAAA,CACE;AAAA,MACJ,KACC,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,IAAyB,MAAK;AAAA,IAAS,cAAW;AAAA,IAAO,cAAY,GAAG,CAAA;AAAA,cAAvF,CACE,gBAAA,EAAC,OAAD;AAAA,MAAK,WAAU;AAAA,gBAAf,CACE,gBAAA,EAAC,UAAD,EAAA,UAAS,EAAc,CAAA,GACvB,gBAAA,EAAC,GAAD;AAAA,QAAQ,MAAK;AAAA,QAAK,SAAQ;AAAA,QAAQ,SAAS;AAAA,kBAAiB;AAAA,MAAU,CAAA,CACnE;AAAA,QACL,gBAAA,EAAC,YAAD;AAAA,MACE,WAAU;AAAA,MACH,OAAA;AAAA,MACM,aAAA;AAAA,MACb,UAAA,CAAW,MAAU,EAAS,EAAM,OAAO,KAAK;AAAA,MAChD,YAAY;AAAA,MACZ,WAAA;AAAA,IACD,CAAA,CACE;AAAA,IAEP,EAAA,CAAA;AAEN"}