@shwfed/config 2.7.8 → 2.9.0

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, provideScopeAncestor } from "../../utils/cel-context";
+import { provideCELContext, provideScopeAncestor, provideSelectionRoster } 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";
@@ -310,6 +310,10 @@ const selectedColumnEntry = computed(() => {
   if (!c) return void 0;
   return findColumnEntry(c.type, c.compatibilityDate);
 });
+const selectionRoster = computed(
+  () => editingColumns.value.filter((c) => findColumnEntry(c.type, c.compatibilityDate)?.metadata?.selection).map((c) => ({ id: c.id, name: columnLabel(c) }))
+);
+provideSelectionRoster(selectionRoster);
 const pinnedLeftIds = computed(() => {
   const ids = editingGeneralConfig.value.initialState?.columnPinning?.left;
   return new Set(Array.isArray(ids) ? ids : []);
@@ -914,6 +918,16 @@ function setPaginationEnabled(enabled) {
   const { pagination: _drop, ...rest } = cur;
   config.value = rest;
 }
+function setPersistQueryEnabled(enabled) {
+  if (enabled) {
+    writeGeneralPatch({ persistQuery: true });
+    return;
+  }
+  const cur = config.value;
+  if (!cur || cur.persistQuery === void 0) return;
+  const { persistQuery: _drop, ...rest } = cur;
+  config.value = rest;
+}
 function setPageSize(value) {
   const cur = readGeneral();
   if (!cur.pagination) return;
@@ -1462,6 +1476,26 @@ const tableQueryValue = computed({
 
             <Separator />
 
+            <div class="flex items-center gap-2">
+              <h3 class="text-xs font-medium text-zinc-500">
+                {{ generalFieldTitle("persistQuery") }}
+              </h3>
+              <Switch
+                size="sm"
+                :model-value="editingGeneralConfig.persistQuery === true"
+                aria-label="搜索条件持久化"
+                @update:model-value="setPersistQueryEnabled"
+              />
+            </div>
+            <p
+              v-if="generalFieldDescription('persistQuery')"
+              class="text-xs text-zinc-400"
+            >
+              {{ generalFieldDescription("persistQuery") }}
+            </p>
+
+            <Separator />
+
             <h3 class="text-xs font-medium text-zinc-500">
               样式
             </h3>

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

@@ -31,6 +31,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;
+        persistQuery?: boolean;
         initialState?: import("effect/Schema").Schema.Type<import("effect/Schema").Struct<{
             columnVisibility: import("effect/Schema").optional<import("effect/Schema").Record$<typeof import("effect/Schema").String, typeof import("effect/Schema").Boolean>>;
             columnOrder: import("effect/Schema").optional<import("effect/Schema").Array$<typeof import("effect/Schema").String>>;
@@ -76,6 +77,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;
+        persistQuery?: boolean;
         initialState?: import("effect/Schema").Schema.Type<import("effect/Schema").Struct<{
             columnVisibility: import("effect/Schema").optional<import("effect/Schema").Record$<typeof import("effect/Schema").String, typeof import("effect/Schema").Boolean>>;
             columnOrder: import("effect/Schema").optional<import("effect/Schema").Array$<typeof import("effect/Schema").String>>;

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

@@ -30,6 +30,7 @@ import { evaluateInitial } from "../form/utils/initial";
 import { provideTableInstanceId } from "./utils/instance";
 import { provideSharedFetchLayer } from "./utils/shared-fetch";
 import { provideEventTarget } from "../../share/event-bus";
+import { usePersistedQuery } from "../../share/use-persisted-query";
 import { findColumn } from "./utils/resolve";
 import { interpolateMarkdown } from "./utils/runtime";
 import { carrySymbolId, createRowKeyResolver } from "./utils/row-key";
@@ -42,6 +43,11 @@ const rowData = defineModel("rows", { type: Array, ...{ default: () => [] } });
 const serverTotal = ref(void 0);
 const isFetching = ref(false);
 const queryState = ref({});
+const persistedQuery = usePersistedQuery(
+  config.value?.id,
+  queryState,
+  () => config.value?.persistQuery === true
+);
 const { t, locale } = useI18n({
   inheritLocale: true,
   messages: {
@@ -379,6 +385,7 @@ async function fetchDataSource() {
   }
 }
 async function resetQuery() {
+  persistedQuery.clear();
   const initial = config.value?.query?.initial;
   if (!initial) {
     queryState.value = {};
@@ -435,6 +442,7 @@ provideEventTarget(tableInstanceId, {
 const queryRef = ref(null);
 onMounted(async () => {
   await queryRef.value?.seeded;
+  persistedQuery.restore();
   await fetchDataSource();
 });
 watch(

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

@@ -31,6 +31,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;
+        persistQuery?: boolean;
         initialState?: import("effect/Schema").Schema.Type<import("effect/Schema").Struct<{
             columnVisibility: import("effect/Schema").optional<import("effect/Schema").Record$<typeof import("effect/Schema").String, typeof import("effect/Schema").Boolean>>;
             columnOrder: import("effect/Schema").optional<import("effect/Schema").Array$<typeof import("effect/Schema").String>>;
@@ -76,6 +77,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;
+        persistQuery?: boolean;
         initialState?: import("effect/Schema").Schema.Type<import("effect/Schema").Struct<{
             columnVisibility: import("effect/Schema").optional<import("effect/Schema").Record$<typeof import("effect/Schema").String, typeof import("effect/Schema").Boolean>>;
             columnOrder: import("effect/Schema").optional<import("effect/Schema").Array$<typeof import("effect/Schema").String>>;

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

@@ -3,6 +3,7 @@ import { Effect } from "effect";
 import { customRef } from "vue";
 import { cel as _rawCel } from "../../utils/cel";
 import { celBindings, injectCELContext, provideCELContext, provideScopeAddress } from "../../utils/cel-context";
+import { provideSelectionsRegistry } from "../../utils/selections-registry";
 import { useDerived, useDerivedQuiescence } from "../form/utils/derived";
 import { provideFormState } from "../form/utils/state";
 defineOptions({ name: "ShwfedTableRowProvider" });
@@ -24,6 +25,7 @@ const rowRef = customRef((track, trigger) => ({
     trigger();
   }
 }));
+const selections = provideSelectionsRegistry();
 provideCELContext({
   row: {
     type: "dyn",
@@ -36,6 +38,12 @@ provideCELContext({
     label: "\u884C\u5E8F\u53F7",
     description: "\u5F53\u524D\u884C\u5728\u6240\u6709\u6570\u636E\u4E2D\u7684\u5E8F\u53F7\uFF0C\u4ECE `0` \u5F00\u59CB\u3002",
     value: () => props.displayIndex
+  },
+  selections: {
+    type: "dyn",
+    label: "\u9009\u4E2D\u9879",
+    description: "\u672C\u884C\u5404\u9009\u62E9\u5217\u5F53\u524D\u9009\u4E2D\u9879\u7684\u5B8C\u6574\u5BF9\u8C61\uFF08\u6309\u5217\u6807\u8BC6\uFF09\u3002",
+    value: () => selections.entries.value
   }
 });
 if (props.scopeId) {

package/dist/runtime/components/table/schema.d.ts

@@ -255,6 +255,7 @@ export declare function TableConfig(configure: (env: Environment) => void): Sche
         readonly pageSizes?: readonly number[] | undefined;
         readonly pageIndex?: number | undefined;
     } | undefined;
+    readonly persistQuery?: boolean | undefined;
     readonly initialState?: {
         readonly expanded?: boolean | {
             readonly [x: string]: boolean;
@@ -536,6 +537,7 @@ export declare function TableConfig(configure: (env: Environment) => void): Sche
             message: Schema.SchemaClass<string, string, never>;
         }>]>>;
     }>>;
+    persistQuery: Schema.optional<Schema.SchemaClass<boolean, boolean, never>>;
     initialState: Schema.optional<Schema.Struct<{
         columnVisibility: Schema.optional<Schema.Record$<typeof Schema.String, typeof Schema.Boolean>>;
         columnOrder: Schema.optional<Schema.Array$<typeof Schema.String>>;
@@ -703,6 +705,7 @@ export declare function createTableConfig(body: Omit<Schema.Schema.Type<ReturnTy
         readonly pageSizes?: readonly number[] | undefined;
         readonly pageIndex?: number | undefined;
     } | undefined;
+    persistQuery?: boolean | undefined;
     initialState?: {
         readonly expanded?: boolean | {
             readonly [x: string]: boolean;
@@ -761,6 +764,7 @@ export type TableConfigValue = Readonly<{
     cellStyle?: string;
     style?: string;
     pagination?: Schema.Schema.Type<typeof Pagination>;
+    persistQuery?: boolean;
     initialState?: Schema.Schema.Type<typeof InitialState>;
 }>;
 export type PaginationValue = Schema.Schema.Type<typeof Pagination>;

package/dist/runtime/components/table/schema.js

@@ -328,6 +328,10 @@ export function TableConfig(configure) {
     pagination: Schema.optional(Pagination).annotations({
       title: "\u5206\u9875"
     }),
+    persistQuery: Schema.optional(Schema.Boolean.annotations({
+      title: "\u641C\u7D22\u6761\u4EF6\u6301\u4E45\u5316",
+      description: "\u5F00\u542F\u540E\uFF0C\u641C\u7D22\u6761\u4EF6\u8868\u5355\u7684\u5F53\u524D\u503C\u4F1A\u5199\u5165\u6D4F\u89C8\u5668\u4F1A\u8BDD\u5B58\u50A8\uFF08sessionStorage\uFF09\uFF0C\u5237\u65B0\u9875\u9762\u540E\u81EA\u52A8\u6062\u590D\uFF0C\u76F4\u5230\u5173\u95ED\u6807\u7B7E\u9875\u6216\u79BB\u5F00\u7AD9\u70B9\u3002\u9700\u8981\u8868\u683C\u5DF2\u914D\u7F6E ID\u3002"
+    })),
     initialState: Schema.optional(InitialState)
   }).pipe(Schema.filter((cfg) => {
     if (cfg.dataSource?.total !== void 0 && cfg.pagination === void 0) {

package/dist/runtime/components/table/utils/resolve.d.ts

@@ -9,6 +9,13 @@ type SchemaFactory = (configure: (env: Environment) => void) => AnySchema;
 export type ColumnMetadata = Readonly<{
     name: string;
     icon: string;
+    /**
+     * True when this column publishes its resolved option to the per-row
+     * `selections` registry (its runtime keyed by `column.id`). Set it together
+     * with the runtime publish so the expression editor never advertises a column
+     * that writes nothing. Mirrors `FieldMetadata.selection` on the form host.
+     */
+    selection?: boolean;
 }>;
 export type ColumnDefDeps = Readonly<{
     getLocaleText: (value: LocaleValue | undefined) => string | undefined;

package/dist/runtime/components/table/utils/shared.js

@@ -1,6 +1,7 @@
 import { Schema } from "effect";
 import { Icon } from "@iconify/vue";
 import { h } from "vue";
+import { SELECTIONS_VAR } from "../../../utils/cel-context.js";
 import { Expression, LocaleMarkdown } from "../../../share/expression.js";
 import { Locale } from "../../../share/locale.js";
 import { md } from "../../../share/markdown.js";
@@ -97,6 +98,9 @@ export function registerRowVariablesIfAbsent(env) {
   if (!declared.has("index")) {
     env.registerVariable("index", "number", { label: "\u884C\u5E8F\u53F7", description: "\u884C\u7D22\u5F15" });
   }
+  if (!declared.has(SELECTIONS_VAR)) {
+    env.registerVariable(SELECTIONS_VAR, "dyn", { label: "\u9009\u4E2D\u9879", description: "\u672C\u884C\u5404\u9009\u62E9\u5217\u5F53\u524D\u9009\u4E2D\u9879\u7684\u5B8C\u6574\u5BF9\u8C61\uFF08\u6309\u5217\u6807\u8BC6\uFF09" });
+  }
 }
 function configureWithRow(configure) {
   return (env) => {

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

@@ -7,6 +7,7 @@ type __VLS_Props = {
     multiline?: boolean;
     placeholder?: string;
     scopeLookup: Map<string, ScopeInfo>;
+    selectionLookup: Map<string, string>;
 };
 declare function insertAtSelection(text: string): void;
 declare function focus(): void;

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

@@ -6,6 +6,7 @@ import { onBeforeUnmount, onMounted, useTemplateRef, watch } from "vue";
 import { cn } from "../../../utils/cn";
 import { celHighlighting } from "./cel-language";
 import { scopeChips, scopeLookupFacet } from "./chip-extension";
+import { selectionChips, selectionLookupFacet } from "./selection-chip-extension";
 defineOptions({ name: "UiCodeMirrorInput" });
 const props = defineProps({
   class: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
@@ -13,12 +14,14 @@ const props = defineProps({
   modelValue: { type: String, required: false },
   multiline: { type: Boolean, required: false },
   placeholder: { type: String, required: false },
-  scopeLookup: { type: Map, required: true }
+  scopeLookup: { type: Map, required: true },
+  selectionLookup: { type: Map, required: true }
 });
 const emits = defineEmits(["update:modelValue"]);
 const host = useTemplateRef("host");
 let view = null;
 const lookupCompartment = new Compartment();
+const selectionLookupCompartment = new Compartment();
 const modeCompartment = new Compartment();
 let applyingExternal = false;
 const editorTheme = EditorView.theme({
@@ -73,6 +76,7 @@ function makeState(doc) {
       keymap.of([...defaultKeymap, ...historyKeymap]),
       cmPlaceholder(props.placeholder ?? ""),
       lookupCompartment.of(scopeLookupFacet.of(props.scopeLookup)),
+      selectionLookupCompartment.of(selectionLookupFacet.of(props.selectionLookup)),
       modeCompartment.of(modeExtension(!!props.multiline)),
       editorTheme,
       // CEL syntax colours sit *under* the chips: the chip plugin's
@@ -80,6 +84,7 @@ function makeState(doc) {
       // marks here only show through on ordinary expression text.
       celHighlighting(),
       scopeChips(),
+      selectionChips(),
       EditorView.contentAttributes.of({ "aria-label": props.placeholder ?? "Expression" }),
       EditorView.updateListener.of((update) => {
         if (!update.docChanged || applyingExternal) return;
@@ -110,6 +115,9 @@ watch(() => props.modelValue, (next) => {
 watch(() => props.scopeLookup, (lookup) => {
   view?.dispatch({ effects: lookupCompartment.reconfigure(scopeLookupFacet.of(lookup)) });
 });
+watch(() => props.selectionLookup, (lookup) => {
+  view?.dispatch({ effects: selectionLookupCompartment.reconfigure(selectionLookupFacet.of(lookup)) });
+});
 watch(() => props.multiline, (multiline) => {
   view?.dispatch({ effects: modeCompartment.reconfigure(modeExtension(!!multiline)) });
 });

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

@@ -7,6 +7,7 @@ type __VLS_Props = {
     multiline?: boolean;
     placeholder?: string;
     scopeLookup: Map<string, ScopeInfo>;
+    selectionLookup: Map<string, string>;
 };
 declare function insertAtSelection(text: string): void;
 declare function focus(): void;

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

@@ -14,11 +14,11 @@ type __VLS_Props = {
     extraVars?: Record<string, VarSpec>;
     unlistedVarsAreDyn?: boolean;
 };
-declare var __VLS_13: {}, __VLS_129: {};
+declare var __VLS_13: {}, __VLS_150: {};
 type __VLS_Slots = {} & {
     leading?: (props: typeof __VLS_13) => any;
 } & {
-    trailing?: (props: typeof __VLS_129) => any;
+    trailing?: (props: typeof __VLS_150) => 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

@@ -2,11 +2,12 @@
 import { Icon } from "@iconify/vue";
 import { computed, ref, useSlots, useTemplateRef, watch } from "vue";
 import { buildCheckEnvironment, evaluateExpression } from "../../../share/expression";
-import { injectCELContext, useScopeAncestry } from "../../../utils/cel-context";
+import { injectCELContext, useScopeAncestry, useSelectionRoster } from "../../../utils/cel-context";
 import { Markdown } from "../markdown";
 import CodeMirrorInput from "./CodeMirrorInput.vue";
 import { buildScopeLookup } from "./scope-refs";
-import { buildScopeEntries, buildVarEntries } from "./picker-entries";
+import { buildSelectionLookup } from "./selection-refs";
+import { buildScopeEntries, buildSelectionEntries, buildVarEntries } from "./picker-entries";
 import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "../command";
 import { InputGroup, InputGroupAddon, InputGroupButton } from "../input-group";
 import { Popover, PopoverContent, PopoverTrigger } from "../popover";
@@ -24,10 +25,13 @@ const props = defineProps({
 const emits = defineEmits(["update:modelValue"]);
 const celContext = injectCELContext();
 const scopeAncestry = useScopeAncestry();
+const selectionRoster = useSelectionRoster();
 const varEntries = computed(() => buildVarEntries(celContext, props.extraVars));
 const scopeEntries = computed(() => buildScopeEntries(scopeAncestry.value.slice(1)));
+const selectionEntries = computed(() => buildSelectionEntries(selectionRoster.value));
 const scopeLookup = computed(() => buildScopeLookup(scopeAncestry.value));
-const hasVars = computed(() => varEntries.value.length > 0 || scopeEntries.value.length > 0);
+const selectionLookup = computed(() => buildSelectionLookup(selectionRoster.value));
+const hasVars = computed(() => varEntries.value.length > 0 || scopeEntries.value.length > 0 || selectionEntries.value.length > 0);
 const checkEnvironment = computed(() => {
   const vars = /* @__PURE__ */ new Map();
   for (const [name, entry] of Object.entries(celContext)) vars.set(name, entry.type);
@@ -46,6 +50,7 @@ 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 shownSelections = computed(() => entries.value.filter((e) => e.group === "selection"));
 const hoveredName = ref(null);
 const editorRef = useTemplateRef("editor");
 function insertVariable(text) {
@@ -54,7 +59,7 @@ function insertVariable(text) {
 }
 watch(open, (v) => {
   if (v) {
-    entries.value = [...varEntries.value, ...scopeEntries.value];
+    entries.value = [...varEntries.value, ...selectionEntries.value, ...scopeEntries.value];
     hoveredName.value = entries.value[0]?.id ?? null;
   }
 });
@@ -91,6 +96,7 @@ const addonAlign = computed(
         :placeholder="props.placeholder"
         :multiline="props.multiline"
         :scope-lookup="scopeLookup"
+        :selection-lookup="selectionLookup"
         :class="props.class"
         @update:model-value="(v) => emits('update:modelValue', v)"
       />
@@ -141,6 +147,29 @@ const addonAlign = computed(
                     </span>
                   </CommandItem>
                 </CommandGroup>
+                <CommandGroup
+                  v-if="shownSelections.length > 0"
+                  heading="选中项"
+                >
+                  <CommandItem
+                    v-for="entry in shownSelections"
+                    :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:cursor-click-20-regular"
+                      class="size-3.5 shrink-0 text-teal-500"
+                    />
+                    <span class="flex-1 truncate text-xs text-zinc-700">{{ entry.display }}</span>
+                    <span class="rounded bg-teal-100 px-1.5 py-0.5 font-mono text-[10px] leading-none text-teal-700 select-none">
+                      {{ entry.type }}
+                    </span>
+                  </CommandItem>
+                </CommandGroup>
                 <CommandGroup
                   v-if="shownScopes.length > 0"
                   heading="跨层引用"

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

@@ -14,11 +14,11 @@ type __VLS_Props = {
     extraVars?: Record<string, VarSpec>;
     unlistedVarsAreDyn?: boolean;
 };
-declare var __VLS_13: {}, __VLS_129: {};
+declare var __VLS_13: {}, __VLS_150: {};
 type __VLS_Slots = {} & {
     leading?: (props: typeof __VLS_13) => any;
 } & {
-    trailing?: (props: typeof __VLS_129) => any;
+    trailing?: (props: typeof __VLS_150) => 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/picker-entries.d.ts

@@ -1,7 +1,7 @@
-import { type ScopeAncestor } from '../../../utils/cel-context.js';
+import { type ScopeAncestor, type SelectionFieldRef } from '../../../utils/cel-context.js';
 export type PickEntry = {
     id: string;
-    group: 'var' | 'scope';
+    group: 'var' | 'scope' | 'selection';
     insert: string;
     display: string;
     label: string;
@@ -14,4 +14,5 @@ export type PickVarMeta = {
     description?: string;
 };
 export declare function buildVarEntries(celContext: Record<string, PickVarMeta>, extraVars?: Record<string, PickVarMeta>): PickEntry[];
+export declare function buildSelectionEntries(roster: ReadonlyArray<SelectionFieldRef>): PickEntry[];
 export declare function buildScopeEntries(ancestry: ReadonlyArray<ScopeAncestor>): PickEntry[];

package/dist/runtime/components/ui/expression-editor/picker-entries.js

@@ -1,19 +1,30 @@
-import { SCOPE_ADDRESS_VAR } from "../../../utils/cel-context.js";
+import { SCOPE_ADDRESS_VAR, SELECTIONS_VAR } from "../../../utils/cel-context.js";
 import { scopeOrigin } from "./scope-refs.js";
+const SUPPRESSED_VARS = /* @__PURE__ */ new Set([SCOPE_ADDRESS_VAR, SELECTIONS_VAR]);
 export function buildVarEntries(celContext, extraVars) {
   const out = [];
   const seen = /* @__PURE__ */ new Set();
   for (const [name, meta] of Object.entries(celContext)) {
-    if (name === SCOPE_ADDRESS_VAR) continue;
+    if (SUPPRESSED_VARS.has(name)) continue;
     seen.add(name);
     out.push({ id: name, group: "var", insert: name, display: name, label: meta.label, type: meta.type, description: meta.description });
   }
   for (const [name, meta] of Object.entries(extraVars ?? {})) {
-    if (seen.has(name) || name === SCOPE_ADDRESS_VAR) continue;
+    if (seen.has(name) || SUPPRESSED_VARS.has(name)) continue;
     out.push({ id: name, group: "var", insert: name, display: name, label: meta.label, type: meta.type, description: meta.description });
   }
   return out;
 }
+export function buildSelectionEntries(roster) {
+  return roster.map((field) => ({
+    id: `selection:${field.id}`,
+    group: "selection",
+    insert: `${SELECTIONS_VAR}[${JSON.stringify(field.id)}]`,
+    display: field.name,
+    label: "\u9009\u4E2D\u9879",
+    type: "dyn"
+  }));
+}
 export function buildScopeEntries(ancestry) {
   const out = [];
   for (const ancestor of ancestry) {

package/dist/runtime/components/ui/expression-editor/selection-chip-extension.d.ts

@@ -0,0 +1,4 @@
+import { type Extension, Facet } from '@codemirror/state';
+export declare const selectionLookupFacet: Facet<Map<string, string>, Map<string, string>>;
+/** The full selection inline-chip extension: decoration plugin + theme. */
+export declare function selectionChips(): Extension;

package/dist/runtime/components/ui/expression-editor/selection-chip-extension.js

@@ -0,0 +1,119 @@
+import { Facet, RangeSetBuilder } from "@codemirror/state";
+import {
+  Decoration,
+  EditorView,
+  ViewPlugin,
+  WidgetType
+} from "@codemirror/view";
+import { scanSelectionRefs } from "./selection-refs.js";
+export const selectionLookupFacet = Facet.define({
+  combine: (values) => values.length > 0 ? values[values.length - 1] : /* @__PURE__ */ new Map()
+});
+class SelectionChipWidget extends WidgetType {
+  constructor(id, name) {
+    super();
+    this.id = id;
+    this.name = name;
+  }
+  eq(other) {
+    return other.id === this.id && other.name === this.name;
+  }
+  toDOM() {
+    const chip = document.createElement("span");
+    chip.className = "cm-selection-chip";
+    chip.setAttribute("data-selection-id", this.id);
+    const tag = document.createElement("span");
+    tag.className = "cm-selection-chip-tag";
+    tag.textContent = "\u9009\u4E2D\u9879";
+    chip.appendChild(tag);
+    const text = document.createElement("span");
+    text.className = "cm-selection-chip-label";
+    if (this.name !== null) {
+      text.textContent = this.name;
+      chip.title = `\u9009\u4E2D\u9879 \xB7 ${this.name}`;
+    } else {
+      chip.classList.add("cm-selection-chip-dangling");
+      const short = this.id.length > 8 ? `${this.id.slice(0, 8)}\u2026` : this.id;
+      text.textContent = short;
+      chip.title = `\u672A\u77E5\u5B57\u6BB5 ${this.id}`;
+    }
+    chip.appendChild(text);
+    return chip;
+  }
+  ignoreEvent() {
+    return false;
+  }
+}
+function buildChips(view) {
+  const lookup = view.state.facet(selectionLookupFacet);
+  const builder = new RangeSetBuilder();
+  for (const ref of scanSelectionRefs(view.state.doc.toString())) {
+    const name = lookup.get(ref.id) ?? null;
+    builder.add(
+      ref.from,
+      ref.to,
+      Decoration.replace({ widget: new SelectionChipWidget(ref.id, name) })
+    );
+  }
+  return builder.finish();
+}
+const chipPlugin = ViewPlugin.fromClass(
+  class {
+    decorations;
+    constructor(view) {
+      this.decorations = buildChips(view);
+    }
+    update(update) {
+      if (update.docChanged || update.viewportChanged || update.startState.facet(selectionLookupFacet) !== update.state.facet(selectionLookupFacet)) {
+        this.decorations = buildChips(update.view);
+      }
+    }
+  },
+  {
+    decorations: (plugin) => plugin.decorations,
+    // Atomic so the caret steps over a chip and Backspace removes the whole
+    // `selections["id"]` at once — matching the scope chip's delete-as-unit feel.
+    provide: (plugin) => EditorView.atomicRanges.of((view) => view.plugin(plugin)?.decorations ?? Decoration.none)
+  }
+);
+const chipTheme = EditorView.theme({
+  ".cm-selection-chip": {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: "0.25rem",
+    margin: "0 1px",
+    padding: "0.125rem 0.25rem",
+    borderRadius: "0.25rem",
+    background: "#f0fdfa",
+    border: "1px solid #99f6e4",
+    color: "#0f766e",
+    fontFamily: "ui-sans-serif, system-ui, sans-serif",
+    verticalAlign: "baseline",
+    cursor: "default",
+    whiteSpace: "nowrap"
+  },
+  ".cm-selection-chip-dangling": {
+    background: "#fef2f2",
+    borderColor: "#fecaca",
+    color: "#b91c1c"
+  },
+  ".cm-selection-chip-tag": {
+    borderRadius: "0.125rem",
+    background: "#ccfbf1",
+    padding: "0.05rem 0.2rem",
+    fontSize: "9px",
+    lineHeight: "1",
+    color: "#0d9488"
+  },
+  ".cm-selection-chip-dangling .cm-selection-chip-tag": {
+    background: "#fee2e2",
+    color: "#b91c1c"
+  },
+  ".cm-selection-chip-label": {
+    fontSize: "0.75rem",
+    lineHeight: "1.1"
+  }
+});
+export function selectionChips() {
+  return [chipPlugin, chipTheme];
+}

package/dist/runtime/components/ui/expression-editor/selection-refs.d.ts

@@ -0,0 +1,8 @@
+import { type SelectionFieldRef } from '../../../utils/cel-context.js';
+export type SelectionRef = {
+    from: number;
+    to: number;
+    id: string;
+};
+export declare function scanSelectionRefs(text: string): SelectionRef[];
+export declare function buildSelectionLookup(roster: ReadonlyArray<SelectionFieldRef>): Map<string, string>;

package/dist/runtime/components/ui/expression-editor/selection-refs.js

@@ -0,0 +1,29 @@
+import { SELECTIONS_VAR } from "../../../utils/cel-context.js";
+const SELECTION_REF_RE = new RegExp(
+  `(?<![\\w$.])${SELECTIONS_VAR}\\[("(?:[^"\\\\]|\\\\.)*")\\]`,
+  "g"
+);
+export function scanSelectionRefs(text) {
+  const out = [];
+  SELECTION_REF_RE.lastIndex = 0;
+  let match;
+  while ((match = SELECTION_REF_RE.exec(text)) !== null) {
+    let id;
+    try {
+      id = JSON.parse(match[1]);
+    } catch {
+      continue;
+    }
+    out.push({
+      from: match.index,
+      to: match.index + match[0].length,
+      id
+    });
+  }
+  return out;
+}
+export function buildSelectionLookup(roster) {
+  const lookup = /* @__PURE__ */ new Map();
+  for (const field of roster) lookup.set(field.id, field.name);
+  return lookup;
+}