dishui 0.0.64 → 0.0.66

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

@@ -1,1810 +1,1804 @@
-import g from "../../../Button/index.js";
-import b from "../../../Input/index.js";
+import e from "../../../Button/index.js";
+import t from "../../../Input/index.js";
 import n from "../../../Label/index.js";
-import W from "../../../Checkbox/index.js";
-import y from "../../../Select/index.js";
-import { BORDER_STYLE_OPTIONS as le, DEFAULT_NODE_DATA as te, EDGE_LINE_STYLE_OPTIONS as J, EDGE_MARKER_OPTIONS as Z, EDGE_TYPE_OPTIONS as se } from "../constants.js";
-import { useFlowContext as ie } from "../context/FlowContext.js";
-import { useFlowUI as ae } from "../context/FlowUIContext.js";
-import { COMMON_COLORS as H, THEME_SYNC_TOKEN as oe, isThemeToken as ne, resolveThemeColor as re, themeTokenCssVar as ce } from "../utils/themeColor.js";
-import { BORDER_SIDE_NAMES as de, BORDER_SIDE_TYPES as he, hasBorderSideOverrides as pe } from "../nodes/shapes.js";
-import { generateId as me } from "../nodes/nodeUtils.js";
-import { SVG_ICON_CATEGORIES as fe, buildSvgMarkup as ue, getAllSvgIcons as ve, getSvgIcon as $, getSvgIconsByCategory as we } from "../nodes/svgIcons.js";
-import { COMPONENT_STYLES as R } from "../archify/palette.js";
-import { ARCHIFY_COMPONENT_LABELS as _, ARCHIFY_COMPONENT_ORDER as j, archifyStylePatch as V } from "../archify/presets.js";
-import { useDraggablePanel as be } from "../hooks/useDraggablePanel.js";
-import { useResizablePanel as ge } from "../hooks/useResizablePanel.js";
-import { FLOW_NODE_TYPES as Ne } from "../types.js";
-import { ExpandableTextarea as K } from "./ExpandableTextarea.js";
-import { DataInspectorSection as xe } from "./DataInspectorSection.js";
-import { useMemo as A, useRef as ye, useState as ze } from "react";
-import { Fragment as E, jsx as e, jsxs as s } from "react/jsx-runtime";
-function Ue() {
-  const { showInspector: l } = ae(), { panelStyle: c, handleProps: a } = be(), { panelWidth: o, resizeHandleProps: f } = ge("left", 240);
-  return l ? /* @__PURE__ */ s("div", {
-    className: "flow-inspector",
-    "data-flow-panel": !0,
-    style: {
-      ...c,
-      width: o
-    },
-    children: [
-      /* @__PURE__ */ e("div", {
-        className: "flow-panel-resize-handle flow-panel-resize-handle--left",
-        ...f
-      }),
-      /* @__PURE__ */ e("div", {
-        className: "flow-panel-drag-handle",
-        ...a,
-        style: {
-          fontSize: 11,
-          fontWeight: 600,
-          marginBottom: 8,
-          color: "color-mix(in oklch, var(--color-base-content) 50%, transparent)",
-          textTransform: "uppercase",
-          letterSpacing: "0.05em",
-          cursor: "grab"
-        },
-        children: "Inspector"
-      }),
-      /* @__PURE__ */ e("div", {
-        className: "flow-inspector-content",
-        children: /* @__PURE__ */ e(Ce, {})
-      })
-    ]
-  }) : null;
+import r from "../../../Checkbox/index.js";
+import i from "../../../Select/index.js";
+import { BORDER_STYLE_OPTIONS as a, DEFAULT_NODE_DATA as o, EDGE_LINE_STYLE_OPTIONS as s, EDGE_MARKER_OPTIONS as c, EDGE_TYPE_OPTIONS as l } from "../constants.js";
+import { useFlowContext as u } from "../context/FlowContext.js";
+import { useFlowUI as d } from "../context/FlowUIContext.js";
+import { COMMON_COLORS as f, THEME_SYNC_TOKEN as p, isThemeToken as m, resolveThemeColor as h, themeTokenCssVar as g } from "../utils/themeColor.js";
+import { BORDER_SIDE_NAMES as _, BORDER_SIDE_TYPES as v, hasBorderSideOverrides as y } from "../nodes/shapes.js";
+import { generateId as b } from "../nodes/nodeUtils.js";
+import { SVG_ICON_CATEGORIES as x, buildSvgMarkup as S, getAllSvgIcons as C, getSvgIcon as w, getSvgIconsByCategory as T } from "../nodes/svgIcons.js";
+import { COMPONENT_STYLES as E } from "../archify/palette.js";
+import { ARCHIFY_COMPONENT_LABELS as D, ARCHIFY_COMPONENT_ORDER as O, archifyStylePatch as k } from "../archify/presets.js";
+import { useDraggablePanel as A } from "../hooks/useDraggablePanel.js";
+import { useResizablePanel as j } from "../hooks/useResizablePanel.js";
+import { FLOW_NODE_TYPES as M } from "../types.js";
+import { ExpandableTextarea as N } from "./ExpandableTextarea.js";
+import { DataInspectorSection as P } from "./DataInspectorSection.js";
+import { useMemo as F, useRef as I, useState as L } from "react";
+import { Fragment as R, jsx as z, jsxs as B } from "react/jsx-runtime";
+//#region src/components/pro/Flow/panels/InspectorPanel.tsx
+function V() {
+	let { showInspector: e } = d(), { panelStyle: t, handleProps: n } = A(), { panelWidth: r, resizeHandleProps: i } = j("left", 240);
+	return e ? /* @__PURE__ */ B("div", {
+		className: "flow-inspector",
+		"data-flow-panel": !0,
+		style: {
+			...t,
+			width: r
+		},
+		children: [
+			/* @__PURE__ */ z("div", {
+				className: "flow-panel-resize-handle flow-panel-resize-handle--left",
+				...i
+			}),
+			/* @__PURE__ */ z("div", {
+				className: "flow-panel-drag-handle",
+				...n,
+				style: {
+					fontSize: 11,
+					fontWeight: 600,
+					marginBottom: 8,
+					color: "color-mix(in oklch, var(--color-base-content) 50%, transparent)",
+					textTransform: "uppercase",
+					letterSpacing: "0.05em",
+					cursor: "grab"
+				},
+				children: "Inspector"
+			}),
+			/* @__PURE__ */ z("div", {
+				className: "flow-inspector-content",
+				children: /* @__PURE__ */ z(H, {})
+			})
+		]
+	}) : null;
 }
-function Ce() {
-  const { currentCanvas: l, selection: c, setSelection: a, setDoc: o, currentCanvasId: f } = ie(), m = A(() => l.nodes.filter((p) => c.nodeIds.has(p.id)), [l.nodes, c.nodeIds]), t = A(() => l.edges.filter((p) => c.edgeIds.has(p.id)), [l.edges, c.edgeIds]), r = A(() => l.lines.filter((p) => c.lineIds.has(p.id)), [l.lines, c.lineIds]), N = m.length > 0 || t.length > 0 || r.length > 0, w = m.length === 1 && (m[0].type === "flowGroup" || m[0].type === "geometryGroup" || m[0].data.isGroup), z = m.length + r.length, T = (p = "flowGroup") => {
-    if (z < 2) return;
-    const v = 20;
-    let h = 1 / 0, i = 1 / 0, d = -1 / 0, u = -1 / 0;
-    for (const S of m)
-      h = Math.min(h, S.position.x), i = Math.min(i, S.position.y), d = Math.max(d, S.position.x + S.width), u = Math.max(u, S.position.y + S.height);
-    for (const S of r) for (const I of S.points)
-      h = Math.min(h, I.x), i = Math.min(i, I.y), d = Math.max(d, I.x), u = Math.max(u, I.y);
-    const M = p === "geometryGroup", B = me("group"), x = {
-      id: B,
-      type: p,
-      position: {
-        x: h - v,
-        y: i - v
-      },
-      width: d - h + v * 2,
-      height: u - i + v * 2,
-      data: {
-        ...te,
-        label: M ? "Geo Group" : "Group",
-        fill: M ? "#fefce8" : "#f0f9ff",
-        stroke: "#9ca3af",
-        strokeWidth: 1.5,
-        borderStyle: M ? "dashed" : "dotted",
-        isGroup: !0
-      }
-    }, F = c.nodeIds, C = c.lineIds;
-    o((S) => {
-      const I = S.canvases[f];
-      return I ? {
-        ...S,
-        canvases: {
-          ...S.canvases,
-          [f]: {
-            ...I,
-            nodes: M ? [x, ...I.nodes] : [x, ...I.nodes.map((G) => F.has(G.id) ? {
-              ...G,
-              parentId: B
-            } : G)],
-            lines: M ? I.lines : I.lines.map((G) => C.has(G.id) ? {
-              ...G,
-              parentId: B
-            } : G)
-          }
-        }
-      } : S;
-    }), a({
-      nodeIds: /* @__PURE__ */ new Set([B]),
-      edgeIds: /* @__PURE__ */ new Set(),
-      lineIds: /* @__PURE__ */ new Set()
-    });
-  }, Y = () => {
-    const p = /* @__PURE__ */ new Set(), v = /* @__PURE__ */ new Set(), h = /* @__PURE__ */ new Set();
-    for (const i of m) (i.type === "flowGroup" || i.type === "geometryGroup" || i.data.isGroup) && p.add(i.id);
-    if (p.size !== 0) {
-      for (const i of l.nodes) i.parentId && p.has(i.parentId) && v.add(i.id);
-      for (const i of l.lines) i.parentId && p.has(i.parentId) && h.add(i.id);
-      o((i) => {
-        const d = i.canvases[f];
-        return d ? {
-          ...i,
-          canvases: {
-            ...i.canvases,
-            [f]: {
-              ...d,
-              nodes: d.nodes.filter((u) => !p.has(u.id)).map((u) => v.has(u.id) ? {
-                ...u,
-                parentId: void 0
-              } : u),
-              lines: d.lines.map((u) => h.has(u.id) ? {
-                ...u,
-                parentId: void 0
-              } : u)
-            }
-          }
-        } : i;
-      }), a({
-        nodeIds: v,
-        edgeIds: /* @__PURE__ */ new Set(),
-        lineIds: h
-      });
-    }
-  }, P = (p) => {
-    const v = c.nodeIds;
-    v.size !== 0 && o((h) => {
-      const i = h.canvases[f];
-      if (!i) return h;
-      const d = i.nodes.map((x) => x.zIndex ?? 0), u = d.length > 0 ? Math.max(...d) : 0, M = d.length > 0 ? Math.min(...d) : 0, B = i.nodes.map((x) => {
-        if (!v.has(x.id)) return x;
-        const F = x.zIndex ?? 0;
-        let C = F;
-        return p === "front" ? C = u + 1 : p === "back" ? C = M - 1 : p === "up" ? C = F + 1 : p === "down" && (C = F - 1), {
-          ...x,
-          zIndex: C
-        };
-      });
-      return {
-        ...h,
-        canvases: {
-          ...h.canvases,
-          [f]: {
-            ...i,
-            nodes: B
-          }
-        }
-      };
-    });
-  }, L = (p) => {
-    const v = c.lineIds;
-    v.size !== 0 && o((h) => {
-      const i = h.canvases[f];
-      if (!i) return h;
-      const d = i.lines.map((x) => x.zIndex ?? 0), u = d.length > 0 ? Math.max(...d) : 0, M = d.length > 0 ? Math.min(...d) : 0, B = i.lines.map((x) => {
-        if (!v.has(x.id)) return x;
-        const F = x.zIndex ?? 0;
-        let C = F;
-        return p === "front" ? C = u + 1 : p === "back" ? C = M - 1 : p === "up" ? C = F + 1 : p === "down" && (C = F - 1), {
-          ...x,
-          zIndex: C
-        };
-      });
-      return {
-        ...h,
-        canvases: {
-          ...h.canvases,
-          [f]: {
-            ...i,
-            lines: B
-          }
-        }
-      };
-    });
-  }, k = (p, v, h) => {
-    X(p, { [v]: h });
-  }, X = (p, v) => {
-    o((h) => {
-      const i = h.canvases[f];
-      return i ? {
-        ...h,
-        canvases: {
-          ...h.canvases,
-          [f]: {
-            ...i,
-            nodes: i.nodes.map((d) => d.id === p ? {
-              ...d,
-              data: {
-                ...d.data,
-                ...v
-              }
-            } : d)
-          }
-        }
-      } : h;
-    });
-  }, q = (p, v, h) => {
-    o((i) => {
-      const d = i.canvases[f];
-      return d ? {
-        ...i,
-        canvases: {
-          ...i.canvases,
-          [f]: {
-            ...d,
-            nodes: d.nodes.map((u) => u.id === p ? {
-              ...u,
-              [v]: h
-            } : u)
-          }
-        }
-      } : i;
-    });
-  }, Q = (p, v, h) => {
-    o((i) => {
-      const d = i.canvases[f];
-      return d ? {
-        ...i,
-        canvases: {
-          ...i.canvases,
-          [f]: {
-            ...d,
-            edges: d.edges.map((u) => u.id === p ? {
-              ...u,
-              data: {
-                ...u.data,
-                [v]: h
-              }
-            } : u)
-          }
-        }
-      } : i;
-    });
-  }, D = (p, v) => {
-    o((h) => {
-      const i = h.canvases[f];
-      return i ? {
-        ...h,
-        canvases: {
-          ...h.canvases,
-          [f]: {
-            ...i,
-            nodes: i.nodes.map((d) => d.id === p ? {
-              ...d,
-              type: v
-            } : d)
-          }
-        }
-      } : h;
-    });
-  }, U = (p, v) => {
-    o((h) => {
-      const i = h.canvases[f];
-      return i ? {
-        ...h,
-        canvases: {
-          ...h.canvases,
-          [f]: {
-            ...i,
-            edges: i.edges.map((d) => d.id === p ? {
-              ...d,
-              type: v
-            } : d)
-          }
-        }
-      } : h;
-    });
-  }, ee = (p, v, h) => {
-    o((i) => {
-      const d = i.canvases[f];
-      return d ? {
-        ...i,
-        canvases: {
-          ...i.canvases,
-          [f]: {
-            ...d,
-            lines: d.lines.map((u) => u.id === p ? {
-              ...u,
-              [v]: h
-            } : u)
-          }
-        }
-      } : i;
-    });
-  };
-  return /* @__PURE__ */ s(E, { children: [
-    !N && /* @__PURE__ */ e("div", {
-      style: {
-        fontSize: 12,
-        color: "color-mix(in oklch, var(--color-base-content) 40%, transparent)",
-        textAlign: "center",
-        padding: "20px 0"
-      },
-      children: "Select an element to inspect"
-    }),
-    m.length === 1 && /* @__PURE__ */ e(Ie, {
-      node: m[0],
-      isGroup: w,
-      onUpdateData: k,
-      onUpdateDataBatch: X,
-      onUpdateDimension: q,
-      onUpdateType: D
-    }),
-    z > 1 && /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [
-        /* @__PURE__ */ e("div", {
-          className: "flow-inspector-section-title",
-          children: "Selection"
-        }),
-        /* @__PURE__ */ s("div", {
-          style: {
-            fontSize: 12,
-            color: "color-mix(in oklch, var(--color-base-content) 50%, transparent)",
-            marginBottom: 8
-          },
-          children: [
-            m.length > 0 && `${m.length} node${m.length > 1 ? "s" : ""}`,
-            m.length > 0 && r.length > 0 && ", ",
-            r.length > 0 && `${r.length} line${r.length > 1 ? "s" : ""}`,
-            " selected"
-          ]
-        }),
-        /* @__PURE__ */ s("div", {
-          style: {
-            display: "flex",
-            flexDirection: "column",
-            gap: 4,
-            width: "100%"
-          },
-          children: [/* @__PURE__ */ e(g, {
-            size: "xs",
-            onClick: () => T("flowGroup"),
-            block: !0,
-            children: "Group (⌘G)"
-          }), /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => T("geometryGroup"),
-            block: !0,
-            children: "Geo Group (⌘⌥G)"
-          })]
-        })
-      ]
-    }),
-    w && /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [
-        /* @__PURE__ */ e("div", {
-          className: "flow-inspector-section-title",
-          children: m[0].type === "geometryGroup" ? "Geometry Group" : "Group"
-        }),
-        /* @__PURE__ */ e("div", {
-          style: {
-            fontSize: 11,
-            color: "color-mix(in oklch, var(--color-base-content) 45%, transparent)",
-            marginBottom: 6
-          },
-          children: m[0].type === "geometryGroup" ? "Auto-binds spatially contained nodes" : "Explicit membership via add/remove"
-        }),
-        /* @__PURE__ */ e(g, {
-          size: "xs",
-          variant: "ghost",
-          onClick: Y,
-          block: !0,
-          children: "Ungroup (⌘⇧G)"
-        })
-      ]
-    }),
-    m.length > 0 && /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [/* @__PURE__ */ e("div", {
-        className: "flow-inspector-section-title",
-        children: "Layer"
-      }), /* @__PURE__ */ s("div", {
-        style: {
-          display: "flex",
-          gap: 4
-        },
-        children: [
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => P("front"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Bring to Front (⌘⇧↑)",
-              children: "⤒"
-            })
-          }),
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => P("up"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Bring Forward (⌘↑)",
-              children: "↑"
-            })
-          }),
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => P("down"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Send Backward (⌘↓)",
-              children: "↓"
-            })
-          }),
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => P("back"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Send to Back (⌘⇧↓)",
-              children: "⤓"
-            })
-          })
-        ]
-      })]
-    }),
-    t.length === 1 && /* @__PURE__ */ e(Oe, {
-      edge: t[0],
-      onUpdateData: Q,
-      onUpdateType: U
-    }),
-    r.length === 1 && /* @__PURE__ */ s(E, { children: [/* @__PURE__ */ e(Ee, {
-      line: r[0],
-      onUpdateData: ee
-    }), /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [/* @__PURE__ */ e("div", {
-        className: "flow-inspector-section-title",
-        children: "Layer"
-      }), /* @__PURE__ */ s("div", {
-        style: {
-          display: "flex",
-          gap: 4
-        },
-        children: [
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => L("front"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Bring to Front",
-              children: "⤒"
-            })
-          }),
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => L("up"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Bring Forward",
-              children: "↑"
-            })
-          }),
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => L("down"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Send Backward",
-              children: "↓"
-            })
-          }),
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "ghost",
-            onClick: () => L("back"),
-            children: /* @__PURE__ */ e("span", {
-              title: "Send to Back",
-              children: "⤓"
-            })
-          })
-        ]
-      })]
-    })] })
-  ] });
+function H() {
+	let { currentCanvas: t, selection: n, setSelection: r, setDoc: i, currentCanvasId: a } = u(), s = F(() => t.nodes.filter((e) => n.nodeIds.has(e.id)), [t.nodes, n.nodeIds]), c = F(() => t.edges.filter((e) => n.edgeIds.has(e.id)), [t.edges, n.edgeIds]), l = F(() => t.lines.filter((e) => n.lineIds.has(e.id)), [t.lines, n.lineIds]), d = s.length > 0 || c.length > 0 || l.length > 0, f = s.length === 1 && (s[0].type === "flowGroup" || s[0].type === "geometryGroup" || s[0].data.isGroup), p = s.length + l.length, m = (e = "flowGroup") => {
+		if (p < 2) return;
+		let t = Infinity, c = Infinity, u = -Infinity, d = -Infinity;
+		for (let e of s) t = Math.min(t, e.position.x), c = Math.min(c, e.position.y), u = Math.max(u, e.position.x + e.width), d = Math.max(d, e.position.y + e.height);
+		for (let e of l) for (let n of e.points) t = Math.min(t, n.x), c = Math.min(c, n.y), u = Math.max(u, n.x), d = Math.max(d, n.y);
+		let f = e === "geometryGroup", m = b("group"), h = {
+			id: m,
+			type: e,
+			position: {
+				x: t - 20,
+				y: c - 20
+			},
+			width: u - t + 40,
+			height: d - c + 40,
+			data: {
+				...o,
+				label: f ? "Geo Group" : "Group",
+				fill: f ? "#fefce8" : "#f0f9ff",
+				stroke: "#9ca3af",
+				strokeWidth: 1.5,
+				borderStyle: f ? "dashed" : "dotted",
+				isGroup: !0
+			}
+		}, g = n.nodeIds, _ = n.lineIds;
+		i((e) => {
+			let t = e.canvases[a];
+			return t ? {
+				...e,
+				canvases: {
+					...e.canvases,
+					[a]: {
+						...t,
+						nodes: f ? [h, ...t.nodes] : [h, ...t.nodes.map((e) => g.has(e.id) ? {
+							...e,
+							parentId: m
+						} : e)],
+						lines: f ? t.lines : t.lines.map((e) => _.has(e.id) ? {
+							...e,
+							parentId: m
+						} : e)
+					}
+				}
+			} : e;
+		}), r({
+			nodeIds: /* @__PURE__ */ new Set([m]),
+			edgeIds: /* @__PURE__ */ new Set(),
+			lineIds: /* @__PURE__ */ new Set()
+		});
+	}, h = () => {
+		let e = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set();
+		for (let t of s) (t.type === "flowGroup" || t.type === "geometryGroup" || t.data.isGroup) && e.add(t.id);
+		if (e.size !== 0) {
+			for (let r of t.nodes) r.parentId && e.has(r.parentId) && n.add(r.id);
+			for (let n of t.lines) n.parentId && e.has(n.parentId) && o.add(n.id);
+			i((t) => {
+				let r = t.canvases[a];
+				return r ? {
+					...t,
+					canvases: {
+						...t.canvases,
+						[a]: {
+							...r,
+							nodes: r.nodes.filter((t) => !e.has(t.id)).map((e) => n.has(e.id) ? {
+								...e,
+								parentId: void 0
+							} : e),
+							lines: r.lines.map((e) => o.has(e.id) ? {
+								...e,
+								parentId: void 0
+							} : e)
+						}
+					}
+				} : t;
+			}), r({
+				nodeIds: n,
+				edgeIds: /* @__PURE__ */ new Set(),
+				lineIds: o
+			});
+		}
+	}, g = (e) => {
+		let t = n.nodeIds;
+		t.size !== 0 && i((n) => {
+			let r = n.canvases[a];
+			if (!r) return n;
+			let i = r.nodes.map((e) => e.zIndex ?? 0), o = i.length > 0 ? Math.max(...i) : 0, s = i.length > 0 ? Math.min(...i) : 0, c = r.nodes.map((n) => {
+				if (!t.has(n.id)) return n;
+				let r = n.zIndex ?? 0, i = r;
+				return e === "front" ? i = o + 1 : e === "back" ? i = s - 1 : e === "up" ? i = r + 1 : e === "down" && (i = r - 1), {
+					...n,
+					zIndex: i
+				};
+			});
+			return {
+				...n,
+				canvases: {
+					...n.canvases,
+					[a]: {
+						...r,
+						nodes: c
+					}
+				}
+			};
+		});
+	}, _ = (e) => {
+		let t = n.lineIds;
+		t.size !== 0 && i((n) => {
+			let r = n.canvases[a];
+			if (!r) return n;
+			let i = r.lines.map((e) => e.zIndex ?? 0), o = i.length > 0 ? Math.max(...i) : 0, s = i.length > 0 ? Math.min(...i) : 0, c = r.lines.map((n) => {
+				if (!t.has(n.id)) return n;
+				let r = n.zIndex ?? 0, i = r;
+				return e === "front" ? i = o + 1 : e === "back" ? i = s - 1 : e === "up" ? i = r + 1 : e === "down" && (i = r - 1), {
+					...n,
+					zIndex: i
+				};
+			});
+			return {
+				...n,
+				canvases: {
+					...n.canvases,
+					[a]: {
+						...r,
+						lines: c
+					}
+				}
+			};
+		});
+	}, v = (e, t, n) => {
+		y(e, { [t]: n });
+	}, y = (e, t) => {
+		i((n) => {
+			let r = n.canvases[a];
+			return r ? {
+				...n,
+				canvases: {
+					...n.canvases,
+					[a]: {
+						...r,
+						nodes: r.nodes.map((n) => n.id === e ? {
+							...n,
+							data: {
+								...n.data,
+								...t
+							}
+						} : n)
+					}
+				}
+			} : n;
+		});
+	};
+	return /* @__PURE__ */ B(R, { children: [
+		!d && /* @__PURE__ */ z("div", {
+			style: {
+				fontSize: 12,
+				color: "color-mix(in oklch, var(--color-base-content) 40%, transparent)",
+				textAlign: "center",
+				padding: "20px 0"
+			},
+			children: "Select an element to inspect"
+		}),
+		s.length === 1 && /* @__PURE__ */ z(K, {
+			node: s[0],
+			isGroup: f,
+			onUpdateData: v,
+			onUpdateDataBatch: y,
+			onUpdateDimension: (e, t, n) => {
+				i((r) => {
+					let i = r.canvases[a];
+					return i ? {
+						...r,
+						canvases: {
+							...r.canvases,
+							[a]: {
+								...i,
+								nodes: i.nodes.map((r) => r.id === e ? {
+									...r,
+									[t]: n
+								} : r)
+							}
+						}
+					} : r;
+				});
+			},
+			onUpdateType: (e, t) => {
+				i((n) => {
+					let r = n.canvases[a];
+					return r ? {
+						...n,
+						canvases: {
+							...n.canvases,
+							[a]: {
+								...r,
+								nodes: r.nodes.map((n) => n.id === e ? {
+									...n,
+									type: t
+								} : n)
+							}
+						}
+					} : n;
+				});
+			}
+		}),
+		p > 1 && /* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [
+				/* @__PURE__ */ z("div", {
+					className: "flow-inspector-section-title",
+					children: "Selection"
+				}),
+				/* @__PURE__ */ B("div", {
+					style: {
+						fontSize: 12,
+						color: "color-mix(in oklch, var(--color-base-content) 50%, transparent)",
+						marginBottom: 8
+					},
+					children: [
+						s.length > 0 && `${s.length} node${s.length > 1 ? "s" : ""}`,
+						s.length > 0 && l.length > 0 && ", ",
+						l.length > 0 && `${l.length} line${l.length > 1 ? "s" : ""}`,
+						" selected"
+					]
+				}),
+				/* @__PURE__ */ B("div", {
+					style: {
+						display: "flex",
+						flexDirection: "column",
+						gap: 4,
+						width: "100%"
+					},
+					children: [/* @__PURE__ */ z(e, {
+						size: "xs",
+						onClick: () => m("flowGroup"),
+						block: !0,
+						children: "Group (⌘G)"
+					}), /* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => m("geometryGroup"),
+						block: !0,
+						children: "Geo Group (⌘⌥G)"
+					})]
+				})
+			]
+		}),
+		f && /* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [
+				/* @__PURE__ */ z("div", {
+					className: "flow-inspector-section-title",
+					children: s[0].type === "geometryGroup" ? "Geometry Group" : "Group"
+				}),
+				/* @__PURE__ */ z("div", {
+					style: {
+						fontSize: 11,
+						color: "color-mix(in oklch, var(--color-base-content) 45%, transparent)",
+						marginBottom: 6
+					},
+					children: s[0].type === "geometryGroup" ? "Auto-binds spatially contained nodes" : "Explicit membership via add/remove"
+				}),
+				/* @__PURE__ */ z(e, {
+					size: "xs",
+					variant: "ghost",
+					onClick: h,
+					block: !0,
+					children: "Ungroup (⌘⇧G)"
+				})
+			]
+		}),
+		s.length > 0 && /* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [/* @__PURE__ */ z("div", {
+				className: "flow-inspector-section-title",
+				children: "Layer"
+			}), /* @__PURE__ */ B("div", {
+				style: {
+					display: "flex",
+					gap: 4
+				},
+				children: [
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => g("front"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Bring to Front (⌘⇧↑)",
+							children: "⤒"
+						})
+					}),
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => g("up"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Bring Forward (⌘↑)",
+							children: "↑"
+						})
+					}),
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => g("down"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Send Backward (⌘↓)",
+							children: "↓"
+						})
+					}),
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => g("back"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Send to Back (⌘⇧↓)",
+							children: "⤓"
+						})
+					})
+				]
+			})]
+		}),
+		c.length === 1 && /* @__PURE__ */ z(J, {
+			edge: c[0],
+			onUpdateData: (e, t, n) => {
+				i((r) => {
+					let i = r.canvases[a];
+					return i ? {
+						...r,
+						canvases: {
+							...r.canvases,
+							[a]: {
+								...i,
+								edges: i.edges.map((r) => r.id === e ? {
+									...r,
+									data: {
+										...r.data,
+										[t]: n
+									}
+								} : r)
+							}
+						}
+					} : r;
+				});
+			},
+			onUpdateType: (e, t) => {
+				i((n) => {
+					let r = n.canvases[a];
+					return r ? {
+						...n,
+						canvases: {
+							...n.canvases,
+							[a]: {
+								...r,
+								edges: r.edges.map((n) => n.id === e ? {
+									...n,
+									type: t
+								} : n)
+							}
+						}
+					} : n;
+				});
+			}
+		}),
+		l.length === 1 && /* @__PURE__ */ B(R, { children: [/* @__PURE__ */ z(Y, {
+			line: l[0],
+			onUpdateData: (e, t, n) => {
+				i((r) => {
+					let i = r.canvases[a];
+					return i ? {
+						...r,
+						canvases: {
+							...r.canvases,
+							[a]: {
+								...i,
+								lines: i.lines.map((r) => r.id === e ? {
+									...r,
+									[t]: n
+								} : r)
+							}
+						}
+					} : r;
+				});
+			}
+		}), /* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [/* @__PURE__ */ z("div", {
+				className: "flow-inspector-section-title",
+				children: "Layer"
+			}), /* @__PURE__ */ B("div", {
+				style: {
+					display: "flex",
+					gap: 4
+				},
+				children: [
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => _("front"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Bring to Front",
+							children: "⤒"
+						})
+					}),
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => _("up"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Bring Forward",
+							children: "↑"
+						})
+					}),
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => _("down"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Send Backward",
+							children: "↓"
+						})
+					}),
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => _("back"),
+						children: /* @__PURE__ */ z("span", {
+							title: "Send to Back",
+							children: "⤓"
+						})
+					})
+				]
+			})]
+		})] })
+	] });
 }
