@shwfed/config 2.5.3 → 2.6.0

package/dist/runtime/components/table/columns/2026-05-28/com.shwfed.table.column.combobox-multi/config.d.vue.ts

@@ -43,8 +43,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;
@@ -132,8 +132,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;

package/dist/runtime/components/table/columns/2026-05-28/com.shwfed.table.column.combobox-multi/config.vue.d.ts

@@ -43,8 +43,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;
@@ -132,8 +132,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;

package/dist/runtime/components/table/columns/2026-05-28/com.shwfed.table.column.combobox-single/config.d.vue.ts

@@ -43,8 +43,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;
@@ -132,8 +132,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;

package/dist/runtime/components/table/columns/2026-05-28/com.shwfed.table.column.combobox-single/config.vue.d.ts

@@ -43,8 +43,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;
@@ -132,8 +132,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 readonly target: string;
                 readonly operation: string;
             }[] | undefined;
-            readonly successMessage?: string | undefined;
             readonly accessor: string;
+            readonly successMessage?: string | undefined;
         };
         readonly grow?: boolean | undefined;
         readonly enableSorting?: boolean | undefined;

package/dist/runtime/components/table/config.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { computed, defineComponent, inject, onBeforeUnmount, provide, ref, watch } from "vue";
-import { provideCELContext } from "../../utils/cel-context";
+import { provideCELContext, provideScopeAncestor } from "../../utils/cel-context";
 import { BREADCRUMB_EXTENSION_KEY } from "../config/breadcrumb-extension";
 import { TABLE_COLUMN_LAYOUT_KEY } from "./column-layout";
 import { Icon } from "@iconify/vue";
@@ -272,6 +272,22 @@ const tableEventAncestor = computed(() => {
   };
 });
 provideEventAncestor(tableEventAncestor);
+const tableScopeAncestor = computed(() => {
+  const id = config.value.id;
+  if (!id) return null;
+  const displayName = config.value.displayName;
+  return {
+    id,
+    name: displayName && displayName.length > 0 ? displayName : void 0,
+    typeName: tableMetadata.name,
+    typeIcon: tableMetadata.icon,
+    members: [
+      { key: "row", label: "\u5F53\u524D\u884C", type: "dyn", description: "\u8BE5\u8868\u683C\u5F53\u524D\u884C\u7684\u6574\u884C\u6570\u636E" },
+      { key: "index", label: "\u884C\u5E8F\u53F7", type: "number", description: "\u8BE5\u8868\u683C\u5F53\u524D\u884C\u7684\u5E8F\u53F7\uFF0C\u4ECE `0` \u5F00\u59CB" }
+    ]
+  };
+});
+provideScopeAncestor(tableScopeAncestor);
 const isDrilled = computed(
   () => selectedActions.value || selectedQuery.value || columnFullPane.value
 );

package/dist/runtime/components/table/index.vue

@@ -809,6 +809,7 @@ export { TableConfig, createTableConfig, getColumnTechnicalKey } from "./schema"
                     :derived-columns="derivedEditableColumns"
                     :get-row="getRowAt"
                     :set-row="setRowAt"
+                    :scope-id="config?.id"
                   >
                     <tr
                       :ref="getRowRefFn(rows[r.index].id)"

package/dist/runtime/components/table/row-provider.d.vue.ts

