n-design-readonly-plugin 1.0.2 → 1.0.3

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 pangsh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -31,14 +31,14 @@ import App from './App.vue';
 
 // 引入 n-designv3（必须）
 import NDesignV3 from 'n-designv3';
-import 'n-designv3/dist/style.css';
+import 'n-designv3/dist/nancal.variable.min.css';
 
 // 引入本插件
-import { NkReadonlyPlugin } from 'nk-readonly-hoc';
+import NDesignReadolyPlugin from 'n-design-readonly-plugin';
 
 const app = createApp(App);
 app.use(NDesignV3);
-app.use(NkReadonlyPlugin); // 注册后自动提供 NkInput, NkSelect 等组件
+app.use(NDesignReadolyPlugin); // 注册后自动提供 NkInput, NkSelect 等组件
 app.mount('#app');
 
 ```

package/dist/index.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue"),l=require("n-designv3");function x(e){if(e==null)return"";if(typeof e=="string")return e;if(Array.isArray(e))return e.map(x).join("");if(typeof e=="object"){if(typeof e.children=="string")return e.children;if(e?.default&&typeof e.default=="function"){const n=e.default();if(Array.isArray(n))return x(n)}e.children&&x(e.children)}return""}function L(e,n={}){const t=new Map,{value:c="value",label:s="label"}=n;if(!e)return t;const d=Array.isArray(e)?e:[e];for(const r of d)if(!(!r||typeof r!="object")){if(r.type&&(typeof r.type=="object"||typeof r.type=="function")){let f=r.type.name?.toLowerCase()||"";if(typeof r.type=="function"?f=r.type.displayName?.toLowerCase()||"":typeof r.type=="string"&&(f=r.type?.toLowerCase()||""),/option|radio|checkbox/i.test(f)){const o=r.props||{},a=o[c]??o.value,y=o[s]??o.label;if(a!=null){const w=x(r.children)||y||String(a);t.set(a,w)}}}r.children&&L(r.children,n).forEach((o,a)=>{t.has(a)||t.set(a,o)})}return t}function G(e,n,t){const{value:c="value",label:s="label",children:d="children"}=t,r=[];let f=e;for(const o of n){const a=f.find(y=>y[c]===o);if(a)r.push(a[s]||a[c]||String(o)),f=a[d]||[];else{r.push(String(o));break}}return r}function D(e,n,t){const{value:c="value",label:s="title",children:d="children"}=t,r=[],f=new Set(Array.isArray(n)?n:[n]);function o(a){for(const y of a)f.has(y[c])&&r.push(y[s]||y[c]),y[d]&&o(y[d])}return o(e),r}function H({modelValue:e,options:n,treeData:t,valueToLabel:c,fieldNames:s,slots:d,isSelect:r,isRadioGroup:f,isCheckboxGroup:o,isCheckbox:a,isRadio:y,isCascader:w,isTreeSelect:C,isSwitch:T,attrs:p,emptyText:k}){if(c)try{return c(e)||k}catch(i){console.warn("[ReadonlyHOC] valueToLabel error",i)}if(T){const i=p.checkedValue??p["checked-value"]??!0,h=p.uncheckedValue??p["un-checked-value"]??!1;return e===i?p.checkedChildren??p["checked-children"]??"开启":e===h?p.uncheckedChildren??p["un-checked-children"]??"关闭":String(e||k)}if(w&&Array.isArray(e)&&n?.length)return G(n,e,s).join(" / ")||k;if(C&&t?.length)return D(t,e,s).join(", ")||k;if(n?.length){const i=s.value||"value",h=s.label||"label",S=v=>{const R=n.find(m=>m[i]===v);return R?R[h]||R[i]:v==null?"":String(v)};return Array.isArray(e)?e.map(S).join(", ")||k:S(e)||k}else if((r||f||o)&&d?.default)try{const i=d.default(),h=L(i,s);if(h.size>0){const S=v=>v==null?"":h.get(v)||String(v);return Array.isArray(e)?e.map(S).join(", ")||k:S(e)||k}}catch(i){console.warn("[ReadonlyHOC] Failed to parse slot options",i)}else if(d?.default&&(a||y)&&typeof e=="boolean")try{const i=d.default(),h=x(i);if(h)return h}catch{}return e==null||e===""?k:Array.isArray(e)?e.join(", "):String(e)}function O(e){const n=e.name||"",t=n.toLowerCase(),c=/select/i.test(t)&&!/tree|cascader/i.test(t),s=/radio/i.test(t)&&!/group/i.test(t),d=/radio.*group/i.test(t),r=/checkbox/i.test(t)&&!/group/i.test(t),f=/checkbox.*group/i.test(t),o=/switch/i.test(t),a=/cascader/i.test(t),y=/tree.*select/i.test(t),C=r||o||s?"checked":"value",T=`update:${C}`,p=/form$/i.test(t),k=/form.*item/i.test(t);return u.defineComponent({name:n,inheritAttrs:!1,props:{modelValue:{type:[String,Number,Boolean,Array,Object],default:void 0},[C]:{type:[String,Number,Boolean,Array,Object],default:void 0},readonly:{type:Boolean,default:void 0},emptyText:{type:String,default:"--"},valueToLabel:{type:Function,default:null}},emits:["update:modelValue",T],setup(i,{emit:h,slots:S,expose:v}){const R=u.inject("nkReadonly",u.ref(!1)),m=u.computed(()=>i.readonly??R.value),F=u.computed(()=>i.readonly??R.value);p&&u.provide("nkReadonly",F);const j=u.computed(()=>i[C]!==void 0?i[C]:i.modelValue),P=g=>{h("update:modelValue",g),h(T,g)},b=u.useAttrs(),K=u.computed(()=>{if(!m.value)return"";const g=b.fieldNames??b["field-names"]??{},M=b.options,I=b.treeData??b["tree-data"];return H({modelValue:j.value,options:M,treeData:I,valueToLabel:i.valueToLabel,fieldNames:g,slots:S,isSelect:c,isRadioGroup:d,isCheckboxGroup:f,isCheckbox:r,isRadio:s,isCascader:a,isTreeSelect:y,isSwitch:o,attrs:b,emptyText:i.emptyText})}),N={lineHeight:"32px",padding:"0 6px",display:"inline-block",minHeight:"32px",border:"none",backgroundColor:"none",cursor:"default",wordBreak:"break-all",color:"rgba(0, 0, 0, 0.65)"},A=u.ref();return p&&v({validate:()=>m.value?Promise.resolve({}):A.value?.validate?.(),validateFields:g=>m.value?Promise.resolve({}):A.value?.validateFields?.(g),resetFields:g=>!m.value&&A.value?.resetFields?.(g),clearValidate:g=>!m.value&&A.value?.clearValidate?.(g),scrollToField:g=>!m.value&&A.value?.scrollToField?.(g)}),()=>k?u.h(e,{...b,style:{...b.style||{},marginBottom:m.value?"10px":void 0}},S):p?u.h(e,{...b,rules:F.value?null:b.rules,disabled:F.value?!0:b.disabled,ref:A},S):m.value?u.h("span",{class:"nk-readonly-wrapper",style:N,role:"text",tabindex:0,"aria-readonly":"true"},K.value):u.h(e,{...b,[C]:j.value,[`onUpdate:${C}`]:P,ref:p?A:void 0},S)}})}const $={Input:l.Input,InputNumber:l.InputNumber,Textarea:l.Textarea,Select:l.Select,SelectOption:l.Select.Option,TreeSelect:l.TreeSelect,Cascader:l.Cascader,DatePicker:l.DatePicker,TimePicker:l.TimePicker,Radio:l.Radio,Checkbox:l.Checkbox,RadioGroup:l.Radio.Group,CheckboxGroup:l.Checkbox.Group,Switch:l.Switch,Form:l.Form,FormItem:l.Form.Item},E={install(e){for(const[n,t]of Object.entries($))if(t){const c=O(t);e.component(`Nk${n}`,c)}}};exports.NkReadonlyPlugin=E;exports.withReadonly=O;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const u=require("vue"),l=require("n-designv3");function R(e){if(e==null)return"";if(typeof e=="string")return e;if(Array.isArray(e))return e.map(R).join("");if(typeof e=="object"){if(typeof e.children=="string")return e.children;if(e?.default&&typeof e.default=="function"){const n=e.default();if(Array.isArray(n))return R(n)}e.children&&R(e.children)}return""}function L(e,n={}){const t=new Map,{value:c="value",label:s="label"}=n;if(!e)return t;const d=Array.isArray(e)?e:[e];for(const r of d)if(!(!r||typeof r!="object")){if(r.type&&(typeof r.type=="object"||typeof r.type=="function")){let f=r.type.name?.toLowerCase()||"";if(typeof r.type=="function"?f=r.type.displayName?.toLowerCase()||"":typeof r.type=="string"&&(f=r.type?.toLowerCase()||""),/option|radio|checkbox/i.test(f)){const o=r.props||{},a=o[c]??o.value,y=o[s]??o.label;if(a!=null){const w=R(r.children)||y||String(a);t.set(a,w)}}}r.children&&L(r.children,n).forEach((o,a)=>{t.has(a)||t.set(a,o)})}return t}function D(e,n,t){const{value:c="value",label:s="label",children:d="children"}=t,r=[];let f=e;for(const o of n){const a=f.find(y=>y[c]===o);if(a)r.push(a[s]||a[c]||String(o)),f=a[d]||[];else{r.push(String(o));break}}return r}function G(e,n,t){const{value:c="value",label:s="title",children:d="children"}=t,r=[],f=new Set(Array.isArray(n)?n:[n]);function o(a){for(const y of a)f.has(y[c])&&r.push(y[s]||y[c]),y[d]&&o(y[d])}return o(e),r}function H({modelValue:e,options:n,treeData:t,valueToLabel:c,fieldNames:s,slots:d,isSelect:r,isRadioGroup:f,isCheckboxGroup:o,isCheckbox:a,isRadio:y,isCascader:w,isTreeSelect:C,isSwitch:T,attrs:p,emptyText:g}){if(c)try{return c(e)||g}catch(i){console.warn("[ReadonlyHOC] valueToLabel error",i)}if(T){const i=p.checkedValue??p["checked-value"]??!0,h=p.uncheckedValue??p["un-checked-value"]??!1;return e===i?p.checkedChildren??p["checked-children"]??"开启":e===h?p.uncheckedChildren??p["un-checked-children"]??"关闭":String(e||g)}if(w&&Array.isArray(e)&&n?.length)return D(n,e,s).join(" / ")||g;if(C&&t?.length)return G(t,e,s).join(", ")||g;if(n?.length){const i=s.value||"value",h=s.label||"label",S=k=>{const x=n.find(m=>m[i]===k);return x?x[h]||x[i]:k==null?"":String(k)};return Array.isArray(e)?e.map(S).join(", ")||g:S(e)||g}else if((r||f||o)&&d?.default)try{const i=d.default(),h=L(i,s);if(h.size>0){const S=k=>k==null?"":h.get(k)||String(k);return Array.isArray(e)?e.map(S).join(", ")||g:S(e)||g}}catch(i){console.warn("[ReadonlyHOC] Failed to parse slot options",i)}else if(d?.default&&(a||y)&&typeof e=="boolean")try{const i=d.default(),h=R(i);if(h)return h}catch{}return e==null||e===""?g:Array.isArray(e)?e.join(", "):String(e)}function O(e){if(typeof e=="function")return e;const n=e.name||"",t=n.toLowerCase(),c=/select/i.test(t)&&!/tree|cascader/i.test(t),s=/radio/i.test(t)&&!/group/i.test(t),d=/radio.*group/i.test(t),r=/checkbox/i.test(t)&&!/group/i.test(t),f=/checkbox.*group/i.test(t),o=/switch/i.test(t),a=/cascader/i.test(t),y=/tree.*select/i.test(t),C=r||o||s?"checked":"value",T=`update:${C}`,p=/form$/i.test(t),g=/form.*item/i.test(t);return u.defineComponent({name:n,inheritAttrs:!1,props:{modelValue:{type:[String,Number,Boolean,Array,Object],default:void 0},[C]:{type:[String,Number,Boolean,Array,Object],default:void 0},readonly:{type:Boolean,default:void 0},emptyText:{type:String,default:"--"},valueToLabel:{type:Function,default:null}},emits:["update:modelValue",T],setup(i,{emit:h,slots:S,expose:k}){const x=u.inject("nkReadonly",u.ref(!1)),m=u.computed(()=>i.readonly??x.value),F=u.computed(()=>i.readonly??x.value);p&&u.provide("nkReadonly",F);const j=u.computed(()=>i[C]!==void 0?i[C]:i.modelValue),K=v=>{h("update:modelValue",v),h(T,v)},b=u.useAttrs(),P=u.computed(()=>{if(!m.value)return"";const v=b.fieldNames??b["field-names"]??{},N=b.options,I=b.treeData??b["tree-data"];return H({modelValue:j.value,options:N,treeData:I,valueToLabel:i.valueToLabel,fieldNames:v,slots:S,isSelect:c,isRadioGroup:d,isCheckboxGroup:f,isCheckbox:r,isRadio:s,isCascader:a,isTreeSelect:y,isSwitch:o,attrs:b,emptyText:i.emptyText})}),M={lineHeight:"32px",padding:"0 6px",display:"inline-block",minHeight:"32px",border:"none",backgroundColor:"none",cursor:"default",wordBreak:"break-all",color:"rgba(0, 0, 0, 0.65)"},A=u.ref();return p&&k({validate:()=>m.value?Promise.resolve({}):A.value?.validate?.(),validateFields:v=>m.value?Promise.resolve({}):A.value?.validateFields?.(v),resetFields:v=>!m.value&&A.value?.resetFields?.(v),clearValidate:v=>!m.value&&A.value?.clearValidate?.(v),scrollToField:v=>!m.value&&A.value?.scrollToField?.(v)}),()=>g?u.h(e,{...b,style:{...b.style||{},marginBottom:m.value?"10px":void 0}},S):p?u.h(e,{...b,rules:F.value?null:b.rules,disabled:F.value?!0:b.disabled,ref:A},S):m.value?u.h("span",{class:"nk-readonly-wrapper",style:M,role:"text",tabindex:0,"aria-readonly":"true"},P.value):u.h(e,{...b,[C]:j.value,[`onUpdate:${C}`]:K,ref:p?A:void 0},S)}})}const $={Input:l.Input,InputNumber:l.InputNumber,Textarea:l.Textarea,Select:l.Select,SelectOption:l.Select.Option,TreeSelect:l.TreeSelect,Cascader:l.Cascader,DatePicker:l.DatePicker,TimePicker:l.TimePicker,Radio:l.Radio,Checkbox:l.Checkbox,RadioGroup:l.Radio.Group,CheckboxGroup:l.Checkbox.Group,Switch:l.Switch,Form:l.Form,FormItem:l.Form.Item},E={install(e){for(const[n,t]of Object.entries($))if(t){const c=O(t);e.component(`Nk${n}`,c)}}};exports.default=E;exports.withReadonly=O;

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { Plugin } from 'vue';
 import { withReadonly } from './withReadonly';
-export declare const NkReadonlyPlugin: Plugin;
+declare const NDesignReadolyPlugin: Plugin;
+export default NDesignReadolyPlugin;
 export { withReadonly };

package/dist/index.es.js

@@ -1,18 +1,18 @@
-import { defineComponent as E, inject as B, ref as T, computed as w, provide as U, useAttrs as z, h as j } from "vue";
-import { Form as K, Checkbox as O, Radio as N, Select as M, Switch as q, TimePicker as J, DatePicker as Q, Cascader as W, TreeSelect as X, Textarea as Y, InputNumber as Z, Input as _ } from "n-designv3";
-function A(e) {
+import { defineComponent as E, inject as U, ref as T, computed as w, provide as z, useAttrs as q, h as j } from "vue";
+import { Form as K, Checkbox as O, Radio as N, Select as M, Switch as B, TimePicker as J, DatePicker as Q, Cascader as W, TreeSelect as X, Textarea as Y, InputNumber as Z, Input as _ } from "n-designv3";
+function C(e) {
   if (e == null) return "";
   if (typeof e == "string") return e;
-  if (Array.isArray(e)) return e.map(A).join("");
+  if (Array.isArray(e)) return e.map(C).join("");
   if (typeof e == "object") {
     if (typeof e.children == "string")
       return e.children;
     if (e?.default && typeof e.default == "function") {
       const n = e.default();
       if (Array.isArray(n))
-        return A(n);
+        return C(n);
     }
-    e.children && A(e.children);
+    e.children && C(e.children);
   }
   return "";
 }
@@ -25,15 +25,15 @@ function P(e, n = {}) {
       if (r.type && (typeof r.type == "object" || typeof r.type == "function")) {
         let u = r.type.name?.toLowerCase() || "";
         if (typeof r.type == "function" ? u = r.type.displayName?.toLowerCase() || "" : typeof r.type == "string" && (u = r.type?.toLowerCase() || ""), /option|radio|checkbox/i.test(u)) {
-          const o = r.props || {}, a = o[l] ?? o.value, f = o[c] ?? o.label;
-          if (a != null) {
-            const x = A(r.children) || f || String(a);
-            t.set(a, x);
+          const a = r.props || {}, o = a[l] ?? a.value, f = a[c] ?? a.label;
+          if (o != null) {
+            const x = C(r.children) || f || String(o);
+            t.set(o, x);
           }
         }
       }
-      r.children && P(r.children, n).forEach((o, a) => {
-        t.has(a) || t.set(a, o);
+      r.children && P(r.children, n).forEach((a, o) => {
+        t.has(o) || t.set(o, a);
       });
     }
   return t;
@@ -41,12 +41,12 @@ function P(e, n = {}) {
 function V(e, n, t) {
   const { value: l = "value", label: c = "label", children: s = "children" } = t, r = [];
   let u = e;
-  for (const o of n) {
-    const a = u.find((f) => f[l] === o);
-    if (a)
-      r.push(a[c] || a[l] || String(o)), u = a[s] || [];
+  for (const a of n) {
+    const o = u.find((f) => f[l] === a);
+    if (o)
+      r.push(o[c] || o[l] || String(a)), u = o[s] || [];
     else {
-      r.push(String(o));
+      r.push(String(a));
       break;
     }
   }
@@ -54,11 +54,11 @@ function V(e, n, t) {
 }
 function ee(e, n, t) {
   const { value: l = "value", label: c = "title", children: s = "children" } = t, r = [], u = new Set(Array.isArray(n) ? n : [n]);
-  function o(a) {
-    for (const f of a)
-      u.has(f[l]) && r.push(f[c] || f[l]), f[s] && o(f[s]);
+  function a(o) {
+    for (const f of o)
+      u.has(f[l]) && r.push(f[c] || f[l]), f[s] && a(f[s]);
   }
-  return o(e), r;
+  return a(e), r;
 }
 function te({
   modelValue: e,
@@ -69,11 +69,11 @@ function te({
   slots: s,
   isSelect: r,
   isRadioGroup: u,
-  isCheckboxGroup: o,
-  isCheckbox: a,
+  isCheckboxGroup: a,
+  isCheckbox: o,
   isRadio: f,
   isCascader: x,
-  isTreeSelect: m,
+  isTreeSelect: S,
   isSwitch: R,
   attrs: d,
   emptyText: b
@@ -90,72 +90,74 @@ function te({
   }
   if (x && Array.isArray(e) && n?.length)
     return V(n, e, c).join(" / ") || b;
-  if (m && t?.length)
+  if (S && t?.length)
     return ee(t, e, c).join(", ") || b;
   if (n?.length) {
-    const i = c.value || "value", y = c.label || "label", g = (v) => {
-      const C = n.find((k) => k[i] === v);
-      return C ? C[y] || C[i] : v == null ? "" : String(v);
+    const i = c.value || "value", y = c.label || "label", v = (g) => {
+      const A = n.find((k) => k[i] === g);
+      return A ? A[y] || A[i] : g == null ? "" : String(g);
     };
-    return Array.isArray(e) ? e.map(g).join(", ") || b : g(e) || b;
-  } else if ((r || u || o) && s?.default)
+    return Array.isArray(e) ? e.map(v).join(", ") || b : v(e) || b;
+  } else if ((r || u || a) && s?.default)
     try {
       const i = s.default(), y = P(i, c);
       if (y.size > 0) {
-        const g = (v) => v == null ? "" : y.get(v) || String(v);
-        return Array.isArray(e) ? e.map(g).join(", ") || b : g(e) || b;
+        const v = (g) => g == null ? "" : y.get(g) || String(g);
+        return Array.isArray(e) ? e.map(v).join(", ") || b : v(e) || b;
       }
     } catch (i) {
       console.warn("[ReadonlyHOC] Failed to parse slot options", i);
     }
-  else if (s?.default && (a || f) && typeof e == "boolean")
+  else if (s?.default && (o || f) && typeof e == "boolean")
     try {
-      const i = s.default(), y = A(i);
+      const i = s.default(), y = C(i);
       if (y) return y;
     } catch {
     }
   return e == null || e === "" ? b : Array.isArray(e) ? e.join(", ") : String(e);
 }
 function re(e) {
-  const n = e.name || "", t = n.toLowerCase(), l = /select/i.test(t) && !/tree|cascader/i.test(t), c = /radio/i.test(t) && !/group/i.test(t), s = /radio.*group/i.test(t), r = /checkbox/i.test(t) && !/group/i.test(t), u = /checkbox.*group/i.test(t), o = /switch/i.test(t), a = /cascader/i.test(t), f = /tree.*select/i.test(t), m = r || o || c ? "checked" : "value", R = `update:${m}`, d = /form$/i.test(t), b = /form.*item/i.test(t);
+  if (typeof e == "function")
+    return e;
+  const n = e.name || "", t = n.toLowerCase(), l = /select/i.test(t) && !/tree|cascader/i.test(t), c = /radio/i.test(t) && !/group/i.test(t), s = /radio.*group/i.test(t), r = /checkbox/i.test(t) && !/group/i.test(t), u = /checkbox.*group/i.test(t), a = /switch/i.test(t), o = /cascader/i.test(t), f = /tree.*select/i.test(t), S = r || a || c ? "checked" : "value", R = `update:${S}`, d = /form$/i.test(t), b = /form.*item/i.test(t);
   return E({
     name: n,
     inheritAttrs: !1,
     props: {
       modelValue: { type: [String, Number, Boolean, Array, Object], default: void 0 },
-      [m]: { type: [String, Number, Boolean, Array, Object], default: void 0 },
+      [S]: { type: [String, Number, Boolean, Array, Object], default: void 0 },
       readonly: { type: Boolean, default: void 0 },
       emptyText: { type: String, default: "--" },
       valueToLabel: { type: Function, default: null }
     },
     emits: ["update:modelValue", R],
-    setup(i, { emit: y, slots: g, expose: v }) {
-      const C = B("nkReadonly", T(!1)), k = w(() => i.readonly ?? C.value), F = w(() => i.readonly ?? C.value);
-      d && U("nkReadonly", F);
-      const L = w(() => i[m] !== void 0 ? i[m] : i.modelValue), G = (h) => {
+    setup(i, { emit: y, slots: v, expose: g }) {
+      const A = U("nkReadonly", T(!1)), k = w(() => i.readonly ?? A.value), F = w(() => i.readonly ?? A.value);
+      d && z("nkReadonly", F);
+      const L = w(() => i[S] !== void 0 ? i[S] : i.modelValue), G = (h) => {
         y("update:modelValue", h), y(R, h);
-      }, p = z(), I = w(() => {
+      }, p = q(), I = w(() => {
         if (!k.value) return "";
-        const h = p.fieldNames ?? p["field-names"] ?? {}, $ = p.options, D = p.treeData ?? p["tree-data"];
+        const h = p.fieldNames ?? p["field-names"] ?? {}, H = p.options, $ = p.treeData ?? p["tree-data"];
         return te({
           modelValue: L.value,
-          options: $,
-          treeData: D,
+          options: H,
+          treeData: $,
           valueToLabel: i.valueToLabel,
           fieldNames: h,
-          slots: g,
+          slots: v,
           isSelect: l,
           isRadioGroup: s,
           isCheckboxGroup: u,
           isCheckbox: r,
           isRadio: c,
-          isCascader: a,
+          isCascader: o,
           isTreeSelect: f,
-          isSwitch: o,
+          isSwitch: a,
           attrs: p,
           emptyText: i.emptyText
         });
-      }), H = {
+      }), D = {
         lineHeight: "32px",
         padding: "0 6px",
         display: "inline-block",
@@ -165,34 +167,34 @@ function re(e) {
         cursor: "default",
         wordBreak: "break-all",
         color: "rgba(0, 0, 0, 0.65)"
-      }, S = T();
-      return d && v({
-        validate: () => k.value ? Promise.resolve({}) : S.value?.validate?.(),
-        validateFields: (h) => k.value ? Promise.resolve({}) : S.value?.validateFields?.(h),
-        resetFields: (h) => !k.value && S.value?.resetFields?.(h),
-        clearValidate: (h) => !k.value && S.value?.clearValidate?.(h),
-        scrollToField: (h) => !k.value && S.value?.scrollToField?.(h)
+      }, m = T();
+      return d && g({
+        validate: () => k.value ? Promise.resolve({}) : m.value?.validate?.(),
+        validateFields: (h) => k.value ? Promise.resolve({}) : m.value?.validateFields?.(h),
+        resetFields: (h) => !k.value && m.value?.resetFields?.(h),
+        clearValidate: (h) => !k.value && m.value?.clearValidate?.(h),
+        scrollToField: (h) => !k.value && m.value?.scrollToField?.(h)
       }), () => b ? j(
         e,
         {
           ...p,
           style: { ...p.style || {}, marginBottom: k.value ? "10px" : void 0 }
         },
-        g
+        v
       ) : d ? j(
         e,
         {
           ...p,
           rules: F.value ? null : p.rules,
           disabled: F.value ? !0 : p.disabled,
-          ref: S
+          ref: m
         },
-        g
+        v
       ) : k.value ? j(
         "span",
         {
           class: "nk-readonly-wrapper",
-          style: H,
+          style: D,
           role: "text",
           tabindex: 0,
           "aria-readonly": "true"
@@ -202,11 +204,11 @@ function re(e) {
         e,
         {
           ...p,
-          [m]: L.value,
-          [`onUpdate:${m}`]: G,
-          ref: d ? S : void 0
+          [S]: L.value,
+          [`onUpdate:${S}`]: G,
+          ref: d ? m : void 0
         },
-        g
+        v
       );
     }
   });
@@ -225,10 +227,10 @@ const ne = {
   Checkbox: O,
   RadioGroup: N.Group,
   CheckboxGroup: O.Group,
-  Switch: q,
+  Switch: B,
   Form: K,
   FormItem: K.Item
-}, ae = {
+}, oe = {
   install(e) {
     for (const [n, t] of Object.entries(ne))
       if (t) {
@@ -238,6 +240,6 @@ const ne = {
   }
 };
 export {
-  ae as NkReadonlyPlugin,
+  oe as default,
   re as withReadonly
 };

package/dist/withReadonly.d.ts

@@ -1,71 +1,7 @@
-import { PropType, Component, VNode } from 'vue';
-type FormModelValue = string | number | boolean | any[] | null | undefined;
-type ValueToLabelFn = (value: FormModelValue) => string;
-export declare function withReadonly(BaseComponent: Component): import('vue').DefineComponent<{
-    [x: string]: {
-        type: PropType<FormModelValue>;
-        default: undefined;
-    } | {
-        type: BooleanConstructor;
-        default: undefined;
-    } | {
-        type: StringConstructor;
-        default: string;
-    } | {
-        type: PropType<ValueToLabelFn>;
-        default: null;
-    };
-    modelValue: {
-        type: PropType<FormModelValue>;
-        default: undefined;
-    };
-    readonly: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    emptyText: {
-        type: StringConstructor;
-        default: string;
-    };
-    valueToLabel: {
-        type: PropType<ValueToLabelFn>;
-        default: null;
-    };
-}, () => VNode<import('vue').RendererNode, import('vue').RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, string[], string, import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, Readonly<import('vue').ExtractPropTypes<{
-    [x: string]: {
-        type: PropType<FormModelValue>;
-        default: undefined;
-    } | {
-        type: BooleanConstructor;
-        default: undefined;
-    } | {
-        type: StringConstructor;
-        default: string;
-    } | {
-        type: PropType<ValueToLabelFn>;
-        default: null;
-    };
-    modelValue: {
-        type: PropType<FormModelValue>;
-        default: undefined;
-    };
-    readonly: {
-        type: BooleanConstructor;
-        default: undefined;
-    };
-    emptyText: {
-        type: StringConstructor;
-        default: string;
-    };
-    valueToLabel: {
-        type: PropType<ValueToLabelFn>;
-        default: null;
-    };
-}>> & {
-    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
-}, {
-    [x: string]: FormModelValue | ValueToLabelFn;
-}, {}>;
-export {};
+import { Component } from 'vue';
+export declare function withReadonly(BaseComponent: Component): import('vue').FunctionalComponent<any, any, any> | {
+    new (...args: any[]): any;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "n-design-readonly-plugin",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "只读模式插件 for n-designv3",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.es.js",
@@ -13,8 +13,7 @@
     }
   },
   "files": [
-    "dist",
-    ""
+    "dist", "README.md", "LICENSE"
   ],
   "scripts": {
     "dev": "vite --config vite.config.playground.ts",
@@ -31,7 +30,7 @@
     "hoc"
   ],
   "author": "pangsh<psh2416623245@163.com>",
-  "license": "ISC",
+  "license": "MIT",
   "packageManager": "pnpm@10.21.0",
   "devDependencies": {
     "@types/node": "^25.2.0",

package/.gitignore

@@ -1,31 +0,0 @@
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
-
-node_modules
-.DS_Store
-dist
-dist-ssr
-coverage
-*.local
-package-lock.json
-report.html
-
-/cypress/videos/
-/cypress/screenshots/
-
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-!.vscode/settings.json
-.idea
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?

package/playground/App.vue

@@ -1,77 +0,0 @@
-<template>
-  <div class="form-wrapper">
-    <nk-form :readonly="false" :model="form" :rules="rules">
-      <nk-form-item label="用户名" name="name">
-        <nk-input placeholder="用户名" v-model:value="form.name"></nk-input>
-      </nk-form-item>
-      <n-row>
-        <n-col :span="24">
-        <nk-form-item label="下拉options" name="ep6ClusterObjId">
-          <nk-select
-            allowClear
-            placeholder="请选择"
-            :options="options"
-            :showSearch="false"
-            v-model:value="form.ep6ClusterObjId"
-          >
-          </nk-select>
-        </nk-form-item>
-        </n-col>
-      </n-row>
-      <n-row>
-        <n-col :span="24">
-        <nk-form-item label="下拉options" name="ep6ClusterObjId">
-          <n-select
-            allowClear
-            placeholder="请选择"
-            :options="options"
-            :showSearch="false"
-            v-model:value="form.ep6ClusterObjId"
-          >
-          </n-select>
-        </nk-form-item>
-        </n-col>
-      </n-row>
-    </nk-form>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { reactive } from "vue";
-
-const form = reactive({
-  name: "张三",
-  ep6ClusterObjId: "1",
-});
-const options = [
-  {
-    label: "选项1",
-    value: "1",
-    externalValue: "externalValue1",
-  },
-  {
-    label: "选项2",
-    value: "2",
-    externalValue: "externalValue2",
-  },
-  {
-    label: "选项3",
-    value: "3",
-    externalValue: "externalValue3",
-  },
-];
-const rules = {
-  name: [{ required: true, message: "请输入用户名" }],
-  ep6ClusterObjId: [{ required: true, message: "请选择" }],
-};
-</script>
-<style>
-.form-wrapper {
-  width: 100%;
-  height: 100vh;
-  padding: 20px;
-  box-sizing: border-box;
-  position: relative;
-  background-color: bisque;
-}
-</style>

package/playground/index.html

@@ -1,16 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-  <meta charset="UTF-8" />
-  <link rel="icon" href="/favicon.ico" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>NkReadonlyHOC Playground</title>
-</head>
-
-<body>
-  <div id="app"></div>
-  <script type="module" src="./main.ts"></script>
-</body>
-
-</html>

package/playground/main.ts

@@ -1,12 +0,0 @@
-// main.ts
-import { createApp } from 'vue';
-import App from './App.vue';
-import { NkReadonlyPlugin } from '../src/index';
-import NDesign from 'n-designv3';
-import 'n-designv3/dist/nancal.variable.min.css';
-import './reset.css'
-
-const app = createApp(App);
-app.use(NDesign);
-app.use(NkReadonlyPlugin); // ← 一行注册！
-app.mount('#app');

package/playground/reset.css

@@ -1,126 +0,0 @@
-html,
-body,
-div,
-span,
-applet,
-object,
-iframe,
-p,
-blockquote,
-pre,
-a,
-abbr,
-acronym,
-address,
-big,
-cite,
-code,
-del,
-dfn,
-em,
-img,
-ins,
-kbd,
-q,
-s,
-samp,
-small,
-strike,
-strong,
-sub,
-sup,
-tt,
-var,
-b,
-u,
-i,
-center,
-dl,
-dt,
-dd,
-ol,
-ul,
-li,
-fieldset,
-form,
-label,
-legend,
-table,
-caption,
-tbody,
-tfoot,
-thead,
-tr,
-th,
-td,
-article,
-aside,
-canvas,
-details,
-embed,
-figure,
-figcaption,
-footer,
-header,
-hgroup,
-menu,
-nav,
-output,
-ruby,
-section,
-summary,
-time,
-mark,
-audio,
-video {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  font-size: 100%;
-  font: inherit;
-  // vertical-align: baseline;
-}
-/* HTML5 display-role reset for older browsers */
-article,
-aside,
-details,
-figcaption,
-figure,
-footer,
-header,
-hgroup,
-menu,
-nav,
-section {
-  display: block;
-}
-body {
-  line-height: 1;
-}
-ol,
-ul {
-  list-style: none;
-}
-blockquote,
-q {
-  quotes: none;
-}
-blockquote:before,
-blockquote:after,
-q:before,
-q:after {
-  content: '';
-  content: none;
-}
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-html,
-body {
-  width: 100%;
-  height: 100%;
-  padding: 0;
-  margin: 0;
-  font-family: 'PingFang SC-Medium', 'PingFang SC-Regular', 'PingFang SC', 'STHeitiSC-Light', 'Helvetica-Light', 'Arial', 'sans-serif';
-}

package/src/index.ts

@@ -1,52 +0,0 @@
-// src/index.ts
-import type { App, Plugin } from 'vue';
-import { withReadonly } from './withReadonly';
-
-// 👇 直接从 n-designv3 导入组件（构建时 external，不打包）
-import {
-  Input,
-  InputNumber,
-  Textarea,
-  Select,
-  TreeSelect,
-  Cascader,
-  DatePicker,
-  TimePicker,
-  Radio,
-  Checkbox,
-  Switch,
-  Form,
-} from 'n-designv3';
-
-const COMPONENTS = {
-  Input,
-  InputNumber,
-  Textarea,
-  Select,
-  SelectOption: Select.Option,
-  TreeSelect,
-  Cascader,
-  DatePicker,
-  TimePicker,
-  Radio,
-  Checkbox,
-  RadioGroup: Radio.Group,
-  CheckboxGroup: Checkbox.Group,
-  Switch,
-  Form,
-  FormItem: Form.Item,
-};
-
-export const NkReadonlyPlugin: Plugin = {
-  install(app: App) {
-    for (const [name, Comp] of Object.entries(COMPONENTS)) {
-      if (Comp) {
-        const ReadonlyComp = withReadonly(Comp);
-        app.component(`Nk${name}`, ReadonlyComp);
-      }
-    }
-  },
-};
-
-// 可选：导出 HOC 供用户按需使用
-export { withReadonly };

package/src/types/env.d.ts

@@ -1,11 +0,0 @@
-// src/types/env.d.ts
-interface ImportMetaEnv {
-  readonly DEV: boolean;
-  readonly PROD: boolean;
-  readonly SSR: boolean;
-  // 可以根据实际需要添加其他环境变量
-}
-
-interface ImportMeta {
-  readonly env: ImportMetaEnv;
-}

package/src/withReadonly.tsx

@@ -1,414 +0,0 @@
-// composables/withReadonly.ts
-import { defineComponent, h, computed, inject, provide, ref, watch, useAttrs, type PropType, type Component, type VNode, Ref } from 'vue';
-
-type FormModelValue = string | number | boolean | any[] | null | undefined;
-type ValueToLabelFn = (value: FormModelValue) => string;
-
-// ========================
-// 工具函数：提取静态文本（用于单个 checkbox/radio/select ）
-// ========================
-function extractStaticText(vnode: any): string {
-  if (vnode == null) return '';
-  if (typeof vnode === 'string') return vnode;
-  if (Array.isArray(vnode)) return vnode.map(extractStaticText).join('');
-  if (typeof vnode === 'object') {
-    if (typeof vnode.children === 'string') {
-      return vnode.children;
-    }
-    // 处理动态插槽内容
-    if (vnode?.default && typeof vnode.default === 'function') {
-      const dynamicContent = vnode.default();
-      if (Array.isArray(dynamicContent)) {
-        return extractStaticText(dynamicContent);
-      }
-    }
-    if (vnode.children) {
-      extractStaticText(vnode.children);
-    }
-  }
-  return '';
-}
-
-// ========================
-// 从插槽中提取 value → label 映射（支持 n-option / n-radio / n-checkbox / n-select）
-// ========================
-function collectOptionLabelMapFromSlots(vnodes: VNode | VNode[] | undefined, fieldNames: Record<string, string> = {}): Map<any, string> {
-  const labelMap = new Map<any, string>();
-  const { value: valKey = 'value', label: labelKey = 'label' } = fieldNames;
-
-  if (!vnodes) return labelMap;
-
-  const nodes = Array.isArray(vnodes) ? vnodes : [vnodes];
-
-  for (const vnode of nodes) {
-    if (!vnode || typeof vnode !== 'object') continue;
-
-    // 处理组件节点
-    if (vnode.type && (typeof vnode.type === 'object' || typeof vnode.type === 'function')) {
-      let compName = (vnode.type as any).name?.toLowerCase() || '';
-      if (typeof vnode.type === 'function') {
-        compName = (vnode.type as any).displayName?.toLowerCase() || '';
-      } else if (typeof vnode.type === 'string') {
-        compName = (vnode.type as any)?.toLowerCase() || '';
-      }
-      if (/option|radio|checkbox/i.test(compName)) {
-        const props = vnode.props || {};
-        const value = props[valKey] ?? props.value;
-        const labelText = props[labelKey] ?? props.label;
-        if (value != null) {
-          const label = extractStaticText(vnode.children) || labelText || String(value);
-          labelMap.set(value, label);
-        }
-      }
-    }
-
-    // 递归子节点
-    if (vnode.children) {
-      const childMap = collectOptionLabelMapFromSlots(vnode.children as any, fieldNames);
-      childMap.forEach((label, val) => {
-        if (!labelMap.has(val)) labelMap.set(val, label);
-      });
-    }
-  }
-
-  return labelMap;
-}
-
-// ========================
-// Cascader: 递归查找 label 路径
-// ========================
-function findCascaderLabels(options: any[], value: any[], fieldNames: Record<string, string>): string[] {
-  const { value: valKey = 'value', label: labelKey = 'label', children: childrenKey = 'children' } = fieldNames;
-  const labels: string[] = [];
-  let current = options;
-
-  for (const v of value) {
-    const node = current.find((item: any) => item[valKey] === v);
-    if (node) {
-      labels.push(node[labelKey] || node[valKey] || String(v));
-      current = node[childrenKey] || [];
-    } else {
-      labels.push(String(v));
-      break;
-    }
-  }
-  return labels;
-}
-
-// ========================
-// TreeSelect: 从 treeData 递归查找 label
-// ========================
-function findTreeSelectLabels(treeData: any[], value: any, fieldNames: Record<string, string>): string[] {
-  const { value: valKey = 'value', label: labelKey = 'title', children: childrenKey = 'children' } = fieldNames;
-  const labels: string[] = [];
-  const targetValues = new Set(Array.isArray(value) ? value : [value]);
-
-  function dfs(nodes: any[]) {
-    for (const node of nodes) {
-      if (targetValues.has(node[valKey])) {
-        labels.push(node[labelKey] || node[valKey]);
-      }
-      if (node[childrenKey]) {
-        dfs(node[childrenKey]);
-      }
-    }
-  }
-
-  dfs(treeData);
-  return labels;
-}
-
-// ========================
-// 获取只读显示文本
-// ========================
-function getDisplayText({
-  modelValue,
-  options,
-  treeData,
-  valueToLabel,
-  fieldNames,
-  slots,
-  isSelect,
-  isRadioGroup,
-  isCheckboxGroup,
-  isCheckbox,
-  isRadio,
-  isCascader,
-  isTreeSelect,
-  isSwitch,
-  attrs,
-  emptyText,
-}: {
-  modelValue: FormModelValue;
-  options?: any[];
-  treeData?: any[];
-  valueToLabel?: ValueToLabelFn;
-  fieldNames: Record<string, string>;
-  slots?: any;
-  isSelect: boolean;
-  isRadioGroup: boolean;
-  isCheckboxGroup: boolean;
-  isCheckbox: boolean;
-  isRadio: boolean;
-  isCascader: boolean;
-  isTreeSelect: boolean;
-  isSwitch: boolean;
-  attrs: Record<string, any>;
-  emptyText: string;
-}): string {
-  // 1. 自定义映射
-  if (valueToLabel) {
-    try {
-      return valueToLabel(modelValue) || emptyText;
-    } catch (e) {
-      console.warn('[ReadonlyHOC] valueToLabel error', e);
-    }
-  }
-
-  // 2. Switch 特殊处理
-  if (isSwitch) {
-    const checkedVal = attrs.checkedValue ?? attrs['checked-value'] ?? true;
-    const uncheckedVal = attrs.uncheckedValue ?? attrs['un-checked-value'] ?? false;
-    if (modelValue === checkedVal) return attrs.checkedChildren ?? attrs['checked-children'] ?? '开启';
-    if (modelValue === uncheckedVal) return attrs.uncheckedChildren ?? attrs['un-checked-children'] ?? '关闭';
-    return String(modelValue || emptyText);
-  }
-
-  // 3. Cascader
-  if (isCascader && Array.isArray(modelValue) && options?.length) {
-    return findCascaderLabels(options, modelValue, fieldNames).join(' / ') || emptyText;
-  }
-
-  // 4. TreeSelect
-  if (isTreeSelect && treeData?.length) {
-    return findTreeSelectLabels(treeData, modelValue, fieldNames).join(', ') || emptyText;
-  }
-
-  // 5. 动态 options（Select / RadioGroup / CheckboxGroup）
-  if (options?.length) {
-    const valKey = fieldNames.value || 'value';
-    const labelKey = fieldNames.label || 'label';
-    const getLabel = (val: any) => {
-      const opt = options.find(item => item[valKey] === val);
-      return opt ? opt[labelKey] || opt[valKey] : val === undefined || val === null ? '' : String(val);
-    };
-    if (Array.isArray(modelValue)) {
-      return modelValue.map(getLabel).join(', ') || emptyText;
-    } else {
-      return getLabel(modelValue) || emptyText;
-    }
-  }
-
-  // 6. 静态插槽 fallback（Select / RadioGroup / CheckboxGroup）
-  else if ((isSelect || isRadioGroup || isCheckboxGroup) && slots?.default) {
-    try {
-      const slotContent = slots.default();
-
-      const labelMap = collectOptionLabelMapFromSlots(slotContent, fieldNames);
-      if (labelMap.size > 0) {
-        const getLabel = (val: any) => (val === undefined || val === null ? '' : labelMap.get(val) || String(val));
-        if (Array.isArray(modelValue)) {
-          return modelValue.map(getLabel).join(', ') || emptyText;
-        } else {
-          return getLabel(modelValue) || emptyText;
-        }
-      }
-    } catch (e) {
-      console.warn('[ReadonlyHOC] Failed to parse slot options', e);
-    }
-  }
-
-  // 7. 单个 Checkbox / Radio 静态文本兜底
-  else if (slots?.default && (isCheckbox || isRadio) && typeof modelValue === 'boolean') {
-    try {
-      const content = slots.default();
-      const text = extractStaticText(content);
-      if (text) return text;
-    } catch (e) {
-      /* ignore */
-    }
-  }
-
-  // 8. 最终兜底
-  if (modelValue == null || modelValue === '') return emptyText;
-  return Array.isArray(modelValue) ? modelValue.join(', ') : String(modelValue);
-}
-
-// ========================
-// 高阶组件
-// ========================
-export function withReadonly(BaseComponent: Component) {
-  const baseName = BaseComponent.name || '';
-  const componentName = baseName.toLowerCase();
-
-  const isSelect = /select/i.test(componentName) && !/tree|cascader/i.test(componentName);
-  const isRadio = /radio/i.test(componentName) && !/group/i.test(componentName);
-  const isRadioGroup = /radio.*group/i.test(componentName);
-  const isCheckbox = /checkbox/i.test(componentName) && !/group/i.test(componentName);
-  const isCheckboxGroup = /checkbox.*group/i.test(componentName);
-  const isSwitch = /switch/i.test(componentName);
-  const isCascader = /cascader/i.test(componentName);
-  const isTreeSelect = /tree.*select/i.test(componentName);
-
-  const isCheckType = isCheckbox || isSwitch || isRadio;
-  const nativeProp = isCheckType ? 'checked' : 'value';
-  const updateEvent = `update:${nativeProp}`;
-
-  const isForm = /form$/i.test(componentName);
-  const isFormItem = /form.*item/i.test(componentName);
-
-  return defineComponent({
-    name: baseName,
-    inheritAttrs: false,
-    props: {
-      modelValue: { type: [String, Number, Boolean, Array, Object] as PropType<FormModelValue>, default: undefined },
-      [nativeProp]: { type: [String, Number, Boolean, Array, Object] as PropType<FormModelValue>, default: undefined },
-      readonly: { type: Boolean, default: undefined },
-      emptyText: { type: String, default: '--' },
-      valueToLabel: { type: Function as PropType<ValueToLabelFn>, default: null },
-    },
-    emits: ['update:modelValue', updateEvent],
-    setup(props, { emit, slots, expose }) {
-      const globalReadonly = inject<Ref<boolean>>('nkReadonly', ref(false));
-      const isReadonly = computed(() => props.readonly ?? globalReadonly.value);
-      const formReadonly = computed(() => props.readonly ?? globalReadonly.value);
-
-      if (isForm) provide('nkReadonly', formReadonly);
-
-      const finalValue = computed(() => (props[nativeProp] !== undefined ? props[nativeProp] : props.modelValue));
-
-      const emitUpdate = (val: FormModelValue) => {
-        emit('update:modelValue', val);
-        emit(updateEvent, val);
-      };
-
-      // ✅ 使用 useAttrs() 保证响应式
-      const attrs = useAttrs();
-
-      const displayText = computed(() => {
-        if (!isReadonly.value) return '';
-
-        const fieldNames = attrs.fieldNames ?? attrs['field-names'] ?? {};
-        const options = attrs.options as any[] | undefined;
-        const treeData = (attrs.treeData ?? attrs['tree-data']) as any[] | undefined;
-
-        return getDisplayText({
-          modelValue: finalValue.value as FormModelValue,
-          options,
-          treeData,
-          valueToLabel: props.valueToLabel as ValueToLabelFn,
-          fieldNames: fieldNames as Record<string, string>,
-          slots,
-          isSelect,
-          isRadioGroup,
-          isCheckboxGroup,
-          isCheckbox,
-          isRadio,
-          isCascader,
-          isTreeSelect,
-          isSwitch,
-          attrs,
-          emptyText: props.emptyText as string,
-        });
-      });
-
-      // ⚠️ 开发警告
-      if (import.meta?.env?.DEV) {
-        watch(
-          () => isReadonly.value,
-          readonly => {
-            if (
-              readonly &&
-              !attrs.options &&
-              !attrs.treeData &&
-              !props.valueToLabel &&
-              slots?.default &&
-              (isSelect || isRadioGroup || isCheckboxGroup || isCascader || isTreeSelect)
-            ) {
-              console.warn(
-                `[ReadonlyHOC] Detected slot-only usage for  ${baseName} in readonly mode. ` +
-                  `This works for static content, but will fail for async/dynamic data. ` +
-                  `✅ Recommended: Use \`options\` or \`treeData\` prop instead.`
-              );
-            }
-          },
-          { immediate: true }
-        );
-      }
-
-      const readonlyStyle = {
-        lineHeight: '32px',
-        padding: '0 6px',
-        display: 'inline-block',
-        minHeight: '32px',
-        border: 'none',
-        backgroundColor: 'none',
-        cursor: 'default',
-        wordBreak: 'break-all',
-        color: 'rgba(0, 0, 0, 0.65)',
-      };
-
-      const formRef = ref<any>();
-      if (isForm) {
-        expose({
-          validate: () => (isReadonly.value ? Promise.resolve({}) : formRef.value?.validate?.()),
-          validateFields: (names?: string[]) => (isReadonly.value ? Promise.resolve({}) : formRef.value?.validateFields?.(names)),
-          resetFields: (names?: string[]) => !isReadonly.value && formRef.value?.resetFields?.(names),
-          clearValidate: (names?: string[]) => !isReadonly.value && formRef.value?.clearValidate?.(names),
-          scrollToField: (name: string) => !isReadonly.value && formRef.value?.scrollToField?.(name),
-        });
-      }
-
-      return () => {
-        if (isFormItem) {
-          return h(
-            BaseComponent,
-            {
-              ...attrs,
-              style: { ...(attrs.style || {}), marginBottom: isReadonly.value ? '10px' : undefined },
-            },
-            slots
-          );
-        }
-
-        if (isForm) {
-          return h(
-            BaseComponent,
-            {
-              ...attrs,
-              rules: formReadonly.value ? null : attrs.rules,
-              disabled: formReadonly.value ? true : attrs.disabled,
-              ref: formRef,
-            },
-            slots
-          );
-        }
-
-        if (isReadonly.value) {
-          return h(
-            'span',
-            {
-              class: 'nk-readonly-wrapper',
-              style: readonlyStyle,
-              role: 'text',
-              tabindex: 0,
-              'aria-readonly': 'true',
-            },
-            displayText.value
-          );
-        }
-
-        return h(
-          BaseComponent,
-          {
-            ...attrs,
-            [nativeProp]: finalValue.value,
-            [`onUpdate:${nativeProp}`]: emitUpdate,
-            ref: isForm ? formRef : undefined,
-          },
-          slots
-        );
-      };
-    },
-  });
-}

