@veltra/desktop 1.0.0

package/dist/components/expression-editor/internal/features/insertion/insertion-service.js

@@ -0,0 +1,33 @@
+import { $createVariableNode } from "../../../nodes/variable-node.js";
+import { $createTextNode, $getNodeByKey, $getSelection, $isRangeSelection } from "lexical";
+//#region src/components/expression-editor/internal/features/insertion/insertion-service.ts
+/**
+* Typed mutation gateway for variable insertion at @ trigger.
+* Must be called inside editor.update or via a gateway that runs updates.
+*/
+function insertVariableAtTrigger(editor, input) {
+	let result = false;
+	editor.update(() => {
+		const targetNode = $getNodeByKey(input.nodeKey);
+		if (!targetNode) return;
+		const selection = $getSelection();
+		if (!$isRangeSelection(selection)) return;
+		if (selection.focus.getNode().getKey() !== targetNode.getKey()) return;
+		const textContent = targetNode.getTextContent();
+		if (!textContent?.includes("@")) return;
+		const pos = input.charPosition;
+		const newNode = $createVariableNode(input.variable.value, input.variable.label, input.variable.type);
+		const nodeBefore = $createTextNode(textContent.slice(0, pos - 1));
+		const nodeAfter = $createTextNode(textContent.slice(pos));
+		targetNode.replace(nodeBefore);
+		nodeBefore.insertAfter(newNode);
+		newNode.insertAfter(nodeAfter);
+		newNode.selectEnd();
+		result = true;
+	});
+	return result;
+}
+//#endregion
+export { insertVariableAtTrigger };
+
+//# sourceMappingURL=insertion-service.js.map

package/dist/components/expression-editor/internal/features/insertion/insertion-service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"insertion-service.js","names":[],"sources":["../../../../../../src/components/expression-editor/internal/features/insertion/insertion-service.ts"],"sourcesContent":["import {\n  $createTextNode,\n  $getNodeByKey,\n  $getSelection,\n  $isRangeSelection,\n  type LexicalEditor\n} from 'lexical'\n\nimport { $createVariableNode } from '../../../nodes/variable-node'\n\nexport interface InsertVariableInput {\n  nodeKey: string\n  charPosition: number\n  variable: { value: string; label: string; type?: string }\n}\n\n/**\n * Typed mutation gateway for variable insertion at @ trigger.\n * Must be called inside editor.update or via a gateway that runs updates.\n */\nexport function insertVariableAtTrigger(\n  editor: LexicalEditor,\n  input: InsertVariableInput\n): boolean {\n  let result = false\n\n  editor.update(() => {\n    const targetNode = $getNodeByKey(input.nodeKey)\n    if (!targetNode) return\n\n    const selection = $getSelection()\n    if (!$isRangeSelection(selection)) return\n\n    const focusNode = selection.focus.getNode()\n    if (focusNode.getKey() !== targetNode.getKey()) return\n\n    const textContent = targetNode.getTextContent()\n    if (!textContent?.includes('@')) return\n\n    const pos = input.charPosition\n    const newNode = $createVariableNode(\n      input.variable.value,\n      input.variable.label,\n      input.variable.type\n    )\n    const nodeBefore = $createTextNode(textContent.slice(0, pos - 1))\n    const nodeAfter = $createTextNode(textContent.slice(pos))\n    targetNode.replace(nodeBefore)\n    nodeBefore.insertAfter(newNode)\n    newNode.insertAfter(nodeAfter)\n    newNode.selectEnd()\n    result = true\n  })\n\n  return result\n}\n"],"mappings":";;;;;;;AAoBA,SAAgB,wBACd,QACA,OACS;CACT,IAAI,SAAS;AAEb,QAAO,aAAa;EAClB,MAAM,aAAa,cAAc,MAAM,QAAQ;AAC/C,MAAI,CAAC,WAAY;EAEjB,MAAM,YAAY,eAAe;AACjC,MAAI,CAAC,kBAAkB,UAAU,CAAE;AAGnC,MADkB,UAAU,MAAM,SAAS,CAC7B,QAAQ,KAAK,WAAW,QAAQ,CAAE;EAEhD,MAAM,cAAc,WAAW,gBAAgB;AAC/C,MAAI,CAAC,aAAa,SAAS,IAAI,CAAE;EAEjC,MAAM,MAAM,MAAM;EAClB,MAAM,UAAU,oBACd,MAAM,SAAS,OACf,MAAM,SAAS,OACf,MAAM,SAAS,KAChB;EACD,MAAM,aAAa,gBAAgB,YAAY,MAAM,GAAG,MAAM,EAAE,CAAC;EACjE,MAAM,YAAY,gBAAgB,YAAY,MAAM,IAAI,CAAC;AACzD,aAAW,QAAQ,WAAW;AAC9B,aAAW,YAAY,QAAQ;AAC/B,UAAQ,YAAY,UAAU;AAC9B,UAAQ,WAAW;AACnB,WAAS;GACT;AAEF,QAAO"}

package/dist/components/expression-editor/nodes/variable-node.js

