@shwfed/config 2.3.1 → 2.3.3

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "shwfed",
   "configKey": "shwfed",
-  "version": "2.3.1",
+  "version": "2.3.3",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -107,6 +107,8 @@ const module$1 = defineNuxtModule({
         "@atlaskit/pragmatic-drag-and-drop/combine",
         "@atlaskit/pragmatic-drag-and-drop/element/adapter",
         "@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item",
+        "@atlaskit/pragmatic-drag-and-drop/element/preserve-offset-on-source",
+        "@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview",
         "vaul-vue",
         "dot-prop",
         "@internationalized/date",

package/dist/runtime/components/config/blocks/2026-05-06/com.shwfed.block.table/config.d.vue.ts

@@ -131,6 +131,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{
@@ -306,6 +307,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{

package/dist/runtime/components/config/blocks/2026-05-06/com.shwfed.block.table/config.vue.d.ts

@@ -131,6 +131,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{
@@ -306,6 +307,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{

package/dist/runtime/components/config/blocks/2026-05-06/com.shwfed.block.table/runtime.d.vue.ts

@@ -126,6 +126,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{
@@ -301,6 +302,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{

package/dist/runtime/components/config/blocks/2026-05-06/com.shwfed.block.table/runtime.vue.d.ts

@@ -126,6 +126,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{
@@ -301,6 +302,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[];
                 readonly readonly?: string | undefined;
             } | undefined;
+            readonly rowKey?: string | undefined;
             readonly cellStyle?: string | undefined;
             readonly pagination?: {
                 readonly left?: readonly [{

package/dist/runtime/components/config/blocks/2026-05-06/com.shwfed.block.table/schema.d.ts

@@ -141,6 +141,7 @@ export declare function schema(configure: (env: Environment) => void, _blockRef:
             }[];
             readonly readonly?: string | undefined;
         } | undefined;
+        readonly rowKey?: string | undefined;
         readonly cellStyle?: string | undefined;
         readonly pagination?: {
             readonly left?: readonly [{
@@ -356,6 +357,7 @@ export declare function schema(configure: (env: Environment) => void, _blockRef:
             }>>>;
             readonly: Schema.optional<Schema.Schema<string, string, never>>;
         }>>>;
+        rowKey: Schema.optional<Schema.Schema<string, string, never>>;
         cellStyle: Schema.optional<Schema.Schema<string, string, never>>;
         style: Schema.optional<typeof Schema.String>;
         pagination: Schema.optional<Schema.Struct<{

package/dist/runtime/components/form/fields/2026-05-18/com.shwfed.form.field.table/config.d.vue.ts

@@ -26,6 +26,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
             }>;
             actions?: import("../../../../table/schema.js").TableActionsValue;
             query?: import("../../../schema.js").FormConfigValue;
+            rowKey?: string;
             cellStyle?: string;
             style?: string;
             pagination?: import("effect/Schema").Schema.Type<typeof import("../../../../table/schema.js").Pagination>;
@@ -88,6 +89,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
             }>;
             actions?: import("../../../../table/schema.js").TableActionsValue;
             query?: import("../../../schema.js").FormConfigValue;
+            rowKey?: string;
             cellStyle?: string;
             style?: string;
             pagination?: import("effect/Schema").Schema.Type<typeof import("../../../../table/schema.js").Pagination>;

package/dist/runtime/components/form/fields/2026-05-18/com.shwfed.form.field.table/config.vue.d.ts

@@ -26,6 +26,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
             }>;
             actions?: import("../../../../table/schema.js").TableActionsValue;
             query?: import("../../../schema.js").FormConfigValue;
+            rowKey?: string;
             cellStyle?: string;
             style?: string;
             pagination?: import("effect/Schema").Schema.Type<typeof import("../../../../table/schema.js").Pagination>;
@@ -88,6 +89,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
             }>;
             actions?: import("../../../../table/schema.js").TableActionsValue;
             query?: import("../../../schema.js").FormConfigValue;
+            rowKey?: string;
             cellStyle?: string;
             style?: string;
             pagination?: import("effect/Schema").Schema.Type<typeof import("../../../../table/schema.js").Pagination>;

package/dist/runtime/components/form/fields/2026-05-18/com.shwfed.form.field.table/schema.d.ts

@@ -42,6 +42,7 @@ export declare function schema(configure: (env: Environment) => void): Schema.St
         dataSource?: import("../../../../table/schema.js").DataSourceValue;
         actions?: import("../../../../table/schema.js").TableActionsValue;
         query?: import("../../../schema.js").FormConfigValue;
+        rowKey?: string;
         cellStyle?: string;
         style?: string;
         pagination?: Schema.Schema.Type<typeof import("../../../../table/schema.js").Pagination>;
@@ -76,6 +77,7 @@ export declare function schema(configure: (env: Environment) => void): Schema.St
         dataSource?: import("../../../../table/schema.js").DataSourceValue;
         actions?: import("../../../../table/schema.js").TableActionsValue;
         query?: import("../../../schema.js").FormConfigValue;
+        rowKey?: string;
         cellStyle?: string;
         style?: string;
         pagination?: Schema.Schema.Type<typeof import("../../../../table/schema.js").Pagination>;

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/config.d.vue.ts

@@ -0,0 +1,10 @@
+type __VLS_ModelProps = {
+    modelValue: Record<string, any>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: Record<string, any>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: Record<string, any>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/config.vue

@@ -0,0 +1,10 @@
+<script setup>
+defineOptions({ name: "ShwfedTableDragHandleRendererConfig" });
+defineModel({ type: Object, ...{ required: true } });
+</script>
+
+<template>
+  <p class="text-xs text-zinc-500">
+    本列无可配置项。
+  </p>
+</template>

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/config.vue.d.ts

@@ -0,0 +1,10 @@
+type __VLS_ModelProps = {
+    modelValue: Record<string, any>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: Record<string, any>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: Record<string, any>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/runtime.d.vue.ts

@@ -0,0 +1,9 @@
+import type { CellContext } from '@tanstack/vue-table';
+import type { Value } from './schema.js';
+type __VLS_Props = {
+    column: Value;
+    ctx: CellContext<unknown, unknown>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/runtime.vue

@@ -0,0 +1,68 @@
+<script setup>
+import { computed, onBeforeUnmount, ref, watch } from "vue";
+import { Icon } from "@iconify/vue";
+import { Tooltip, TooltipContent, TooltipTrigger } from "../../../../ui/tooltip";
+import { injectReorderContext } from "../../../utils/reorder";
+defineOptions({ name: "ShwfedTableDragHandleRendererRuntime" });
+const props = defineProps({
+  column: { type: null, required: true },
+  ctx: { type: Object, required: true }
+});
+const reorder = injectReorderContext();
+const enabled = computed(() => reorder?.enabled.value ?? false);
+const reason = computed(() => reorder?.disabledReason.value ?? null);
+const gripRef = ref(null);
+watch(
+  [() => props.ctx.row.id, gripRef, enabled],
+  ([rowId, el, isEnabled], [prevRowId]) => {
+    if (!reorder) return;
+    if (prevRowId && prevRowId !== rowId) {
+      reorder.registerHandle(prevRowId, null);
+    }
+    reorder.registerHandle(rowId, isEnabled ? el : null);
+  },
+  { immediate: true, flush: "post" }
+);
+onBeforeUnmount(() => {
+  if (!reorder) return;
+  reorder.registerHandle(props.ctx.row.id, null);
+});
+</script>
+
+<template>
+  <div class="flex items-center justify-center w-full h-full">
+    <Tooltip
+      v-if="!enabled && reason"
+      :delay-duration="400"
+    >
+      <TooltipTrigger as-child>
+        <span
+          class="inline-flex items-center justify-center size-6 text-zinc-300 cursor-not-allowed select-none"
+          aria-disabled="true"
+        >
+          <Icon
+            icon="fluent:re-order-dots-vertical-20-regular"
+            class="size-4"
+          />
+        </span>
+      </TooltipTrigger>
+      <TooltipContent>
+        {{ reason }}
+      </TooltipContent>
+    </Tooltip>
+    <span
+      v-else
+      ref="gripRef"
+      :class="[
+  'inline-flex items-center justify-center size-6 select-none',
+  enabled ? 'text-zinc-400 hover:text-zinc-600 cursor-grab active:cursor-grabbing' : 'text-zinc-300 cursor-not-allowed'
+]"
+      :aria-disabled="!enabled || void 0"
+    >
+      <Icon
+        icon="fluent:re-order-dots-vertical-20-regular"
+        class="size-4"
+      />
+    </span>
+  </div>
+</template>

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/runtime.vue.d.ts

@@ -0,0 +1,9 @@
+import type { CellContext } from '@tanstack/vue-table';
+import type { Value } from './schema.js';
+type __VLS_Props = {
+    column: Value;
+    ctx: CellContext<unknown, unknown>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/schema.d.ts

@@ -0,0 +1,17 @@
+import { Schema } from 'effect';
+import type { ColumnDef } from '@tanstack/vue-table';
+import type { Environment } from '../../../../../vendor/cel-js/lib/index.js';
+export declare const type: "com.shwfed.table.column.drag-handle";
+export declare const compatibilityDate: "2026-05-21";
+export declare const metadata: {
+    readonly name: "拖拽";
+    readonly icon: "fluent:re-order-dots-vertical-20-regular";
+};
+export declare function schema(_configure: (env: Environment) => void): Schema.Struct<{
+    id: Schema.refine<string, typeof Schema.String>;
+    groupId: Schema.optional<typeof Schema.UUID>;
+    type: Schema.Literal<["com.shwfed.table.column.drag-handle"]>;
+    compatibilityDate: Schema.Literal<["2026-05-21"]>;
+}>;
+export type Value = Schema.Schema.Type<ReturnType<typeof schema>>;
+export declare function toColumnDef(_value: Value): Partial<ColumnDef<unknown, unknown>>;

package/dist/runtime/components/table/columns/2026-05-21/com.shwfed.table.column.drag-handle/schema.js

@@ -0,0 +1,31 @@
+import { Schema } from "effect";
+import { h } from "vue";
+import { Icon } from "@iconify/vue";
+import { columnIdentityFields } from "../../../utils/shared.js";
+export const type = "com.shwfed.table.column.drag-handle";
+export const compatibilityDate = "2026-05-21";
+export const metadata = {
+  name: "\u62D6\u62FD",
+  icon: "fluent:re-order-dots-vertical-20-regular"
+};
+export function schema(_configure) {
+  return Schema.Struct({
+    type: Schema.Literal(type),
+    compatibilityDate: Schema.Literal(compatibilityDate),
+    ...columnIdentityFields()
+  }).annotations({ title: "DragHandleRenderer", description: "\u884C\u62D6\u62FD\u624B\u67C4\u5217" });
+}
+export function toColumnDef(_value) {
+  return {
+    header: () => h(Icon, {
+      "icon": "fluent:re-order-dots-vertical-20-regular",
+      "class": "size-3.5 text-zinc-400",
+      "aria-hidden": "true"
+    }),
+    size: 40,
+    enableSorting: false,
+    enableResizing: false,
+    enableHiding: false,
+    meta: { grow: false }
+  };
+}

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

@@ -9,9 +9,9 @@ type __VLS_ModelProps = {
     modelValue: AnyRecord;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_201: {};
+declare var __VLS_232: {};
 type __VLS_Slots = {} & {
-    'general-extra'?: (props: typeof __VLS_201) => any;
+    'general-extra'?: (props: typeof __VLS_232) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: AnyRecord) => any;

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

@@ -38,6 +38,26 @@ import TableAiColumnsButton from "./ai/columns-button.vue";
 import TableAiDataSourceButton from "./ai/data-source-button.vue";
 import { Environment } from "../../vendor/cel-js/lib/index";
 defineOptions({ name: "ShwfedTableConfig" });
+const RowKeyCELContext = defineComponent({
+  name: "RowKeyCELContext",
+  setup(_, { slots }) {
+    provideCELContext({
+      row: {
+        type: "dyn",
+        label: "\u5F53\u524D\u884C",
+        description: "\u5F53\u524D\u6E32\u67D3\u7684\u6574\u884C\u6570\u636E\uFF0C\u7C7B\u578B\u5728\u914D\u7F6E\u65F6\u672A\u77E5\uFF08`dyn`\uFF09\uFF0C\u5177\u4F53\u5B57\u6BB5\u53D6\u51B3\u4E8E\u63A5\u5165\u6570\u636E\u6E90\u3002",
+        value: void 0
+      },
+      index: {
+        type: "number",
+        label: "\u884C\u5E8F\u53F7",
+        description: "\u5F53\u524D\u884C\u5728\u6240\u6709\u6570\u636E\u4E2D\u7684\u5E8F\u53F7\uFF0C\u4ECE `0` \u5F00\u59CB\u3002",
+        value: 0
+      }
+    });
+    return () => slots.default?.();
+  }
+});
 const CellStyleCELContext = defineComponent({
   name: "CellStyleCELContext",
   setup(_, { slots }) {
@@ -444,13 +464,12 @@ function groupLabel(group) {
 }
 function columnLabel(col) {
   if (!col) return "(\u672A\u77E5)";
-  if (col.type === "com.shwfed.table.column.select") return "\u9009\u62E9\u5217";
-  if (!col.title) return "(\u65E0\u6807\u9898)";
   if (Array.isArray(col.title)) {
     const zh = col.title.find((t) => t.locale === "zh");
-    return zh?.message || col.title[0]?.message || "(\u65E0\u6807\u9898)";
+    const msg = zh?.message || col.title[0]?.message;
+    if (msg) return msg;
   }
-  return "(\u65E0\u6807\u9898)";
+  return getColumnTypeLabel(col.type, col.compatibilityDate);
 }
 function getColumnTypeLabel(type, compatibilityDate) {
   return findColumnEntry(type, compatibilityDate)?.metadata.name ?? type;
@@ -1265,6 +1284,36 @@ const tableQueryValue = computed({
               </InputGroup>
             </Field>
 
+            <Field orientation="vertical">
+              <FieldLabel class="text-xs text-zinc-500">
+                <template
+                  v-if="generalFieldDescription('rowKey')"
+                  #tooltip
+                >
+                  <Markdown
+                    :source="generalFieldDescription('rowKey')"
+                    block
+                    class="prose prose-sm prose-zinc"
+                  />
+                </template>
+                {{ generalFieldTitle("rowKey") }}
+              </FieldLabel>
+              <RowKeyCELContext>
+                <ExpressionEditor
+                  :model-value="editingGeneralConfig.rowKey ?? ''"
+                  placeholder="如 row.id"
+                  result-type="string"
+                  @update:model-value="(v) => updateGeneralOptionalString('rowKey', v)"
+                />
+              </RowKeyCELContext>
+              <p
+                v-if="getError('rowKey')"
+                class="text-xs text-red-500"
+              >
+                {{ getError("rowKey") }}
+              </p>
+            </Field>
+
             <!-- Host extension slot: a wrapping editor (e.g. the `table` form
                  field config) injects its own fields into the general pane. -->
             <slot name="general-extra" />

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

@@ -9,9 +9,9 @@ type __VLS_ModelProps = {
     modelValue: AnyRecord;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_201: {};
+declare var __VLS_232: {};
 type __VLS_Slots = {} & {
-    'general-extra'?: (props: typeof __VLS_201) => any;
+    'general-extra'?: (props: typeof __VLS_232) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: AnyRecord) => any;

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

@@ -27,6 +27,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         }>;
         actions?: import("./schema.js").TableActionsValue;
         query?: import("../form/schema.js").FormConfigValue;
+        rowKey?: string;
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;
@@ -71,6 +72,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         }>;
         actions?: import("./schema.js").TableActionsValue;
         query?: import("../form/schema.js").FormConfigValue;
+        rowKey?: string;
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;

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

@@ -30,6 +30,10 @@ import { provideTableInstanceId } from "./utils/instance";
 import { provideEventTarget } from "../../share/event-bus";
 import { findColumn } from "./utils/resolve";
 import { interpolateMarkdown } from "./utils/runtime";
+import { carrySymbolId, createRowKeyResolver } from "./utils/row-key";
+import { provideReorderContext } from "./utils/reorder";
+import { applyReorder, useRowReorder } from "./utils/row-reorder";
+import { type as DRAG_HANDLE_COLUMN_TYPE } from "./columns/2026-05-21/com.shwfed.table.column.drag-handle/schema";
 defineOptions({ name: "ShwfedTable" });
 const config = defineModel("config", { type: Object });
 const rowData = defineModel("rows", { type: Array, ...{ default: () => [] } });
@@ -46,7 +50,12 @@ const { t, locale } = useI18n({
       "sort-asc": "\u5347\u5E8F",
       "sort-desc": "\u964D\u5E8F",
       "sort-unsorted": "\u672A\u6392\u5E8F",
-      "column-tooltip": "\u67E5\u770B\u5217\u63D0\u793A\uFF1A{column}"
+      "column-tooltip": "\u67E5\u770B\u5217\u63D0\u793A\uFF1A{column}",
+      "reorder-disabled-sort": "\u5DF2\u6392\u5E8F\u65F6\u4E0D\u53EF\u62D6\u62FD\uFF0C\u8BF7\u5148\u53D6\u6D88\u6392\u5E8F",
+      "reorder-disabled-filter": "\u5DF2\u7B5B\u9009\u65F6\u4E0D\u53EF\u62D6\u62FD\uFF0C\u8BF7\u5148\u6E05\u9664\u7B5B\u9009",
+      "reorder-disabled-grouping": "\u5DF2\u5206\u7EC4\u65F6\u4E0D\u53EF\u62D6\u62FD\uFF0C\u8BF7\u5148\u53D6\u6D88\u5206\u7EC4",
+      "reorder-disabled-pinning": "\u5DF2\u56FA\u5B9A\u884C\u65F6\u4E0D\u53EF\u62D6\u62FD\uFF0C\u8BF7\u5148\u53D6\u6D88\u56FA\u5B9A",
+      "reorder-disabled-manual-pagination": "\u670D\u52A1\u7AEF\u5206\u9875\u4E0B\u4E0D\u53EF\u672C\u5730\u62D6\u62FD\u6392\u5E8F"
     },
     en: {
       "total": "Total {count} items",
@@ -55,7 +64,12 @@ const { t, locale } = useI18n({
       "sort-asc": "Ascending",
       "sort-desc": "Descending",
       "sort-unsorted": "Unsorted",
-      "column-tooltip": "Show column tooltip: {column}"
+      "column-tooltip": "Show column tooltip: {column}",
+      "reorder-disabled-sort": "Drag disabled while sorted \u2014 clear sorting first",
+      "reorder-disabled-filter": "Drag disabled while filtered \u2014 clear filters first",
+      "reorder-disabled-grouping": "Drag disabled while grouped \u2014 clear grouping first",
+      "reorder-disabled-pinning": "Drag disabled while rows are pinned \u2014 unpin first",
+      "reorder-disabled-manual-pagination": "Drag disabled with server-side pagination"
     },
     ja: {
       "total": "\u5408\u8A08 {count} \u4EF6",
@@ -64,7 +78,12 @@ const { t, locale } = useI18n({
       "sort-asc": "\u6607\u9806",
       "sort-desc": "\u964D\u9806",
       "sort-unsorted": "\u672A\u30BD\u30FC\u30C8",
-      "column-tooltip": "\u5217\u30C4\u30FC\u30EB\u30C1\u30C3\u30D7\u3092\u8868\u793A: {column}"
+      "column-tooltip": "\u5217\u30C4\u30FC\u30EB\u30C1\u30C3\u30D7\u3092\u8868\u793A: {column}",
+      "reorder-disabled-sort": "\u30BD\u30FC\u30C8\u4E2D\u306F\u30C9\u30E9\u30C3\u30B0\u3067\u304D\u307E\u305B\u3093\u3002\u30BD\u30FC\u30C8\u3092\u89E3\u9664\u3057\u3066\u304F\u3060\u3055\u3044",
+      "reorder-disabled-filter": "\u30D5\u30A3\u30EB\u30BF\u30FC\u4E2D\u306F\u30C9\u30E9\u30C3\u30B0\u3067\u304D\u307E\u305B\u3093\u3002\u30D5\u30A3\u30EB\u30BF\u30FC\u3092\u89E3\u9664\u3057\u3066\u304F\u3060\u3055\u3044",
+      "reorder-disabled-grouping": "\u30B0\u30EB\u30FC\u30D7\u5316\u4E2D\u306F\u30C9\u30E9\u30C3\u30B0\u3067\u304D\u307E\u305B\u3093\u3002\u30B0\u30EB\u30FC\u30D7\u5316\u3092\u89E3\u9664\u3057\u3066\u304F\u3060\u3055\u3044",
+      "reorder-disabled-pinning": "\u56FA\u5B9A\u884C\u304C\u3042\u308B\u305F\u3081\u30C9\u30E9\u30C3\u30B0\u3067\u304D\u307E\u305B\u3093\u3002\u56FA\u5B9A\u3092\u89E3\u9664\u3057\u3066\u304F\u3060\u3055\u3044",
+      "reorder-disabled-manual-pagination": "\u30B5\u30FC\u30D0\u30FC\u30B5\u30A4\u30C9\u30DA\u30FC\u30B8\u30F3\u30B0\u3067\u306F\u30C9\u30E9\u30C3\u30B0\u4E26\u3079\u66FF\u3048\u306F\u3067\u304D\u307E\u305B\u3093"
     }
   }
 });
@@ -171,11 +190,27 @@ function getRowAt(i) {
 function setRowAt(i, next) {
   const rows2 = rowData.value;
   if (i < 0 || i >= rows2.length) return;
+  carrySymbolId(rows2[i], next);
   rowData.value = rows2.map((r, j) => j === i ? next : r);
 }
 const derivedEditableColumns = computed(
   () => (config.value?.columns ?? []).filter((c) => typeof c.binding === "string" && !!c.derived)
 );
+const getRowId = createRowKeyResolver({
+  evaluateKey: (row, index) => {
+    const expr = config.value?.rowKey;
+    if (!expr) return void 0;
+    try {
+      const result = Effect.runSync($cel(expr, mergeCelContext({ row, index })));
+      if (typeof result === "string") return result;
+      if (typeof result === "number" && Number.isFinite(result)) return result;
+      return void 0;
+    } catch (e) {
+      console.error("[shwfed-table] rowKey expression failed", e);
+      return void 0;
+    }
+  }
+});
 const tableApi = useVueTable({
   get columns() {
     return columns.value;
@@ -197,6 +232,7 @@ const tableApi = useVueTable({
       }
     };
   },
+  getRowId,
   getCoreRowModel: getCoreRowModel(),
   getExpandedRowModel: getExpandedRowModel(),
   getPaginationRowModel: getPaginationRowModel(),
@@ -221,6 +257,55 @@ provideCELContext({
     }
   }
 });
+const hasDragHandleColumn = computed(() => (config.value?.columns ?? []).some((c) => c.type === DRAG_HANDLE_COLUMN_TYPE));
+const reorderDisabledReason = computed(() => {
+  if (!hasDragHandleColumn.value) return null;
+  const state = tableApi.getState();
+  if (state.sorting.length > 0) return t("reorder-disabled-sort");
+  if (state.columnFilters.length > 0) return t("reorder-disabled-filter");
+  const gf = state.globalFilter;
+  if (typeof gf === "string" && gf.length > 0) return t("reorder-disabled-filter");
+  if (state.grouping.length > 0) return t("reorder-disabled-grouping");
+  const rp = state.rowPinning;
+  if ((rp?.top?.length ?? 0) > 0 || (rp?.bottom?.length ?? 0) > 0) {
+    return t("reorder-disabled-pinning");
+  }
+  if (isManualPagination.value) return t("reorder-disabled-manual-pagination");
+  return null;
+});
+const isReorderable = computed(() => hasDragHandleColumn.value && reorderDisabledReason.value === null);
+const rowReorder = useRowReorder({
+  isEnabled: () => isReorderable.value,
+  onReorder: (sourceId, targetId, position) => reorderRow(sourceId, targetId, position)
+});
+function reorderRow(sourceId, targetId, position) {
+  if (sourceId === targetId) return;
+  const flat = tableApi.getCoreRowModel().rows;
+  const src = flat.find((r) => r.id === sourceId);
+  const tgt = flat.find((r) => r.id === targetId);
+  if (!src || !tgt) return;
+  const next = applyReorder(rowData.value, src.index, tgt.index, position);
+  if (next === rowData.value) return;
+  rowData.value = next;
+}
+provideReorderContext({
+  enabled: isReorderable,
+  disabledReason: reorderDisabledReason,
+  registerHandle: rowReorder.setHandle,
+  instructionFor: rowReorder.instructionFor
+});
+const rowRefCache = /* @__PURE__ */ new Map();
+function getRowRefFn(rowId) {
+  let fn = rowRefCache.get(rowId);
+  if (!fn) {
+    fn = (el) => {
+      measureRow(el);
+      rowReorder.setRow(rowId, el instanceof HTMLElement ? el : null);
+    };
+    rowRefCache.set(rowId, fn);
+  }
+  return fn;
+}
 async function fetchDataSource() {
   const dataSource = config.value?.dataSource;
   if (!dataSource) return;
@@ -704,11 +789,32 @@ export { TableConfig, createTableConfig, getColumnTechnicalKey } from "./schema"
                     :set-row="setRowAt"
                   >
                     <tr
-                      :ref="measureRow"
+                      :ref="getRowRefFn(rows[r.index].id)"
                       class="flex absolute w-full border-b border-zinc-300"
                       :data-index="rows[r.index].index"
                       :style="{ transform: `translate3d(0, ${r.start}px, 0)` }"
                     >
+                      <!--
+                        Drop indicator. Absolutely positioned so it overlays
+                        the row without affecting flex layout, and sits at
+                        z-30 above sticky pinned cells (which use z-15) so
+                        the line is never hidden behind a column. The bar is
+                        offset by -1px so its 2px height is centered exactly
+                        on the row boundary — for adjacent rows, "reorder-
+                        below on i" and "reorder-above on i+1" then resolve
+                        to the same pixel band, so the indicator doesn't
+                        jitter as the hitbox flips between them.
+                      -->
+                      <span
+                        v-if="rowReorder.instructionFor(rows[r.index].id) === 'reorder-above'"
+                        aria-hidden="true"
+                        class="absolute left-0 right-0 -top-px h-0.5 z-30 pointer-events-none bg-(--primary)"
+                      />
+                      <span
+                        v-else-if="rowReorder.instructionFor(rows[r.index].id) === 'reorder-below'"
+                        aria-hidden="true"
+                        class="absolute left-0 right-0 -bottom-px h-0.5 z-30 pointer-events-none bg-(--primary)"
+                      />
                       <td
                         v-for="cell in rows[r.index].getVisibleCells()"
                         :key="cell.id"

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

@@ -27,6 +27,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         }>;
         actions?: import("./schema.js").TableActionsValue;
         query?: import("../form/schema.js").FormConfigValue;
+        rowKey?: string;
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;
@@ -71,6 +72,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
         }>;
         actions?: import("./schema.js").TableActionsValue;
         query?: import("../form/schema.js").FormConfigValue;
+        rowKey?: string;
         cellStyle?: string;
         style?: string;
         pagination?: import("effect/Schema").Schema.Type<typeof import("./schema.js").Pagination>;

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

@@ -220,6 +220,7 @@ export declare function TableConfig(configure: (env: Environment) => void): Sche
         }[];
         readonly readonly?: string | undefined;
     } | undefined;
+    readonly rowKey?: string | undefined;
     readonly cellStyle?: string | undefined;
     readonly pagination?: {
         readonly left?: readonly [{
@@ -435,6 +436,7 @@ export declare function TableConfig(configure: (env: Environment) => void): Sche
         }>>>;
         readonly: Schema.optional<Schema.Schema<string, string, never>>;
     }>>>;
+    rowKey: Schema.optional<Schema.Schema<string, string, never>>;
     cellStyle: Schema.optional<Schema.Schema<string, string, never>>;
     style: Schema.optional<typeof Schema.String>;
     pagination: Schema.optional<Schema.Struct<{
@@ -598,6 +600,7 @@ export declare function createTableConfig(body: Omit<Schema.Schema.Type<ReturnTy
         }[];
         readonly readonly?: string | undefined;
     } | undefined;
+    rowKey?: string | undefined;
     cellStyle?: string | undefined;
     pagination?: {
         readonly left?: readonly [{
@@ -672,6 +675,7 @@ export type TableConfigValue = Readonly<{
     dataSource?: DataSourceValue;
     actions?: TableActionsValue;
     query?: FormConfigValue;
+    rowKey?: string;
     cellStyle?: string;
     style?: string;
     pagination?: Schema.Schema.Type<typeof Pagination>;

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

@@ -4,7 +4,7 @@ import { Locale } from "../../share/locale.js";
 import { ActionSchemaFields } from "../actions/schema.js";
 import { FormConfig } from "../form/schema.js";
 import { allColumnSchemas } from "./utils/resolve.js";
-import { registerRowVariablesIfAbsent } from "./utils/shared.js";
+import { CelRowAccess, registerRowVariablesIfAbsent } from "./utils/shared.js";
 export { getStructFieldTitle, getStructFieldDescription } from "./utils/schema-meta.js";
 const KIND = "shwfed.component.table";
 export const metadata = {
@@ -195,6 +195,9 @@ export function TableConfig(configure) {
     },
     resultType: (type) => type.startsWith("map")
   });
+  const CelRowKey = CelRowAccess(configure, {
+    resultType: (type) => type === "string" || type === "number" || type === "dyn"
+  });
   const dataSourceSchema = DataSource(configure);
   const { fields: actionFields } = ActionSchemaFields((env) => {
     configure(env);
@@ -238,6 +241,10 @@ export function TableConfig(configure) {
       title: "\u641C\u7D22\u6761\u4EF6",
       description: "\u6E32\u67D3\u5728\u8868\u683C\u4E0A\u65B9\u7684\u641C\u7D22\u6761\u4EF6\u8868\u5355\uFF1B\u5176\u5F53\u524D\u503C\u4EE5 `query` \u53D8\u91CF\u6CE8\u5165\u6570\u636E\u6E90\u8868\u8FBE\u5F0F"
     }),
+    rowKey: Schema.optional(CelRowKey).annotations({
+      title: "\u884C\u552F\u4E00\u6807\u8BC6",
+      description: "\u4E3A\u6BCF\u4E00\u884C\u8BA1\u7B97\u7A33\u5B9A\u552F\u4E00 ID \u7684 CEL \u8868\u8FBE\u5F0F\uFF0C\u53EF\u8BBF\u95EE `row` / `index`\uFF0C\u7ED3\u679C\u987B\u4E3A\u5B57\u7B26\u4E32\u6216\u6570\u5B57\uFF08\u4F8B\u5982 `row.id`\uFF09\u3002\u914D\u7F6E\u540E\uFF0C\u8DE8\u5237\u65B0\u7684\u52FE\u9009\u3001\u5C55\u5F00\u7B49\u884C\u7EA7\u72B6\u6001\u6309\u8BE5 ID \u5339\u914D\uFF1B\u7559\u7A7A\u65F6\u884C\u8EAB\u4EFD\u6309\u5BF9\u8C61\u5F15\u7528\u515C\u5E95\uFF0C\u8FDC\u7AEF\u6570\u636E\u5237\u65B0\u4F1A\u4E22"
+    }),
     cellStyle: Schema.optional(CelCellStyle).annotations({
       title: "\u5355\u5143\u683C\u6837\u5F0F",
       description: "\u5355\u5143\u683C\u6837\u5F0F CEL \u8868\u8FBE\u5F0F"

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

@@ -0,0 +1,10 @@
+import type { Ref } from 'vue';
+import type { RowReorderInstruction } from './row-reorder.js';
+export interface ReorderContext {
+    enabled: Ref<boolean>;
+    disabledReason: Ref<string | null>;
+    registerHandle: (rowId: string, el: HTMLElement | null) => void;
+    instructionFor: (rowId: string) => RowReorderInstruction | null;
+}
+export declare function provideReorderContext(ctx: ReorderContext): void;
+export declare function injectReorderContext(): ReorderContext | null;

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

@@ -0,0 +1,8 @@
+import { inject, provide } from "vue";
+const KEY = Symbol("shwfed-table-reorder");
+export function provideReorderContext(ctx) {
+  provide(KEY, ctx);
+}
+export function injectReorderContext() {
+  return inject(KEY, null);
+}

package/dist/runtime/components/table/utils/row-key.d.ts

@@ -0,0 +1,11 @@
+export declare const ROW_ID_SYMBOL: unique symbol;
+export declare function readSymbolId(row: object): string | undefined;
+export declare function stampSymbolId(row: object, id?: string): string;
+export declare function carrySymbolId(prev: unknown, next: unknown): void;
+export interface RowKeyResolver {
+    (row: unknown, index: number): string;
+}
+export interface CreateRowKeyResolverOptions {
+    evaluateKey: (row: object, index: number) => string | number | undefined;
+}
+export declare function createRowKeyResolver(options: CreateRowKeyResolverOptions): RowKeyResolver;

package/dist/runtime/components/table/utils/row-key.js

@@ -0,0 +1,30 @@
+import { toRaw } from "vue";
+export const ROW_ID_SYMBOL = Symbol.for("shwfed.table.row-id");
+export function readSymbolId(row) {
+  const id = toRaw(row)[ROW_ID_SYMBOL];
+  return typeof id === "string" ? id : void 0;
+}
+export function stampSymbolId(row, id) {
+  const next = id ?? crypto.randomUUID();
+  toRaw(row)[ROW_ID_SYMBOL] = next;
+  return next;
+}
+export function carrySymbolId(prev, next) {
+  if (!prev || typeof prev !== "object") return;
+  if (!next || typeof next !== "object") return;
+  const prevId = readSymbolId(prev);
+  if (!prevId) return;
+  if (readSymbolId(next) !== void 0) return;
+  stampSymbolId(next, prevId);
+}
+export function createRowKeyResolver(options) {
+  return (row, index) => {
+    if (row === null || typeof row !== "object") return `__primitive_${index}`;
+    const obj = row;
+    const keyed = options.evaluateKey(obj, index);
+    if (keyed !== void 0 && keyed !== null && keyed !== "") {
+      return `k:${String(keyed)}`;
+    }
+    return readSymbolId(obj) ?? stampSymbolId(obj);
+  };
+}

package/dist/runtime/components/table/utils/row-reorder.d.ts

@@ -0,0 +1,12 @@
+export type RowReorderInstruction = 'reorder-above' | 'reorder-below';
+export declare function applyReorder<T>(rows: ReadonlyArray<T>, sourceIndex: number, targetIndex: number, position: RowReorderInstruction): ReadonlyArray<T>;
+export interface UseRowReorderOptions {
+    onReorder: (sourceId: string, targetId: string, position: RowReorderInstruction) => void;
+    isEnabled: () => boolean;
+}
+export interface RowReorderApi {
+    setRow: (rowId: string, el: HTMLElement | null) => void;
+    setHandle: (rowId: string, el: HTMLElement | null) => void;
+    instructionFor: (rowId: string) => RowReorderInstruction | null;
+}
+export declare function useRowReorder(options: UseRowReorderOptions): RowReorderApi;

package/dist/runtime/components/table/utils/row-reorder.js

@@ -0,0 +1,162 @@
+import { onBeforeUnmount, ref } from "vue";
+import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine";
+import {
+  draggable,
+  dropTargetForElements
+} from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
+import { setCustomNativeDragPreview } from "@atlaskit/pragmatic-drag-and-drop/element/set-custom-native-drag-preview";
+import { preserveOffsetOnSource } from "@atlaskit/pragmatic-drag-and-drop/element/preserve-offset-on-source";
+import {
+  attachInstruction,
+  extractInstruction
+} from "@atlaskit/pragmatic-drag-and-drop-hitbox/tree-item";
+export function applyReorder(rows, sourceIndex, targetIndex, position) {
+  if (sourceIndex === targetIndex) return rows;
+  if (sourceIndex < 0 || sourceIndex >= rows.length) return rows;
+  if (targetIndex < 0 || targetIndex >= rows.length) return rows;
+  let insertIdx = targetIndex + (position === "reorder-below" ? 1 : 0);
+  if (sourceIndex < targetIndex) insertIdx -= 1;
+  if (insertIdx === sourceIndex) return rows;
+  const next = rows.slice();
+  const [moved] = next.splice(sourceIndex, 1);
+  next.splice(insertIdx, 0, moved);
+  return next;
+}
+const SOURCE_KIND = "shwfed-table-row";
+export function useRowReorder(options) {
+  const instruction = ref(null);
+  const regs = /* @__PURE__ */ new Map();
+  function rewire(rowId, reg) {
+    reg.cleanup?.();
+    if (!reg.rowEl || !reg.handleEl) {
+      reg.cleanup = null;
+      return;
+    }
+    const rowEl = reg.rowEl;
+    const handleEl = reg.handleEl;
+    reg.cleanup = combine(
+      draggable({
+        element: rowEl,
+        dragHandle: handleEl,
+        getInitialData: () => ({ kind: SOURCE_KIND, id: rowId }),
+        canDrag: () => options.isEnabled(),
+        // The row is full-table-width and most of its content trails off-
+        // screen on wide tables, so the default native preview (a snapshot
+        // of `element`) is a giant useless rectangle. We render a clone
+        // capped at ~360px and fade it out to the right via a CSS mask so
+        // the user sees just enough of the row's leading cells to identify
+        // it, with the trailing content gracefully dissolving.
+        onGenerateDragPreview: ({ nativeSetDragImage, location, source }) => {
+          setCustomNativeDragPreview({
+            nativeSetDragImage,
+            getOffset: preserveOffsetOnSource({
+              element: source.element,
+              input: location.current.input
+            }),
+            render: ({ container }) => {
+              const src = source.element;
+              const rect = src.getBoundingClientRect();
+              const clone = src.cloneNode(true);
+              clone.style.transform = "none";
+              clone.style.position = "relative";
+              clone.style.top = "0";
+              clone.style.left = "0";
+              clone.style.height = `${rect.height}px`;
+              clone.style.width = `${rect.width}px`;
+              clone.style.flexShrink = "0";
+              const wrapper = document.createElement("div");
+              wrapper.style.width = `${Math.min(rect.width, 360)}px`;
+              wrapper.style.maxWidth = "60vw";
+              wrapper.style.height = `${rect.height}px`;
+              wrapper.style.overflow = "hidden";
+              wrapper.style.background = "white";
+              wrapper.style.boxShadow = "0 6px 18px rgba(0,0,0,0.12)";
+              wrapper.style.borderRadius = "4px";
+              const fade = "linear-gradient(to right, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 55%, rgba(0,0,0,0) 100%)";
+              wrapper.style.maskImage = fade;
+              wrapper.style.webkitMaskImage = fade;
+              wrapper.appendChild(clone);
+              container.appendChild(wrapper);
+            }
+          });
+        }
+      }),
+      dropTargetForElements({
+        element: reg.rowEl,
+        canDrop: ({ source }) => {
+          if (!options.isEnabled()) return false;
+          return source.data.kind === SOURCE_KIND && source.data.id !== rowId;
+        },
+        getIsSticky: () => true,
+        getData: ({ input, element }) => attachInstruction(
+          { kind: `${SOURCE_KIND}-target`, id: rowId },
+          {
+            input,
+            element,
+            currentLevel: 0,
+            indentPerLevel: 0,
+            mode: "standard",
+            block: ["make-child", "reparent"]
+          }
+        ),
+        onDrag: ({ self }) => {
+          const inst = extractInstruction(self.data);
+          if (!inst || inst.type === "instruction-blocked") {
+            if (instruction.value?.id === rowId) instruction.value = null;
+            return;
+          }
+          if (inst.type === "reorder-above" || inst.type === "reorder-below") {
+            instruction.value = { id: rowId, type: inst.type };
+          }
+        },
+        onDragLeave: () => {
+          if (instruction.value?.id === rowId) instruction.value = null;
+        },
+        onDrop: ({ source, self }) => {
+          instruction.value = null;
+          const inst = extractInstruction(self.data);
+          if (!inst) return;
+          if (inst.type !== "reorder-above" && inst.type !== "reorder-below") return;
+          const sourceId = typeof source.data.id === "string" ? source.data.id : null;
+          if (!sourceId || sourceId === rowId) return;
+          options.onReorder(sourceId, rowId, inst.type);
+        }
+      })
+    );
+  }
+  function getReg(rowId) {
+    let reg = regs.get(rowId);
+    if (!reg) {
+      reg = { rowEl: null, handleEl: null, cleanup: null };
+      regs.set(rowId, reg);
+    }
+    return reg;
+  }
+  function purgeIfEmpty(rowId, reg) {
+    if (!reg.rowEl && !reg.handleEl && !reg.cleanup) regs.delete(rowId);
+    if (instruction.value?.id === rowId && !reg.rowEl) instruction.value = null;
+  }
+  function setRow(rowId, el) {
+    const reg = getReg(rowId);
+    if (reg.rowEl === el) return;
+    reg.rowEl = el;
+    rewire(rowId, reg);
+    purgeIfEmpty(rowId, reg);
+  }
+  function setHandle(rowId, el) {
+    const reg = getReg(rowId);
+    if (reg.handleEl === el) return;
+    reg.handleEl = el;
+    rewire(rowId, reg);
+    purgeIfEmpty(rowId, reg);
+  }
+  function instructionFor(rowId) {
+    return instruction.value?.id === rowId ? instruction.value.type : null;
+  }
+  onBeforeUnmount(() => {
+    for (const reg of regs.values()) reg.cleanup?.();
+    regs.clear();
+    instruction.value = null;
+  });
+  return { setRow, setHandle, instructionFor };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shwfed/config",
-  "version": "2.3.1",
+  "version": "2.3.3",
   "description": "Configurable UI for SHWFED",
   "type": "module",
   "publishConfig": {