@@ -5,6 +5,7 @@ type __VLS_Props = {
     derivedColumns: ReadonlyArray<FieldValue>;
     getRow: (i: number) => unknown;
     setRow: (i: number, value: unknown) => void;
+    scopeId?: string;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/table/row-provider.vue

@@ -2,7 +2,7 @@
 import { Effect } from "effect";
 import { customRef } from "vue";
 import { cel as _rawCel } from "../../utils/cel";
-import { celBindings, injectCELContext, provideCELContext } from "../../utils/cel-context";
+import { celBindings, injectCELContext, provideCELContext, provideScopeAddress } from "../../utils/cel-context";
 import { useDerived, useDerivedQuiescence } from "../form/utils/derived";
 import { provideFormState } from "../form/utils/state";
 defineOptions({ name: "ShwfedTableRowProvider" });
@@ -11,7 +11,8 @@ const props = defineProps({
   displayIndex: { type: Number, required: true },
   derivedColumns: { type: Array, required: true },
   getRow: { type: Function, required: true },
-  setRow: { type: Function, required: true }
+  setRow: { type: Function, required: true },
+  scopeId: { type: String, required: false }
 });
 const rowRef = customRef((track, trigger) => ({
   get() {
@@ -37,6 +38,12 @@ provideCELContext({
     value: () => props.displayIndex
   }
 });
+if (props.scopeId) {
+  provideScopeAddress(props.scopeId, {
+    row: () => rowRef.value,
+    index: () => props.displayIndex
+  });
+}
 const inherited = injectCELContext();
 const $cel = (expression, context) => _rawCel(expression, { ...celBindings(inherited), ...context });
 const formState = provideFormState(rowRef, "row");

package/dist/runtime/components/table/row-provider.vue.d.ts

@@ -5,6 +5,7 @@ type __VLS_Props = {
     derivedColumns: ReadonlyArray<FieldValue>;
     getRow: (i: number) => unknown;
     setRow: (i: number, value: unknown) => void;
+    scopeId?: string;
 };
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/ui/date-picker/DatePickerInput.d.vue.ts

@@ -24,8 +24,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     "onUpdate:modelValue"?: ((args_0: Date | undefined) => any) | undefined;
 }>, {
     size: "sm" | "md" | "lg";
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/date-picker/DatePickerInput.vue.d.ts

@@ -24,8 +24,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     "onUpdate:modelValue"?: ((args_0: Date | undefined) => any) | undefined;
 }>, {
     size: "sm" | "md" | "lg";
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/date-picker/DatePickerTimeInput.d.vue.ts

@@ -22,8 +22,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     size: "sm" | "md" | "lg";
     granularity: "hour" | "minute" | "second";
     hourCycle: 12 | 24;
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/date-picker/DatePickerTimeInput.vue.d.ts

@@ -22,8 +22,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     size: "sm" | "md" | "lg";
     granularity: "hour" | "minute" | "second";
     hourCycle: 12 | 24;
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/date-range-picker/DateRangePickerInput.d.vue.ts

@@ -29,8 +29,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     "onUpdate:endValue"?: ((args_0: Date | undefined) => any) | undefined;
 }>, {
     size: "sm" | "md" | "lg";
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/date-range-picker/DateRangePickerInput.vue.d.ts

@@ -29,8 +29,8 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     "onUpdate:endValue"?: ((args_0: Date | undefined) => any) | undefined;
 }>, {
     size: "sm" | "md" | "lg";
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/date-range-picker/DateRangePickerTimeInput.d.vue.ts

@@ -26,9 +26,9 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     size: "sm" | "md" | "lg";
     granularity: "hour" | "minute" | "second";
     hourCycle: 12 | 24;
-    rangeSeparatorIcon: string;
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
+    rangeSeparatorIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/date-range-picker/DateRangePickerTimeInput.vue.d.ts

@@ -26,9 +26,9 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
     size: "sm" | "md" | "lg";
     granularity: "hour" | "minute" | "second";
     hourCycle: 12 | 24;
-    rangeSeparatorIcon: string;
-    clearIcon: string;
     clearable: boolean;
+    clearIcon: string;
+    rangeSeparatorIcon: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/ui/expression-editor/CodeMirrorInput.d.vue.ts

@@ -0,0 +1,22 @@
+import type { HTMLAttributes } from 'vue';
+import type { ScopeInfo } from './scope-refs.js';
+type __VLS_Props = {
+    class?: HTMLAttributes['class'];
+    defaultValue?: string;
+    modelValue?: string;
+    multiline?: boolean;
+    placeholder?: string;
+    scopeLookup: Map<string, ScopeInfo>;
+};
+declare function insertAtSelection(text: string): void;
+declare function focus(): void;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    insertAtSelection: typeof insertAtSelection;
+    focus: typeof focus;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (payload: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((payload: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/expression-editor/CodeMirrorInput.vue

@@ -0,0 +1,134 @@
+<script setup>
+import { Compartment, EditorState } from "@codemirror/state";
+import { EditorView, keymap, placeholder as cmPlaceholder } from "@codemirror/view";
+import { defaultKeymap, history, historyKeymap } from "@codemirror/commands";
+import { onBeforeUnmount, onMounted, useTemplateRef, watch } from "vue";
+import { cn } from "../../../utils/cn";
+import { celHighlighting } from "./cel-language";
+import { scopeChips, scopeLookupFacet } from "./chip-extension";
+defineOptions({ name: "UiCodeMirrorInput" });
+const props = defineProps({
+  class: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
+  defaultValue: { type: String, required: false },
+  modelValue: { type: String, required: false },
+  multiline: { type: Boolean, required: false },
+  placeholder: { type: String, required: false },
+  scopeLookup: { type: Map, required: true }
+});
+const emits = defineEmits(["update:modelValue"]);
+const host = useTemplateRef("host");
+let view = null;
+const lookupCompartment = new Compartment();
+const modeCompartment = new Compartment();
+let applyingExternal = false;
+const editorTheme = EditorView.theme({
+  "&": {
+    fontSize: "0.875rem",
+    color: "var(--color-zinc-700)",
+    backgroundColor: "transparent"
+  },
+  "&.cm-focused": {
+    outline: "none"
+  },
+  ".cm-content": {
+    fontFamily: "var(--font-mono)",
+    padding: "7px 0",
+    lineHeight: "1.5",
+    caretColor: "var(--color-zinc-700)"
+  },
+  ".cm-placeholder": {
+    color: "var(--color-zinc-200)"
+  },
+  ".cm-scroller": {
+    fontFamily: "var(--font-mono)",
+    lineHeight: "1.5"
+  },
+  ".cm-line": {
+    padding: "0"
+  }
+});
+function modeExtension(multiline) {
+  if (multiline) return EditorView.lineWrapping;
+  return EditorState.transactionFilter.of((tr) => {
+    if (!tr.docChanged) return tr;
+    let hasNewline = false;
+    tr.changes.iterChanges((_fromA, _toA, _fromB, _toB, inserted) => {
+      if (inserted.lines > 1) hasNewline = true;
+    });
+    return hasNewline ? [] : tr;
+  });
+}
+function makeState(doc) {
+  return EditorState.create({
+    doc,
+    extensions: [
+      history(),
+      keymap.of([...defaultKeymap, ...historyKeymap]),
+      cmPlaceholder(props.placeholder ?? ""),
+      lookupCompartment.of(scopeLookupFacet.of(props.scopeLookup)),
+      modeCompartment.of(modeExtension(!!props.multiline)),
+      editorTheme,
+      // CEL syntax colours sit *under* the chips: the chip plugin's
+      // `Decoration.replace` widgets hide the `__scopes__[...]` spans, so the
+      // marks here only show through on ordinary expression text.
+      celHighlighting(),
+      scopeChips(),
+      EditorView.contentAttributes.of({ "aria-label": props.placeholder ?? "Expression" }),
+      EditorView.updateListener.of((update) => {
+        if (!update.docChanged || applyingExternal) return;
+        emits("update:modelValue", update.state.doc.toString());
+      })
+    ]
+  });
+}
+onMounted(() => {
+  if (!host.value) return;
+  view = new EditorView({
+    state: makeState(props.modelValue ?? props.defaultValue ?? ""),
+    parent: host.value
+  });
+});
+onBeforeUnmount(() => {
+  view?.destroy();
+  view = null;
+});
+watch(() => props.modelValue, (next) => {
+  if (!view) return;
+  const incoming = next ?? "";
+  if (incoming === view.state.doc.toString()) return;
+  applyingExternal = true;
+  view.dispatch({ changes: { from: 0, to: view.state.doc.length, insert: incoming } });
+  applyingExternal = false;
+});
+watch(() => props.scopeLookup, (lookup) => {
+  view?.dispatch({ effects: lookupCompartment.reconfigure(scopeLookupFacet.of(lookup)) });
+});
+watch(() => props.multiline, (multiline) => {
+  view?.dispatch({ effects: modeCompartment.reconfigure(modeExtension(!!multiline)) });
+});
+function insertAtSelection(text) {
+  if (!view) return;
+  const { from, to } = view.state.selection.main;
+  view.dispatch({
+    changes: { from, to, insert: text },
+    selection: { anchor: from + text.length }
+  });
+  view.focus();
+}
+function focus() {
+  view?.focus();
+}
+defineExpose({ insertAtSelection, focus });
+</script>
+
+<template>
+  <div
+    ref="host"
+    data-slot="input-group-control"
+    :class="cn(
+  'flex-1 min-w-0 self-stretch overflow-x-auto px-3',
+  props.multiline ? '[&_.cm-content]:min-h-16' : '[&_.cm-scroller]:items-center',
+  props.class
+)"
+  />
+</template>

package/dist/runtime/components/ui/expression-editor/CodeMirrorInput.vue.d.ts

@@ -0,0 +1,22 @@
+import type { HTMLAttributes } from 'vue';
+import type { ScopeInfo } from './scope-refs.js';
+type __VLS_Props = {
+    class?: HTMLAttributes['class'];
+    defaultValue?: string;
+    modelValue?: string;
+    multiline?: boolean;
+    placeholder?: string;
+    scopeLookup: Map<string, ScopeInfo>;
+};
+declare function insertAtSelection(text: string): void;
+declare function focus(): void;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
+    insertAtSelection: typeof insertAtSelection;
+    focus: typeof focus;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (payload: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((payload: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/expression-editor/ExpressionEditor.d.vue.ts

@@ -13,11 +13,11 @@ type __VLS_Props = {
     resultType?: string | string[];
     extraVars?: Record<string, VarSpec>;
 };
-declare var __VLS_14: {}, __VLS_108: {};
+declare var __VLS_14: {}, __VLS_130: {};
 type __VLS_Slots = {} & {
     leading?: (props: typeof __VLS_14) => any;
 } & {
-    trailing?: (props: typeof __VLS_108) => any;
+    trailing?: (props: typeof __VLS_130) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:modelValue": (payload: string) => any;

package/dist/runtime/components/ui/expression-editor/ExpressionEditor.vue

@@ -1,11 +1,13 @@
 <script setup>
 import { Icon } from "@iconify/vue";
-import { computed, ref, useSlots, watch } from "vue";
-import { injectCELContext } from "../../../utils/cel-context";
+import { computed, ref, useSlots, useTemplateRef, watch } from "vue";
+import { injectCELContext, useScopeAncestry } from "../../../utils/cel-context";
 import { Markdown } from "../markdown";
-import { cn } from "../../../utils/cn";
+import CodeMirrorInput from "./CodeMirrorInput.vue";
+import { buildScopeLookup } from "./scope-refs";
+import { buildScopeEntries, buildVarEntries } from "./picker-entries";
 import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "../command";
-import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupTextarea } from "../input-group";
+import { InputGroup, InputGroupAddon, InputGroupButton } from "../input-group";
 import { Popover, PopoverContent, PopoverTrigger } from "../popover";
 defineOptions({ name: "UiExpressionEditor" });
 const props = defineProps({
@@ -19,31 +21,31 @@ const props = defineProps({
 });
 const emits = defineEmits(["update:modelValue"]);
 const celContext = injectCELContext();
-const mergedEntries = computed(() => {
-  const out = Object.entries(celContext).map(
-    ([name, meta]) => ({ name, meta })
-  );
-  const seen = new Set(out.map((e) => e.name));
-  for (const [name, meta] of Object.entries(props.extraVars ?? {})) {
-    if (seen.has(name)) continue;
-    out.push({ name, meta });
-  }
-  return out;
-});
-const hasVars = computed(() => mergedEntries.value.length > 0);
+const scopeAncestry = useScopeAncestry();
+const varEntries = computed(() => buildVarEntries(celContext, props.extraVars));
+const scopeEntries = computed(() => buildScopeEntries(scopeAncestry.value.slice(1)));
+const scopeLookup = computed(() => buildScopeLookup(scopeAncestry.value));
+const hasVars = computed(() => varEntries.value.length > 0 || scopeEntries.value.length > 0);
 const open = ref(false);
 const entries = ref([]);
+const shownVars = computed(() => entries.value.filter((e) => e.group === "var"));
+const shownScopes = computed(() => entries.value.filter((e) => e.group === "scope"));
 const hoveredName = ref(null);
+const editorRef = useTemplateRef("editor");
+function insertVariable(text) {
+  editorRef.value?.insertAtSelection(text);
+  open.value = false;
+}
 watch(open, (v) => {
   if (v) {
-    entries.value = mergedEntries.value;
-    hoveredName.value = entries.value[0]?.name ?? null;
+    entries.value = [...varEntries.value, ...scopeEntries.value];
+    hoveredName.value = entries.value[0]?.id ?? null;
   }
 });
-const hoveredMeta = computed(
-  () => entries.value.find((e) => e.name === hoveredName.value)?.meta ?? null
+const hoveredEntry = computed(
+  () => entries.value.find((e) => e.id === hoveredName.value) ?? null
 );
-const hoveredDescription = computed(() => hoveredMeta.value?.description ?? "");
+const hoveredDescription = computed(() => hoveredEntry.value?.description ?? "");
 const resultTypeLabel = computed(() => {
   const rt = props.resultType;
   if (!rt) return null;
@@ -65,21 +67,15 @@ const addonAlign = computed(
     >
       <slot name="leading" />
     </InputGroupAddon>
-    <InputGroupTextarea
-      v-if="props.multiline"
+    <CodeMirrorInput
+      ref="editor"
       :model-value="props.modelValue"
       :default-value="props.defaultValue"
       :placeholder="props.placeholder"
-      :class="cn('font-mono text-xs', props.class)"
-      @update:model-value="(v) => emits('update:modelValue', String(v))"
-    />
-    <InputGroupInput
-      v-else
-      :model-value="props.modelValue"
-      :default-value="props.defaultValue"
-      :placeholder="props.placeholder"
-      :class="cn('font-mono text-xs', props.class)"
-      @update:model-value="(v) => emits('update:modelValue', String(v))"
+      :multiline="props.multiline"
+      :scope-lookup="scopeLookup"
+      :class="props.class"
+      @update:model-value="(v) => emits('update:modelValue', v)"
     />
     <InputGroupAddon
       v-if="showAddon"
@@ -109,34 +105,59 @@ const addonAlign = computed(
               <CommandEmpty>No variables.</CommandEmpty>
               <CommandGroup>
                 <CommandItem
-                  v-for="entry in entries"
-                  :key="entry.name"
-                  :value="entry.name"
-                  class="cursor-default gap-2"
-                  @mouseenter="hoveredName = entry.name"
-                  @focus="hoveredName = entry.name"
+                  v-for="entry in shownVars"
+                  :key="entry.id"
+                  :value="entry.display"
+                  class="cursor-pointer gap-2"
+                  @select="insertVariable(entry.insert)"
+                  @mouseenter="hoveredName = entry.id"
+                  @focus="hoveredName = entry.id"
                 >
-                  <span class="font-mono text-xs text-zinc-800">{{ entry.name }}</span>
-                  <span class="flex-1 truncate text-xs text-zinc-500">{{ entry.meta.label }}</span>
+                  <Icon
+                    icon="fluent:braces-variable-20-regular"
+                    class="size-3.5 shrink-0 text-zinc-400"
+                  />
+                  <span class="font-mono text-xs text-zinc-800">{{ entry.display }}</span>
+                  <span class="flex-1 truncate text-xs text-zinc-500">{{ entry.label }}</span>
                   <span class="rounded bg-purple-100 px-1.5 py-0.5 font-mono text-[10px] leading-none text-purple-700 select-none">
-                    {{ entry.meta.type }}
+                    {{ entry.type }}
+                  </span>
+                </CommandItem>
+              </CommandGroup>
+              <CommandGroup
+                v-if="shownScopes.length > 0"
+                heading="跨层引用"
+              >
+                <CommandItem
+                  v-for="entry in shownScopes"
+                  :key="entry.id"
+                  :value="`${entry.display} ${entry.id}`"
+                  class="cursor-pointer gap-2"
+                  @select="insertVariable(entry.insert)"
+                  @mouseenter="hoveredName = entry.id"
+                  @focus="hoveredName = entry.id"
+                >
+                  <Icon
+                    icon="fluent:link-20-regular"
+                    class="size-3.5 shrink-0 text-zinc-400"
+                  />
+                  <span class="flex-1 truncate text-xs text-zinc-700">{{ entry.display }}</span>
+                  <span class="rounded bg-purple-100 px-1.5 py-0.5 font-mono text-[10px] leading-none text-purple-700 select-none">
+                    {{ entry.type }}
                   </span>
                 </CommandItem>
               </CommandGroup>
             </CommandList>
             <div
-              v-if="hoveredMeta"
+              v-if="hoveredEntry"
               class="border-t border-zinc-200 px-3 py-2 group-data-[side=top]/popover:border-t-0 group-data-[side=top]/popover:border-b"
             >
-              <div class="mb-1 flex items-center gap-2">
-                <span class="font-mono text-xs text-zinc-800">{{ hoveredName }}</span>
-                <span class="rounded bg-purple-100 px-1.5 py-0.5 font-mono text-[10px] leading-none text-purple-700 select-none">
-                  {{ hoveredMeta.type }}
+              <div class="flex items-center gap-2">
+                <span class="text-xs font-medium text-zinc-700">{{ hoveredEntry.label }}</span>
+                <span class="ml-auto shrink-0 rounded bg-purple-100 px-1.5 py-0.5 font-mono text-[10px] leading-none text-purple-700 select-none">
+                  {{ hoveredEntry.type }}
                 </span>
               </div>
-              <div class="text-xs font-medium text-zinc-700">
-                {{ hoveredMeta.label }}
-              </div>
               <Markdown
                 v-if="hoveredDescription"
                 :source="hoveredDescription"

package/dist/runtime/components/ui/expression-editor/ExpressionEditor.vue.d.ts

@@ -13,11 +13,11 @@ type __VLS_Props = {
     resultType?: string | string[];
     extraVars?: Record<string, VarSpec>;
 };
-declare var __VLS_14: {}, __VLS_108: {};
+declare var __VLS_14: {}, __VLS_130: {};
 type __VLS_Slots = {} & {
     leading?: (props: typeof __VLS_14) => any;
 } & {
-    trailing?: (props: typeof __VLS_108) => any;
+    trailing?: (props: typeof __VLS_130) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:modelValue": (payload: string) => any;