@shwfed/config 2.3.29 → 2.4.1

package/dist/preview/assets/runtime-BP7zXnyG.js

@@ -0,0 +1 @@
+import{d as u,aq as p,ag as g,ar as a,as as m,ak as l,e as d,u as x,al as E,am as _,an as h,ao as C,ap as k,o as q}from"./index-DUDlWaQI.js";import{_ as v}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";const R=u({name:"ShwfedHttpRequestActionRuntime",__name:"runtime",props:{buttonId:{},config:{}},setup(o){const e=o,c=C(),i=(n,s)=>E(n,{..._(c),...s}),r=k(),t=h(),f=p(()=>{const n=t?g(()=>t()):a(!0);return m(n,s=>s?l(e.config.expression,i,{messageExpression:e.config.messageExpression,resultExpression:e.config.resultExpression,channel:r,triggers:{success:e.config.onSuccess,warning:e.config.onWarning,error:e.config.onError,info:e.config.onInfo}}):a(void 0))});return(n,s)=>(q(),d(v,{"action-id":o.buttonId,effect:x(f)},null,8,["action-id","effect"]))}});export{R as default};

package/dist/preview/assets/runtime-BQSwNpLC.js

@@ -0,0 +1 @@
+import{d as u,ae as i,e as l,u as p,$ as m,o as d,k as f,ah as _,ai as k,al as w,am as x,ao as g}from"./index-DUDlWaQI.js";const B=u({name:"ShwfedMarkdownItemRuntime",__name:"runtime",props:{config:{}},setup(n){const o=n,{locale:s}=i(),t=g(),c=(e,a)=>w(e,{...x(t),...a}),r=m(()=>{const e=_(o.config.content,s.value)??"";return k(e,c)});return(e,a)=>(d(),l(p(f),{"data-slot":"buttons-markdown",source:r.value,class:"prose prose-sm prose-zinc px-1"},null,8,["source"]))}});export{B as default};

package/dist/preview/assets/runtime-BwR_BbTu.js

@@ -0,0 +1 @@
+import{d as i,aq as f,as as r,au as u,e as d,u as m,al as l,am as p,ao as _,o as g}from"./index-DUDlWaQI.js";import{_ as h}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";const B=i({name:"ShwfedNavigationActionRuntime",__name:"runtime",props:{buttonId:{},config:{}},setup(e){const t=e,o=_(),c=(n,a)=>l(n,{...p(o),...a}),s=f(()=>r(c(t.config.url),n=>u(()=>{window.open(n,t.config.mode)})));return(n,a)=>(g(),d(h,{"action-id":e.buttonId,effect:m(s)},null,8,["action-id","effect"]))}});export{B as default};

package/dist/preview/assets/runtime-Ch3JIgUQ.js

@@ -0,0 +1 @@
+import{_ as s}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";import{d as c,aq as o,aE as i,e as r,u as f,ap as u,o as p}from"./index-DUDlWaQI.js";const g=c({name:"ShwfedEventDispatchActionRuntime",__name:"runtime",props:{buttonId:{},config:{}},setup(e){const n=e,t=u(),a=o(()=>i(t,n.config.triggers));return(m,d)=>(p(),r(s,{"action-id":e.buttonId,effect:f(a)},null,8,["action-id","effect"]))}});export{g as default};

package/dist/preview/assets/runtime-CjvZcU7X.js