-function O({ value: l, onChange: c, kind: a, allowTransparent: o, customFallback: f = "#ffffff" }) {
-  const m = oe[a], t = ce(m) ?? "var(--color-base-content)", r = l ?? "", N = r.toLowerCase(), w = ne(r), z = r === "transparent", T = H.some((k) => k.value.toLowerCase() === N), Y = r === m, P = !!r && !w && !z && !T, L = P ? r : f;
-  return /* @__PURE__ */ s("div", {
-    className: "flow-color-field",
-    children: [
-      /* @__PURE__ */ e("button", {
-        type: "button",
-        title: "跟随主题切换",
-        "aria-label": "跟随主题切换",
-        className: `flow-color-swatch flow-color-swatch--sync${Y ? " is-active" : ""}`,
-        style: { background: t },
-        onClick: () => c(m)
-      }),
-      /* @__PURE__ */ e("span", { className: "flow-color-divider" }),
-      H.map((k) => /* @__PURE__ */ e("button", {
-        type: "button",
-        title: k.label,
-        "aria-label": k.label,
-        className: `flow-color-swatch${!w && !z && N === k.value.toLowerCase() ? " is-active" : ""}`,
-        style: { background: k.value },
-        onClick: () => c(k.value)
-      }, k.value)),
-      /* @__PURE__ */ e("span", { className: "flow-color-divider" }),
-      /* @__PURE__ */ e("label", {
-        className: `flow-color-swatch flow-color-swatch--custom${P ? " is-active" : ""}`,
-        title: "自定义颜色",
-        style: P ? { background: r } : void 0,
-        children: /* @__PURE__ */ e("input", {
-          type: "color",
-          value: L,
-          onChange: (k) => c(k.target.value)
-        })
-      }),
-      o && /* @__PURE__ */ e("button", {
-        type: "button",
-        title: "透明",
-        "aria-label": "透明",
-        className: `flow-color-swatch flow-color-swatch--transparent${z ? " is-active" : ""}`,
-        onClick: () => c("transparent")
-      })
-    ]
-  });
+function U({ value: e, onChange: t, kind: n, allowTransparent: r, customFallback: i = "#ffffff" }) {
+	let a = p[n], o = g(a) ?? "var(--color-base-content)", s = e ?? "", c = s.toLowerCase(), l = m(s), u = s === "transparent", d = f.some((e) => e.value.toLowerCase() === c), h = s === a, _ = !!s && !l && !u && !d, v = _ ? s : i;
+	return /* @__PURE__ */ B("div", {
+		className: "flow-color-field",
+		children: [
+			/* @__PURE__ */ z("button", {
+				type: "button",
+				title: "跟随主题切换",
+				"aria-label": "跟随主题切换",
+				className: `flow-color-swatch flow-color-swatch--sync${h ? " is-active" : ""}`,
+				style: { background: o },
+				onClick: () => t(a)
+			}),
+			/* @__PURE__ */ z("span", { className: "flow-color-divider" }),
+			f.map((e) => /* @__PURE__ */ z("button", {
+				type: "button",
+				title: e.label,
+				"aria-label": e.label,
+				className: `flow-color-swatch${!l && !u && c === e.value.toLowerCase() ? " is-active" : ""}`,
+				style: { background: e.value },
+				onClick: () => t(e.value)
+			}, e.value)),
+			/* @__PURE__ */ z("span", { className: "flow-color-divider" }),
+			/* @__PURE__ */ z("label", {
+				className: `flow-color-swatch flow-color-swatch--custom${_ ? " is-active" : ""}`,
+				title: "自定义颜色",
+				style: _ ? { background: s } : void 0,
+				children: /* @__PURE__ */ z("input", {
+					type: "color",
+					value: v,
+					onChange: (e) => t(e.target.value)
+				})
+			}),
+			r && /* @__PURE__ */ z("button", {
+				type: "button",
+				title: "透明",
+				"aria-label": "透明",
+				className: `flow-color-swatch flow-color-swatch--transparent${u ? " is-active" : ""}`,
+				onClick: () => t("transparent")
+			})
+		]
+	});
 }
-function Se(l) {
-  const c = ue(l, re($(l)?.brandColor, "") || "#475569");
-  return c ? `data:image/svg+xml;utf8,${encodeURIComponent(c)}` : "";
+function W(e) {
+	let t = w(e), n = h(t?.brandColor, "") || "#475569", r = S(e, n);
+	return r ? `data:image/svg+xml;utf8,${encodeURIComponent(r)}` : "";
 }
-function ke({ node: l, onUpdateData: c }) {
-  const [a, o] = ze("lang"), f = A(() => we(a), [a]), m = l.data.titleIcon ?? "", t = l.data.titleIconSide ?? "left";
-  return /* @__PURE__ */ s("div", {
-    className: "flow-inspector-section",
-    children: [
-      /* @__PURE__ */ e("div", {
-        className: "flow-inspector-section-title",
-        children: "Title Icon"
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Icon"
-        }), /* @__PURE__ */ s("div", {
-          style: {
-            display: "flex",
-            gap: 4,
-            alignItems: "center",
-            flex: 1,
-            minWidth: 0
-          },
-          children: [/* @__PURE__ */ e(y, {
-            options: fe.map((r) => ({
-              value: r.id,
-              label: r.label
-            })),
-            value: a,
-            onChange: (r) => o(r),
-            style: {
-              fontSize: 12,
-              flex: 1,
-              minWidth: 0
-            }
-          }), /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: m ? "ghost" : "primary",
-            square: !0,
-            onClick: () => c(l.id, "titleIcon", void 0),
-            children: /* @__PURE__ */ e("span", {
-              title: "移除标题图标",
-              children: "✕"
-            })
-          })]
-        })]
-      }),
-      m && !f.some((r) => r.id === m) && /* @__PURE__ */ e("div", {
-        style: {
-          fontSize: 10,
-          opacity: 0.55,
-          marginBottom: 4
-        },
-        children: "当前图标在其他分类"
-      }),
-      /* @__PURE__ */ e("div", {
-        style: {
-          display: "grid",
-          gridTemplateColumns: "repeat(auto-fill, minmax(22px, 1fr))",
-          gap: 3,
-          maxHeight: 92,
-          overflowY: "auto",
-          padding: 3,
-          border: "1px solid color-mix(in oklch, var(--color-base-content) 14%, transparent)",
-          borderRadius: 6,
-          marginBottom: 6
-        },
-        children: f.map((r) => {
-          const N = Se(r.id), w = m === r.id;
-          return /* @__PURE__ */ e("button", {
-            type: "button",
-            title: r.label,
-            "aria-label": r.label,
-            onClick: () => c(l.id, "titleIcon", r.id),
-            style: {
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              width: 22,
-              height: 22,
-              borderRadius: 4,
-              cursor: "pointer",
-              padding: 0,
-              border: w ? "1.5px solid var(--color-primary)" : "1px solid transparent",
-              background: w ? "color-mix(in oklch, var(--color-primary) 12%, transparent)" : "transparent"
-            },
-            children: N && /* @__PURE__ */ e("img", {
-              src: N,
-              width: 16,
-              height: 16,
-              alt: "",
-              style: { objectFit: "contain" }
-            })
-          }, r.id);
-        })
-      }),
-      m && /* @__PURE__ */ s(E, { children: [
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Side"
-          }), /* @__PURE__ */ e(y, {
-            options: [{
-              value: "left",
-              label: "left"
-            }, {
-              value: "right",
-              label: "right"
-            }],
-            value: t,
-            onChange: (r) => c(l.id, "titleIconSide", r),
-            style: { fontSize: 12 }
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [
-            /* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Size"
-            }),
-            /* @__PURE__ */ e(b, {
-              size: "xs",
-              type: "number",
-              value: String(l.data.titleIconSize ?? Math.max(8, Math.round(l.data.fontSize * 1.15))),
-              onChange: (r) => c(l.id, "titleIconSize", Math.max(8, Number(r.target.value) || 8))
-            }),
-            /* @__PURE__ */ e("span", {
-              className: "flow-inspector-suffix",
-              style: {
-                fontSize: 10,
-                opacity: 0.5
-              },
-              children: "px"
-            })
-          ]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Color"
-          }), /* @__PURE__ */ e(O, {
-            value: l.data.titleIconColor ?? $(m)?.brandColor ?? l.data.labelColor ?? l.data.color,
-            kind: "stroke",
-            customFallback: "#334155",
-            onChange: (r) => c(l.id, "titleIconColor", r)
-          })]
-        })
-      ] })
-    ]
-  });
+function G({ node: r, onUpdateData: a }) {
+	let [o, s] = L("lang"), c = F(() => T(o), [o]), l = r.data.titleIcon ?? "", u = r.data.titleIconSide ?? "left";
+	return /* @__PURE__ */ B("div", {
+		className: "flow-inspector-section",
+		children: [
+			/* @__PURE__ */ z("div", {
+				className: "flow-inspector-section-title",
+				children: "Title Icon"
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Icon"
+				}), /* @__PURE__ */ B("div", {
+					style: {
+						display: "flex",
+						gap: 4,
+						alignItems: "center",
+						flex: 1,
+						minWidth: 0
+					},
+					children: [/* @__PURE__ */ z(i, {
+						options: x.map((e) => ({
+							value: e.id,
+							label: e.label
+						})),
+						value: o,
+						onChange: (e) => s(e),
+						style: {
+							fontSize: 12,
+							flex: 1,
+							minWidth: 0
+						}
+					}), /* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: l ? "ghost" : "primary",
+						square: !0,
+						onClick: () => a(r.id, "titleIcon", void 0),
+						children: /* @__PURE__ */ z("span", {
+							title: "移除标题图标",
+							children: "✕"
+						})
+					})]
+				})]
+			}),
+			l && !c.some((e) => e.id === l) && /* @__PURE__ */ z("div", {
+				style: {
+					fontSize: 10,
+					opacity: .55,
+					marginBottom: 4
+				},
+				children: "当前图标在其他分类"
+			}),
+			/* @__PURE__ */ z("div", {
+				style: {
+					display: "grid",
+					gridTemplateColumns: "repeat(auto-fill, minmax(22px, 1fr))",
+					gap: 3,
+					maxHeight: 92,
+					overflowY: "auto",
+					padding: 3,
+					border: "1px solid color-mix(in oklch, var(--color-base-content) 14%, transparent)",
+					borderRadius: 6,
+					marginBottom: 6
+				},
+				children: c.map((e) => {
+					let t = W(e.id), n = l === e.id;
+					return /* @__PURE__ */ z("button", {
+						type: "button",
+						title: e.label,
+						"aria-label": e.label,
+						onClick: () => a(r.id, "titleIcon", e.id),
+						style: {
+							display: "flex",
+							alignItems: "center",
+							justifyContent: "center",
+							width: 22,
+							height: 22,
+							borderRadius: 4,
+							cursor: "pointer",
+							padding: 0,
+							border: n ? "1.5px solid var(--color-primary)" : "1px solid transparent",
+							background: n ? "color-mix(in oklch, var(--color-primary) 12%, transparent)" : "transparent"
+						},
+						children: t && /* @__PURE__ */ z("img", {
+							src: t,
+							width: 16,
+							height: 16,
+							alt: "",
+							style: { objectFit: "contain" }
+						})
+					}, e.id);
+				})
+			}),
+			l && /* @__PURE__ */ B(R, { children: [
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Side"
+					}), /* @__PURE__ */ z(i, {
+						options: [{
+							value: "left",
+							label: "left"
+						}, {
+							value: "right",
+							label: "right"
+						}],
+						value: u,
+						onChange: (e) => a(r.id, "titleIconSide", e),
+						style: { fontSize: 12 }
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [
+						/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Size"
+						}),
+						/* @__PURE__ */ z(t, {
+							size: "xs",
+							type: "number",
+							value: String(r.data.titleIconSize ?? Math.max(8, Math.round(r.data.fontSize * 1.15))),
+							onChange: (e) => a(r.id, "titleIconSize", Math.max(8, Number(e.target.value) || 8))
+						}),
+						/* @__PURE__ */ z("span", {
+							className: "flow-inspector-suffix",
+							style: {
+								fontSize: 10,
+								opacity: .5
+							},
+							children: "px"
+						})
+					]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Color"
+					}), /* @__PURE__ */ z(U, {
+						value: r.data.titleIconColor ?? w(l)?.brandColor ?? r.data.labelColor ?? r.data.color,
+						kind: "stroke",
+						customFallback: "#334155",
+						onChange: (e) => a(r.id, "titleIconColor", e)
+					})]
+				})
+			] })
+		]
+	});
 }