@@ -0,0 +1,94 @@
+import _sfc_main from "../../tag/tag.js";
+import { EXPRESSION_VARIABLE_DRAG_KEY_ATTR, EXPRESSION_VARIABLE_DRAG_MARKER_ATTR } from "../constants.js";
+import { createVNode, isVNode } from "vue";
+import { DecoratorNode } from "lexical";
+//#region src/components/expression-editor/nodes/variable-node.tsx
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+var VariableNode = class VariableNode extends DecoratorNode {
+	__variable;
+	__label;
+	__variableType;
+	__text;
+	__domNode = null;
+	static getType() {
+		return "variable";
+	}
+	static clone(node) {
+		return new VariableNode(node.__variable, node.__label, node.__variableType, node.__key);
+	}
+	static importJSON(serializedNode) {
+		const variableNode = serializedNode;
+		return new VariableNode(variableNode.variable, variableNode.label || variableNode.variable, variableNode.variableType);
+	}
+	constructor(variable, label, type, key) {
+		super(key);
+		this.__variable = variable;
+		this.__label = label || variable;
+		this.__variableType = type || "";
+		this.__text = `{${variable}}`;
+	}
+	createDOM() {
+		const span = document.createElement("span");
+		span.style.display = "inline-block";
+		span.classList.add("ultra-expression-variable-source");
+		span.setAttribute(EXPRESSION_VARIABLE_DRAG_MARKER_ATTR, "true");
+		span.setAttribute(EXPRESSION_VARIABLE_DRAG_KEY_ATTR, this.getKey());
+		span.draggable = true;
+		return span;
+	}
+	getTextContent() {
+		return this.__text;
+	}
+	updateDOM() {
+		return false;
+	}
+	decorate() {
+		const displayText = this.__variableType ? `${this.__label} (${this.__variableType})` : this.__label;
+		return createVNode(_sfc_main, {
+			"size": "small",
+			"style": "margin: 0 2px",
+			"type": "primary",
+			"round": true,
+			"title": this.__label
+		}, _isSlot(displayText) ? displayText : { default: () => [displayText] });
+	}
+	updateVariable(newVariable, newLabel, newType) {
+		const writable = this.getWritable();
+		writable.__variable = newVariable;
+		writable.__label = newLabel || newVariable;
+		writable.__variableType = newType ?? writable.__variableType;
+		writable.__text = `{${newVariable}}`;
+	}
+	getVariable() {
+		return this.__variable;
+	}
+	getLabel() {
+		return this.__label;
+	}
+	getVariableType() {
+		return this.__variableType;
+	}
+	exportJSON() {
+		return {
+			...super.exportJSON(),
+			type: "variable",
+			variable: this.__variable,
+			label: this.__label,
+			variableType: this.__variableType
+		};
+	}
+};
+/** 判断是否为变量节点 */
+function $isVariableNode(node) {
+	return node instanceof VariableNode;
+}
+/** 创建变量节点 */
+function $createVariableNode(variable, label, type) {
+	return new VariableNode(variable, label, type);
+}
+//#endregion
+export { $createVariableNode, $isVariableNode, VariableNode };
+
+//# sourceMappingURL=variable-node.js.map