@@ -0,0 +1 @@
+import{d as E,aq as _,af as S,au as r,aE as m,aF as j,aG as v,e as x,u as B,al as L,am as b,ap as k,ao as C,o as R}from"./index-DUDlWaQI.js";import{_ as T}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";const O=E({name:"ShwfedHttpDownloadActionRuntime",__name:"runtime",props:{buttonId:{},config:{}},setup(d){const c=d,g=C(),t=(e,n)=>L(e,{...b(g),...n}),l=k(),p=new Set(["success","error","warning","info"]);function f(e){const n=URL.createObjectURL(e),o=document.createElement("a");o.href=n,o.download=e.name,document.body.appendChild(o),o.click(),o.remove(),URL.revokeObjectURL(n)}const y=_(()=>S(function*(){const{template:e,messageExpression:n,resultExpression:o}=c.config,u=yield*t(e.request);if(!e.download){const s=yield*u.file();return yield*r(()=>f(s)),yield*m(l,c.config.onSuccess)}const a={json:yield*u.json()},i=o===void 0?"success":yield*j(t(o,a),s=>p.has(s)?s:"success");if(n!==void 0){const s=yield*t(n,a);yield*r(()=>v[i](s))}if(i==="success"||i==="info"){const h=yield*(yield*t(e.download,a)).file();yield*r(()=>f(h))}const w={success:c.config.onSuccess,warning:c.config.onWarning,error:c.config.onError,info:c.config.onInfo};return yield*m(l,w[i])}));return(e,n)=>(R(),x(T,{"action-id":d.buttonId,effect:B(y)},null,8,["action-id","effect"]))}});export{O as default};

package/dist/preview/assets/runtime-Cunk4vOs.js

@@ -0,0 +1 @@
+import{d as l,aH as g,aq as A,as as y,aE as _,e as h,u as S,al as b,am as j,ap as k,aI as C,o as B,ao as E}from"./index-DUDlWaQI.js";import{_ as I}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";const F=l({name:"ShwfedStateWriteActionRuntime",__name:"runtime",props:{buttonId:{},config:{}},setup(r){const s=r,i=E(),f=(e,t)=>b(e,{...j(i),...t}),n=g(),o=n.kind==="form"&&n.parent?n.parent:n,u=k(),m=C((e,t,a)=>{if(Array.isArray(e[t])&&Array.isArray(a))return e[t]=a,!0});function c(e){return typeof e=="object"&&e!==null&&!Array.isArray(e)}function p(e,t){return c(e)&&c(t)?m({...t},e):t}const d=A(()=>y(f(s.config.expression),e=>{for(const t of Object.keys(e)){const a=p(o.getAt(t),e[t]);o.setAt(t,a)}return _(u,s.config.onSuccess)}));return(e,t)=>(B(),h(I,{"action-id":r.buttonId,effect:S(d)},null,8,["action-id","effect"]))}});export{F as default};

package/dist/preview/assets/runtime-D34aQN00.js

@@ -0,0 +1 @@
+import{d as s,ae as p,av as x,af as M,ah as c,aw as T,ax as N,e as b,w as d,u,a0 as k,a1 as w,ap as L,au as S,o as A,f as I,ay as z,g as f,az as F,aA as H,a7 as V,ao as $,aB as r,aC as m,aD as j}from"./index-DUDlWaQI.js";import{_ as K}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";const D=s({name:"ShwfedModalLayoutActionRuntime",__name:"runtime",props:{buttonId:{},config:{},buttonTitle:{}},setup(t){const n=t,{locale:l}=p(),v=e=>{},h=$(),i=w(r,void 0),g=L(),o=k(null),C=x(n.buttonId,{close:()=>S(()=>{o.value?.()})},g),y=s({name:"ModalBoundaryBridge",setup(e,{slots:a}){return H(h),m(j,C),i&&m(r,i),()=>a.default?.()}}),E=(e,a)=>V()?.(e,a),_=M(function*(){const e=c(n.config.modalTitle,l.value)??c(n.buttonTitle,l.value)??"",{modal:a,close:B}=yield*T({title:e,width:n.config.modalWidth});o.value=()=>N(B()),yield*a,o.value=null});return(e,a)=>(A(),b(K,{"action-id":t.buttonId,effect:u(_)},{default:d(()=>[I("div",{style:z(t.config.modalMinHeight?`min-height: ${t.config.modalMinHeight}`:void 0)},[f(u(y),null,{default:d(()=>[f(F,{"slot-value":t.config.slot,configure:v,"find-entry":E},null,8,["slot-value"])]),_:1})],4)]),_:1},8,["action-id","effect"]))}});export{D as default};

package/dist/preview/assets/runtime-a9TOQRwD.js