-function Ie({ node: l, isGroup: c, onUpdateData: a, onUpdateDataBatch: o, onUpdateDimension: f, onUpdateType: m }) {
-  return /* @__PURE__ */ s(E, { children: [
-    /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [
-        /* @__PURE__ */ e("div", {
-          className: "flow-inspector-section-title",
-          children: "Node"
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Label"
-          }), /* @__PURE__ */ e(b, {
-            size: "xs",
-            value: l.data.label,
-            onChange: (t) => a(l.id, "label", t.target.value)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Type"
-          }), /* @__PURE__ */ e(y, {
-            options: Ne.map((t) => ({
-              value: t,
-              label: t
-            })),
-            value: l.type,
-            onChange: (t) => m(l.id, t),
-            style: { fontSize: 12 }
-          })]
-        })
-      ]
-    }),
-    /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [
-        /* @__PURE__ */ e("div", {
-          className: "flow-inspector-section-title",
-          children: "Size"
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "W"
-          }), /* @__PURE__ */ e(b, {
-            size: "xs",
-            type: "number",
-            value: String(Math.round(l.width * 100) / 100),
-            onChange: (t) => f(l.id, "width", Number(t.target.value) || l.width)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "H"
-          }), /* @__PURE__ */ e(b, {
-            size: "xs",
-            type: "number",
-            value: String(Math.round(l.height * 100) / 100),
-            onChange: (t) => f(l.id, "height", Number(t.target.value) || l.height)
-          })]
-        })
-      ]
-    }),
-    /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [
-        /* @__PURE__ */ e("div", {
-          className: "flow-inspector-section-title",
-          children: "Style"
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Fill"
-          }), /* @__PURE__ */ e(O, {
-            value: l.data.fill,
-            kind: "fill",
-            allowTransparent: !0,
-            customFallback: "#ffffff",
-            onChange: (t) => a(l.id, "fill", t)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Stroke"
-          }), /* @__PURE__ */ e(O, {
-            value: l.data.stroke,
-            kind: "stroke",
-            allowTransparent: !0,
-            customFallback: "#000000",
-            onChange: (t) => a(l.id, "stroke", t)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Font"
-          }), /* @__PURE__ */ e(b, {
-            size: "xs",
-            type: "number",
-            value: String(l.data.fontSize),
-            onChange: (t) => a(l.id, "fontSize", Number(t.target.value) || 14)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Color"
-          }), /* @__PURE__ */ e(O, {
-            value: l.data.color,
-            kind: "text",
-            customFallback: "#111827",
-            onChange: (t) => a(l.id, "color", t)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Font Color"
-          }), /* @__PURE__ */ e(O, {
-            value: l.data.labelColor ?? l.data.color,
-            kind: "text",
-            customFallback: "#111827",
-            onChange: (t) => a(l.id, "labelColor", t)
-          })]
-        }),
-        l.type !== "shapeSvg" && l.type !== "mediaNode" && /* @__PURE__ */ s(E, { children: [
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Text Pos"
-            }), /* @__PURE__ */ e(y, {
-              options: [
-                {
-                  value: "center",
-                  label: "center"
-                },
-                {
-                  value: "top",
-                  label: "top"
-                },
-                {
-                  value: "bottom",
-                  label: "bottom"
-                },
-                {
-                  value: "left",
-                  label: "left"
-                },
-                {
-                  value: "right",
-                  label: "right"
-                },
-                {
-                  value: "top-left",
-                  label: "top-left"
-                },
-                {
-                  value: "top-right",
-                  label: "top-right"
-                },
-                {
-                  value: "bottom-left",
-                  label: "bottom-left"
-                },
-                {
-                  value: "bottom-right",
-                  label: "bottom-right"
-                }
-              ],
-              value: l.data.textPlacement ?? (c || l.type === "animAnchor" ? "top" : "center"),
-              onChange: (t) => a(l.id, "textPlacement", t),
-              style: { fontSize: 12 }
-            })]
-          }),
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Text Off X"
-            }), /* @__PURE__ */ e(b, {
-              size: "xs",
-              type: "number",
-              value: String(l.data.labelOffsetX ?? 0),
-              onChange: (t) => a(l.id, "labelOffsetX", Number(t.target.value) || 0)
-            })]
-          }),
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Text Off Y"
-            }), /* @__PURE__ */ e(b, {
-              size: "xs",
-              type: "number",
-              value: String(l.data.labelOffsetY ?? 0),
-              onChange: (t) => a(l.id, "labelOffsetY", Number(t.target.value) || 0)
-            })]
-          })
-        ] }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Border"
-          }), /* @__PURE__ */ e(y, {
-            options: [{
-              value: "none",
-              label: "none"
-            }, ...le.map((t) => ({
-              value: t,
-              label: t
-            }))],
-            value: l.data.borderStyle ?? (c ? l.type === "geometryGroup" ? "dashed" : "dotted" : "solid"),
-            onChange: (t) => a(l.id, "borderStyle", t),
-            style: { fontSize: 12 }
-          })]
-        }),
-        he.has(l.type) && (() => {
-          const t = l.data.borderSides ?? {}, r = (w, z) => {
-            a(l.id, "borderSides", {
-              ...l.data.borderSides ?? {},
-              [w]: {
-                ...l.data.borderSides?.[w] ?? {},
-                ...z
-              }
-            });
-          }, N = {
-            top: "Top",
-            right: "Right",
-            bottom: "Bottom",
-            left: "Left"
-          };
-          return /* @__PURE__ */ s(E, { children: [/* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Sides"
-            }), /* @__PURE__ */ s("div", {
-              style: {
-                display: "flex",
-                alignItems: "center",
-                gap: 6,
-                flex: 1
-              },
-              children: [/* @__PURE__ */ e("span", {
-                style: {
-                  fontSize: 10,
-                  opacity: 0.55
-                },
-                children: "上下左右独立边框"
-              }), pe(l.data, l.type) && /* @__PURE__ */ e("span", {
-                title: "恢复与 Border 设置一致",
-                style: { display: "inline-flex" },
-                children: /* @__PURE__ */ e(g, {
-                  size: "xs",
-                  variant: "ghost",
-                  onClick: () => a(l.id, "borderSides", void 0),
-                  children: "重置"
-                })
-              })]
-            })]
-          }), de.map((w) => {
-            const z = t[w];
-            return /* @__PURE__ */ s("div", {
-              style: {
-                display: "flex",
-                alignItems: "center",
-                gap: 4,
-                marginBottom: 4
-              },
-              children: [
-                /* @__PURE__ */ e("span", {
-                  title: `独立设置${N[w]}边`,
-                  style: {
-                    fontSize: 10,
-                    width: 40,
-                    flexShrink: 0,
-                    opacity: z ? 0.95 : 0.6
-                  },
-                  children: N[w]
-                }),
-                /* @__PURE__ */ e("span", {
-                  title: `显示/隐藏 ${N[w]} 边`,
-                  style: { display: "inline-flex" },
-                  children: /* @__PURE__ */ e(W, {
-                    size: "sm",
-                    checked: z?.visible ?? !0,
-                    onChange: (T) => r(w, { visible: T })
-                  })
-                }),
-                /* @__PURE__ */ e(O, {
-                  value: z?.color ?? l.data.stroke,
-                  kind: "stroke",
-                  customFallback: "#334155",
-                  onChange: (T) => r(w, { color: T })
-                }),
-                /* @__PURE__ */ e("span", {
-                  title: `${N[w]} 粗细`,
-                  style: {
-                    display: "inline-flex",
-                    width: 52
-                  },
-                  children: /* @__PURE__ */ e(b, {
-                    size: "xs",
-                    type: "number",
-                    value: String(z?.width ?? l.data.strokeWidth),
-                    onChange: (T) => r(w, { width: Math.max(0, Number(T.target.value) || 0) })
-                  })
-                })
-              ]
-            }, w);
-          })] });
-        })(),
-        l.type === "shapeSvg" && /* @__PURE__ */ s(E, { children: [
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Icon"
-            }), /* @__PURE__ */ e(y, {
-              options: ve().map((t) => ({
-                value: t.id,
-                label: t.label
-              })),
-              value: l.data.svgId ?? "",
-              placeholder: "选择图标",
-              onChange: (t) => {
-                const r = $(String(t));
-                o(l.id, {
-                  svgId: t,
-                  ...r?.brandColor ? { color: r.brandColor } : {},
-                  ...!l.data.label || l.data.label === "Text" ? { label: r?.label ?? String(t) } : {}
-                });
-              },
-              style: { fontSize: 12 }
-            })]
-          }),
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Box"
-            }), /* @__PURE__ */ e(W, {
-              size: "sm",
-              checked: l.data.iconBox ?? !1,
-              onChange: (t) => a(l.id, "iconBox", t),
-              label: "显示边框"
-            })]
-          }),
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Label"
-            }), /* @__PURE__ */ e(y, {
-              options: [
-                {
-                  value: "top",
-                  label: "top"
-                },
-                {
-                  value: "middle",
-                  label: "middle"
-                },
-                {
-                  value: "bottom",
-                  label: "bottom"
-                },
-                {
-                  value: "left",
-                  label: "left"
-                },
-                {
-                  value: "right",
-                  label: "right"
-                }
-              ],
-              value: l.data.labelPlacement === "above" ? "top" : l.data.labelPlacement === "center" ? "middle" : l.data.labelPlacement === "below" ? "bottom" : l.data.labelPlacement ?? "bottom",
-              onChange: (t) => a(l.id, "labelPlacement", t),
-              style: { fontSize: 12 }
-            })]
-          }),
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Offset X"
-            }), /* @__PURE__ */ e(b, {
-              size: "xs",
-              type: "number",
-              value: String(l.data.labelOffsetX ?? 0),
-              onChange: (t) => a(l.id, "labelOffsetX", Number(t.target.value) || 0)
-            })]
-          }),
-          /* @__PURE__ */ s("div", {
-            className: "flow-inspector-row",
-            children: [/* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Offset Y"
-            }), /* @__PURE__ */ e(b, {
-              size: "xs",
-              type: "number",
-              value: String(l.data.labelOffsetY ?? 0),
-              onChange: (t) => a(l.id, "labelOffsetY", Number(t.target.value) || 0)
-            })]
-          })
-        ] })
-      ]
-    }),
-    l.type === "mediaNode" && /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [/* @__PURE__ */ e("div", {
-        className: "flow-inspector-section-title",
-        children: "Palette (Archify)"
-      }), /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Palette"
-        }), /* @__PURE__ */ e("div", {
-          style: {
-            display: "flex",
-            flexWrap: "wrap",
-            gap: 4
-          },
-          children: j.map((t) => /* @__PURE__ */ e("button", {
-            type: "button",
-            title: _[t],
-            "aria-label": _[t],
-            onClick: () => o(l.id, V(t)),
-            style: {
-              width: 18,
-              height: 18,
-              borderRadius: 4,
-              cursor: "pointer",
-              background: R[t].fill,
-              border: `1.5px solid ${R[t].stroke}`
-            }
-          }, t))
-        })]
-      })]
-    }),
-    l.type !== "mediaNode" && l.type !== "shapeSvg" && /* @__PURE__ */ e(ke, {
-      node: l,
-      onUpdateData: a
-    }),
-    l.type !== "mediaNode" && /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [
-        /* @__PURE__ */ e("div", {
-          className: "flow-inspector-section-title",
-          children: "Card (Archify)"
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Subtitle"
-          }), /* @__PURE__ */ e(b, {
-            size: "xs",
-            value: l.data.sublabel ?? "",
-            placeholder: "secondary line",
-            onChange: (t) => a(l.id, "sublabel", t.target.value)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Sub Color"
-          }), /* @__PURE__ */ e(O, {
-            value: l.data.sublabelColor ?? "#94a3b8",
-            kind: "text",
-            customFallback: "#94a3b8",
-            onChange: (t) => a(l.id, "sublabelColor", t)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Tag"
-          }), /* @__PURE__ */ e(b, {
-            size: "xs",
-            value: l.data.tag ?? "",
-            placeholder: "corner pill",
-            onChange: (t) => a(l.id, "tag", t.target.value)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Tag Color"
-          }), /* @__PURE__ */ e(O, {
-            value: l.data.tagColor ?? l.data.stroke,
-            kind: "stroke",
-            customFallback: "#334155",
-            onChange: (t) => a(l.id, "tagColor", t)
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Tag Pos"
-          }), /* @__PURE__ */ e(y, {
-            options: [
-              {
-                value: "top-left",
-                label: "top-left"
-              },
-              {
-                value: "top-right",
-                label: "top-right"
-              },
-              {
-                value: "bottom-left",
-                label: "bottom-left"
-              },
-              {
-                value: "bottom-right",
-                label: "bottom-right"
-              }
-            ],
-            value: l.data.tagPlacement ?? "top-right",
-            onChange: (t) => a(l.id, "tagPlacement", t),
-            style: { fontSize: 12 }
-          })]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [/* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "Palette"
-          }), /* @__PURE__ */ e("div", {
-            style: {
-              display: "flex",
-              flexWrap: "wrap",
-              gap: 4
-            },
-            children: j.map((t) => /* @__PURE__ */ e("button", {
-              type: "button",
-              title: _[t],
-              "aria-label": _[t],
-              onClick: () => o(l.id, V(t)),
-              style: {
-                width: 18,
-                height: 18,
-                borderRadius: 4,
-                cursor: "pointer",
-                background: R[t].fill,
-                border: `1.5px solid ${R[t].stroke}`
-              }
-            }, t))
-          })]
-        })
-      ]
-    }),
-    l.type === "mediaNode" && /* @__PURE__ */ e(Te, {
-      node: l,
-      onUpdateData: a
-    }),
-    /* @__PURE__ */ s("div", {
-      className: "flow-inspector-section",
-      children: [
-        /* @__PURE__ */ e("div", {
-          className: "flow-inspector-section-title",
-          children: "Transform"
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [
-            /* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Rotate"
-            }),
-            /* @__PURE__ */ e(b, {
-              size: "xs",
-              type: "number",
-              value: String(l.data.rotation ?? 0),
-              onChange: (t) => a(l.id, "rotation", Number(t.target.value) || 0)
-            }),
-            /* @__PURE__ */ e("span", {
-              className: "flow-inspector-suffix",
-              style: {
-                fontSize: 10,
-                opacity: 0.5
-              },
-              children: "°"
-            })
-          ]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [
-            /* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Flip"
-            }),
-            /* @__PURE__ */ e(g, {
-              size: "xs",
-              variant: l.data.flipX ? "primary" : "ghost",
-              onClick: () => a(l.id, "flipX", !l.data.flipX),
-              square: !0,
-              children: /* @__PURE__ */ e("span", {
-                title: "Flip Horizontal",
-                children: "↔"
-              })
-            }),
-            /* @__PURE__ */ e(g, {
-              size: "xs",
-              variant: l.data.flipY ? "primary" : "ghost",
-              onClick: () => a(l.id, "flipY", !l.data.flipY),
-              square: !0,
-              children: /* @__PURE__ */ e("span", {
-                title: "Flip Vertical",
-                children: "↕"
-              })
-            })
-          ]
-        }),
-        /* @__PURE__ */ s("div", {
-          className: "flow-inspector-row",
-          children: [
-            /* @__PURE__ */ e(n, {
-              size: "xs",
-              className: "flow-inspector-label",
-              children: "Quick"
-            }),
-            /* @__PURE__ */ e(g, {
-              size: "xs",
-              variant: "ghost",
-              onClick: () => a(l.id, "rotation", ((l.data.rotation ?? 0) + 90) % 360),
-              children: "+90°"
-            }),
-            /* @__PURE__ */ e(g, {
-              size: "xs",
-              variant: "ghost",
-              onClick: () => a(l.id, "rotation", ((l.data.rotation ?? 0) - 90 + 360) % 360),
-              children: "−90°"
-            })
-          ]
-        })
-      ]
-    })
-  ] });
+function K({ node: o, isGroup: s, onUpdateData: c, onUpdateDataBatch: l, onUpdateDimension: u, onUpdateType: d }) {
+	return /* @__PURE__ */ B(R, { children: [
+		/* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [
+				/* @__PURE__ */ z("div", {
+					className: "flow-inspector-section-title",
+					children: "Node"
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Label"
+					}), /* @__PURE__ */ z(t, {
+						size: "xs",
+						value: o.data.label,
+						onChange: (e) => c(o.id, "label", e.target.value)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Type"
+					}), /* @__PURE__ */ z(i, {
+						options: M.map((e) => ({
+							value: e,
+							label: e
+						})),
+						value: o.type,
+						onChange: (e) => d(o.id, e),
+						style: { fontSize: 12 }
+					})]
+				})
+			]
+		}),
+		/* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [
+				/* @__PURE__ */ z("div", {
+					className: "flow-inspector-section-title",
+					children: "Size"
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "W"
+					}), /* @__PURE__ */ z(t, {
+						size: "xs",
+						type: "number",
+						value: String(Math.round(o.width * 100) / 100),
+						onChange: (e) => u(o.id, "width", Number(e.target.value) || o.width)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "H"
+					}), /* @__PURE__ */ z(t, {
+						size: "xs",
+						type: "number",
+						value: String(Math.round(o.height * 100) / 100),
+						onChange: (e) => u(o.id, "height", Number(e.target.value) || o.height)
+					})]
+				})
+			]
+		}),
+		/* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [
+				/* @__PURE__ */ z("div", {
+					className: "flow-inspector-section-title",
+					children: "Style"
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Fill"
+					}), /* @__PURE__ */ z(U, {
+						value: o.data.fill,
+						kind: "fill",
+						allowTransparent: !0,
+						customFallback: "#ffffff",
+						onChange: (e) => c(o.id, "fill", e)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Stroke"
+					}), /* @__PURE__ */ z(U, {
+						value: o.data.stroke,
+						kind: "stroke",
+						allowTransparent: !0,
+						customFallback: "#000000",
+						onChange: (e) => c(o.id, "stroke", e)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Font"
+					}), /* @__PURE__ */ z(t, {
+						size: "xs",
+						type: "number",
+						value: String(o.data.fontSize),
+						onChange: (e) => c(o.id, "fontSize", Number(e.target.value) || 14)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Color"
+					}), /* @__PURE__ */ z(U, {
+						value: o.data.color,
+						kind: "text",
+						customFallback: "#111827",
+						onChange: (e) => c(o.id, "color", e)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Font Color"
+					}), /* @__PURE__ */ z(U, {
+						value: o.data.labelColor ?? o.data.color,
+						kind: "text",
+						customFallback: "#111827",
+						onChange: (e) => c(o.id, "labelColor", e)
+					})]
+				}),
+				o.type !== "shapeSvg" && o.type !== "mediaNode" && /* @__PURE__ */ B(R, { children: [
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Text Pos"
+						}), /* @__PURE__ */ z(i, {
+							options: [
+								{
+									value: "center",
+									label: "center"
+								},
+								{
+									value: "top",
+									label: "top"
+								},
+								{
+									value: "bottom",
+									label: "bottom"
+								},
+								{
+									value: "left",
+									label: "left"
+								},
+								{
+									value: "right",
+									label: "right"
+								},
+								{
+									value: "top-left",
+									label: "top-left"
+								},
+								{
+									value: "top-right",
+									label: "top-right"
+								},
+								{
+									value: "bottom-left",
+									label: "bottom-left"
+								},
+								{
+									value: "bottom-right",
+									label: "bottom-right"
+								}
+							],
+							value: o.data.textPlacement ?? (s || o.type === "animAnchor" ? "top" : "center"),
+							onChange: (e) => c(o.id, "textPlacement", e),
+							style: { fontSize: 12 }
+						})]
+					}),
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Text Off X"
+						}), /* @__PURE__ */ z(t, {
+							size: "xs",
+							type: "number",
+							value: String(o.data.labelOffsetX ?? 0),
+							onChange: (e) => c(o.id, "labelOffsetX", Number(e.target.value) || 0)
+						})]
+					}),
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Text Off Y"
+						}), /* @__PURE__ */ z(t, {
+							size: "xs",
+							type: "number",
+							value: String(o.data.labelOffsetY ?? 0),
+							onChange: (e) => c(o.id, "labelOffsetY", Number(e.target.value) || 0)
+						})]
+					})
+				] }),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Border"
+					}), /* @__PURE__ */ z(i, {
+						options: [{
+							value: "none",
+							label: "none"
+						}, ...a.map((e) => ({
+							value: e,
+							label: e
+						}))],
+						value: o.data.borderStyle ?? (s ? o.type === "geometryGroup" ? "dashed" : "dotted" : "solid"),
+						onChange: (e) => c(o.id, "borderStyle", e),
+						style: { fontSize: 12 }
+					})]
+				}),
+				v.has(o.type) && (() => {
+					let i = o.data.borderSides ?? {}, a = (e, t) => {
+						c(o.id, "borderSides", {
+							...o.data.borderSides,
+							[e]: {
+								...o.data.borderSides?.[e],
+								...t
+							}
+						});
+					}, s = {
+						top: "Top",
+						right: "Right",
+						bottom: "Bottom",
+						left: "Left"
+					};
+					return /* @__PURE__ */ B(R, { children: [/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Sides"
+						}), /* @__PURE__ */ B("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								gap: 6,
+								flex: 1
+							},
+							children: [/* @__PURE__ */ z("span", {
+								style: {
+									fontSize: 10,
+									opacity: .55
+								},
+								children: "上下左右独立边框"
+							}), y(o.data, o.type) && /* @__PURE__ */ z("span", {
+								title: "恢复与 Border 设置一致",
+								style: { display: "inline-flex" },
+								children: /* @__PURE__ */ z(e, {
+									size: "xs",
+									variant: "ghost",
+									onClick: () => c(o.id, "borderSides", void 0),
+									children: "重置"
+								})
+							})]
+						})]
+					}), _.map((e) => {
+						let n = i[e];
+						return /* @__PURE__ */ B("div", {
+							style: {
+								display: "flex",
+								alignItems: "center",
+								gap: 4,
+								marginBottom: 4
+							},
+							children: [
+								/* @__PURE__ */ z("span", {
+									title: `独立设置${s[e]}边`,
+									style: {
+										fontSize: 10,
+										width: 40,
+										flexShrink: 0,
+										opacity: n ? .95 : .6
+									},
+									children: s[e]
+								}),
+								/* @__PURE__ */ z("span", {
+									title: `显示/隐藏 ${s[e]} 边`,
+									style: { display: "inline-flex" },
+									children: /* @__PURE__ */ z(r, {
+										size: "sm",
+										checked: n?.visible ?? !0,
+										onChange: (t) => a(e, { visible: t })
+									})
+								}),
+								/* @__PURE__ */ z(U, {
+									value: n?.color ?? o.data.stroke,
+									kind: "stroke",
+									customFallback: "#334155",
+									onChange: (t) => a(e, { color: t })
+								}),
+								/* @__PURE__ */ z("span", {
+									title: `${s[e]} 粗细`,
+									style: {
+										display: "inline-flex",
+										width: 52
+									},
+									children: /* @__PURE__ */ z(t, {
+										size: "xs",
+										type: "number",
+										value: String(n?.width ?? o.data.strokeWidth),
+										onChange: (t) => a(e, { width: Math.max(0, Number(t.target.value) || 0) })
+									})
+								})
+							]
+						}, e);
+					})] });
+				})(),
+				o.type === "shapeSvg" && /* @__PURE__ */ B(R, { children: [
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Icon"
+						}), /* @__PURE__ */ z(i, {
+							options: C().map((e) => ({
+								value: e.id,
+								label: e.label
+							})),
+							value: o.data.svgId ?? "",
+							placeholder: "选择图标",
+							onChange: (e) => {
+								let t = w(String(e));
+								l(o.id, {
+									svgId: e,
+									...t?.brandColor ? { color: t.brandColor } : {},
+									...!o.data.label || o.data.label === "Text" ? { label: t?.label ?? String(e) } : {}
+								});
+							},
+							style: { fontSize: 12 }
+						})]
+					}),
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Box"
+						}), /* @__PURE__ */ z(r, {
+							size: "sm",
+							checked: o.data.iconBox ?? !1,
+							onChange: (e) => c(o.id, "iconBox", e),
+							label: "显示边框"
+						})]
+					}),
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Label"
+						}), /* @__PURE__ */ z(i, {
+							options: [
+								{
+									value: "top",
+									label: "top"
+								},
+								{
+									value: "middle",
+									label: "middle"
+								},
+								{
+									value: "bottom",
+									label: "bottom"
+								},
+								{
+									value: "left",
+									label: "left"
+								},
+								{
+									value: "right",
+									label: "right"
+								}
+							],
+							value: o.data.labelPlacement === "above" ? "top" : o.data.labelPlacement === "center" ? "middle" : o.data.labelPlacement === "below" ? "bottom" : o.data.labelPlacement ?? "bottom",
+							onChange: (e) => c(o.id, "labelPlacement", e),
+							style: { fontSize: 12 }
+						})]
+					}),
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Offset X"
+						}), /* @__PURE__ */ z(t, {
+							size: "xs",
+							type: "number",
+							value: String(o.data.labelOffsetX ?? 0),
+							onChange: (e) => c(o.id, "labelOffsetX", Number(e.target.value) || 0)
+						})]
+					}),
+					/* @__PURE__ */ B("div", {
+						className: "flow-inspector-row",
+						children: [/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Offset Y"
+						}), /* @__PURE__ */ z(t, {
+							size: "xs",
+							type: "number",
+							value: String(o.data.labelOffsetY ?? 0),
+							onChange: (e) => c(o.id, "labelOffsetY", Number(e.target.value) || 0)
+						})]
+					})
+				] })
+			]
+		}),
+		o.type === "mediaNode" && /* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [/* @__PURE__ */ z("div", {
+				className: "flow-inspector-section-title",
+				children: "Palette (Archify)"
+			}), /* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Palette"
+				}), /* @__PURE__ */ z("div", {
+					style: {
+						display: "flex",
+						flexWrap: "wrap",
+						gap: 4
+					},
+					children: O.map((e) => /* @__PURE__ */ z("button", {
+						type: "button",
+						title: D[e],
+						"aria-label": D[e],
+						onClick: () => l(o.id, k(e)),
+						style: {
+							width: 18,
+							height: 18,
+							borderRadius: 4,
+							cursor: "pointer",
+							background: E[e].fill,
+							border: `1.5px solid ${E[e].stroke}`
+						}
+					}, e))
+				})]
+			})]
+		}),
+		o.type !== "mediaNode" && o.type !== "shapeSvg" && /* @__PURE__ */ z(G, {
+			node: o,
+			onUpdateData: c
+		}),
+		o.type !== "mediaNode" && /* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [
+				/* @__PURE__ */ z("div", {
+					className: "flow-inspector-section-title",
+					children: "Card (Archify)"
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Subtitle"
+					}), /* @__PURE__ */ z(t, {
+						size: "xs",
+						value: o.data.sublabel ?? "",
+						placeholder: "secondary line",
+						onChange: (e) => c(o.id, "sublabel", e.target.value)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Sub Color"
+					}), /* @__PURE__ */ z(U, {
+						value: o.data.sublabelColor ?? "#94a3b8",
+						kind: "text",
+						customFallback: "#94a3b8",
+						onChange: (e) => c(o.id, "sublabelColor", e)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Tag"
+					}), /* @__PURE__ */ z(t, {
+						size: "xs",
+						value: o.data.tag ?? "",
+						placeholder: "corner pill",
+						onChange: (e) => c(o.id, "tag", e.target.value)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Tag Color"
+					}), /* @__PURE__ */ z(U, {
+						value: o.data.tagColor ?? o.data.stroke,
+						kind: "stroke",
+						customFallback: "#334155",
+						onChange: (e) => c(o.id, "tagColor", e)
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Tag Pos"
+					}), /* @__PURE__ */ z(i, {
+						options: [
+							{
+								value: "top-left",
+								label: "top-left"
+							},
+							{
+								value: "top-right",
+								label: "top-right"
+							},
+							{
+								value: "bottom-left",
+								label: "bottom-left"
+							},
+							{
+								value: "bottom-right",
+								label: "bottom-right"
+							}
+						],
+						value: o.data.tagPlacement ?? "top-right",
+						onChange: (e) => c(o.id, "tagPlacement", e),
+						style: { fontSize: 12 }
+					})]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "Palette"
+					}), /* @__PURE__ */ z("div", {
+						style: {
+							display: "flex",
+							flexWrap: "wrap",
+							gap: 4
+						},
+						children: O.map((e) => /* @__PURE__ */ z("button", {
+							type: "button",
+							title: D[e],
+							"aria-label": D[e],
+							onClick: () => l(o.id, k(e)),
+							style: {
+								width: 18,
+								height: 18,
+								borderRadius: 4,
+								cursor: "pointer",
+								background: E[e].fill,
+								border: `1.5px solid ${E[e].stroke}`
+							}
+						}, e))
+					})]
+				})
+			]
+		}),
+		o.type === "mediaNode" && /* @__PURE__ */ z(q, {
+			node: o,
+			onUpdateData: c
+		}),
+		/* @__PURE__ */ B("div", {
+			className: "flow-inspector-section",
+			children: [
+				/* @__PURE__ */ z("div", {
+					className: "flow-inspector-section-title",
+					children: "Transform"
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [
+						/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Rotate"
+						}),
+						/* @__PURE__ */ z(t, {
+							size: "xs",
+							type: "number",
+							value: String(o.data.rotation ?? 0),
+							onChange: (e) => c(o.id, "rotation", Number(e.target.value) || 0)
+						}),
+						/* @__PURE__ */ z("span", {
+							className: "flow-inspector-suffix",
+							style: {
+								fontSize: 10,
+								opacity: .5
+							},
+							children: "°"
+						})
+					]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [
+						/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Flip"
+						}),
+						/* @__PURE__ */ z(e, {
+							size: "xs",
+							variant: o.data.flipX ? "primary" : "ghost",
+							onClick: () => c(o.id, "flipX", !o.data.flipX),
+							square: !0,
+							children: /* @__PURE__ */ z("span", {
+								title: "Flip Horizontal",
+								children: "↔"
+							})
+						}),
+						/* @__PURE__ */ z(e, {
+							size: "xs",
+							variant: o.data.flipY ? "primary" : "ghost",
+							onClick: () => c(o.id, "flipY", !o.data.flipY),
+							square: !0,
+							children: /* @__PURE__ */ z("span", {
+								title: "Flip Vertical",
+								children: "↕"
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ B("div", {
+					className: "flow-inspector-row",
+					children: [
+						/* @__PURE__ */ z(n, {
+							size: "xs",
+							className: "flow-inspector-label",
+							children: "Quick"
+						}),
+						/* @__PURE__ */ z(e, {
+							size: "xs",
+							variant: "ghost",
+							onClick: () => c(o.id, "rotation", ((o.data.rotation ?? 0) + 90) % 360),
+							children: "+90°"
+						}),
+						/* @__PURE__ */ z(e, {
+							size: "xs",
+							variant: "ghost",
+							onClick: () => c(o.id, "rotation", ((o.data.rotation ?? 0) - 90 + 360) % 360),
+							children: "−90°"
+						})
+					]
+				})
+			]
+		})
+	] });
 }