package/dist/components/expression-editor/nodes/variable-node.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"variable-node.js","names":["DecoratorNode","LexicalNode","SerializedLexicalNode","NodeKey","VNode","UTag","EXPRESSION_VARIABLE_DRAG_KEY_ATTR","EXPRESSION_VARIABLE_DRAG_MARKER_ATTR","_isSlot","s","Object","prototype","toString","call","_isVNode","SerializedVariableNode","type","variable","label","variableType","VariableNode","__variable","__label","__variableType","__text","__domNode","HTMLElement","getType","clone","node","__key","importJSON","serializedNode","variableNode","constructor","key","createDOM","span","document","createElement","style","display","classList","add","setAttribute","getKey","draggable","getTextContent","updateDOM","decorate","displayText","_createVNode","default","updateVariable","newVariable","newLabel","newType","writable","getWritable","getVariable","getLabel","getVariableType","exportJSON","$isVariableNode","$createVariableNode"],"sources":["../../../../src/components/expression-editor/nodes/variable-node.tsx"],"sourcesContent":["import { DecoratorNode, type LexicalNode, type SerializedLexicalNode, type NodeKey } from 'lexical'\nimport type { VNode } from 'vue'\n\nimport { UTag } from '../../tag'\nimport {\n  EXPRESSION_VARIABLE_DRAG_KEY_ATTR,\n  EXPRESSION_VARIABLE_DRAG_MARKER_ATTR\n} from '../constants'\n\ninterface SerializedVariableNode extends SerializedLexicalNode {\n  type: 'variable'\n  variable: string\n  label?: string\n  variableType?: string\n}\n\nexport class VariableNode extends DecoratorNode<VNode> {\n  __variable: string\n  __label: string\n  __variableType: string\n  __text: string\n  __domNode: HTMLElement | null = null\n\n  static override getType(): string {\n    return 'variable'\n  }\n\n  static override clone(node: VariableNode): VariableNode {\n    return new VariableNode(node.__variable, node.__label, node.__variableType, node.__key)\n  }\n\n  static override importJSON(serializedNode: SerializedLexicalNode): VariableNode {\n    const variableNode = serializedNode as SerializedVariableNode\n    return new VariableNode(\n      variableNode.variable,\n      variableNode.label || variableNode.variable,\n      variableNode.variableType\n    )\n  }\n\n  constructor(variable: string, label?: string, type?: string, key?: NodeKey) {\n    super(key)\n\n    this.__variable = variable\n    this.__label = label || variable\n    this.__variableType = type || ''\n    this.__text = `{${variable}}`\n  }\n\n  override createDOM(): HTMLElement {\n    const span = document.createElement('span')\n    span.style.display = 'inline-block'\n    span.classList.add('ultra-expression-variable-source')\n    span.setAttribute(EXPRESSION_VARIABLE_DRAG_MARKER_ATTR, 'true')\n    span.setAttribute(EXPRESSION_VARIABLE_DRAG_KEY_ATTR, this.getKey())\n    span.draggable = true\n    return span\n  }\n\n  override getTextContent(): string {\n    return this.__text\n  }\n\n  override updateDOM(): false {\n    return false\n  }\n\n  override decorate(): VNode {\n    const displayText = this.__variableType\n      ? `${this.__label} (${this.__variableType})`\n      : this.__label\n    return (\n      <UTag size='small' style='margin: 0 2px' type='primary' round title={this.__label}>\n        {displayText}\n      </UTag>\n    )\n  }\n\n  updateVariable(newVariable: string, newLabel?: string, newType?: string): void {\n    const writable = this.getWritable()\n    writable.__variable = newVariable\n    writable.__label = newLabel || newVariable\n    writable.__variableType = newType ?? writable.__variableType\n    writable.__text = `{${newVariable}}`\n  }\n\n  getVariable(): string {\n    return this.__variable\n  }\n\n  getLabel(): string {\n    return this.__label\n  }\n\n  getVariableType(): string {\n    return this.__variableType\n  }\n\n  override exportJSON(): SerializedVariableNode {\n    return {\n      ...super.exportJSON(),\n      type: 'variable',\n      variable: this.__variable,\n      label: this.__label,\n      variableType: this.__variableType\n    }\n  }\n}\n\n/** 判断是否为变量节点 */\nexport function $isVariableNode(node: LexicalNode | null | undefined): boolean {\n  return node instanceof VariableNode\n}\n\n/** 创建变量节点 */\nexport function $createVariableNode(variable: string, label?: string, type?: string): VariableNode {\n  return new VariableNode(variable, label, type)\n}\n"],"mappings":";;;;;AAOqB,SAAAQ,QAAAC,GAAA;AAAA,QAAA,OAAAA,MAAA,cAAAC,OAAAC,UAAAC,SAAAC,KAAAJ,EAAA,KAAA,qBAAA,CAAAK,QAAAL,EAAA;;AASrB,IAAaW,eAAb,MAAaA,qBAAqBpB,cAAqB;CACrDqB;CACAC;CACAC;CACAC;CACAC,YAAgC;CAEhC,OAAgBE,UAAkB;AAChC,SAAO;;CAGT,OAAgBC,MAAMC,MAAkC;AACtD,SAAO,IAAIT,aAAaS,KAAKR,YAAYQ,KAAKP,SAASO,KAAKN,gBAAgBM,KAAKC,MAAM;;CAGzF,OAAgBC,WAAWC,gBAAqD;EAC9E,MAAMC,eAAeD;AACrB,SAAO,IAAIZ,aACTa,aAAahB,UACbgB,aAAaf,SAASe,aAAahB,UACnCgB,aAAad,aACd;;CAGHe,YAAYjB,UAAkBC,OAAgBF,MAAemB,KAAe;AAC1E,QAAMA,IAAI;AAEV,OAAKd,aAAaJ;AAClB,OAAKK,UAAUJ,SAASD;AACxB,OAAKM,iBAAiBP,QAAQ;AAC9B,OAAKQ,SAAS,IAAIP,SAAQ;;CAG5B,YAAkC;EAChC,MAAMoB,OAAOC,SAASC,cAAc,OAAO;AAC3CF,OAAKG,MAAMC,UAAU;AACrBJ,OAAKK,UAAUC,IAAI,mCAAmC;AACtDN,OAAKO,aAAarC,sCAAsC,OAAO;AAC/D8B,OAAKO,aAAatC,mCAAmC,KAAKuC,QAAQ,CAAC;AACnER,OAAKS,YAAY;AACjB,SAAOT;;CAGT,iBAAkC;AAChC,SAAO,KAAKb;;CAGd,YAA4B;AAC1B,SAAO;;CAGT,WAA2B;EACzB,MAAM0B,cAAc,KAAK3B,iBACrB,GAAG,KAAKD,QAAO,IAAK,KAAKC,eAAc,KACvC,KAAKD;AACT,SAAA6B,YAAA9C,WAAA;GAAA,QAAA;GAAA,SAAA;GAAA,QAAA;GAAA,SAAA;GAAA,SACuE,KAAKiB;GAAO,EAAAd,QAC9E0C,YAAW,GAAXA,cAAW,EAAAE,eAAA,CAAXF,YAAW,EAAA,CAAA;;CAKlBG,eAAeC,aAAqBC,UAAmBC,SAAwB;EAC7E,MAAMC,WAAW,KAAKC,aAAa;AACnCD,WAASpC,aAAaiC;AACtBG,WAASnC,UAAUiC,YAAYD;AAC/BG,WAASlC,iBAAiBiC,WAAWC,SAASlC;AAC9CkC,WAASjC,SAAS,IAAI8B,YAAW;;CAGnCK,cAAsB;AACpB,SAAO,KAAKtC;;CAGduC,WAAmB;AACjB,SAAO,KAAKtC;;CAGduC,kBAA0B;AACxB,SAAO,KAAKtC;;CAGd,aAA8C;AAC5C,SAAO;GACL,GAAG,MAAMuC,YAAY;GACrB9C,MAAM;GACNC,UAAU,KAAKI;GACfH,OAAO,KAAKI;GACZH,cAAc,KAAKI;GACpB;;;;AAKL,SAAgBwC,gBAAgBlC,MAA+C;AAC7E,QAAOA,gBAAgBT;;;AAIzB,SAAgB4C,oBAAoB/C,UAAkBC,OAAgBF,MAA6B;AACjG,QAAO,IAAII,aAAaH,UAAUC,OAAOF,KAAK"}

package/dist/components/expression-editor/parser.js