package/tsconfig.json

@@ -1,19 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "module": "ESNext",
-    "lib": ["ES2020", "DOM"],
-    "moduleResolution": "bundler",
-    "strict": true,
-    "jsx": "preserve",
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "declaration": true,
-    "declarationDir": "./dist",
-    "outDir": "./dist",
-    "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true
-  },
-  "include": ["src"]
-}

package/vite.config.playground.ts

@@ -1,17 +0,0 @@
-import { defineConfig } from 'vite'
-import vue from '@vitejs/plugin-vue'
-import { resolve } from 'path'
-
-export default defineConfig({
-  root: 'playground',
-  plugins: [vue()],
-  resolve: {
-    alias: {
-      '@': resolve(__dirname, 'src'),
-    },
-  },
-  server: {
-    host: '0.0.0.0',
-    port: 5200,
-  },
-})

package/vite.config.ts

@@ -1,20 +0,0 @@
-import { resolve } from 'path';
-import { defineConfig } from 'vite';
-import dts from 'vite-plugin-dts';
-
-export default defineConfig({
-  build: {
-    lib: {
-      entry: resolve(__dirname, 'src/index.ts'),
-      name: 'NDesignReadolyPlugin',
-      fileName: (format) => `index.${format}.js`,
-      formats: ['es', 'cjs']
-    },
-    rollupOptions: {
-      // external 排除 vue 和 n-designv3
-      external: ['vue','n-designv3'],
-      output: { globals: { vue: 'Vue' } }
-    }
-  },
-  plugins: [dts({ insertTypesEntry: true })]
-});