-function Te({ node: l, onUpdateData: c }) {
-  const a = l.data.mediaKind ?? "markdown", o = l.data.aiConfig, f = ye(null), m = (t, r) => {
-    c(l.id, "aiConfig", {
-      gateway: "",
-      protocol: "openai",
-      model: "",
-      ...o,
-      [t]: r
-    });
-  };
-  return /* @__PURE__ */ s("div", {
-    className: "flow-inspector-section",
-    children: [/* @__PURE__ */ s("div", {
-      className: "flow-inspector-section-title",
-      children: ["Media · ", a]
-    }), a === "data" ? /* @__PURE__ */ e(xe, {
-      node: l,
-      onUpdateData: c
-    }) : a === "model3d" ? /* @__PURE__ */ s(E, { children: [
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "格式"
-        }), /* @__PURE__ */ e(y, {
-          options: [
-            {
-              value: "stl",
-              label: "STL"
-            },
-            {
-              value: "obj",
-              label: "OBJ"
-            },
-            {
-              value: "3mf",
-              label: "3MF"
-            }
-          ],
-          value: l.data.modelFormat ?? "stl",
-          onChange: (t) => c(l.id, "modelFormat", t)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row flow-inspector-multiline",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "模型链接"
-        }), /* @__PURE__ */ e(b, {
-          size: "xs",
-          value: l.data.mediaContent ?? "",
-          placeholder: "https://example.com/model.stl",
-          onChange: (t) => c(l.id, "mediaContent", t.target.value)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [
-          /* @__PURE__ */ e(n, {
-            size: "xs",
-            className: "flow-inspector-label",
-            children: "本地模型"
-          }),
-          /* @__PURE__ */ e("input", {
-            ref: f,
-            type: "file",
-            accept: ".stl,.obj,.3mf,model/stl,model/obj,model/3mf,application/vnd.ms-package.3dmanufacturing-3dmodel+xml",
-            hidden: !0,
-            onChange: (t) => {
-              const r = t.target.files?.[0];
-              if (t.target.value = "", !r) return;
-              if (r.size > 10 * 1024 * 1024) {
-                window.alert("本地模型不能超过 10 MiB，请改用模型链接。");
-                return;
-              }
-              const N = r.name.split(".").pop()?.toLowerCase();
-              if (N !== "stl" && N !== "obj" && N !== "3mf") {
-                window.alert("仅支持 STL、OBJ 和 3MF 模型。");
-                return;
-              }
-              const w = new FileReader();
-              w.onload = () => {
-                typeof w.result == "string" && (c(l.id, "modelFormat", N), c(l.id, "mediaContent", w.result));
-              }, w.onerror = () => window.alert("读取本地模型失败。"), w.readAsDataURL(r);
-            }
-          }),
-          /* @__PURE__ */ e(g, {
-            size: "xs",
-            variant: "neutral",
-            onClick: () => f.current?.click(),
-            children: "选择文件"
-          }),
-          l.data.mediaContent?.startsWith("data:") && /* @__PURE__ */ e("span", {
-            className: "flow-inspector-file-status",
-            children: "已嵌入"
-          })
-        ]
-      }),
-      /* @__PURE__ */ e("div", {
-        className: "flow-inspector-help",
-        children: "支持 STL、OBJ、3MF；本地文件将以 Base64 嵌入文档，最大 10 MiB。选中节点后可在内部拖拽旋转、滚轮缩放。"
-      })
-    ] }) : a === "image" ? /* @__PURE__ */ s(E, { children: [/* @__PURE__ */ s("div", {
-      className: "flow-inspector-row flow-inspector-multiline",
-      children: [/* @__PURE__ */ e(n, {
-        size: "xs",
-        className: "flow-inspector-label",
-        children: "图片链接"
-      }), /* @__PURE__ */ e(b, {
-        size: "xs",
-        value: l.data.mediaContent ?? "",
-        placeholder: "https://example.com/image.png",
-        onChange: (t) => c(l.id, "mediaContent", t.target.value)
-      })]
-    }), /* @__PURE__ */ e("div", {
-      className: "flow-inspector-help",
-      children: "支持 HTTP(S) 链接；选中图片节点后可直接粘贴图片并保存为 Base64。"
-    })] }) : a !== "ai" ? /* @__PURE__ */ e(K, {
-      label: {
-        markdown: "Markdown 源码",
-        html: "HTML 源码",
-        mermaid: "Mermaid 图表",
-        math: "LaTeX 公式"
-      }[a] ?? "内容",
-      value: l.data.mediaContent ?? "",
-      onChange: (t) => c(l.id, "mediaContent", t),
-      rows: 8
-    }) : /* @__PURE__ */ s(E, { children: [
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "协议"
-        }), /* @__PURE__ */ e(y, {
-          options: [{
-            value: "openai",
-            label: "OpenAI 兼容"
-          }, {
-            value: "anthropic",
-            label: "Anthropic 兼容"
-          }],
-          value: o?.protocol ?? "openai",
-          onChange: (t) => m("protocol", t),
-          style: { fontSize: 12 }
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        style: {
-          flexDirection: "column",
-          alignItems: "stretch",
-          gap: 4
-        },
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "接口地址"
-        }), /* @__PURE__ */ e(b, {
-          size: "xs",
-          value: o?.gateway ?? "",
-          placeholder: "https://api.openai.com/v1/chat/completions",
-          onChange: (t) => m("gateway", t.target.value)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        style: {
-          flexDirection: "column",
-          alignItems: "stretch",
-          gap: 4
-        },
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "模型"
-        }), /* @__PURE__ */ e(b, {
-          size: "xs",
-          value: o?.model ?? "",
-          placeholder: "gpt-4o-mini",
-          onChange: (t) => m("model", t.target.value)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        style: {
-          flexDirection: "column",
-          alignItems: "stretch",
-          gap: 4
-        },
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "API Key"
-        }), /* @__PURE__ */ e(b, {
-          size: "xs",
-          type: "password",
-          value: o?.apiKey ?? "",
-          placeholder: "sk-...",
-          onChange: (t) => m("apiKey", t.target.value)
-        })]
-      }),
-      /* @__PURE__ */ e(K, {
-        label: "System Prompt",
-        value: o?.systemPrompt ?? "",
-        onChange: (t) => m("systemPrompt", t),
-        rows: 3
-      }),
-      /* @__PURE__ */ e("div", {
-        style: {
-          fontSize: 10,
-          color: "color-mix(in oklch, var(--color-base-content) 45%, transparent)",
-          marginTop: 4
-        },
-        children: "密钥会随文档 JSON 一同导出，请谨慎分享。"
-      })
-    ] })]
-  });
+function q({ node: r, onUpdateData: a }) {
+	let o = r.data.mediaKind ?? "markdown", s = r.data.aiConfig, c = I(null), l = (e, t) => {
+		a(r.id, "aiConfig", {
+			gateway: "",
+			protocol: "openai",
+			model: "",
+			...s,
+			[e]: t
+		});
+	};
+	return /* @__PURE__ */ B("div", {
+		className: "flow-inspector-section",
+		children: [/* @__PURE__ */ B("div", {
+			className: "flow-inspector-section-title",
+			children: ["Media · ", o]
+		}), o === "data" ? /* @__PURE__ */ z(P, {
+			node: r,
+			onUpdateData: a
+		}) : o === "model3d" ? /* @__PURE__ */ B(R, { children: [
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "格式"
+				}), /* @__PURE__ */ z(i, {
+					options: [
+						{
+							value: "stl",
+							label: "STL"
+						},
+						{
+							value: "obj",
+							label: "OBJ"
+						},
+						{
+							value: "3mf",
+							label: "3MF"
+						}
+					],
+					value: r.data.modelFormat ?? "stl",
+					onChange: (e) => a(r.id, "modelFormat", e)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row flow-inspector-multiline",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "模型链接"
+				}), /* @__PURE__ */ z(t, {
+					size: "xs",
+					value: r.data.mediaContent ?? "",
+					placeholder: "https://example.com/model.stl",
+					onChange: (e) => a(r.id, "mediaContent", e.target.value)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [
+					/* @__PURE__ */ z(n, {
+						size: "xs",
+						className: "flow-inspector-label",
+						children: "本地模型"
+					}),
+					/* @__PURE__ */ z("input", {
+						ref: c,
+						type: "file",
+						accept: ".stl,.obj,.3mf,model/stl,model/obj,model/3mf,application/vnd.ms-package.3dmanufacturing-3dmodel+xml",
+						hidden: !0,
+						onChange: (e) => {
+							let t = e.target.files?.[0];
+							if (e.target.value = "", !t) return;
+							if (t.size > 10485760) {
+								window.alert("本地模型不能超过 10 MiB，请改用模型链接。");
+								return;
+							}
+							let n = t.name.split(".").pop()?.toLowerCase();
+							if (n !== "stl" && n !== "obj" && n !== "3mf") {
+								window.alert("仅支持 STL、OBJ 和 3MF 模型。");
+								return;
+							}
+							let i = new FileReader();
+							i.onload = () => {
+								typeof i.result == "string" && (a(r.id, "modelFormat", n), a(r.id, "mediaContent", i.result));
+							}, i.onerror = () => window.alert("读取本地模型失败。"), i.readAsDataURL(t);
+						}
+					}),
+					/* @__PURE__ */ z(e, {
+						size: "xs",
+						variant: "neutral",
+						onClick: () => c.current?.click(),
+						children: "选择文件"
+					}),
+					r.data.mediaContent?.startsWith("data:") && /* @__PURE__ */ z("span", {
+						className: "flow-inspector-file-status",
+						children: "已嵌入"
+					})
+				]
+			}),
+			/* @__PURE__ */ z("div", {
+				className: "flow-inspector-help",
+				children: "支持 STL、OBJ、3MF；本地文件将以 Base64 嵌入文档，最大 10 MiB。选中节点后可在内部拖拽旋转、滚轮缩放。"
+			})
+		] }) : o === "image" ? /* @__PURE__ */ B(R, { children: [/* @__PURE__ */ B("div", {
+			className: "flow-inspector-row flow-inspector-multiline",
+			children: [/* @__PURE__ */ z(n, {
+				size: "xs",
+				className: "flow-inspector-label",
+				children: "图片链接"
+			}), /* @__PURE__ */ z(t, {
+				size: "xs",
+				value: r.data.mediaContent ?? "",
+				placeholder: "https://example.com/image.png",
+				onChange: (e) => a(r.id, "mediaContent", e.target.value)
+			})]
+		}), /* @__PURE__ */ z("div", {
+			className: "flow-inspector-help",
+			children: "支持 HTTP(S) 链接；选中图片节点后可直接粘贴图片并保存为 Base64。"
+		})] }) : o === "ai" ? /* @__PURE__ */ B(R, { children: [
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "协议"
+				}), /* @__PURE__ */ z(i, {
+					options: [{
+						value: "openai",
+						label: "OpenAI 兼容"
+					}, {
+						value: "anthropic",
+						label: "Anthropic 兼容"
+					}],
+					value: s?.protocol ?? "openai",
+					onChange: (e) => l("protocol", e),
+					style: { fontSize: 12 }
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				style: {
+					flexDirection: "column",
+					alignItems: "stretch",
+					gap: 4
+				},
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "接口地址"
+				}), /* @__PURE__ */ z(t, {
+					size: "xs",
+					value: s?.gateway ?? "",
+					placeholder: "https://api.openai.com/v1/chat/completions",
+					onChange: (e) => l("gateway", e.target.value)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				style: {
+					flexDirection: "column",
+					alignItems: "stretch",
+					gap: 4
+				},
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "模型"
+				}), /* @__PURE__ */ z(t, {
+					size: "xs",
+					value: s?.model ?? "",
+					placeholder: "gpt-4o-mini",
+					onChange: (e) => l("model", e.target.value)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				style: {
+					flexDirection: "column",
+					alignItems: "stretch",
+					gap: 4
+				},
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "API Key"
+				}), /* @__PURE__ */ z(t, {
+					size: "xs",
+					type: "password",
+					value: s?.apiKey ?? "",
+					placeholder: "sk-...",
+					onChange: (e) => l("apiKey", e.target.value)
+				})]
+			}),
+			/* @__PURE__ */ z(N, {
+				label: "System Prompt",
+				value: s?.systemPrompt ?? "",
+				onChange: (e) => l("systemPrompt", e),
+				rows: 3
+			}),
+			/* @__PURE__ */ z("div", {
+				style: {
+					fontSize: 10,
+					color: "color-mix(in oklch, var(--color-base-content) 45%, transparent)",
+					marginTop: 4
+				},
+				children: "密钥会随文档 JSON 一同导出，请谨慎分享。"
+			})
+		] }) : /* @__PURE__ */ z(N, {
+			label: {
+				markdown: "Markdown 源码",
+				html: "HTML 源码",
+				mermaid: "Mermaid 图表",
+				math: "LaTeX 公式"
+			}[o] ?? "内容",
+			value: r.data.mediaContent ?? "",
+			onChange: (e) => a(r.id, "mediaContent", e),
+			rows: 8
+		})]
+	});
 }