@@ -0,0 +1,32 @@
+import { $createVariableNode } from "./nodes/variable-node.js";
+import { $createTextNode } from "lexical";
+//#region src/components/expression-editor/parser.ts
+/**
+* 解析表达式内容
+* @param content 表达式内容
+* @param variableMap 变量映射表（可选，用于查找 label）
+* @returns 节点列表
+*/
+function parseContent(content, variableMap) {
+	const nodes = [];
+	let prevItem = null;
+	for (const item of content.matchAll(/\{([^}]+)\}/g)) {
+		const variable = item[1];
+		const startIndex = prevItem ? prevItem.index + prevItem[0].length : 0;
+		const endIndex = item.index;
+		const text = content.slice(startIndex, endIndex);
+		if (text) nodes.push($createTextNode(text));
+		prevItem = item;
+		const label = variableMap?.get(variable)?.label;
+		nodes.push($createVariableNode(variable, label));
+	}
+	if (prevItem) {
+		const tail = content.slice(prevItem.index + prevItem[0].length);
+		if (tail) nodes.push($createTextNode(tail));
+	} else if (content) nodes.push($createTextNode(content));
+	return nodes;
+}
+//#endregion
+export { parseContent };
+
+//# sourceMappingURL=parser.js.map

package/dist/components/expression-editor/parser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parser.js","names":[],"sources":["../../../src/components/expression-editor/parser.ts"],"sourcesContent":["import { $createTextNode, type LexicalNode } from 'lexical'\n\nimport type { VariableItem } from '../../types'\nimport { $createVariableNode } from './nodes/variable-node'\n\n/**\n * 解析表达式内容\n * @param content 表达式内容\n * @param variableMap 变量映射表（可选，用于查找 label）\n * @returns 节点列表\n */\nexport function parseContent(\n  content: string,\n  variableMap?: Map<string, VariableItem>\n): LexicalNode[] {\n  const nodes: LexicalNode[] = []\n\n  let prevItem: null | RegExpExecArray = null\n  for (const item of content.matchAll(/\\{([^}]+)\\}/g)) {\n    const variable = item[1]!\n\n    const startIndex = prevItem ? prevItem.index! + prevItem[0].length : 0\n    const endIndex = item.index\n\n    const text = content.slice(startIndex, endIndex)\n\n    if (text) {\n      nodes.push($createTextNode(text))\n    }\n\n    prevItem = item\n\n    // 从映射表中查找对应的 label\n    const label = variableMap?.get(variable)?.label\n    nodes.push($createVariableNode(variable, label))\n  }\n\n  if (prevItem) {\n    const tail = content.slice(prevItem.index! + prevItem[0].length)\n    if (tail) nodes.push($createTextNode(tail))\n  } else if (content) {\n    nodes.push($createTextNode(content))\n  }\n\n  return nodes\n}\n"],"mappings":";;;;;;;;;AAWA,SAAgB,aACd,SACA,aACe;CACf,MAAM,QAAuB,EAAE;CAE/B,IAAI,WAAmC;AACvC,MAAK,MAAM,QAAQ,QAAQ,SAAS,eAAe,EAAE;EACnD,MAAM,WAAW,KAAK;EAEtB,MAAM,aAAa,WAAW,SAAS,QAAS,SAAS,GAAG,SAAS;EACrE,MAAM,WAAW,KAAK;EAEtB,MAAM,OAAO,QAAQ,MAAM,YAAY,SAAS;AAEhD,MAAI,KACF,OAAM,KAAK,gBAAgB,KAAK,CAAC;AAGnC,aAAW;EAGX,MAAM,QAAQ,aAAa,IAAI,SAAS,EAAE;AAC1C,QAAM,KAAK,oBAAoB,UAAU,MAAM,CAAC;;AAGlD,KAAI,UAAU;EACZ,MAAM,OAAO,QAAQ,MAAM,SAAS,QAAS,SAAS,GAAG,OAAO;AAChE,MAAI,KAAM,OAAM,KAAK,gBAAgB,KAAK,CAAC;YAClC,QACT,OAAM,KAAK,gBAAgB,QAAQ,CAAC;AAGtC,QAAO"}

package/dist/components/expression-editor/plain-text.js

@@ -0,0 +1,19 @@
+import { clearDragVisualState } from "./use-expression-drag-drop.js";
+import { registerCommandPacks } from "./internal/features/commands/register-command-packs.js";
+import { onBeforeUnmount } from "vue";
+//#region src/components/expression-editor/plain-text.ts
+/**
+* Registers plain-text editing commands for the expression editor.
+* Delegates to capability command packs (text-editing, clipboard, drag-drop, optional context-keys).
+*/
+function registerPlainText(editor, options) {
+	const removeListener = registerCommandPacks(editor, { getContextCommands: options?.getContextCommands });
+	onBeforeUnmount(() => {
+		clearDragVisualState(editor);
+		removeListener();
+	});
+}
+//#endregion
+export { registerPlainText };
+
+//# sourceMappingURL=plain-text.js.map

package/dist/components/expression-editor/plain-text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plain-text.js","names":[],"sources":["../../../src/components/expression-editor/plain-text.ts"],"sourcesContent":["import type { LexicalEditor } from 'lexical'\nimport { onBeforeUnmount } from 'vue'\n\nimport { registerCommandPacks } from './internal/features/commands/register-command-packs'\nimport { clearDragVisualState } from './use-expression-drag-drop'\n\nexport interface RegisterPlainTextOptions {\n  /** Optional context-key commands registration (e.g. from use-context). Merged when provided. */\n  getContextCommands?: () => () => void\n}\n\n/**\n * Registers plain-text editing commands for the expression editor.\n * Delegates to capability command packs (text-editing, clipboard, drag-drop, optional context-keys).\n */\nexport function registerPlainText(editor: LexicalEditor, options?: RegisterPlainTextOptions): void {\n  const removeListener = registerCommandPacks(editor, {\n    getContextCommands: options?.getContextCommands\n  })\n\n  onBeforeUnmount(() => {\n    clearDragVisualState(editor)\n    removeListener()\n  })\n}\n"],"mappings":";;;;;;;;AAeA,SAAgB,kBAAkB,QAAuB,SAA0C;CACjG,MAAM,iBAAiB,qBAAqB,QAAQ,EAClD,oBAAoB,SAAS,oBAC9B,CAAC;AAEF,uBAAsB;AACpB,uBAAqB,OAAO;AAC5B,kBAAgB;GAChB"}

package/dist/components/expression-editor/style.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/components/expression-editor/style.js

@@ -0,0 +1 @@
+import "./style2.css";

package/dist/components/expression-editor/style2.css

@@ -0,0 +1,359 @@
+@charset "UTF-8";
+/** flex布局 */
+/**
+* 设置css变量
+* 参数1:变量前缀
+* 参数2: 一个由值组成的列表或者由key, value组成的map
+* css-var(height, (
+*   large: 40px
+*   default: 32px
+*   small: 24px
+* ))
+* 生成的css变量:
+* --u-height-large: 40px;
+* --u-height-default: 32px;
+* --u-height-small: 24px;
+*/
+/** 暗色：data-theme 与系统偏好，与 UITheme.injectBuiltInThemes 选择器策略一致 */
+.u-expression-editor {
+  position: relative;
+  background-color: var(--u-bg-color-top);
+  border-width: var(--u-border-width);
+  border-style: var(--u-border-style);
+  border-color: var(--u-border-color);
+  border-radius: var(--u-radius-default);
+}
+.u-expression-editor:hover:not(.is-disabled):not(.is-readonly) {
+  border-color: var(--u-color-primary);
+}
+.u-expression-editor:focus-within:not(.is-disabled):not(.is-readonly) {
+  border-color: var(--u-color-primary);
+  outline: none;
+}
+.u-expression-editor.is-disabled {
+  background-color: var(--u-color-disabled);
+  cursor: not-allowed;
+  border-color: var(--u-border-color);
+}
+.u-expression-editor.is-disabled:hover {
+  border-color: var(--u-border-color);
+}
+.u-expression-editor.is-readonly {
+  background-color: var(--u-bg-color-middle);
+  cursor: default;
+  border-color: var(--u-border-color);
+  user-select: text;
+}
+.u-expression-editor.is-readonly:hover {
+  border-color: var(--u-border-color);
+}
+.u-expression-editor__tools {
+  text-align: right;
+  margin-bottom: var(--u-gap-small);
+}
+.u-expression-editor__tools > * {
+  cursor: pointer;
+  transition: color 0.2s ease;
+}
+.u-expression-editor__tools > *:hover {
+  color: var(--u-color-primary);
+}
+.u-expression-editor__paragraph {
+  margin: 0;
+  padding: 0;
+  line-height: 1.6;
+}
+.u-expression-editor__placeholder {
+  position: absolute;
+  color: var(--u-text-color-placeholder);
+  pointer-events: none;
+  user-select: none;
+  transition: opacity 0.2s ease;
+  font-weight: 400;
+}
+.u-expression-editor__container {
+  position: relative;
+  outline: none;
+  min-height: 1.5em;
+  line-height: 1.6;
+  color: var(--u-text-color-main);
+  word-break: break-word;
+  white-space: pre-wrap;
+  overflow-y: auto;
+}
+.u-expression-editor__container:empty::before {
+  content: "​";
+}
+.u-expression-editor__container .ultra-expression-variable-source {
+  cursor: grab;
+}
+.u-expression-editor__container .ultra-expression-variable-source.is-dragging {
+  opacity: 0.5;
+  cursor: grabbing;
+}
+.u-expression-editor__container .expression-editor__drop-indicator {
+  position: absolute;
+  width: 2px;
+  border-radius: 999px;
+  transform: translateX(-1px);
+  pointer-events: none;
+  background-color: var(--u-color-primary);
+  box-shadow: 0 0 0 1px var(--u-color-primary-light-8);
+  transition: opacity 0.12s ease;
+  z-index: 3;
+}
+.u-expression-editor__fallback {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  margin-top: 8px;
+  padding-top: 8px;
+  border-top: var(--u-border);
+}
+.u-expression-editor__fallback-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+}
+.u-expression-editor__fallback-label {
+  min-width: 0;
+  flex: 1;
+  font-size: 12px;
+  color: var(--u-text-color-main);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.u-expression-editor__fallback-actions {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  flex-shrink: 0;
+}
+.u-expression-editor__fallback-button {
+  border: var(--u-border);
+  border-radius: var(--u-radius-small);
+  background-color: var(--u-bg-color-top);
+  color: var(--u-text-color-main);
+  font-size: 12px;
+  line-height: 1;
+  height: 22px;
+  padding: 0 8px;
+  cursor: pointer;
+  transition: all 0.12s ease;
+}
+.u-expression-editor__fallback-button:hover:not(:disabled) {
+  color: var(--u-color-primary);
+  border-color: var(--u-color-primary);
+  background-color: var(--u-color-primary-light-9);
+}
+.u-expression-editor__fallback-button:disabled {
+  cursor: not-allowed;
+  color: var(--u-text-color-placeholder);
+  border-color: var(--u-border-color);
+  background-color: var(--u-bg-color-middle);
+}
+.u-expression-editor--small {
+  min-height: var(--u-form-component-height-small);
+  padding: var(--u-gap-small);
+}
+.u-expression-editor--small .u-expression-editor__placeholder {
+  top: var(--u-gap-small);
+  left: var(--u-gap-small);
+  font-size: var(--u-font-size-main-small);
+}
+.u-expression-editor--small .u-expression-editor__container {
+  font-size: var(--u-font-size-main-small);
+}
+.u-expression-editor--small .u-expression-editor__clear {
+  font-size: var(--u-font-size-main-small);
+}
+.u-expression-editor--default {
+  min-height: var(--u-form-component-height-default);
+  padding: var(--u-gap-default);
+}
+.u-expression-editor--default .u-expression-editor__placeholder {
+  top: var(--u-gap-default);
+  left: var(--u-gap-default);
+  font-size: var(--u-font-size-main-default);
+}
+.u-expression-editor--default .u-expression-editor__container {
+  font-size: var(--u-font-size-main-default);
+}
+.u-expression-editor--default .u-expression-editor__clear {
+  font-size: var(--u-font-size-main-default);
+}
+.u-expression-editor--large {
+  min-height: var(--u-form-component-height-large);
+  padding: var(--u-gap-large);
+}
+.u-expression-editor--large .u-expression-editor__placeholder {
+  top: var(--u-gap-large);
+  left: var(--u-gap-large);
+  font-size: var(--u-font-size-main-large);
+}
+.u-expression-editor--large .u-expression-editor__container {
+  font-size: var(--u-font-size-main-large);
+}
+.u-expression-editor--large .u-expression-editor__clear {
+  font-size: var(--u-font-size-main-large);
+}
+.u-expression-editor__variable-empty {
+  padding: 16px;
+  text-align: center;
+  color: var(--u-text-color-second);
+  font-size: 13px;
+  font-weight: 500;
+}
+.u-expression-editor__variable-list {
+  padding: 6px 0;
+  margin: 0;
+  list-style: none;
+  max-height: 240px;
+  overflow-y: auto;
+  background-color: var(--u-bg-color-top);
+}
+.u-expression-editor__variable-list::-webkit-scrollbar {
+  width: 8px;
+}
+.u-expression-editor__variable-list::-webkit-scrollbar-track {
+  background-color: var(--u-bg-color-middle);
+  border-radius: var(--u-radius-small);
+}
+.u-expression-editor__variable-list::-webkit-scrollbar-thumb {
+  background-color: var(--u-text-color-placeholder);
+  border-radius: var(--u-radius-small);
+  border: 2px solid var(--u-bg-color-middle);
+}
+.u-expression-editor__variable-list::-webkit-scrollbar-thumb:hover {
+  background-color: var(--u-text-color-second);
+}
+.u-expression-editor__variable-item {
+  padding: 8px 14px;
+  margin: 2px 6px;
+  cursor: pointer;
+  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
+  border-radius: var(--u-radius-default);
+  font-size: 13px;
+  color: var(--u-text-color-main);
+  font-weight: 500;
+}
+.u-expression-editor__variable-item:hover {
+  background-color: var(--u-color-primary-light-9);
+  color: var(--u-color-primary);
+  transform: translateX(2px);
+}
+.u-expression-editor__variable-item.is-active {
+  background-color: var(--u-color-primary);
+  color: var(--u-text-color-white);
+  font-weight: 600;
+  box-shadow: 0 2px 4px var(--u-shadow-color);
+}
+.u-expression-editor__filter {
+  padding: 6px;
+  border-bottom: var(--u-border);
+}
+.u-expression-editor__breadcrumbs {
+  display: flex;
+  align-items: center;
+  padding: 6px 10px;
+  border-bottom: var(--u-border);
+  background-color: var(--u-bg-color-middle);
+  font-size: 12px;
+  color: var(--u-text-color-second);
+  overflow-x: auto;
+  white-space: nowrap;
+}
+.u-expression-editor__breadcrumbs::-webkit-scrollbar {
+  height: 4px;
+}
+.u-expression-editor__breadcrumbs::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+.u-expression-editor__breadcrumbs::-webkit-scrollbar-thumb {
+  background-color: var(--u-border-color);
+  border-radius: 2px;
+}
+.u-expression-editor__breadcrumbs::-webkit-scrollbar-thumb:hover {
+  background-color: var(--u-text-color-placeholder);
+}
+.u-expression-editor__breadcrumb-item {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+.u-expression-editor__breadcrumb-link {
+  cursor: pointer;
+  transition: all 0.15s ease;
+  font-weight: 500;
+  padding: 2px 6px;
+  border-radius: var(--u-radius-small);
+}
+.u-expression-editor__breadcrumb-link:hover {
+  color: var(--u-color-primary);
+  background-color: var(--u-bg-color-hover);
+}
+.u-expression-editor__breadcrumb-link--active {
+  color: var(--u-color-primary);
+  font-weight: 600;
+}
+.u-expression-editor__breadcrumb-separator {
+  font-size: 10px;
+  color: var(--u-text-color-placeholder);
+  margin: 0 2px;
+}
+.u-expression-editor__panel {
+  min-height: 200px;
+  max-height: 360px;
+}
+.u-expression-editor__panel-list {
+  height: 100%;
+  min-height: 200px;
+}
+.u-expression-editor__panel-content {
+  padding: 2px 0;
+}
+.u-expression-editor__item {
+  padding: 5px 10px;
+  cursor: pointer;
+  user-select: none;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  transition: all 0.12s ease;
+  color: var(--u-text-color-main);
+  font-size: 13px;
+  line-height: 1.4;
+  border-radius: var(--u-radius-small);
+  margin: 1px 4px;
+}
+.u-expression-editor__item:hover {
+  background-color: var(--u-bg-color-hover);
+}
+.u-expression-editor__item.is-active {
+  background-color: var(--u-color-primary);
+  color: var(--u-text-color-white);
+  font-weight: 500;
+  box-shadow: 0 1px 3px var(--u-shadow-color);
+}
+.u-expression-editor__item.is-active .u-expression-editor__item-expand {
+  color: var(--u-text-color-white);
+}
+.u-expression-editor__item-label {
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.u-expression-editor__item-expand {
+  flex-shrink: 0;
+  color: var(--u-text-color-placeholder);
+  font-size: 11px;
+  transition: color 0.15s ease;
+}
+.u-expression-editor__empty {
+  padding: 40px 20px;
+  text-align: center;
+}

package/dist/components/expression-editor/use-context.js

@@ -0,0 +1,69 @@
+import { shallowRef } from "vue";
+import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_LOW, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ENTER_COMMAND, KEY_ESCAPE_COMMAND, SELECTION_CHANGE_COMMAND } from "lexical";
+import { mergeRegister } from "@lexical/utils";
+//#region src/components/expression-editor/use-context.ts
+function useContext(editor) {
+	const contextVisible = shallowRef(false);
+	const contextTriggerDom = shallowRef();
+	const textNode = shallowRef();
+	const charPosition = shallowRef(0);
+	const pickerKeyHandlerRef = shallowRef(null);
+	function registerPickerKeyHandler(handler) {
+		pickerKeyHandlerRef.value = handler;
+	}
+	function openContextMenu(triggerElement) {
+		contextVisible.value = true;
+		contextTriggerDom.value = triggerElement;
+	}
+	function closeContextMenu() {
+		contextVisible.value = false;
+		contextTriggerDom.value = void 0;
+	}
+	function PreventDefaultListener(event) {
+		if (event.isComposing) return false;
+		if (contextVisible.value) {
+			event.preventDefault();
+			pickerKeyHandlerRef.value?.(event);
+			return true;
+		}
+		return false;
+	}
+	function registerContextCommands() {
+		return mergeRegister(editor.registerCommand(SELECTION_CHANGE_COMMAND, () => {
+			const selection = $getSelection();
+			if (contextVisible.value) return true;
+			if (!$isRangeSelection(selection) || selection.anchor.offset !== selection.focus.offset) {
+				closeContextMenu();
+				return false;
+			}
+			const cursorPosition = selection.focus.offset;
+			const node = selection.focus.getNode();
+			const textContent = node.getTextContent();
+			const isAtTriggerLeft = textContent[cursorPosition - 1] === "@";
+			const isAtTriggerRight = textContent[cursorPosition] === "@";
+			if (!isAtTriggerLeft && !isAtTriggerRight) {
+				closeContextMenu();
+				return false;
+			}
+			textNode.value = node;
+			charPosition.value = isAtTriggerLeft ? cursorPosition : cursorPosition + 1;
+			const triggerDom = editor.getElementByKey(node.getKey());
+			if (contextVisible.value) {
+				if (triggerDom && triggerDom !== contextTriggerDom.value) contextTriggerDom.value = triggerDom;
+			} else triggerDom && openContextMenu(triggerDom);
+			return true;
+		}, COMMAND_PRIORITY_EDITOR), editor.registerCommand(KEY_ENTER_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_ESCAPE_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_ARROW_UP_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW), editor.registerCommand(KEY_ARROW_DOWN_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW));
+	}
+	return {
+		contextVisible,
+		contextTriggerDom,
+		textNode,
+		charPosition,
+		registerPickerKeyHandler,
+		registerContextCommands
+	};
+}
+//#endregion
+export { useContext };
+
+//# sourceMappingURL=use-context.js.map

package/dist/components/expression-editor/use-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-context.js","names":[],"sources":["../../../src/components/expression-editor/use-context.ts"],"sourcesContent":["import { mergeRegister } from '@lexical/utils'\nimport {\n  $getSelection,\n  $isRangeSelection,\n  COMMAND_PRIORITY_LOW,\n  COMMAND_PRIORITY_EDITOR,\n  KEY_ARROW_DOWN_COMMAND,\n  KEY_ARROW_UP_COMMAND,\n  type LexicalEditor,\n  SELECTION_CHANGE_COMMAND,\n  KEY_ENTER_COMMAND,\n  KEY_ESCAPE_COMMAND,\n  TextNode\n} from 'lexical'\nimport { shallowRef, type ShallowRef } from 'vue'\n\nimport { CONTEXT_TRIGGER_CHAR } from './constants'\n\nexport function useContext(editor: LexicalEditor): {\n  contextVisible: ShallowRef<boolean>\n  contextTriggerDom: ShallowRef<HTMLElement | undefined>\n  textNode: ShallowRef<TextNode | undefined>\n  charPosition: ShallowRef<number>\n  registerPickerKeyHandler: (handler: ((e: KeyboardEvent) => void) | null) => void\n  /** Returns cleanup for context-key commands. Injected into registerCommandPacks. */\n  registerContextCommands: () => () => void\n} {\n  const contextVisible = shallowRef(false)\n  const contextTriggerDom = shallowRef<HTMLElement>()\n  const textNode = shallowRef<TextNode>()\n  const charPosition = shallowRef(0)\n  const pickerKeyHandlerRef = shallowRef<((e: KeyboardEvent) => void) | null>(null)\n\n  function registerPickerKeyHandler(handler: ((e: KeyboardEvent) => void) | null) {\n    pickerKeyHandlerRef.value = handler\n  }\n\n  function openContextMenu(triggerElement: HTMLElement) {\n    contextVisible.value = true\n\n    contextTriggerDom.value = triggerElement\n  }\n\n  function closeContextMenu() {\n    contextVisible.value = false\n    contextTriggerDom.value = undefined\n  }\n\n  function PreventDefaultListener(event: KeyboardEvent) {\n    if (event.isComposing) return false\n    if (contextVisible.value) {\n      event.preventDefault()\n      pickerKeyHandlerRef.value?.(event)\n      return true\n    }\n    return false\n  }\n\n  function registerContextCommands(): () => void {\n    return mergeRegister(\n      // 选取变更命令，实现呼出上下文菜单的核心\n      editor.registerCommand(\n        SELECTION_CHANGE_COMMAND,\n        () => {\n          const selection = $getSelection()\n\n          // 如果菜单已经打开，不要因为失焦而关闭（用户可能在输入搜索框）\n          if (contextVisible.value) {\n            return true\n          }\n\n          // 选区类型必须为rangeSelection且选取的anchor和focus的offset值必须一致\n          // 否则关闭上下文菜单\n          if (!$isRangeSelection(selection) || selection.anchor.offset !== selection.focus.offset) {\n            closeContextMenu()\n\n            return false\n          }\n\n          const cursorPosition = selection.focus.offset\n          const node = selection.focus.getNode()\n          const textContent = node.getTextContent()\n\n          // 检测光标是否在 '@' 左右\n          const isAtTriggerLeft = textContent[cursorPosition - 1] === CONTEXT_TRIGGER_CHAR\n          const isAtTriggerRight = textContent[cursorPosition] === CONTEXT_TRIGGER_CHAR\n\n          // 光标左右的字符都不是'@'时，关闭上下文菜单\n          if (!isAtTriggerLeft && !isAtTriggerRight) {\n            closeContextMenu()\n            return false\n          }\n\n          // 更新文本节点和光标位置\n          // charPosition: index of first char after '@' (for slice in handleVariableSelect)\n          // isAtTriggerLeft: '@' is left of cursor (cursor already after '@') → charPosition = cursorPosition\n          // isAtTriggerRight: '@' is right of cursor (cursor before '@') → charPosition = cursorPosition + 1\n          textNode.value = node as TextNode\n          charPosition.value = isAtTriggerLeft ? cursorPosition : cursorPosition + 1\n\n          const triggerDom = editor.getElementByKey(node.getKey())\n\n          // 如果弹框已经打开，更新位置；否则打开弹框\n          if (contextVisible.value) {\n            // 更新触发元素位置（如果变化了）\n            if (triggerDom && triggerDom !== contextTriggerDom.value) {\n              contextTriggerDom.value = triggerDom\n            }\n          } else {\n            triggerDom && openContextMenu(triggerDom)\n          }\n\n          return true\n        },\n        COMMAND_PRIORITY_EDITOR\n      ),\n\n      // 当上下文菜单显示时，阻止下面的命令的默认行为\n      editor.registerCommand(KEY_ENTER_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_ESCAPE_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_ARROW_UP_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_ARROW_DOWN_COMMAND, PreventDefaultListener, COMMAND_PRIORITY_LOW)\n    )\n  }\n\n  return {\n    contextVisible,\n    contextTriggerDom,\n    textNode,\n    charPosition,\n    registerPickerKeyHandler,\n    registerContextCommands\n  }\n}\n"],"mappings":";;;;AAkBA,SAAgB,WAAW,QAQzB;CACA,MAAM,iBAAiB,WAAW,MAAM;CACxC,MAAM,oBAAoB,YAAyB;CACnD,MAAM,WAAW,YAAsB;CACvC,MAAM,eAAe,WAAW,EAAE;CAClC,MAAM,sBAAsB,WAAgD,KAAK;CAEjF,SAAS,yBAAyB,SAA8C;AAC9E,sBAAoB,QAAQ;;CAG9B,SAAS,gBAAgB,gBAA6B;AACpD,iBAAe,QAAQ;AAEvB,oBAAkB,QAAQ;;CAG5B,SAAS,mBAAmB;AAC1B,iBAAe,QAAQ;AACvB,oBAAkB,QAAQ,KAAA;;CAG5B,SAAS,uBAAuB,OAAsB;AACpD,MAAI,MAAM,YAAa,QAAO;AAC9B,MAAI,eAAe,OAAO;AACxB,SAAM,gBAAgB;AACtB,uBAAoB,QAAQ,MAAM;AAClC,UAAO;;AAET,SAAO;;CAGT,SAAS,0BAAsC;AAC7C,SAAO,cAEL,OAAO,gBACL,gCACM;GACJ,MAAM,YAAY,eAAe;AAGjC,OAAI,eAAe,MACjB,QAAO;AAKT,OAAI,CAAC,kBAAkB,UAAU,IAAI,UAAU,OAAO,WAAW,UAAU,MAAM,QAAQ;AACvF,sBAAkB;AAElB,WAAO;;GAGT,MAAM,iBAAiB,UAAU,MAAM;GACvC,MAAM,OAAO,UAAU,MAAM,SAAS;GACtC,MAAM,cAAc,KAAK,gBAAgB;GAGzC,MAAM,kBAAkB,YAAY,iBAAiB,OAAA;GACrD,MAAM,mBAAmB,YAAY,oBAAA;AAGrC,OAAI,CAAC,mBAAmB,CAAC,kBAAkB;AACzC,sBAAkB;AAClB,WAAO;;AAOT,YAAS,QAAQ;AACjB,gBAAa,QAAQ,kBAAkB,iBAAiB,iBAAiB;GAEzE,MAAM,aAAa,OAAO,gBAAgB,KAAK,QAAQ,CAAC;AAGxD,OAAI,eAAe;QAEb,cAAc,eAAe,kBAAkB,MACjD,mBAAkB,QAAQ;SAG5B,eAAc,gBAAgB,WAAW;AAG3C,UAAO;KAET,wBACD,EAGD,OAAO,gBAAgB,mBAAmB,wBAAwB,qBAAqB,EACvF,OAAO,gBAAgB,oBAAoB,wBAAwB,qBAAqB,EACxF,OAAO,gBAAgB,sBAAsB,wBAAwB,qBAAqB,EAC1F,OAAO,gBAAgB,wBAAwB,wBAAwB,qBAAqB,CAC7F;;AAGH,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACD"}