@@ -0,0 +1 @@
+import{_ as o}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";import{d as n,e as a,u as c,o as f,at as i}from"./index-DUDlWaQI.js";const _=n({name:"ShwfedPrototypeActionRuntime",__name:"runtime",props:{buttonId:{},config:{}},setup(t){const e=i;return(r,s)=>(f(),a(o,{"action-id":t.buttonId,effect:c(e)},null,8,["action-id","effect"]))}});export{_ as default};

package/dist/preview/assets/runtime-aPt-bW3F.js

@@ -0,0 +1 @@
+import{d as l,ae as u,af as g,ag as m,ah as d,ai as p,aj as x,ak as k,e as E,u as _,al as h,am as w,an as C,ao as I,ap as j,o as v}from"./index-DUDlWaQI.js";import{_ as y}from"./definition.vue_vue_type_script_setup_true_lang-D8NPPbjZ.js";const q=l({name:"ShwfedHttpRequestConfirmActionRuntime",__name:"runtime",props:{buttonId:{},config:{}},setup(s){const e=s,{locale:c}=u(),i=I(),t=(n,o)=>h(n,{...w(i),...o}),r=j(),a=C(),f=g(function*(){if(a&&!(yield*m(()=>a())))return;const n=d(e.config.markdown,c.value)??"",o=p(n,t);(yield*x({content:o,icon:e.config.icon,color:e.config.color}))||(yield*k(e.config.expression,t,{messageExpression:e.config.messageExpression,resultExpression:e.config.resultExpression,channel:r,triggers:{success:e.config.onSuccess,warning:e.config.onWarning,error:e.config.onError,info:e.config.onInfo}}))});return(n,o)=>(v(),E(y,{"action-id":s.buttonId,effect:_(f)},null,8,["action-id","effect"]))}});export{q as default};

package/dist/preview/index.html