-function Oe({ edge: l, onUpdateData: c, onUpdateType: a }) {
-  return /* @__PURE__ */ s("div", {
-    className: "flow-inspector-section",
-    children: [
-      /* @__PURE__ */ e("div", {
-        className: "flow-inspector-section-title",
-        children: "Edge"
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Type"
-        }), /* @__PURE__ */ e(y, {
-          options: se.map((o) => ({
-            value: o,
-            label: o
-          })),
-          value: l.type,
-          onChange: (o) => a(l.id, o),
-          style: { fontSize: 12 }
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Color"
-        }), /* @__PURE__ */ e(O, {
-          value: l.data.strokeColor,
-          kind: "line",
-          customFallback: "#374151",
-          onChange: (o) => c(l.id, "strokeColor", o)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Width"
-        }), /* @__PURE__ */ e(b, {
-          size: "xs",
-          type: "number",
-          value: String(l.data.strokeWidth ?? 2),
-          onChange: (o) => c(l.id, "strokeWidth", Number(o.target.value) || 2)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Animation"
-        }), /* @__PURE__ */ e(W, {
-          size: "sm",
-          checked: l.data.animated ?? !1,
-          onChange: (o) => c(l.id, "animated", o),
-          label: "预览时播放"
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Line"
-        }), /* @__PURE__ */ e(y, {
-          options: J.map((o) => ({
-            value: o,
-            label: o
-          })),
-          value: l.data.lineStyle ?? "solid",
-          onChange: (o) => c(l.id, "lineStyle", o),
-          style: { fontSize: 12 }
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Start"
-        }), /* @__PURE__ */ e(y, {
-          options: Z.map((o) => ({
-            value: o,
-            label: o
-          })),
-          value: l.data.markerStart ?? "none",
-          onChange: (o) => c(l.id, "markerStart", o),
-          style: { fontSize: 12 }
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "End"
-        }), /* @__PURE__ */ e(y, {
-          options: Z.map((o) => ({
-            value: o,
-            label: o
-          })),
-          value: l.data.markerEnd ?? "none",
-          onChange: (o) => c(l.id, "markerEnd", o),
-          style: { fontSize: 12 }
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Label"
-        }), /* @__PURE__ */ e(b, {
-          size: "xs",
-          value: l.data.labelText ?? "",
-          onChange: (o) => c(l.id, "labelText", o.target.value),
-          placeholder: "Edge label"
-        })]
-      })
-    ]
-  });
+function J({ edge: e, onUpdateData: a, onUpdateType: o }) {
+	return /* @__PURE__ */ B("div", {
+		className: "flow-inspector-section",
+		children: [
+			/* @__PURE__ */ z("div", {
+				className: "flow-inspector-section-title",
+				children: "Edge"
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Type"
+				}), /* @__PURE__ */ z(i, {
+					options: l.map((e) => ({
+						value: e,
+						label: e
+					})),
+					value: e.type,
+					onChange: (t) => o(e.id, t),
+					style: { fontSize: 12 }
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Color"
+				}), /* @__PURE__ */ z(U, {
+					value: e.data.strokeColor,
+					kind: "line",
+					customFallback: "#374151",
+					onChange: (t) => a(e.id, "strokeColor", t)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Width"
+				}), /* @__PURE__ */ z(t, {
+					size: "xs",
+					type: "number",
+					value: String(e.data.strokeWidth ?? 2),
+					onChange: (t) => a(e.id, "strokeWidth", Number(t.target.value) || 2)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Animation"
+				}), /* @__PURE__ */ z(r, {
+					size: "sm",
+					checked: e.data.animated ?? !1,
+					onChange: (t) => a(e.id, "animated", t),
+					label: "预览时播放"
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Line"
+				}), /* @__PURE__ */ z(i, {
+					options: s.map((e) => ({
+						value: e,
+						label: e
+					})),
+					value: e.data.lineStyle ?? "solid",
+					onChange: (t) => a(e.id, "lineStyle", t),
+					style: { fontSize: 12 }
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Start"
+				}), /* @__PURE__ */ z(i, {
+					options: c.map((e) => ({
+						value: e,
+						label: e
+					})),
+					value: e.data.markerStart ?? "none",
+					onChange: (t) => a(e.id, "markerStart", t),
+					style: { fontSize: 12 }
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "End"
+				}), /* @__PURE__ */ z(i, {
+					options: c.map((e) => ({
+						value: e,
+						label: e
+					})),
+					value: e.data.markerEnd ?? "none",
+					onChange: (t) => a(e.id, "markerEnd", t),
+					style: { fontSize: 12 }
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Label"
+				}), /* @__PURE__ */ z(t, {
+					size: "xs",
+					value: e.data.labelText ?? "",
+					onChange: (t) => a(e.id, "labelText", t.target.value),
+					placeholder: "Edge label"
+				})]
+			})
+		]
+	});
 }
-function Ee({ line: l, onUpdateData: c }) {
-  return /* @__PURE__ */ s("div", {
-    className: "flow-inspector-section",
-    children: [
-      /* @__PURE__ */ e("div", {
-        className: "flow-inspector-section-title",
-        children: "Line"
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Type"
-        }), /* @__PURE__ */ e("span", {
-          style: {
-            fontSize: 12,
-            color: "color-mix(in oklch, var(--color-base-content) 60%, transparent)"
-          },
-          children: l.type
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Color"
-        }), /* @__PURE__ */ e(O, {
-          value: l.strokeColor,
-          kind: "line",
-          customFallback: "#374151",
-          onChange: (a) => c(l.id, "strokeColor", a)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Width"
-        }), /* @__PURE__ */ e(b, {
-          size: "xs",
-          type: "number",
-          value: String(l.strokeWidth),
-          onChange: (a) => c(l.id, "strokeWidth", Number(a.target.value) || 2)
-        })]
-      }),
-      /* @__PURE__ */ s("div", {
-        className: "flow-inspector-row",
-        children: [/* @__PURE__ */ e(n, {
-          size: "xs",
-          className: "flow-inspector-label",
-          children: "Style"
-        }), /* @__PURE__ */ e(y, {
-          options: J.map((a) => ({
-            value: a,
-            label: a
-          })),
-          value: l.lineStyle,
-          onChange: (a) => c(l.id, "lineStyle", a),
-          style: { fontSize: 12 }
-        })]
-      })
-    ]
-  });
+function Y({ line: e, onUpdateData: r }) {
+	return /* @__PURE__ */ B("div", {
+		className: "flow-inspector-section",
+		children: [
+			/* @__PURE__ */ z("div", {
+				className: "flow-inspector-section-title",
+				children: "Line"
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Type"
+				}), /* @__PURE__ */ z("span", {
+					style: {
+						fontSize: 12,
+						color: "color-mix(in oklch, var(--color-base-content) 60%, transparent)"
+					},
+					children: e.type
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Color"
+				}), /* @__PURE__ */ z(U, {
+					value: e.strokeColor,
+					kind: "line",
+					customFallback: "#374151",
+					onChange: (t) => r(e.id, "strokeColor", t)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Width"
+				}), /* @__PURE__ */ z(t, {
+					size: "xs",
+					type: "number",
+					value: String(e.strokeWidth),
+					onChange: (t) => r(e.id, "strokeWidth", Number(t.target.value) || 2)
+				})]
+			}),
+			/* @__PURE__ */ B("div", {
+				className: "flow-inspector-row",
+				children: [/* @__PURE__ */ z(n, {
+					size: "xs",
+					className: "flow-inspector-label",
+					children: "Style"
+				}), /* @__PURE__ */ z(i, {
+					options: s.map((e) => ({
+						value: e,
+						label: e
+					})),
+					value: e.lineStyle,
+					onChange: (t) => r(e.id, "lineStyle", t),
+					style: { fontSize: 12 }
+				})]
+			})
+		]
+	});
 }
-export {
-  Ce as InspectorPanelContent,
-  Ue as default
-};
+//#endregion
+export { H as InspectorPanelContent, V as default };
 
 //# sourceMappingURL=InspectorPanel.js.map