@@ -10,8 +10,8 @@
          `--primary`, the primary button variant renders as transparent. */
       body { --primary: #009689; }
     </style>
-    <script type="module" crossorigin src="./assets/index-DEF3_MKr.js"></script>
-    <link rel="stylesheet" crossorigin href="./assets/index-2eQR4s3q.css">
+    <script type="module" crossorigin src="./assets/index-DUDlWaQI.js"></script>
+    <link rel="stylesheet" crossorigin href="./assets/index-65eB1l4r.css">
   </head>
   <body>
     <div id="app"></div>

package/dist/runtime/components/actions/buttons/2026-04-18/com.shwfed.actions.button.http.request.json/runtime.vue

@@ -3,6 +3,7 @@ import { Effect } from "effect";
 import { cel as _rawCel } from "../../../../../utils/cel";
 import { celBindings, injectCELContext } from "../../../../../utils/cel-context";
 import { useEventChannel } from "../../../../../share/event-bus";
+import { useFormValidate } from "../../../../../share/form-validate";
 import ShwfedActionDefinition from "../../../components/definition.vue";
 import { executeHttpRequest } from "../../../utils/resolve";
 defineOptions({ name: "ShwfedHttpRequestActionRuntime" });
@@ -13,8 +14,10 @@ const props = defineProps({
 const inherited = injectCELContext();
 const $cel = (expression, context) => _rawCel(expression, { ...celBindings(inherited), ...context });
 const channel = useEventChannel();
-const effect = Effect.suspend(
-  () => executeHttpRequest(props.config.expression, $cel, {
+const validateForm = useFormValidate();
+const effect = Effect.suspend(() => {
+  const gate = validateForm ? Effect.promise(() => validateForm()) : Effect.succeed(true);
+  return Effect.flatMap(gate, (ok) => ok ? executeHttpRequest(props.config.expression, $cel, {
     messageExpression: props.config.messageExpression,
     resultExpression: props.config.resultExpression,
     channel,
@@ -24,8 +27,8 @@ const effect = Effect.suspend(
       error: props.config.onError,
       info: props.config.onInfo
     }
-  })
-);
+  }) : Effect.succeed(void 0));
+});
 </script>
 
 <template>

package/dist/runtime/components/actions/buttons/2026-04-18/com.shwfed.actions.button.http.request.json.confirm/runtime.vue

@@ -6,6 +6,7 @@ import { reject } from "../../../../../composables/useOverlay";
 import { celBindings, injectCELContext } from "../../../../../utils/cel-context";
 import { getLocalizedText } from "../../../../../share/locale";
 import { useEventChannel } from "../../../../../share/event-bus";
+import { useFormValidate } from "../../../../../share/form-validate";
 import ShwfedActionDefinition from "../../../components/definition.vue";
 import { executeHttpRequest, interpolateMarkdown } from "../../../utils/resolve";
 defineOptions({ name: "ShwfedHttpRequestConfirmActionRuntime" });
@@ -17,7 +18,12 @@ const { locale } = useI18n();
 const inherited = injectCELContext();
 const $cel = (expression, context) => _rawCel(expression, { ...celBindings(inherited), ...context });
 const channel = useEventChannel();
+const validateForm = useFormValidate();
 const effect = Effect.gen(function* () {
+  if (validateForm) {
+    const ok = yield* Effect.promise(() => validateForm());
+    if (!ok) return;
+  }
   const raw = getLocalizedText(props.config.markdown, locale.value) ?? "";
   const content = interpolateMarkdown(raw, $cel);
   if (yield* reject({ content, icon: props.config.icon, color: props.config.color })) return;

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

@@ -10,6 +10,7 @@ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;
@@ -42,6 +43,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;

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

@@ -10,6 +10,7 @@ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;
@@ -42,6 +43,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;

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

@@ -12,6 +12,7 @@ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:block": (value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;
@@ -45,6 +46,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:block"?: ((value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;

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

@@ -12,6 +12,7 @@ type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
 declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:block": (value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;
@@ -45,6 +46,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:block"?: ((value: {
         readonly form: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;

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

@@ -22,6 +22,7 @@ export declare function schema(configure: (env: Environment) => void, _blockRef:
     type: Schema.tag<"com.shwfed.block.form">;
     compatibilityDate: Schema.tag<"2026-05-06">;
     form: Schema.refine<{
+        readonly style?: string | undefined;
         readonly initial?: {
             readonly data: string;
             readonly request?: string | undefined;
@@ -88,6 +89,7 @@ export declare function schema(configure: (env: Environment) => void, _blockRef:
             data: Schema.Schema<string, string, never>;
         }>>>;
         readonly: Schema.optional<Schema.Schema<string, string, never>>;
+        style: Schema.optional<typeof Schema.String>;
     }>>;
 }>;
 export declare function defaultBody(): Record<string, unknown>;

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

@@ -35,6 +35,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;
@@ -212,6 +213,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;

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

@@ -35,6 +35,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;
@@ -212,6 +213,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;

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

@@ -30,6 +30,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;
@@ -207,6 +208,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;

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

@@ -30,6 +30,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;
@@ -207,6 +208,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
                 }[]] | undefined;
             }[];
             readonly query?: {
+                readonly style?: string | undefined;
                 readonly initial?: {
                     readonly data: string;
                     readonly request?: string | undefined;

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

@@ -45,6 +45,7 @@ export declare function schema(configure: (env: Environment) => void, _blockRef:
             }[]] | undefined;
         }[];
         readonly query?: {
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;
@@ -349,6 +350,7 @@ export declare function schema(configure: (env: Environment) => void, _blockRef:
             }, never>>;
         }>>;
         query: Schema.optional<Schema.refine<{
+            readonly style?: string | undefined;
             readonly initial?: {
                 readonly data: string;
                 readonly request?: string | undefined;
@@ -415,6 +417,7 @@ export declare function schema(configure: (env: Environment) => void, _blockRef:
                 data: Schema.Schema<string, string, never>;
             }>>>;
             readonly: Schema.optional<Schema.Schema<string, string, never>>;
+            style: Schema.optional<typeof Schema.String>;
         }>>>;
         rowKey: Schema.optional<Schema.Schema<string, string, never>>;
         cellStyle: Schema.optional<Schema.Schema<string, string, never>>;

package/dist/runtime/components/form/ValidationRulesField.d.vue.ts

@@ -0,0 +1,16 @@
+import type { LocaleValue } from '../../share/locale.js';
+type Rule = {
+    when: string;
+    warning?: boolean;
+    message: LocaleValue;
+};
+type __VLS_Props = {
+    modelValue?: ReadonlyArray<Rule>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (rules: readonly Rule[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((rules: readonly Rule[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/form/ValidationRulesField.vue

@@ -0,0 +1,207 @@
+<script setup>
+import { computed, ref, watch } from "vue";
+import { Icon } from "@iconify/vue";
+import {
+  useTreeDnd
+} from "../../composables/useTreeDnd";
+import { Button } from "../ui/button";
+import { ExpressionEditor } from "../ui/expression-editor";
+import { Field, FieldLabel } from "../ui/field";
+import { Switch } from "../ui/switch";
+import { Locale as LocaleField } from "../ui/locale";
+import { Markdown } from "../ui/markdown";
+import { getStructFieldDescription, getStructFieldTitle } from "./utils/schema-meta";
+import { validationRuleStruct } from "./utils/common";
+defineOptions({ name: "ShwfedValidationRulesField" });
+const RULE_META = validationRuleStruct(() => {
+});
+const whenTitle = getStructFieldTitle(RULE_META, "when") ?? "\u6821\u9A8C\u6761\u4EF6";
+const whenDescription = getStructFieldDescription(RULE_META, "when");
+const props = defineProps({
+  modelValue: { type: Array, required: false }
+});
+const emit = defineEmits(["update:modelValue"]);
+const rules = computed(() => props.modelValue ?? []);
+const EMPTY_MESSAGE = [{ locale: "zh", message: "" }];
+function makeId() {
+  if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+    const r = Math.random() * 16 | 0;
+    return (c === "x" ? r : r & 3 | 8).toString(16);
+  });
+}
+const rowKeys = ref([]);
+watch(
+  () => rules.value.length,
+  (len) => {
+    if (len === rowKeys.value.length) return;
+    rowKeys.value = Array.from({ length: len }, () => makeId());
+  },
+  { immediate: true }
+);
+function addRule() {
+  emit("update:modelValue", [...rules.value, { when: "", message: EMPTY_MESSAGE }]);
+  rowKeys.value = [...rowKeys.value, makeId()];
+}
+function removeRule(index) {
+  emit("update:modelValue", rules.value.filter((_, i) => i !== index));
+  rowKeys.value = rowKeys.value.filter((_, i) => i !== index);
+}
+function updateWhen(index, when) {
+  emit("update:modelValue", rules.value.map((rule, i) => i === index ? { ...rule, when } : rule));
+}
+function updateWarning(index, warning) {
+  emit("update:modelValue", rules.value.map((rule, i) => i === index ? { ...rule, warning } : rule));
+}
+function updateMessage(index, message) {
+  emit("update:modelValue", rules.value.map((rule, i) => i === index ? { ...rule, message } : rule));
+}
+function move(from, to) {
+  if (from === to) return;
+  if (from < 0 || to < 0 || from >= rules.value.length || to >= rules.value.length) return;
+  const next = [...rules.value];
+  const [rule] = next.splice(from, 1);
+  if (!rule) return;
+  next.splice(to, 0, rule);
+  emit("update:modelValue", next);
+  const keys = [...rowKeys.value];
+  const [key] = keys.splice(from, 1);
+  if (!key) return;
+  keys.splice(to, 0, key);
+  rowKeys.value = keys;
+}
+const ROW_KIND = "shwfed-validation-rule";
+const rowId = (i) => rowKeys.value[i] ?? `idx-${i}`;
+function onRowDrop(e) {
+  if (e.source.kind !== ROW_KIND || e.target.kind !== ROW_KIND) return;
+  const from = rowKeys.value.findIndex((k) => k === e.source.id);
+  const to = rowKeys.value.findIndex((k) => k === e.target.id);
+  if (from < 0 || to < 0) return;
+  if (e.instruction === "reorder-above") move(from, from < to ? to - 1 : to);
+  else if (e.instruction === "reorder-below") move(from, from <= to ? to : to + 1);
+}
+const dnd = useTreeDnd({ onRowDrop });
+const pickDragHandle = (el) => el.querySelector(".drag-handle");
+function rowConfig(i) {
+  return {
+    kind: ROW_KIND,
+    canDrop: (src) => src.kind === ROW_KIND,
+    blockInstructions: (src) => {
+      const block = ["make-child", "reparent"];
+      if (src.id === rowId(i)) block.push("reorder-above", "reorder-below");
+      return block;
+    },
+    dragHandle: pickDragHandle
+  };
+}
+</script>
+
+<template>
+  <div class="flex flex-col gap-2">
+    <div
+      v-for="(rule, index) in rules"
+      :key="rowKeys[index]"
+      :ref="dnd.rowRef(rowId(index), rowConfig(index))"
+      data-slot="validation-rule"
+      class="relative flex items-start gap-2 rounded border border-zinc-200 bg-zinc-50/40 p-2"
+      :data-instruction="dnd.instructionFor(rowId(index)) ?? void 0"
+    >
+      <Icon
+        icon="fluent:re-order-dots-vertical-20-regular"
+        class="drag-handle mt-2.5 size-4 shrink-0 cursor-grab text-zinc-400"
+        data-slot="validation-rule-drag-handle"
+      />
+
+      <!--
+        `items-start` keeps each Field at its own content height — without it the
+        grid stretches both cells to the taller (multi-row message) and the
+        floating label centers on that inflated height instead of its control.
+        With the natural height restored, the standard floating behaviour is
+        what we want: the label rests centered (acting as the placeholder) while
+        the field is empty + inactive, and floats up to the top-border notch on
+        focus or once a value is present. The `when` editor therefore carries no
+        explicit placeholder — the label IS the placeholder (the syntax contract
+        lives in its tooltip); a separate placeholder would sit under the
+        resting label and double up.
+      -->
+      <div class="grid min-w-0 flex-1 grid-cols-2 items-start gap-2">
+        <Field orientation="floating">
+          <FieldLabel>
+            <template
+              v-if="whenDescription"
+              #tooltip
+            >
+              <Markdown
+                :source="whenDescription"
+                block
+                class="prose prose-sm prose-zinc"
+              />
+            </template>
+            {{ whenTitle }}
+          </FieldLabel>
+          <ExpressionEditor
+            :model-value="rule.when"
+            result-type="bool"
+            class="min-h-10"
+            @update:model-value="(v) => updateWhen(index, v)"
+          />
+        </Field>
+
+        <!--
+          The message is a multi-row Locale — one row per language — so a single
+          shared label can't center over the stack. `floating` gives each row
+          its own per-language floating label instead; the "消息" semantic is
+          carried by the column position opposite 校验条件.
+        -->
+        <LocaleField
+          floating
+          markdown
+          translate-hint="form field validation message"
+          :model-value="rule.message"
+          @update:model-value="(v) => updateMessage(index, v)"
+        />
+      </div>
+
+      <!--
+        Severity switch — off (default) is error (blocks submit, reds the
+        field), on is warning (yellow hint, never blocks). Stacked label keeps
+        it self-describing in the narrow action column.
+      -->
+      <label
+        class="mt-1 flex shrink-0 cursor-pointer flex-col items-center gap-1 text-xs text-zinc-600 select-none"
+        data-slot="validation-rule-severity"
+      >
+        <Switch
+          size="sm"
+          :model-value="rule.warning ?? false"
+          @update:model-value="(v) => updateWarning(index, v)"
+        />
+        仅警告
+      </label>
+
+      <Button
+        variant="ghost"
+        size="sm"
+        class="mt-1.5 text-red-600 hover:text-red-700"
+        aria-label="移除"
+        @click="removeRule(index)"
+      >
+        <Icon icon="fluent:delete-20-regular" />
+      </Button>
+    </div>
+
+    <Button
+      type="button"
+      data-slot="validation-add"
+      class="w-full justify-center"
+      @click="addRule"
+    >
+      <Icon icon="fluent:add-20-regular" />
+      <span>添加校验规则</span>
+    </Button>
+  </div>
+</template>
+
+<style scoped>
+[data-instruction=reorder-above]:before,[data-instruction=reorder-below]:after{background:var(--primary,#2563eb);content:"";height:2px;left:0;pointer-events:none;position:absolute;right:0;z-index:1}[data-instruction=reorder-above]:before{top:-5px}[data-instruction=reorder-below]:after{bottom:-5px}
+</style>

package/dist/runtime/components/form/ValidationRulesField.vue.d.ts

@@ -0,0 +1,16 @@
+import type { LocaleValue } from '../../share/locale.js';
+type Rule = {
+    when: string;
+    warning?: boolean;
+    message: LocaleValue;
+};
+type __VLS_Props = {
+    modelValue?: ReadonlyArray<Rule>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (rules: readonly Rule[]) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((rules: readonly Rule[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

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

@@ -4,6 +4,7 @@ import { provideCELContext } from "../../utils/cel-context";
 import { ExpressionEditor } from "../ui/expression-editor";
 import { Field, FieldLabel } from "../ui/field";
 import { Markdown } from "../ui/markdown";
+import { Textarea } from "../ui/textarea";
 import {
   FormConfig,
   getStructFieldDescription,
@@ -60,6 +61,15 @@ function updateReadonly(value) {
     config.value = { ...next, readonly: value };
   }
 }
+function updateStyle(value) {
+  const next = { ...config.value };
+  if (value.trim() === "") {
+    const { style: _omit, ...rest } = next;
+    config.value = rest;
+  } else {
+    config.value = { ...next, style: value };
+  }
+}
 </script>
 
 <template>
@@ -138,6 +148,28 @@ function updateReadonly(value) {
             @update:model-value="updateReadonly"
           />
         </Field>
+
+        <Field orientation="vertical">
+          <FieldLabel class="text-xs text-zinc-500">
+            <template
+              v-if="generalFieldDescription('style')"
+              #tooltip
+            >
+              <Markdown
+                :source="generalFieldDescription('style')"
+                block
+                class="prose prose-sm prose-zinc"
+              />
+            </template>
+            {{ generalFieldTitle("style") }}
+          </FieldLabel>
+          <Textarea
+            :model-value="config.style ?? ''"
+            placeholder="如 max-width: 640px; margin: 0 auto;"
+            class="min-h-20 font-mono text-xs"
+            @update:model-value="(v) => updateStyle(String(v))"
+          />
+        </Field>
       </div>
     </template>
   </ShwfedFormUnitConfig>

package/dist/runtime/components/form/fields/2026-04-22/com.shwfed.form.field.markdown/config.d.vue.ts

@@ -14,8 +14,20 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
             readonly locale: "en" | "ja" | "ko";
             readonly message: string;
         }[]];
+        readonly required?: string | undefined;
         readonly displayName?: string | undefined;
         readonly compatibilityDate: "2026-04-22";
+        readonly validations?: readonly {
+            readonly message: readonly [{
+                readonly locale: "zh";
+                readonly message: string;
+            }, ...{
+                readonly locale: "en" | "ja" | "ko";
+                readonly message: string;
+            }[]];
+            readonly warning?: boolean | undefined;
+            readonly when: string;
+        }[] | undefined;
     }) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: {
@@ -29,8 +41,20 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {},
             readonly locale: "en" | "ja" | "ko";
             readonly message: string;
         }[]];
+        readonly required?: string | undefined;
         readonly displayName?: string | undefined;
         readonly compatibilityDate: "2026-04-22";
+        readonly validations?: readonly {
+            readonly message: readonly [{
+                readonly locale: "zh";
+                readonly message: string;
+            }, ...{
+                readonly locale: "en" | "ja" | "ko";
+                readonly message: string;
+            }[]];
+            readonly warning?: boolean | undefined;
+            readonly when: string;
+        }[] | undefined;
     }) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;