@formily-djd/designer 0.0.7 → 0.0.8

package/dist/index.css

@@ -197,23 +197,23 @@
 }
 
 
-.config-panel[data-v-3a22b8d5] {
+.config-panel[data-v-e4320a16] {
   height: 100%;
   display: flex;
   flex-direction: column;
 }
-.config-empty[data-v-3a22b8d5] {
+.config-empty[data-v-e4320a16] {
   padding: 20px;
   text-align: center;
   color: #909399;
 }
-.config-content[data-v-3a22b8d5] {
+.config-content[data-v-e4320a16] {
   height: 100%;
   display: flex;
   flex-direction: column;
   overflow: hidden;
 }
-.config-title[data-v-3a22b8d5] {
+.config-title[data-v-e4320a16] {
   margin: 0;
   padding: 16px;
   font-size: 16px;
@@ -222,17 +222,17 @@
   background-color: #fff;
   flex-shrink: 0;
 }
-.config-section[data-v-3a22b8d5] {
+.config-section[data-v-e4320a16] {
   background-color: #fff;
   flex: 1;
   overflow-y: auto;
   border: none;
   padding: 0 16px;
 }
-.config-section[data-v-3a22b8d5] .el-collapse-item__header {
+.config-section[data-v-e4320a16] .el-collapse-item__header {
   font-weight: 600;
 }
-.config-section[data-v-3a22b8d5] .el-form-item {
+.config-section[data-v-e4320a16] .el-form-item {
   margin-bottom: 18px;
 }
 
@@ -320,66 +320,69 @@
 }
 
 
-.schema-tree[data-v-613d7f39] {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  background: var(--el-bg-color);
-}
-.tree-toolbar[data-v-613d7f39] {
+.component-picker-content[data-v-0981e67d] {
+  max-height: 70vh;
+  overflow-y: auto;
   padding: 16px;
+}
+.picker-category-group[data-v-0981e67d] {
+  margin-bottom: 24px;
+}
+.picker-category-group[data-v-0981e67d]:last-child {
+  margin-bottom: 0;
+}
+.picker-category-title[data-v-0981e67d] {
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--el-text-color-primary);
+  margin-bottom: 12px;
+  padding-bottom: 8px;
   border-bottom: 1px solid var(--el-border-color-light);
 }
-.toolbar-buttons[data-v-613d7f39] {
+.picker-component-grid[data-v-0981e67d] {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 12px;
+}
+.picker-component-item[data-v-0981e67d] {
   display: flex;
-  gap: 8px;
-  margin-top: 8px;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 16px 8px;
+  border: 1px solid var(--el-border-color-light);
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.2s;
+  background-color: var(--el-bg-color);
 }
-.tree-content[data-v-613d7f39] {
-  flex: 1;
-  overflow-y: auto;
-  padding: 16px;
+.picker-component-item[data-v-0981e67d]:hover {
+  border-color: var(--el-color-primary);
+  box-shadow: var(--el-box-shadow-light);
+  transform: translateY(-2px);
 }
-.tree-node[data-v-613d7f39] {
+.picker-component-icon[data-v-0981e67d] {
+  width: 48px;
+  height: 48px;
   display: flex;
   align-items: center;
-  gap: 8px;
-  flex: 1;
-  padding: 4px 0;
-}
-.tree-node.is-container[data-v-613d7f39] {
+  justify-content: center;
+  border-radius: 8px;
+  background: var(--el-color-primary);
+  color: var(--el-color-white);
+  font-size: 24px;
   font-weight: 600;
-  color: var(--el-color-primary);
-}
-.node-icon[data-v-613d7f39] {
-  font-size: 16px;
-  flex-shrink: 0;
-}
-.node-label[data-v-613d7f39] {
-  flex: 1;
-  font-size: 14px;
+  margin-bottom: 8px;
 }
-.node-component[data-v-613d7f39] {
+.picker-component-name[data-v-0981e67d] {
   font-size: 12px;
-  color: var(--el-text-color-secondary);
-}
-
-/* 拖拽时高亮 */
-[data-v-613d7f39] .el-tree-node.is-drop-inner > .el-tree-node__content {
-  background-color: var(--el-color-primary-light-9) !important;
-  border: 2px dashed var(--el-color-primary);
+  color: var(--el-text-color-regular);
+  text-align: center;
+  word-break: break-word;
 }
 
-/* 选中状态 */
-[data-v-613d7f39] .el-tree-node.is-current > .el-tree-node__content {
-  background-color: var(--el-color-primary-light-9);
-}
 
-/* 悬浮状态 */
-[data-v-613d7f39] .el-tree-node__content:hover {
-  background-color: var(--el-fill-color-light);
-}
-[data-v-613d7f39] .schema-tree-context-menu {
+[data-v-1ef29c4a] .schema-tree-context-menu {
   min-width: 160px;
   padding: 4px;
   background: var(--el-bg-color);
@@ -387,7 +390,7 @@
   border-radius: 6px;
   box-shadow: var(--el-box-shadow-light);
 }
-.menu-item[data-v-613d7f39] {
+.menu-item[data-v-1ef29c4a] {
   display: flex;
   align-items: center;
   gap: 8px;
@@ -398,107 +401,98 @@
   border-radius: 4px;
   transition: all 0.2s;
 }
-.menu-item[data-v-613d7f39]:hover {
+.menu-item[data-v-1ef29c4a]:hover {
   background-color: var(--el-fill-color-light);
   color: var(--el-color-primary);
 }
-.menu-divider[data-v-613d7f39] {
+.menu-divider[data-v-1ef29c4a] {
   height: 1px;
   background-color: var(--el-border-color-light);
   margin: 4px 0;
 }
-
-/* Element Plus 图标大小调整 */
-.menu-item .el-icon[data-v-613d7f39] {
+.menu-item[data-v-1ef29c4a] .el-icon {
   font-size: 16px;
 }
 
-/* 组件选择器弹窗 */
-.component-picker-content[data-v-613d7f39] {
-  max-height: 70vh;
-  overflow-y: auto;
-  padding: 16px;
-}
-.picker-category-group[data-v-613d7f39] {
-  margin-bottom: 24px;
-}
-.picker-category-group[data-v-613d7f39]:last-child {
-  margin-bottom: 0;
+
+.schema-tree[data-v-1474000a] {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  background: var(--el-bg-color);
 }
-.picker-category-title[data-v-613d7f39] {
-  font-size: 14px;
-  font-weight: 600;
-  color: var(--el-text-color-primary);
-  margin-bottom: 12px;
-  padding-bottom: 8px;
+.tree-toolbar[data-v-1474000a] {
+  padding: 16px;
   border-bottom: 1px solid var(--el-border-color-light);
 }
-.picker-component-grid[data-v-613d7f39] {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 12px;
-}
-.picker-component-item[data-v-613d7f39] {
+.toolbar-buttons[data-v-1474000a] {
   display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 16px 8px;
-  border: 1px solid var(--el-border-color-light);
-  border-radius: 8px;
-  cursor: pointer;
-  transition: all 0.2s;
-  background-color: var(--el-bg-color);
+  gap: 8px;
+  margin-top: 8px;
 }
-.picker-component-item[data-v-613d7f39]:hover {
-  border-color: var(--el-color-primary);
-  box-shadow: var(--el-box-shadow-light);
-  transform: translateY(-2px);
+.tree-content[data-v-1474000a] {
+  flex: 1;
+  overflow-y: auto;
+  padding: 16px;
 }
-.picker-component-icon[data-v-613d7f39] {
-  width: 48px;
-  height: 48px;
+.tree-node[data-v-1474000a] {
   display: flex;
   align-items: center;
-  justify-content: center;
-  border-radius: 8px;
-  background: var(--el-color-primary);
-  color: var(--el-color-white);
-  font-size: 24px;
+  gap: 8px;
+  flex: 1;
+  padding: 4px 0;
+}
+.tree-node.is-container[data-v-1474000a] {
   font-weight: 600;
-  margin-bottom: 8px;
+  color: var(--el-color-primary);
 }
-.picker-component-name[data-v-613d7f39] {
+.node-icon[data-v-1474000a] {
+  font-size: 16px;
+  flex-shrink: 0;
+}
+.node-label[data-v-1474000a] {
+  flex: 1;
+  font-size: 14px;
+}
+.node-component[data-v-1474000a] {
   font-size: 12px;
-  color: var(--el-text-color-regular);
-  text-align: center;
-  word-break: break-word;
+  color: var(--el-text-color-secondary);
+}
+[data-v-1474000a] .el-tree-node.is-drop-inner > .el-tree-node__content {
+  background-color: var(--el-color-primary-light-9) !important;
+  border: 2px dashed var(--el-color-primary);
+}
+[data-v-1474000a] .el-tree-node.is-current > .el-tree-node__content {
+  background-color: var(--el-color-primary-light-9);
+}
+[data-v-1474000a] .el-tree-node__content:hover {
+  background-color: var(--el-fill-color-light);
 }
 
 
-.left-panel[data-v-e47d1682] {
+.left-panel[data-v-7b552cf6] {
   height: 100%;
   display: flex;
   flex-direction: column;
   background: #fff;
 }
-.panel-tabs[data-v-e47d1682] {
+.panel-tabs[data-v-7b552cf6] {
   height: 100%;
   display: flex;
   flex-direction: column;
 }
-[data-v-e47d1682] .el-tabs__header {
+[data-v-7b552cf6] .el-tabs__header {
   margin: 0;
   padding: 0 16px;
   border-bottom: 1px solid #e5e7eb;
 }
-[data-v-e47d1682] .el-tabs__content {
+[data-v-7b552cf6] .el-tabs__content {
   flex: 1;
   overflow: hidden;
   display: flex;
   flex-direction: column;
 }
-[data-v-e47d1682] .el-tab-pane {
+[data-v-7b552cf6] .el-tab-pane {
   height: 100%;
   overflow: hidden;
   display: flex;

package/dist/index.d.mts

@@ -262,5 +262,6 @@ declare const Canvas: any;
 declare const ConfigPanel: any;
 declare const MaterialPanel: any;
 declare const Designer: any;
+declare const Render: any;
 //#endregion
-export { Canvas, ConfigPanel, DesignStore, DesignStoreKey, Designer, MaterialPanel, schemaToSetterValues, setterValuesToSchema, useCreateDesignStore, useDesignStore };
+export { Canvas, ConfigPanel, DesignStore, DesignStoreKey, Designer, MaterialPanel, Render, schemaToSetterValues, setterValuesToSchema, useCreateDesignStore, useDesignStore };

package/dist/index.mjs

@@ -1 +1 @@
-import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,h as l,inject as u,mergeProps as d,nextTick as f,normalizeClass as p,normalizeProps as m,normalizeStyle as h,onBeforeUnmount as g,openBlock as _,provide as v,ref as y,renderList as b,renderSlot as x,resolveComponent as S,resolveDynamicComponent as C,shallowRef as w,toDisplayString as T,unref as E,watch as D,withCtx as O,withModifiers as k}from"vue";import{uid as A}from"@formily/shared";import{deleteByPath as ee,getByPath as j,getFieldNameFromPath as M,setByPath as N}from"@formily-djd/utils";import{ArrayItems as P,Checkbox as te,FormItem as ne,Input as F,InputNumber as re,Radio as I,Select as ie,Space as ae,Switch as oe}from"@formily/element-plus";import{FormProvider as se,RecursionField as L,createSchemaField as R,useField as z,useFieldSchema as ce}from"@formily/vue";import{createForm as B,isVoidField as V,onFormValuesChange as le}from"@formily/core";import{Bottom as ue,CirclePlus as H,CopyDocument as de,Delete as fe,FolderAdd as pe,Search as me,Top as he}from"@element-plus/icons-vue";import{observer as ge}from"@formily/reactive-vue";const U=Symbol(`DesignStore`);function W(){let e=u(U);if(!e)throw Error(`[useDesignStore] 必须在 Designer 组件内使用`);return e}const G=Symbol(`ComponentSettings`),K=Symbol(`ArrayField`),q=Symbol(`ArrayItemKey`),J=Symbol(`LeftPanel`);function Y(e,n=`.canvas-content`){return t(()=>{if(!e.value)return null;let t=document.querySelector(`[data-node-id="${e.value}"]`);if(!t)return null;let r=document.querySelector(n);if(!r)return null;let i=t.getBoundingClientRect(),a=r.getBoundingClientRect();return{x:i.x-a.x+r.scrollLeft,y:i.y-a.y+r.scrollTop,width:i.width,height:i.height}})}function X(e,t,n=!0){let r=e=>{if(!n)return 0;let t=e*.1;return t>20?20:t<10?10:t},i=r(t.width),a=r(t.height);return e.x>=t.x+i&&e.x<=t.x+t.width-i&&e.y>=t.y+a&&e.y<=t.y+t.height-a}function Z(e,t){let n=Math.min(Math.abs(e.x-t.x),Math.abs(e.x-(t.x+t.width))),r=Math.min(Math.abs(e.y-t.y),Math.abs(e.y-(t.y+t.height)));return e.x>=t.x&&e.x<=t.x+t.width&&(n=0),e.y>=t.y&&e.y<=t.y+t.height&&(r=0),Math.sqrt(n**2+r**2)}function _e(e,t,n){return n?e.x>=t.x+t.width/2:e.y>=t.y+t.height/2}function ve(e){return e.width>e.height}let Q=function(e){return e.Before=`BEFORE`,e.After=`AFTER`,e.Upper=`UPPER`,e.Under=`UNDER`,e.Inner=`INNER`,e.InnerBefore=`INNER_BEFORE`,e.InnerAfter=`INNER_AFTER`,e.ForbidBefore=`FORBID_BEFORE`,e.ForbidAfter=`FORBID_AFTER`,e.ForbidUpper=`FORBID_UPPER`,e.ForbidUnder=`FORBID_UNDER`,e.ForbidInner=`FORBID_INNER`,e.ForbidInnerBefore=`FORBID_INNER_BEFORE`,e.ForbidInnerAfter=`FORBID_INNER_AFTER`,e.Forbid=`FORBID`,e}({});var ye=class{sensitive;forceBlock;dragNodes=y([]);touchNode=y(null);closestNode=y(null);closestPosition=y(Q.Before);closestRect=y(null);getNodeRect;getNodeSchema;getCanvasRect;findChildNodes;constructor(e,t){this.sensitive=t?.sensitive??!0,this.forceBlock=t?.forceBlock??!1,this.getNodeRect=e.getNodeRect,this.getNodeSchema=e.getNodeSchema,this.getCanvasRect=e.getCanvasRect,this.findChildNodes=e.findChildNodes}setDragNodes(e){this.dragNodes.value=e}calculate(e){let{point:t,touchNode:n,closestNode:r,closestPosition:i}=e;if(r!==void 0&&i!==void 0){this.closestNode.value=r,this.closestPosition.value=i,r&&(this.closestRect.value=this.getNodeRect(r));return}if(!t)return;n!==void 0&&(this.touchNode.value=n);let a=this.getClosestNode(t);if(this.closestNode.value=a,!a){this.closestPosition.value=Q.Before,this.closestRect.value=null;return}this.closestPosition.value=this.getClosestPosition(t,a),this.closestRect.value=this.getNodeRect(a)}getClosestNode(e){let t=this.touchNode.value;if(!t)return null;let n=this.getNodeRect(t);if(!n)return null;let r=this.findChildNodes(t);if(r.length===0)return t;let i=X(e,n,this.sensitive)?0:Z(e,n),a=t;for(let t of r){let n=this.getNodeRect(t);if(!n)continue;let r=X(e,n,this.sensitive)?0:Z(e,n);r<=i&&(i=r,a=t)}return a}getClosestPosition(e,t){console.log(`[Dragon] getClosestPosition`,t);let n=this.getNodeRect(t),r=this.getNodeSchema(t);if(!n||!r)return Q.Forbid;let i=this.getLayout(n)===`horizontal`,a=X(e,n,this.sensitive),o=this.isContainer(r),s=this.canInsertSibling(t),c=_e(e,n,i);return a?o&&this.canDropInside(t)?this.findChildNodes(t).length===0?Q.Inner:c?Q.InnerAfter:Q.InnerBefore:s?i?c?Q.After:Q.Before:c?Q.Under:Q.Upper:Q.Forbid:s?i?c?Q.ForbidAfter:Q.ForbidBefore:c?Q.ForbidUnder:Q.ForbidUpper:Q.Forbid}getLayout(e){return this.forceBlock?`vertical`:ve(e)?`horizontal`:`vertical`}isContainer(e){return!e||e[`x-droppable`]===!1?!1:e.type===`object`||e.type===`void`||e.type===`array`}canInsertSibling(e){return!(e===``||e==null)}canDropInside(e){if(this.getNodeSchema(e)?.[`x-droppable`]===!1)return!1;let t=this.dragNodes.value;if(t.length===0)return!0;for(let n of t)if(n.nodePath===e||e.startsWith(`${n.nodePath}.`))return!1;return!0}clear(){this.dragNodes.value=[],this.touchNode.value=null,this.closestNode.value=null,this.closestPosition.value=Q.Before,this.closestRect.value=null}};function be(e=!1){let t=y({type:`object`,properties:{}}),n=y(null),r=y(null),i=y(null),a=y(!1),o=y([]),s=y(null),c=y(null),l=y(Q.Before);function u(e){let t=document.querySelector(`[data-node-id="${e}"]`);if(!t)return null;let n=document.querySelector(`.canvas-content`);if(!n)return null;let r=t.getBoundingClientRect(),i=n.getBoundingClientRect();return{x:r.x-i.x,y:r.y-i.y,width:r.width,height:r.height}}function d(){let e=document.querySelector(`.canvas-content`);if(!e)return{x:0,y:0,width:0,height:0};let t=e.getBoundingClientRect();return{x:t.x,y:t.y,width:t.width,height:t.height}}let f=new ye({getNodeRect:u,getNodeSchema:e=>j(t.value.properties,e),getCanvasRect:d,findChildNodes:e=>{let n=j(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{r.push(`${e}.properties.${t}`)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{r.push(`${e}.items.properties.${t}`)}),r}},{sensitive:!0,forceBlock:!1});function p(e,n){t.value.properties||(t.value.properties={}),t.value.properties[e]=n}function m(e,n){N(t.value.properties,e,n)}function h(e){n.value=e}function g(){return n.value&&j(t.value.properties,n.value)||null}function _(e){r.value=e,n.value=e}function b(e){i.value=e}function x(e){a.value=!0,o.value=e,f.setDragNodes(e)}function S(e,t){if(!a.value)return;t!==void 0&&(s.value=t);let n=d(),r={x:e.x-n.x,y:e.y-n.y};f.calculate({point:r,touchNode:s.value||void 0}),c.value=f.closestNode.value,l.value=f.closestPosition.value}function C(){if(console.log(`[DesignStore] drop`),!a.value)return;let e=c.value,t=l.value;if(!e){w();return}if(t.includes(`FORBID`)){w();return}let n=o.value;if(n.length===0){w();return}n.length===1&&T(n[0].nodePath,e,t),w()}function w(){a.value=!1,o.value=[],s.value=null,c.value=null,l.value=Q.Before,f.clear()}function T(e,n,r){let i=ee(t.value.properties,e);if(!i)return;let a=M(e);if(r===Q.Inner||r===Q.InnerAfter||r===Q.InnerBefore){let e=j(t.value.properties,n);if(!e)return;let o,s;if(e.type===`array`?(e.items||={type:`object`,properties:{}},e.items.properties||(e.items.properties={}),o=e.items.properties,s=`${n}.items.properties`):(e.properties||={},o=e.properties,s=`${n}.properties`),r===Q.InnerBefore){let e={[a]:i,...o};N(t.value.properties,s,e)}else N(t.value.properties,`${s}.${a}`,i)}else{let e=r===Q.Before||r===Q.Upper?`before`:`after`,o=n.split(`.`),s=o[o.length-1],c,l=o.includes(`items`);if(o.length===1)c=``;else if(l){let e=o.lastIndexOf(`items`);c=`${o.slice(0,e).join(`.`)}.items.properties`}else{let e=o.lastIndexOf(`properties`);c=o.slice(0,e+1).join(`.`)}let u=c?j(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=e===`after`?f+1:f,m=[...d.slice(0,p),[a,i],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?N(t.value.properties,c,h):t.value.properties=h}}function E(e,n,r,i){if(!e){t.value.properties||(t.value.properties={}),t.value.properties[n]=r;return}if(i===Q.Inner||i===Q.InnerAfter||i===Q.InnerBefore){let a=j(t.value.properties,e);if(!a)return;let o,s;if(a.type===`array`?(a.items||={type:`object`,properties:{}},a.items.properties||(a.items.properties={}),o=a.items.properties,s=`${e}.items.properties`):(a.properties||={},o=a.properties,s=`${e}.properties`),i===Q.InnerBefore){let e={[n]:r,...o};N(t.value.properties,s,e)}else N(t.value.properties,`${s}.${n}`,r)}else{let a=i===Q.Before||i===Q.Upper?`before`:`after`,o=e.split(`.`),s=o[o.length-1],c,l=o.includes(`items`);if(o.length===1)c=``;else if(l){let e=o.lastIndexOf(`items`);c=`${o.slice(0,e).join(`.`)}.items.properties`}else{let e=o.lastIndexOf(`properties`);c=o.slice(0,e+1).join(`.`)}let u=c?j(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=a===`after`?f+1:f,m=[...d.slice(0,p),[n,r],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?N(t.value.properties,c,h):t.value.properties=h}}function D(e){return j(t.value.properties,e)}function O(e){let n=j(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{let n=e?`${e}.properties.${t}`:t;r.push(n)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{let n=`${e}.items.properties.${t}`;r.push(n)}),r}let k={formSchema:t,selectedFieldName:n,selectedNodeId:r,hoveredNodeId:i,draggable:e,dragon:f,isDragging:a,dragNodes:o,touchNode:s,closestNode:c,closestPosition:l,addField:p,updateFieldSchema:m,selectField:h,selectNode:_,getSelectedField:g,setHover:b,startDrag:x,updateDragPosition:S,drop:C,cancelDrag:w,moveField:T,insertField:E,getNodeSchema:D,findChildNodes:O};return v(U,k),k}function xe(e,t){let n={};return Object.entries(t.properties||{}).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=j(e,i);r!==void 0&&(n[t]=r)}}),n}function Se(e,t,n){let r=JSON.parse(JSON.stringify(n));return Object.entries(t.properties||{}).forEach(([t,n])=>{let i=n[`x-path`];i&&e[t]!==void 0&&N(r,i,e[t])}),r}var $=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},Ce=$(c({__name:`HoverBox`,setup(e){let n=W(),a=Y(n.hoveredNodeId),o=t(()=>!n.hoveredNodeId.value||!n.selectedNodeId.value?!1:n.hoveredNodeId.value===n.selectedNodeId.value),s=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:2,visibility:`hidden`};return a.value&&!o.value&&(e.transform=`perspective(1px) translate3d(${a.value.x}px, ${a.value.y}px, 0)`,e.width=`${a.value.width}px`,e.height=`${a.value.height}px`,e.visibility=`visible`),e}),c=t(()=>a.value&&!o.value);return(e,t)=>c.value?(_(),i(`div`,{key:0,class:`hover-box`,style:h(s.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-2759debe`]]),we=$(c({__name:`Insertion`,setup(e){let n=W(),a=t(()=>{if(!n.isDragging.value||!n.closestNode.value)return{display:`none`};let e=n.closestPosition.value,t=n.dragon.closestRect.value;if(!t)return{display:`none`};let r=e.toString().includes(`FORBID`),i={position:`absolute`,backgroundColor:r?`#ef4444`:`#3b82f6`,pointerEvents:`none`,zIndex:10,transition:`all 0.15s cubic-bezier(0.4, 0, 0.2, 1)`,boxShadow:r?`0 0 8px rgba(239, 68, 68, 0.5)`:`0 0 8px rgba(59, 130, 246, 0.5)`};switch(e){case Q.Before:case Q.ForbidBefore:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case Q.After:case Q.ForbidAfter:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x+t.width-2}px, ${t.y}px, 0)`});break;case Q.Upper:case Q.ForbidUpper:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case Q.Under:case Q.ForbidUnder:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y+t.height-2}px, 0)`});break;case Q.Inner:case Q.InnerBefore:case Q.InnerAfter:case Q.ForbidInner:case Q.ForbidInnerBefore:case Q.ForbidInnerAfter:Object.assign(i,{width:`${t.width}px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`,backgroundColor:`transparent`,border:r?`2px dashed #ef4444`:`2px dashed #3b82f6`});break;case Q.Forbid:return{display:`none`};default:return{display:`none`}}return i});return(e,t)=>E(n).draggable?(_(),i(`div`,{key:0,class:`insertion-indicator`,style:h(a.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-9dbef644`]]),Te=$(c({__name:`SelectionBox`,setup(e){let n=Y(W().selectedNodeId),o=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:4,visibility:`hidden`};return n.value&&(e.transform=`perspective(1px) translate3d(${n.value.x-2}px, ${n.value.y-2}px, 0)`,e.width=`${n.value.width+4}px`,e.height=`${n.value.height+4}px`,e.visibility=`visible`),e}),s=t(()=>n.value!==null);return(e,t)=>s.value?(_(),i(`div`,{key:0,class:`selection-box`,style:h(o.value)},[...t[0]||=[a(`div`,{class:`selection-box-inner`},null,-1)]],4)):r(``,!0)}}),[[`__scopeId`,`data-v-c58abee5`]]);const Ee={class:`aux-tool-widget`};var De=$(c({__name:`AuxToolWidget`,setup(e){return(e,t)=>(_(),i(`div`,Ee,[s(Ce),s(Te),s(we)]))}}),[[`__scopeId`,`data-v-2d0e316d`]]);function Oe(e,t){let n={...e?.[`x-component-props`]||{}};return t.basicSetter&&Object.entries(t.basicSetter).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=j(e,i);r!==void 0&&(n[t]=r)}}),t.componentSetter?.properties&&Object.entries(t.componentSetter.properties).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=j(e,i);r!==void 0&&(n[t]=r)}}),n}function ke(e){if(e?.[`x-droppable`]===!1)return!1;let t=e.type;return(t===`object`||t===`void`||t===`array`)&&!!e.properties}function Ae(e){return e.type===`array`&&!!e.items}const je=[`data-node-id`,`draggable`],Me={key:0,class:`empty-container-placeholder`},Ne={key:0,class:`empty-container-placeholder`};var Pe=$(c({name:`CanvasField`,__name:`index`,props:{schema:{},fieldName:{},nodePath:{}},setup(o){let s=o,c=u(G)??{},l=W(),f=t(()=>s.schema?.[`x-component`]),h=t(()=>s.nodePath?s.fieldName?s.nodePath?`${s.nodePath}.${s.fieldName}`:s.fieldName:s.nodePath:s.fieldName||``),g=t(()=>l.selectedNodeId.value===h.value),v=t(()=>!l.draggable||!s.fieldName?!1:g.value);function y(){return s.schema?.type===`array`?h.value?`${h.value}.items`:``:h.value?`${h.value}.properties`:``}let x=t(()=>{let e=s.schema;if(!e||e[`x-droppable`]===!1)return!1;let t=e.type===`object`||e.type===`void`,n=!e.properties||Object.keys(e.properties).length===0;return t&&n});function w(e){if(!v.value||!e.dataTransfer)return;let t={type:`move-component`,nodePath:h.value,fieldName:s.fieldName,schema:s.schema};e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`application/json`,JSON.stringify(t)),l.startDrag([{nodePath:h.value,fieldName:s.fieldName||``,schema:s.schema}])}function T(){l.cancelDrag()}return(t,o)=>{let l=S(`CanvasField`);return s.schema?(_(),i(`div`,{key:0,"data-node-id":h.value,class:p({"is-draggable":v.value,"is-selected":g.value}),draggable:v.value,onDragstart:w,onDragend:T},[f.value&&E(c)[f.value]?(_(),n(C(E(c)[f.value].component),m(d({key:0},E(Oe)(s.schema,E(c)[f.value].setterSchema))),{default:O(()=>[x.value?(_(),i(`div`,Me,[...o[0]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),E(Ae)(s.schema)?(_(),n(l,{key:1,schema:s.schema.items,"node-path":`${y()}`},null,8,[`schema`,`node-path`])):r(``,!0),E(ke)(s.schema)?(_(!0),i(e,{key:2},b(Object.keys(s.schema?.properties||{}),e=>(_(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":y()},null,8,[`schema`,`field-name`,`node-path`]))),128)):r(``,!0)]),_:1},16)):(_(),i(e,{key:1},[x.value?(_(),i(`div`,Ne,[...o[1]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),(_(!0),i(e,null,b(Object.keys(s.schema?.properties||{}),e=>(_(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":y()},null,8,[`schema`,`field-name`,`node-path`]))),128))],64))],42,je)):r(``,!0)}}}),[[`__scopeId`,`data-v-18008a74`]]);const Fe={class:`canvas djd-design`};var Ie=$(c({__name:`canvas`,props:{components:{}},setup(e){v(G,e.components);let o=W(),c=y(!1),l=t(()=>{let e=o.formSchema.value?.properties;return!e||Object.keys(e).length===0});function u(e){let t=e.target.closest(`[data-node-id]`);if(t){let e=t.getAttribute(`data-node-id`);e&&(console.log(e),o.selectNode(e))}else o.selectNode(null)}function d(e){let t=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`);if(o.setHover(t||null),o.isDragging.value){let n={x:e.clientX,y:e.clientY};o.updateDragPosition(n,t||void 0)}}function f(){o.setHover(null)}function m(e){if(!o.draggable||(e.preventDefault(),e.stopPropagation(),!e.dataTransfer))return;let t=o.dragNodes.value.length>0;e.dataTransfer.dropEffect=t?`move`:`copy`,c.value=!0,o.isDragging.value||o.startDrag([]);let n=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`),r={x:e.clientX,y:e.clientY};o.updateDragPosition(r,n||void 0)}function h(e){e.target.classList.contains(`canvas-content`)&&(c.value=!1)}function g(e){if(o.draggable&&(console.log(`[Canvas] handleDrop`),e.preventDefault(),e.stopPropagation(),c.value=!1,e.dataTransfer))try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);console.log(`dragData`,n),n.type===`new-component`?b(n):n.type===`move-component`&&x()}catch(e){console.error(`解析拖拽数据失败:`,e)}}function b(e){let{componentKey:t,defaultSchema:n}=e;if(!n){console.warn(`组件缺少 defaultSchema:`,t);return}let r=`f_${A()}`,i=o.closestNode.value,a=o.closestPosition.value;i?o.insertField(i,r,n,a):o.addField(r,n),o.selectNode(r),o.cancelDrag()}function x(){o.drop()}return(e,t)=>(_(),i(`div`,Fe,[a(`div`,{class:p([`canvas-content`,{"drag-over":c.value,empty:l.value}]),onClick:u,onMousemove:d,onMouseleave:f,onDragover:m,onDragleave:h,onDrop:g},[E(o).formSchema.value?(_(),n(Pe,{key:0,schema:E(o).formSchema.value},null,8,[`schema`])):r(``,!0),s(De)],34)]))}}),[[`__scopeId`,`data-v-b174a160`]]);function Le(e,t){let n=t.getSelectedField();return B({values:n?xe(n,e):{},effects(){le(n=>{let r=t.getSelectedField(),i=t.selectedFieldName.value;if(!r||!i)return;let a=Se(n.values,e,r);t.updateFieldSchema(i,a)})}})}const Re={class:`reactions-editor`},ze={class:`section`},Be={class:`section-header`},Ve={key:0,class:`empty-tip`},He={key:1,class:`dependency-list`},Ue={class:`dependency-header`},We={class:`dependency-index`},Ge={class:`section`},Ke={class:`section-header`},qe={key:0,class:`empty-tip`},Je={key:1,class:`state-rule-list`},Ye={class:`state-rule-header`},Xe={class:`state-rule-index`};var Ze=$(c({__name:`ReactionsEditor`,props:{modelValue:{type:Boolean},schema:{},currentFieldName:{},initialReactions:{}},emits:[`update:modelValue`,`save`],setup(r,{emit:c}){let l=r,u=c,d=t({get:()=>l.modelValue,set:e=>u(`update:modelValue`,e)}),f=y([]),p=y([]),m=[{label:`显示/隐藏 (visible)`,value:`visible`},{label:`禁用 (disabled)`,value:`disabled`},{label:`只读 (readOnly)`,value:`readOnly`},{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`必填 (required)`,value:`required`},{label:`标题 (title)`,value:`title`},{label:`描述 (description)`,value:`description`}],h=[{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`初始值 (initialValue)`,value:`initialValue`},{label:`错误信息 (errors)`,value:`errors`},{label:`验证状态 (valid)`,value:`valid`}],g=[{label:`任意类型 (any)`,value:`any`},{label:`字符串 (string)`,value:`string`},{label:`数字 (number)`,value:`number`},{label:`布尔值 (boolean)`,value:`boolean`},{label:`数组 (array)`,value:`array`},{label:`对象 (object)`,value:`object`}],v=t(()=>{function e(t,n=``){if(!t)return[];let r=[];return Object.entries(t).forEach(([t,i])=>{let a=n?`${n}.${t}`:t,o=i.title||t;if(a===l.currentFieldName||a.startsWith(`${l.currentFieldName}.`))return;let s={value:a,label:`${o} (${t})`,children:void 0};if(i.properties){let t=e(i.properties,a);t.length>0&&(s.children=t)}r.push(s)}),r}return e(l.schema?.properties)});function x(){let e=l.initialReactions;if(!e){f.value=[],p.value=[];return}e.dependencies&&Array.isArray(e.dependencies)&&(f.value=e.dependencies.map(e=>({source:e.source||``,property:e.property||`value`,name:e.name||``,type:e.type||`any`}))),e.fulfill?.state&&(p.value=Object.entries(e.fulfill.state).map(([e,t])=>({state:e,expression:String(t).replace(/^\{\{|\}\}$/g,``).trim()})))}function C(){x()}function w(){f.value.push({source:``,property:`value`,name:``,type:`any`})}function E(e){f.value.splice(e,1)}function D(e){!e.name&&e.source&&(e.name=`${e.source.split(`.`).pop()||e.source}_${e.property}`)}function k(){p.value.push({state:`visible`,expression:``})}function A(e){p.value.splice(e,1)}function ee(){let e={};f.value.length>0&&(e.dependencies=f.value.filter(e=>e.source).map(e=>({source:e.source,property:e.property,name:e.name,type:e.type}))),p.value.length>0&&(e.fulfill={state:{}},p.value.forEach(t=>{t.state&&t.expression&&(e.fulfill.state[t.state]=`{{${t.expression}}}`)})),u(`save`,e),d.value=!1}function j(){d.value=!1}return(t,r)=>{let c=S(`ElButton`),l=S(`ElTreeSelect`),u=S(`ElFormItem`),y=S(`ElOption`),x=S(`ElSelect`),M=S(`ElInput`),N=S(`ElForm`),P=S(`ElDialog`);return _(),n(P,{modelValue:d.value,"onUpdate:modelValue":r[0]||=e=>d.value=e,title:`条件渲染配置`,width:`800px`,onOpen:C},{footer:O(()=>[s(c,{onClick:j},{default:O(()=>[...r[8]||=[o(` 取消 `,-1)]]),_:1}),s(c,{type:`primary`,onClick:ee},{default:O(()=>[...r[9]||=[o(` 保存 `,-1)]]),_:1})]),default:O(()=>[a(`div`,Re,[a(`div`,ze,[a(`div`,Be,[r[2]||=a(`span`,{class:`section-title`},`依赖字段`,-1),s(c,{size:`small`,type:`primary`,onClick:w},{default:O(()=>[...r[1]||=[o(` 添加依赖 `,-1)]]),_:1})]),f.value.length===0?(_(),i(`div`,Ve,` 暂无依赖字段，点击"添加依赖"按钮添加 `)):(_(),i(`div`,He,[(_(!0),i(e,null,b(f.value,(t,n)=>(_(),i(`div`,{key:n,class:`dependency-item`},[a(`div`,Ue,[a(`span`,We,`依赖 `+T(n+1),1),s(c,{size:`small`,type:`danger`,text:``,onClick:e=>E(n)},{default:O(()=>[...r[3]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(N,{"label-width":`80px`},{default:O(()=>[s(u,{label:`字段`},{default:O(()=>[s(l,{modelValue:t.source,"onUpdate:modelValue":e=>t.source=e,data:v.value,placeholder:`选择依赖的字段`,clearable:``,"check-strictly":``,"render-after-expand":!1,onChange:e=>D(t)},null,8,[`modelValue`,`onUpdate:modelValue`,`data`,`onChange`])]),_:2},1024),s(u,{label:`属性`},{default:O(()=>[s(x,{modelValue:t.property,"onUpdate:modelValue":e=>t.property=e,placeholder:`选择属性`,onChange:e=>D(t)},{default:O(()=>[(_(),i(e,null,b(h,e=>s(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`])),64))]),_:1},8,[`modelValue`,`onUpdate:modelValue`,`onChange`])]),_:2},1024),s(u,{label:`变量名`},{default:O(()=>[s(M,{modelValue:t.name,"onUpdate:modelValue":e=>t.name=e,placeholder:`在表达式中使用的变量名`},null,8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(u,{label:`类型`},{default:O(()=>[s(x,{modelValue:t.type,"onUpdate:modelValue":e=>t.type=e,placeholder:`选择类型`},{default:O(()=>[(_(),i(e,null,b(g,e=>s(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`])),64))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024)]),_:2},1024)]))),128))]))]),a(`div`,Ge,[a(`div`,Ke,[r[5]||=a(`span`,{class:`section-title`},`状态控制`,-1),s(c,{size:`small`,type:`primary`,onClick:k},{default:O(()=>[...r[4]||=[o(` 添加规则 `,-1)]]),_:1})]),p.value.length===0?(_(),i(`div`,qe,` 暂无状态规则，点击"添加规则"按钮添加 `)):(_(),i(`div`,Je,[(_(!0),i(e,null,b(p.value,(t,n)=>(_(),i(`div`,{key:n,class:`state-rule-item`},[a(`div`,Ye,[a(`span`,Xe,`规则 `+T(n+1),1),s(c,{size:`small`,type:`danger`,text:``,onClick:e=>A(n)},{default:O(()=>[...r[6]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(N,{"label-width":`80px`},{default:O(()=>[s(u,{label:`状态属性`},{default:O(()=>[s(x,{modelValue:t.state,"onUpdate:modelValue":e=>t.state=e,placeholder:`选择要控制的状态`},{default:O(()=>[(_(),i(e,null,b(m,e=>s(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`])),64))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(u,{label:`表达式`},{default:O(()=>[s(M,{modelValue:t.expression,"onUpdate:modelValue":e=>t.expression=e,type:`textarea`,rows:2,placeholder:`输入 JS 表达式，如：$deps.username_value === '123'`},null,8,[`modelValue`,`onUpdate:modelValue`]),r[7]||=a(`div`,{class:`expression-tip`},` 使用 $deps.变量名 访问依赖字段的值 `,-1)]),_:2},1024)]),_:2},1024)]))),128))]))])])]),_:1},8,[`modelValue`])}}}),[[`__scopeId`,`data-v-0aa160aa`]]);const Qe={class:`config-panel`},$e={key:0,class:`config-empty`},et={key:1,class:`config-content`},tt={class:`config-title`};var nt=$(c({__name:`index`,props:{components:{}},setup(e){let c=e,l=W(),{SchemaField:u}=R({components:{FormItem:ne,Input:F,InputNumber:re,Checkbox:te,Radio:I,Switch:oe,Select:ie,Space:ae,ArrayItems:P}}),d=w(null),f=t(()=>l.getSelectedField()),p=t(()=>f.value?f.value[`x-component`]:null),m=t(()=>{let e=p.value;return e?c.components[e]?.setterSchema:null}),h=t(()=>{if(!m.value)return null;let e=m.value.basicSetter;return!e||Object.keys(e).length===0?null:{type:`object`,properties:e}}),g=t(()=>{if(!m.value)return null;let e=m.value.componentSetter;return!e||!e.properties||Object.keys(e.properties).length===0?null:e}),v=t(()=>{if(!m.value)return null;let e=m.value.basicSetter||{},t=m.value.componentSetter?.properties||{};return{type:`object`,properties:{...e,...t}}});D(()=>l.selectedFieldName.value,()=>{f.value&&v.value?d.value=Le(v.value,l):d.value=null},{immediate:!0});let b=w([`base`,`operate`,`component`]),x=t(()=>l.selectedFieldName.value||`empty`),C=y(!1);function k(){C.value=!0}function A(e){let t=l.selectedFieldName.value;if(!t)return;let n=l.getSelectedField();if(!n)return;let r={...n,"x-reactions":Object.keys(e).length>0?e:void 0};l.updateFieldSchema(t,r)}return(e,t)=>{let c=S(`ElCollapseItem`),m=S(`ElButton`),v=S(`ElCollapse`);return _(),i(`div`,Qe,[f.value?(_(),i(`div`,et,[a(`h3`,tt,T(p.value)+` 配置 `,1),d.value?(_(),n(E(se),{key:x.value,form:d.value},{default:O(()=>[s(v,{modelValue:b.value,"onUpdate:modelValue":t[0]||=e=>b.value=e,class:`config-section`},{default:O(()=>[h.value?(_(),n(c,{key:0,name:`base`,title:`基本配置`},{default:O(()=>[s(E(u),{schema:h.value},null,8,[`schema`])]),_:1})):r(``,!0),s(c,{name:`operate`,title:`操作配置`},{default:O(()=>[a(`div`,null,[s(m,{type:`primary`,onClick:k},{default:O(()=>[...t[3]||=[o(` 条件渲染 `,-1)]]),_:1})])]),_:1}),g.value?(_(),n(c,{key:1,name:`component`,title:`组件配置`},{default:O(()=>[s(E(u),{schema:g.value},null,8,[`schema`])]),_:1})):r(``,!0)]),_:1},8,[`modelValue`])]),_:1},8,[`form`])):r(``,!0),s(Ze,{modelValue:C.value,"onUpdate:modelValue":t[1]||=e=>C.value=e,schema:E(l).formSchema.value,"current-field-name":E(l).selectedFieldName.value,"initial-reactions":f.value?.[`x-reactions`],onSave:A},null,8,[`modelValue`,`schema`,`current-field-name`,`initial-reactions`])])):(_(),i(`div`,$e,[...t[2]||=[a(`p`,null,`请选择一个字段`,-1)]]))])}}}),[[`__scopeId`,`data-v-3a22b8d5`]]);const rt={class:`material-panel`},it={class:`panel-content`},at={class:`category-title`},ot={class:`component-grid`},st=[`onClick`,`onDragstart`],ct={class:`component-icon`},lt={class:`component-name`},ut={key:0,class:`component-desc`};var dt=$(c({__name:`materialPanel`,props:{components:{}},setup(n){let o=n,s=u(J,null),c=t(()=>{let e={};return Object.entries(o.components).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e});function l(e,t,n){if(!e.dataTransfer)return;let r={type:`new-component`,componentKey:t,componentName:n.config.name,defaultSchema:n.defaultSchema};e.dataTransfer.effectAllowed=`copy`,e.dataTransfer.setData(`application/json`,JSON.stringify(r));let i=e.target;e.dataTransfer.setDragImage(i,10,10),setTimeout(()=>{s?.switchToTreeTab()},100)}function d(e){let t=e.target;t.style.opacity=`1`}function f(e){console.log(`点击组件:`,e)}return(t,n)=>(_(),i(`div`,rt,[n[0]||=a(`div`,{class:`panel-header`},[a(`h3`,null,`组件库`)],-1),a(`div`,it,[(_(!0),i(e,null,b(c.value,(t,n)=>(_(),i(`div`,{key:n,class:`category-group`},[a(`div`,at,T(n),1),a(`div`,ot,[(_(!0),i(e,null,b(t,({key:e,component:t})=>(_(),i(`div`,{key:e,class:`component-item`,draggable:`true`,onClick:t=>f(e),onDragstart:n=>l(n,e,t),onDragend:d},[a(`div`,ct,T(t.config?.icon?.slice(0,3)),1),a(`div`,lt,T(t.config?.name||e),1),t.config?.description?(_(),i(`div`,ut,T(t.config.description),1)):r(``,!0)],40,st))),128))])]))),128))])]))}}),[[`__scopeId`,`data-v-93609a69`]]);const ft={class:`schema-tree`},pt={class:`tree-toolbar`},mt={class:`toolbar-buttons`},ht={class:`node-label`},gt={class:`node-component`},_t={class:`context-menu`},vt={key:0,class:`menu-divider`},yt=[`onClick`],bt={class:`component-picker-content`},xt={class:`picker-category-title`},St={class:`picker-component-grid`},Ct=[`onClick`],wt={class:`picker-component-icon`},Tt={class:`picker-component-name`};var Et=$(c({__name:`SchemaTree`,setup(r){let c=W(),l=u(`designerComponents`,{}),d=y(),m=y(``),h=y(!1),v=y(null),x=y(`node`),w=y(null),D=y(null),j=y(!1),M=y(null);function P(e){return JSON.parse(JSON.stringify(e))}function te(e){return e.split(`.`).filter(e=>e!==`properties`&&e!==`items`)}function ne(e,t,n){let r=te(t),i=[...r.slice(0,-1),n],a=new Map,o=(e,t,n)=>{let r=P(e);if(a.set(t.join(`.`),n.join(`.`)),e.properties&&typeof e.properties==`object`){let i={};Object.entries(e.properties).forEach(([e,r])=>{let a=`f_${A()}`;i[a]=o(r,[...t,e],[...n,a])}),r.properties=i}return e.items&&typeof e.items==`object`&&(r.items=o(e.items,[...t,`items`],[...n,`items`])),r},s=e=>{if(a.has(e))return a.get(e)||null;for(let[t,n]of a.entries())if(e.startsWith(`${t}.`))return`${n}${e.slice(t.length)}`;return null},c=e=>{if(!e||typeof e!=`object`)return;let t=e[`x-reactions`];t&&Array.isArray(t.dependencies)&&(t.dependencies=t.dependencies.map(e=>{if(e&&typeof e.source==`string`){let t=s(e.source);if(t)return{...e,source:t}}return e}),e[`x-reactions`]=t),e.properties&&Object.values(e.properties).forEach(e=>c(e)),e.items&&c(e.items)},l=o(e,r,i);return c(l),l}function F(e,t=``){let n=[];return!e||typeof e!=`object`?n:(e.properties&&typeof e.properties==`object`&&Object.entries(e.properties).forEach(([e,r])=>{let i=t?`${t}.properties.${e}`:e,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:re(r),children:F(r,i)};n.push(s)}),e.items?.properties&&Object.entries(e.items.properties).forEach(([e,r])=>{let i=`${t}.items.properties.${e}`,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:re(r),children:F(r,i)};n.push(s)}),n)}function re(e){return e[`x-droppable`]===!1?!1:!![`object`,`void`,`array`].includes(e.type)}let I=t(()=>F(c.formSchema.value)),ie=t(()=>{let e={};return Object.entries(l).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e}),ae={children:`children`,label:`label`};function oe(e,t){return e?t.label.toLowerCase().includes(e.toLowerCase()):!0}function se(e){d.value?.filter(e)}function L(){z(I.value).forEach(e=>{let t=d.value?.getNode(e);t&&(t.expanded=!0)})}function R(){z(I.value).forEach(e=>{let t=d.value?.getNode(e);t&&(t.expanded=!1)})}function z(e){let t=[];return e.forEach(e=>{t.push(e.path),e.children&&e.children.length>0&&t.push(...z(e.children))}),t}function ce(e){c.selectNode(e.path)}function B(e){return!0}function V(e,t,n){let r=t.data;return n===`inner`?r.isContainer:!0}function le(e,t,n,r){let i=e.data,a=t.data,o;o=n===`inner`?`INNER`:n===`before`?`BEFORE`:`AFTER`,c.moveField(i.path,a.path,o)}let ge=t(()=>{if(x.value===`empty`)return[{type:`insertRoot`,label:`插入组件`,icon:H}];let e=v.value;if(!e)return[];let t=[{type:`copy`,label:`复制`,icon:de},{type:`copyTemplate`,label:`复制模板`,icon:de},{type:`delete`,label:`删除`,icon:fe},`divider`,{type:`moveUp`,label:`上移`,icon:he},{type:`moveDown`,label:`下移`,icon:ue},`divider`,{type:`insertBefore`,label:`上方插入`,icon:H},{type:`insertAfter`,label:`下方插入`,icon:H}];return e.isContainer&&t.push({type:`insertInner`,label:`插入内部`,icon:pe}),t});function U(e){X(e,`empty`,null)}function G(e,t,n,r){X(e,`node`,t)}function K(e){let t=new DOMRect(e.clientX,e.clientY,0,0);w.value={getBoundingClientRect:()=>t,contextElement:document.body}}function q(){D.value&&=(document.removeEventListener(`click`,D.value),null)}function J(){h.value=!1,q()}function Y(){q();let e=()=>{J()};D.value=e,document.addEventListener(`click`,e)}function X(e,t,n){e.preventDefault(),e.stopPropagation(),x.value=t,v.value=n,K(e),h.value=!0,setTimeout(()=>{Y()},0)}function Z(e,t){M.value={targetNode:e,position:t},j.value=!0}function _e(e){switch(e){case`insertRoot`:Z(null,`root`);break;case`insertBefore`:Z(v.value,`before`);break;case`insertAfter`:Z(v.value,`after`);break;case`insertInner`:Z(v.value,`inner`);break;case`copy`:be();return;case`copyTemplate`:xe();return;case`delete`:Se();return;case`moveUp`:$();return;case`moveDown`:Ce();return}J()}function ve(e,t){if(!M.value)return;let{targetNode:n,position:r}=M.value,i={componentKey:e,defaultSchema:JSON.parse(JSON.stringify(t.defaultSchema))};r===`root`?Oe(i):n&&De(i,n,r),j.value=!1,M.value=null}function ye(e){let t=e.split(`.`),n=t[t.length-1],r=t.includes(`items`)&&t.includes(`properties`),i=``;if(r){let e=t.lastIndexOf(`items`);i=t.slice(0,e).join(`.`)}else{let e=t.lastIndexOf(`properties`);e>0&&(i=t.slice(0,e).join(`.`))}let a,o;return i?(a=c.getNodeSchema(i),a&&(o=a.type===`array`?a.items?.properties:a.properties)):(a=c.formSchema.value,o=a.properties),{parentSchema:a,propertiesObj:o,fieldName:n}}function be(){if(!v.value)return;let e=v.value.path,t=c.getNodeSchema(e);if(!t)return;let n=`f_${A()}`,r=ne(t,e,n),i=[...e.split(`.`).slice(0,-1),n].join(`.`);N(c.formSchema.value.properties,i,r),J()}function xe(){if(!v.value)return;let e=v.value.path,t=c.getNodeSchema(e);if(!t)return;let n=JSON.stringify(t);navigator.clipboard.writeText(n),J()}function Se(){if(!v.value)return;let e=v.value.path;ee(c.formSchema.value.properties,e),J()}function $(){if(!v.value)return;let e=v.value.path,{parentSchema:t,propertiesObj:n,fieldName:r}=ye(e);if(!n||!t)return;let i=Object.entries(n),a=i.findIndex(([e])=>e===r);if(a<=0)return;let o=i[a];i[a]=i[a-1],i[a-1]=o;let s={};i.forEach(([e,t])=>{s[e]=t});let l=e.split(`.`);if(l.length===1)c.formSchema.value.properties=s;else{let e=l.includes(`items`),t;if(e){let e=l.lastIndexOf(`items`);t=`${l.slice(0,e).join(`.`)}.items.properties`}else{let e=l.lastIndexOf(`properties`);t=l.slice(0,e+1).join(`.`)}N(c.formSchema.value.properties,t,s)}J()}function Ce(){if(!v.value)return;let e=v.value.path,{parentSchema:t,propertiesObj:n,fieldName:r}=ye(e);if(!n||!t)return;let i=Object.entries(n),a=i.findIndex(([e])=>e===r);if(a===-1||a>=i.length-1)return;let o=i[a];i[a]=i[a+1],i[a+1]=o;let s={};i.forEach(([e,t])=>{s[e]=t});let l=e.split(`.`);if(l.length===1)c.formSchema.value.properties=s;else{let e=l.includes(`items`),t;if(e){let e=l.lastIndexOf(`items`);t=`${l.slice(0,e).join(`.`)}.items.properties`}else{let e=l.lastIndexOf(`properties`);t=l.slice(0,e+1).join(`.`)}N(c.formSchema.value.properties,t,s)}J()}function we(e){if(e.preventDefault(),e.stopPropagation(),e.dataTransfer)try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);if(n.type!==`new-component`)return;let{componentKey:r,defaultSchema:i}=n;if(!i){console.warn(`组件缺少 defaultSchema:`,r);return}let a=Te(e.clientX,e.clientY);if(console.log(`targetNode`,a),a){let t=Ee(e,a.element);De(n,a.data,t)}else Oe(n)}catch(e){console.error(`解析拖拽数据失败:`,e)}}function Te(e,t){let n=document.elementFromPoint(e,t)?.closest(`.el-tree-node`);if(n){let e=n.querySelector(`.el-tree-node__content`);if(e){n.__vnode?.props?.[`node-key`];let t=(e,n)=>{for(let r of e){if(r.path===n)return r;if(r.children){let e=t(r.children,n);if(e)return e}}return null},r=n.getAttribute(`data-path`)||e.getAttribute(`data-path`);if(r){let e=t(I.value,r);if(e)return{element:n,data:e}}let i=document.querySelectorAll(`.el-tree-node`),a=Array.from(i).indexOf(n);if(a>=0&&a<I.value.length)return{element:n,data:I.value[a]}}}return null}function Ee(e,t){let n=t.getBoundingClientRect(),r=e.clientY-n.top,i=n.height*.2;return r<i?`before`:r>n.height-i?`after`:`inner`}function De(e,t,n){let{defaultSchema:r}=e,i=`f_${A()}`,a;a=n===`inner`?Q.Inner:n===`before`?Q.Before:Q.After,c.insertField(t.path,i,r,a),f(()=>{let e;if(n===`inner`)e=c.getNodeSchema(t.path)?.type===`array`?`${t.path}.items.properties.${i}`:`${t.path}.properties.${i}`;else{let n=t.path.split(`.`).slice(0,-1).join(`.`);e=n?`${n}.${i}`:i}c.selectNode(e),L()})}function Oe(e){let{defaultSchema:t}=e,n=`f_${A()}`;c.addField(n,t),c.selectNode(n),f(()=>{L()})}return f(()=>{L()}),g(()=>{q()}),(t,r)=>{let c=S(`ElIcon`),l=S(`ElInput`),u=S(`ElButton`),f=S(`ElEmpty`),g=S(`ElTree`),v=S(`ElPopover`),y=S(`ElDialog`);return _(),i(`div`,ft,[a(`div`,pt,[s(l,{modelValue:m.value,"onUpdate:modelValue":r[0]||=e=>m.value=e,placeholder:`搜索组件`,clearable:``,size:`small`,onInput:se},{prefix:O(()=>[s(c,null,{default:O(()=>[s(E(me))]),_:1})]),_:1},8,[`modelValue`]),a(`div`,mt,[s(u,{size:`small`,text:``,onClick:L},{default:O(()=>[...r[4]||=[o(` 全部展开 `,-1)]]),_:1}),s(u,{size:`small`,text:``,onClick:R},{default:O(()=>[...r[5]||=[o(` 全部折叠 `,-1)]]),_:1})])]),a(`div`,{class:`tree-content`,onDrop:we,onDragover:r[1]||=k(()=>{},[`prevent`]),onContextmenu:U},[s(g,{ref_key:`treeRef`,ref:d,style:{height:`100%`},data:I.value,props:ae,"node-key":`path`,draggable:``,"allow-drop":V,"allow-drag":B,"filter-node-method":oe,"default-expand-all":``,"highlight-current":``,onNodeClick:ce,onNodeDrop:le,onNodeContextmenu:G},{default:O(({data:e})=>[a(`div`,{class:p([`tree-node`,{"is-container":e.isContainer}])},[a(`span`,ht,T(e.label),1),a(`span`,gt,`(`+T(e.component)+`)`,1)],2)]),empty:O(()=>[s(f,{description:`暂无组件，请点击右键插入`})]),_:1},8,[`data`])],32),s(v,{visible:h.value,"onUpdate:visible":r[2]||=e=>h.value=e,"virtual-ref":w.value,"virtual-triggering":``,"show-arrow":!1,"popper-class":`schema-tree-context-menu`,placement:`bottom-start`,offset:6},{default:O(()=>[a(`div`,_t,[(_(!0),i(e,null,b(ge.value,(t,r)=>(_(),i(e,{key:r},[t===`divider`?(_(),i(`div`,vt)):(_(),i(`div`,{key:1,class:`menu-item`,onClick:e=>_e(t.type)},[s(c,null,{default:O(()=>[(_(),n(C(t.icon)))]),_:2},1024),a(`span`,null,T(t.label),1)],8,yt))],64))),128))])]),_:1},8,[`visible`,`virtual-ref`]),s(y,{modelValue:j.value,"onUpdate:modelValue":r[3]||=e=>j.value=e,title:`选择组件`,width:`600px`,"close-on-click-modal":!1},{default:O(()=>[a(`div`,bt,[(_(!0),i(e,null,b(ie.value,(t,n)=>(_(),i(`div`,{key:n,class:`picker-category-group`},[a(`div`,xt,T(n),1),a(`div`,St,[(_(!0),i(e,null,b(t,({key:e,component:t})=>(_(),i(`div`,{key:e,class:`picker-component-item`,onClick:n=>ve(e,t)},[a(`div`,wt,T(t.config?.icon?.slice(0,3)),1),a(`div`,Tt,T(t.config?.name||e),1)],8,Ct))),128))])]))),128))])]),_:1},8,[`modelValue`])])}}}),[[`__scopeId`,`data-v-613d7f39`]]);const Dt={class:`left-panel`};var Ot=$(c({__name:`index`,props:{components:{},draggable:{type:Boolean,default:!1}},setup(e){let t=e,r=y(`materials`);function a(){r.value!==`tree`&&(r.value=`tree`)}return v(J,{switchToTreeTab:a}),(a,o)=>{let c=S(`ElTabPane`),l=S(`ElTabs`);return _(),i(`div`,Dt,[t.draggable?(_(),n(l,{key:0,modelValue:r.value,"onUpdate:modelValue":o[0]||=e=>r.value=e,class:`panel-tabs`},{default:O(()=>[s(c,{label:`组件库`,name:`materials`},{default:O(()=>[s(dt,{components:e.components},null,8,[`components`])]),_:1}),s(c,{label:`组件树`,name:`tree`},{default:O(()=>[s(Et)]),_:1})]),_:1},8,[`modelValue`])):(_(),n(Et,{key:1}))])}}}),[[`__scopeId`,`data-v-e47d1682`]]),kt=c({name:`ArrayInner`,inheritAttrs:!1,__name:`arrayInner`,setup(e){return v(K,z()),(e,t)=>x(e.$slots,`default`)}}),At=c({inheritAttrs:!1,__name:`arrayItemInner`,props:{index:{}},setup(e){return v(q,e),(e,t)=>x(e.$slots,`default`)}});function jt(e){return Array.isArray(e?.items)?jt(e.items[0]):e?.items?.type===`array`||e?.items?.type===`object`}function Mt(e){let t=jt(e),n=null;return n=t?new WeakMap:[],g(()=>{n=null}),{getKey:(e,t)=>n instanceof WeakMap?(n.has(e)||n.set(e,A()),`${n.get(e)}-${t}`):(n&&!n[t]&&(n[t]=A()),n?`${n[t]}-${t}`:void 0)}}function Nt(e){return ge(c({name:`SchemaWrapper`,props:{value:{type:[String,Number,Boolean,Array,Object],default:void 0},onChange:{type:Function,default:void 0}},setup(n,r){let{setterSchema:i}=e,a=z(),o=ce(),s=u(K,void 0),c=u(q,void 0),{getKey:d}=Mt(o.value),f=t(()=>{let e=a.value,t={...o.value?.[`x-component-props`]||{},value:n.value,onChange:n.onChange};if(e&&!V(e)&&(t.pattern=e.pattern),i.basicSetter)for(let[e,n]of Object.entries(i.basicSetter)){let r=n[`x-path`];if(r){let n=j(o.value,r);n!==void 0&&(t[e]=n)}}if(i.componentSetter?.properties)for(let[e,n]of Object.entries(i.componentSetter.properties)){let r=n[`x-path`];if(r){let n=j(o.value,r);n!==void 0&&(t[e]=n)}}e&&!V(e)&&(t.pattern=e.pattern);let r=o.value?.type===`array`?a.value:s?.value;return r&&(t.onAdd=()=>r.push({}),t.onPush=()=>r.push({}),t.onUnshift=()=>r.unshift({}),t.onRemove=e=>r.remove(e),t.onMove=(e,t)=>r.move(e,t),t.onMoveUp=e=>{e>0&&r.move(e,e-1)},t.onMoveDown=e=>{e<r.value.length-1&&r.move(e,e+1)},c?.index!==void 0&&(t.pattern=r.pattern)),c?.index!==void 0&&(t.arrayIndex=c.index),t});return()=>{let t=a.value;if(!t||t.display!==`visible`)return l(`template`,{},{});let n=()=>{if(!t||V(t))return null;let e=t.errors||[];return e.length===0?null:l(`div`,{class:`formily-validation-errors`,style:{color:`#f56c6c`,fontSize:`12px`,marginTop:`4px`,lineHeight:`1.5`}},l(`div`,{class:`formily-validation-error-item`},e[0].messages))};if(o.value?.type===`array`){let r=t?.value||[],i=r.length>0?r.map((e,t)=>l(At,{index:t},{default:()=>l(L,{key:d(e,t),schema:o.value.items,name:t})})):null;return l(`div`,{},[l(kt,{},{default:()=>l(e.component,f.value,{default:()=>i})}),n()])}return l(`div`,{},[l(e.component,f.value,r.slots),n()])}}}))}var Pt=c({__name:`index`,props:{schema:{},components:{}},setup(e,{expose:t}){let r=e,i=B(),{SchemaField:a}=R({components:Object.keys(r.components).reduce((e,t)=>(e[t]=Nt(r.components[t]),e),{})});return t({form:i}),(t,r)=>(_(),n(E(se),{form:E(i)},{default:O(()=>[s(E(a),{schema:e.schema},null,8,[`schema`])]),_:1},8,[`form`]))}});const Ft={key:0,class:`designer-layout`},It={class:`designer-material`},Lt={class:`designer-canvas`},Rt={class:`designer-config`},zt={key:1,class:`designer-preview`};var Bt=$(c({__name:`designer`,props:{components:{},mode:{default:`edit`},modelValue:{},draggable:{type:Boolean,default:!1},height:{default:`100vh`}},emits:[`update:modelValue`],setup(e,{expose:n,emit:r}){let o=e,c=r,l=be(o.draggable);v(`designerComponents`,o.components);let u=y(null);D(()=>o.modelValue,e=>{e&&JSON.stringify(e)!==JSON.stringify(l.formSchema.value)&&(l.formSchema.value=e)},{immediate:!0,deep:!0}),D(()=>l.formSchema.value,e=>{c(`update:modelValue`,e)},{deep:!0});function d(){return u.value?.form?.values||{}}return n({getFormValues:d,schema:t(()=>l.formSchema.value),store:l}),(t,n)=>(_(),i(`div`,{class:`designer`,style:h({height:o.height})},[o.mode===`edit`?(_(),i(`div`,Ft,[a(`div`,It,[s(Ot,{components:e.components,draggable:e.draggable},null,8,[`components`,`draggable`])]),a(`div`,Lt,[s(Ie,{components:e.components},null,8,[`components`])]),a(`div`,Rt,[s(nt,{components:e.components},null,8,[`components`])])])):(_(),i(`div`,zt,[s(Pt,{ref_key:`renderRef`,ref:u,schema:E(l).formSchema.value,components:e.components},null,8,[`schema`,`components`])]))],4))}}),[[`__scopeId`,`data-v-aaa05eea`]]);const Vt=Ie,Ht=nt,Ut=dt,Wt=Bt;export{Vt as Canvas,Ht as ConfigPanel,U as DesignStoreKey,Wt as Designer,Ut as MaterialPanel,xe as schemaToSetterValues,Se as setterValuesToSchema,be as useCreateDesignStore,W as useDesignStore};
+import{Fragment as e,computed as t,createBlock as n,createCommentVNode as r,createElementBlock as i,createElementVNode as a,createTextVNode as o,createVNode as s,defineComponent as c,h as l,inject as u,isRef as d,mergeProps as f,nextTick as p,normalizeClass as m,normalizeProps as h,normalizeStyle as g,onBeforeUnmount as _,openBlock as v,provide as y,ref as b,renderList as x,renderSlot as S,resolveComponent as C,resolveDynamicComponent as w,shallowRef as T,toDisplayString as E,unref as D,watch as O,withCtx as k,withModifiers as A}from"vue";import{uid as j}from"@formily/shared";import{deleteByPath as M,getByPath as N,getFieldNameFromPath as P,setByPath as F}from"@formily-djd/utils";import{ArrayItems as I,Checkbox as L,FormItem as ee,Input as te,InputNumber as R,Radio as ne,Select as re,Space as ie,Switch as ae}from"@formily/element-plus";import{FormProvider as z,RecursionField as oe,createSchemaField as B,useField as V,useFieldSchema as se}from"@formily/vue";import{createForm as H,isVoidField as U,onFormValuesChange as ce}from"@formily/core";import{Bottom as le,CirclePlus as W,CopyDocument as G,Delete as ue,FolderAdd as de,Search as fe,Top as pe}from"@element-plus/icons-vue";import{observer as me}from"@formily/reactive-vue";const K=Symbol(`DesignStore`);function q(){let e=u(K);if(!e)throw Error(`[useDesignStore] 必须在 Designer 组件内使用`);return e}const J=Symbol(`ComponentSettings`),he=Symbol(`ArrayField`),ge=Symbol(`ArrayItemKey`),_e=Symbol(`LeftPanel`);function ve(e,n=`.canvas-content`){return t(()=>{if(!e.value)return null;let t=document.querySelector(`[data-node-id="${e.value}"]`);if(!t)return null;let r=document.querySelector(n);if(!r)return null;let i=t.getBoundingClientRect(),a=r.getBoundingClientRect();return{x:i.x-a.x+r.scrollLeft,y:i.y-a.y+r.scrollTop,width:i.width,height:i.height}})}function Y(e,t,n=!0){let r=e=>{if(!n)return 0;let t=e*.1;return t>20?20:t<10?10:t},i=r(t.width),a=r(t.height);return e.x>=t.x+i&&e.x<=t.x+t.width-i&&e.y>=t.y+a&&e.y<=t.y+t.height-a}function ye(e,t){let n=Math.min(Math.abs(e.x-t.x),Math.abs(e.x-(t.x+t.width))),r=Math.min(Math.abs(e.y-t.y),Math.abs(e.y-(t.y+t.height)));return e.x>=t.x&&e.x<=t.x+t.width&&(n=0),e.y>=t.y&&e.y<=t.y+t.height&&(r=0),Math.sqrt(n**2+r**2)}function be(e,t,n){return n?e.x>=t.x+t.width/2:e.y>=t.y+t.height/2}function xe(e){return e.width>e.height}let X=function(e){return e.Before=`BEFORE`,e.After=`AFTER`,e.Upper=`UPPER`,e.Under=`UNDER`,e.Inner=`INNER`,e.InnerBefore=`INNER_BEFORE`,e.InnerAfter=`INNER_AFTER`,e.ForbidBefore=`FORBID_BEFORE`,e.ForbidAfter=`FORBID_AFTER`,e.ForbidUpper=`FORBID_UPPER`,e.ForbidUnder=`FORBID_UNDER`,e.ForbidInner=`FORBID_INNER`,e.ForbidInnerBefore=`FORBID_INNER_BEFORE`,e.ForbidInnerAfter=`FORBID_INNER_AFTER`,e.Forbid=`FORBID`,e}({});var Se=class{sensitive;forceBlock;dragNodes=b([]);touchNode=b(null);closestNode=b(null);closestPosition=b(X.Before);closestRect=b(null);getNodeRect;getNodeSchema;getCanvasRect;findChildNodes;constructor(e,t){this.sensitive=t?.sensitive??!0,this.forceBlock=t?.forceBlock??!1,this.getNodeRect=e.getNodeRect,this.getNodeSchema=e.getNodeSchema,this.getCanvasRect=e.getCanvasRect,this.findChildNodes=e.findChildNodes}setDragNodes(e){this.dragNodes.value=e}calculate(e){let{point:t,touchNode:n,closestNode:r,closestPosition:i}=e;if(r!==void 0&&i!==void 0){this.closestNode.value=r,this.closestPosition.value=i,r&&(this.closestRect.value=this.getNodeRect(r));return}if(!t)return;n!==void 0&&(this.touchNode.value=n);let a=this.getClosestNode(t);if(this.closestNode.value=a,!a){this.closestPosition.value=X.Before,this.closestRect.value=null;return}this.closestPosition.value=this.getClosestPosition(t,a),this.closestRect.value=this.getNodeRect(a)}getClosestNode(e){let t=this.touchNode.value;if(!t)return null;let n=this.getNodeRect(t);if(!n)return null;let r=this.findChildNodes(t);if(r.length===0)return t;let i=Y(e,n,this.sensitive)?0:ye(e,n),a=t;for(let t of r){let n=this.getNodeRect(t);if(!n)continue;let r=Y(e,n,this.sensitive)?0:ye(e,n);r<=i&&(i=r,a=t)}return a}getClosestPosition(e,t){console.log(`[Dragon] getClosestPosition`,t);let n=this.getNodeRect(t),r=this.getNodeSchema(t);if(!n||!r)return X.Forbid;let i=this.getLayout(n)===`horizontal`,a=Y(e,n,this.sensitive),o=this.isContainer(r),s=this.canInsertSibling(t),c=be(e,n,i);return a?o&&this.canDropInside(t)?this.findChildNodes(t).length===0?X.Inner:c?X.InnerAfter:X.InnerBefore:s?i?c?X.After:X.Before:c?X.Under:X.Upper:X.Forbid:s?i?c?X.ForbidAfter:X.ForbidBefore:c?X.ForbidUnder:X.ForbidUpper:X.Forbid}getLayout(e){return this.forceBlock?`vertical`:xe(e)?`horizontal`:`vertical`}isContainer(e){return!e||e[`x-droppable`]===!1?!1:e.type===`object`||e.type===`void`||e.type===`array`}canInsertSibling(e){return!(e===``||e==null)}canDropInside(e){if(this.getNodeSchema(e)?.[`x-droppable`]===!1)return!1;let t=this.dragNodes.value;if(t.length===0)return!0;for(let n of t)if(n.nodePath===e||e.startsWith(`${n.nodePath}.`))return!1;return!0}clear(){this.dragNodes.value=[],this.touchNode.value=null,this.closestNode.value=null,this.closestPosition.value=X.Before,this.closestRect.value=null}};function Ce(e=!1){let t=b({type:`object`,properties:{}}),n=b(null),r=b(null),i=b(null),a=b(!1),o=b([]),s=b(null),c=b(null),l=b(X.Before);function u(e){let t=document.querySelector(`[data-node-id="${e}"]`);if(!t)return null;let n=document.querySelector(`.canvas-content`);if(!n)return null;let r=t.getBoundingClientRect(),i=n.getBoundingClientRect();return{x:r.x-i.x,y:r.y-i.y,width:r.width,height:r.height}}function d(){let e=document.querySelector(`.canvas-content`);if(!e)return{x:0,y:0,width:0,height:0};let t=e.getBoundingClientRect();return{x:t.x,y:t.y,width:t.width,height:t.height}}let f=new Se({getNodeRect:u,getNodeSchema:e=>N(t.value.properties,e),getCanvasRect:d,findChildNodes:e=>{let n=N(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{r.push(`${e}.properties.${t}`)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{r.push(`${e}.items.properties.${t}`)}),r}},{sensitive:!0,forceBlock:!1});function p(e,n){t.value.properties||(t.value.properties={}),t.value.properties[e]=n}function m(e,n){F(t.value.properties,e,n)}function h(e){n.value=e}function g(){return n.value&&N(t.value.properties,n.value)||null}function _(e){r.value=e,n.value=e}function v(e){i.value=e}function x(e){a.value=!0,o.value=e,f.setDragNodes(e)}function S(e,t){if(!a.value)return;t!==void 0&&(s.value=t);let n=d(),r={x:e.x-n.x,y:e.y-n.y};f.calculate({point:r,touchNode:s.value||void 0}),c.value=f.closestNode.value,l.value=f.closestPosition.value}function C(){if(console.log(`[DesignStore] drop`),!a.value)return;let e=c.value,t=l.value;if(!e){w();return}if(t.includes(`FORBID`)){w();return}let n=o.value;if(n.length===0){w();return}n.length===1&&T(n[0].nodePath,e,t),w()}function w(){a.value=!1,o.value=[],s.value=null,c.value=null,l.value=X.Before,f.clear()}function T(e,n,r){let i=M(t.value.properties,e);if(!i)return;let a=P(e);if(r===X.Inner||r===X.InnerAfter||r===X.InnerBefore){let e=N(t.value.properties,n);if(!e)return;let o,s;if(e.type===`array`?(e.items||={type:`object`,properties:{}},e.items.properties||(e.items.properties={}),o=e.items.properties,s=`${n}.items.properties`):(e.properties||={},o=e.properties,s=`${n}.properties`),r===X.InnerBefore){let e={[a]:i,...o};F(t.value.properties,s,e)}else F(t.value.properties,`${s}.${a}`,i)}else{let e=r===X.Before||r===X.Upper?`before`:`after`,o=n.split(`.`),s=o[o.length-1],c,l=o.includes(`items`);if(o.length===1)c=``;else if(l){let e=o.lastIndexOf(`items`);c=`${o.slice(0,e).join(`.`)}.items.properties`}else{let e=o.lastIndexOf(`properties`);c=o.slice(0,e+1).join(`.`)}let u=c?N(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=e===`after`?f+1:f,m=[...d.slice(0,p),[a,i],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?F(t.value.properties,c,h):t.value.properties=h}}function E(e,n,r,i){if(!e){t.value.properties||(t.value.properties={}),t.value.properties[n]=r;return}if(i===X.Inner||i===X.InnerAfter||i===X.InnerBefore){let a=N(t.value.properties,e);if(!a)return;let o,s;if(a.type===`array`?(a.items||={type:`object`,properties:{}},a.items.properties||(a.items.properties={}),o=a.items.properties,s=`${e}.items.properties`):(a.properties||={},o=a.properties,s=`${e}.properties`),i===X.InnerBefore){let e={[n]:r,...o};F(t.value.properties,s,e)}else F(t.value.properties,`${s}.${n}`,r)}else{let a=i===X.Before||i===X.Upper?`before`:`after`,o=e.split(`.`),s=o[o.length-1],c,l=o.includes(`items`);if(o.length===1)c=``;else if(l){let e=o.lastIndexOf(`items`);c=`${o.slice(0,e).join(`.`)}.items.properties`}else{let e=o.lastIndexOf(`properties`);c=o.slice(0,e+1).join(`.`)}let u=c?N(t.value.properties,c):t.value.properties;if(!u){console.warn(`父节点的 properties 不存在:`,c);return}let d=Object.entries(u),f=d.findIndex(([e])=>e===s);if(f===-1){console.warn(`目标字段不存在:`,s);return}let p=a===`after`?f+1:f,m=[...d.slice(0,p),[n,r],...d.slice(p)],h={};m.forEach(([e,t])=>{h[e]=t}),c?F(t.value.properties,c,h):t.value.properties=h}}function D(e){return N(t.value.properties,e)}function O(e){let n=N(t.value.properties,e);if(!n)return[];let r=[];return n.properties&&Object.keys(n.properties).forEach(t=>{let n=e?`${e}.properties.${t}`:t;r.push(n)}),n.items?.properties&&Object.keys(n.items.properties).forEach(t=>{let n=`${e}.items.properties.${t}`;r.push(n)}),r}let k={formSchema:t,selectedFieldName:n,selectedNodeId:r,hoveredNodeId:i,draggable:e,dragon:f,isDragging:a,dragNodes:o,touchNode:s,closestNode:c,closestPosition:l,addField:p,updateFieldSchema:m,selectField:h,selectNode:_,getSelectedField:g,setHover:v,startDrag:x,updateDragPosition:S,drop:C,cancelDrag:w,moveField:T,insertField:E,getNodeSchema:D,findChildNodes:O};return y(K,k),k}function we(e,t){let n={};return Object.entries(t.properties||{}).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=N(e,i);r!==void 0&&(n[t]=r)}}),n}function Te(e,t,n){let r=JSON.parse(JSON.stringify(n));return Object.entries(t.properties||{}).forEach(([t,n])=>{let i=n[`x-path`];i&&e[t]!==void 0&&F(r,i,e[t])}),r}var Z=(e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n},Ee=Z(c({__name:`HoverBox`,setup(e){let n=q(),a=ve(n.hoveredNodeId),o=t(()=>!n.hoveredNodeId.value||!n.selectedNodeId.value?!1:n.hoveredNodeId.value===n.selectedNodeId.value),s=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:2,visibility:`hidden`};return a.value&&!o.value&&(e.transform=`perspective(1px) translate3d(${a.value.x}px, ${a.value.y}px, 0)`,e.width=`${a.value.width}px`,e.height=`${a.value.height}px`,e.visibility=`visible`),e}),c=t(()=>a.value&&!o.value);return(e,t)=>c.value?(v(),i(`div`,{key:0,class:`hover-box`,style:g(s.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-2759debe`]]),De=Z(c({__name:`Insertion`,setup(e){let n=q(),a=t(()=>{if(!n.isDragging.value||!n.closestNode.value)return{display:`none`};let e=n.closestPosition.value,t=n.dragon.closestRect.value;if(!t)return{display:`none`};let r=e.toString().includes(`FORBID`),i={position:`absolute`,backgroundColor:r?`#ef4444`:`#3b82f6`,pointerEvents:`none`,zIndex:10,transition:`all 0.15s cubic-bezier(0.4, 0, 0.2, 1)`,boxShadow:r?`0 0 8px rgba(239, 68, 68, 0.5)`:`0 0 8px rgba(59, 130, 246, 0.5)`};switch(e){case X.Before:case X.ForbidBefore:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case X.After:case X.ForbidAfter:Object.assign(i,{width:`2px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x+t.width-2}px, ${t.y}px, 0)`});break;case X.Upper:case X.ForbidUpper:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`});break;case X.Under:case X.ForbidUnder:Object.assign(i,{width:`${t.width}px`,height:`2px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y+t.height-2}px, 0)`});break;case X.Inner:case X.InnerBefore:case X.InnerAfter:case X.ForbidInner:case X.ForbidInnerBefore:case X.ForbidInnerAfter:Object.assign(i,{width:`${t.width}px`,height:`${t.height}px`,transform:`perspective(1px) translate3d(${t.x}px, ${t.y}px, 0)`,backgroundColor:`transparent`,border:r?`2px dashed #ef4444`:`2px dashed #3b82f6`});break;case X.Forbid:return{display:`none`};default:return{display:`none`}}return i});return(e,t)=>D(n).draggable?(v(),i(`div`,{key:0,class:`insertion-indicator`,style:g(a.value)},null,4)):r(``,!0)}}),[[`__scopeId`,`data-v-9dbef644`]]),Oe=Z(c({__name:`SelectionBox`,setup(e){let n=ve(q().selectedNodeId),o=t(()=>{let e={position:`absolute`,top:0,left:0,boxSizing:`border-box`,pointerEvents:`none`,zIndex:4,visibility:`hidden`};return n.value&&(e.transform=`perspective(1px) translate3d(${n.value.x-2}px, ${n.value.y-2}px, 0)`,e.width=`${n.value.width+4}px`,e.height=`${n.value.height+4}px`,e.visibility=`visible`),e}),s=t(()=>n.value!==null);return(e,t)=>s.value?(v(),i(`div`,{key:0,class:`selection-box`,style:g(o.value)},[...t[0]||=[a(`div`,{class:`selection-box-inner`},null,-1)]],4)):r(``,!0)}}),[[`__scopeId`,`data-v-c58abee5`]]);const ke={class:`aux-tool-widget`};var Ae=Z(c({__name:`AuxToolWidget`,setup(e){return(e,t)=>(v(),i(`div`,ke,[s(Ee),s(Oe),s(De)]))}}),[[`__scopeId`,`data-v-2d0e316d`]]);function je(e,t){let n={...e?.[`x-component-props`]||{}};return t.basicSetter&&Object.entries(t.basicSetter).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=N(e,i);r!==void 0&&(n[t]=r)}}),t.componentSetter?.properties&&Object.entries(t.componentSetter.properties).forEach(([t,r])=>{let i=r[`x-path`];if(i){let r=N(e,i);r!==void 0&&(n[t]=r)}}),n}function Me(e){if(e?.[`x-droppable`]===!1)return!1;let t=e.type;return(t===`object`||t===`void`||t===`array`)&&!!e.properties}function Ne(e){return e.type===`array`&&!!e.items}const Pe=[`data-node-id`,`draggable`],Fe={key:0,class:`empty-container-placeholder`},Ie={key:0,class:`empty-container-placeholder`};var Le=Z(c({name:`CanvasField`,__name:`index`,props:{schema:{},fieldName:{},nodePath:{}},setup(o){let s=o,c=u(J)??{},l=q(),d=t(()=>s.schema?.[`x-component`]),p=t(()=>s.nodePath?s.fieldName?s.nodePath?`${s.nodePath}.${s.fieldName}`:s.fieldName:s.nodePath:s.fieldName||``),g=t(()=>l.selectedNodeId.value===p.value),_=t(()=>!l.draggable||!s.fieldName?!1:g.value);function y(){return s.schema?.type===`array`?p.value?`${p.value}.items`:``:p.value?`${p.value}.properties`:``}let b=t(()=>{let e=s.schema;if(!e||e[`x-droppable`]===!1)return!1;let t=e.type===`object`||e.type===`void`,n=!e.properties||Object.keys(e.properties).length===0;return t&&n});function S(e){if(!_.value||!e.dataTransfer)return;let t={type:`move-component`,nodePath:p.value,fieldName:s.fieldName,schema:s.schema};e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`application/json`,JSON.stringify(t)),l.startDrag([{nodePath:p.value,fieldName:s.fieldName||``,schema:s.schema}])}function T(){l.cancelDrag()}return(t,o)=>{let l=C(`CanvasField`);return s.schema?(v(),i(`div`,{key:0,"data-node-id":p.value,class:m({"is-draggable":_.value,"is-selected":g.value}),draggable:_.value,onDragstart:S,onDragend:T},[d.value&&D(c)[d.value]?(v(),n(w(D(c)[d.value].component),h(f({key:0},D(je)(s.schema,D(c)[d.value].setterSchema))),{default:k(()=>[b.value?(v(),i(`div`,Fe,[...o[0]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),D(Ne)(s.schema)?(v(),n(l,{key:1,schema:s.schema.items,"node-path":`${y()}`},null,8,[`schema`,`node-path`])):r(``,!0),D(Me)(s.schema)?(v(!0),i(e,{key:2},x(Object.keys(s.schema?.properties||{}),e=>(v(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":y()},null,8,[`schema`,`field-name`,`node-path`]))),128)):r(``,!0)]),_:1},16)):(v(),i(e,{key:1},[b.value?(v(),i(`div`,Ie,[...o[1]||=[a(`svg`,{class:`placeholder-icon`,width:`24`,height:`24`,viewBox:`0 0 24 24`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`},[a(`rect`,{x:`3`,y:`3`,width:`18`,height:`18`,rx:`2`,stroke:`currentColor`,"stroke-width":`2`}),a(`path`,{d:`M12 8v8M8 12h8`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`})],-1),a(`span`,{class:`placeholder-text`},`添加组件到这里`,-1)]])):r(``,!0),(v(!0),i(e,null,x(Object.keys(s.schema?.properties||{}),e=>(v(),n(l,{key:e,schema:s.schema?.properties?.[e],"field-name":e,"node-path":y()},null,8,[`schema`,`field-name`,`node-path`]))),128))],64))],42,Pe)):r(``,!0)}}}),[[`__scopeId`,`data-v-18008a74`]]);const Re={class:`canvas djd-design`};var ze=Z(c({__name:`canvas`,props:{components:{}},setup(e){y(J,e.components);let o=q(),c=b(!1),l=t(()=>{let e=o.formSchema.value?.properties;return!e||Object.keys(e).length===0});function u(e){let t=e.target.closest(`[data-node-id]`);if(t){let e=t.getAttribute(`data-node-id`);e&&(console.log(e),o.selectNode(e))}else o.selectNode(null)}function d(e){let t=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`);if(o.setHover(t||null),o.isDragging.value){let n={x:e.clientX,y:e.clientY};o.updateDragPosition(n,t||void 0)}}function f(){o.setHover(null)}function p(e){if(!o.draggable||(e.preventDefault(),e.stopPropagation(),!e.dataTransfer))return;let t=o.dragNodes.value.length>0;e.dataTransfer.dropEffect=t?`move`:`copy`,c.value=!0,o.isDragging.value||o.startDrag([]);let n=e.target.closest(`[data-node-id]`)?.getAttribute(`data-node-id`),r={x:e.clientX,y:e.clientY};o.updateDragPosition(r,n||void 0)}function h(e){e.target.classList.contains(`canvas-content`)&&(c.value=!1)}function g(e){if(o.draggable&&(console.log(`[Canvas] handleDrop`),e.preventDefault(),e.stopPropagation(),c.value=!1,e.dataTransfer))try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);console.log(`dragData`,n),n.type===`new-component`?_(n):n.type===`move-component`&&x()}catch(e){console.error(`解析拖拽数据失败:`,e)}}function _(e){let{componentKey:t,defaultSchema:n}=e;if(!n){console.warn(`组件缺少 defaultSchema:`,t);return}let r=`f_${j()}`,i=o.closestNode.value,a=o.closestPosition.value;i?o.insertField(i,r,n,a):o.addField(r,n),o.selectNode(r),o.cancelDrag()}function x(){o.drop()}return(e,t)=>(v(),i(`div`,Re,[a(`div`,{class:m([`canvas-content`,{"drag-over":c.value,empty:l.value}]),onClick:u,onMousemove:d,onMouseleave:f,onDragover:p,onDragleave:h,onDrop:g},[D(o).formSchema.value?(v(),n(Le,{key:0,schema:D(o).formSchema.value},null,8,[`schema`])):r(``,!0),s(Ae)],34)]))}}),[[`__scopeId`,`data-v-b174a160`]]);function Be(e,t){let n=t.getSelectedField();return H({values:n?we(n,e):{},effects(){ce(n=>{let r=t.getSelectedField(),i=t.selectedFieldName.value;if(!r||!i)return;let a=Te(n.values,e,r);t.updateFieldSchema(i,a)})}})}const Ve={class:`reactions-editor`},He={class:`section`},Ue={class:`section-header`},We={key:0,class:`empty-tip`},Ge={key:1,class:`dependency-list`},Ke={class:`dependency-header`},qe={class:`dependency-index`},Je={class:`section`},Ye={class:`section-header`},Xe={key:0,class:`empty-tip`},Ze={key:1,class:`state-rule-list`},Qe={class:`state-rule-header`},$e={class:`state-rule-index`};var et=Z(c({__name:`ReactionsEditor`,props:{modelValue:{type:Boolean},schema:{},currentFieldName:{},initialReactions:{}},emits:[`update:modelValue`,`save`],setup(r,{emit:c}){let l=r,u=c,d=t({get:()=>l.modelValue,set:e=>u(`update:modelValue`,e)}),f=b([]),p=b([]),m=[{label:`显示/隐藏 (visible)`,value:`visible`},{label:`禁用 (disabled)`,value:`disabled`},{label:`只读 (readOnly)`,value:`readOnly`},{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`必填 (required)`,value:`required`},{label:`标题 (title)`,value:`title`},{label:`描述 (description)`,value:`description`}],h=[{label:`值 (value)`,value:`value`},{label:`显示模式 (display)`,value:`display`},{label:`模式 (pattern)`,value:`pattern`},{label:`初始值 (initialValue)`,value:`initialValue`},{label:`错误信息 (errors)`,value:`errors`},{label:`验证状态 (valid)`,value:`valid`}],g=[{label:`任意类型 (any)`,value:`any`},{label:`字符串 (string)`,value:`string`},{label:`数字 (number)`,value:`number`},{label:`布尔值 (boolean)`,value:`boolean`},{label:`数组 (array)`,value:`array`},{label:`对象 (object)`,value:`object`}],_=t(()=>{function e(t,n=``){if(!t)return[];let r=[];return Object.entries(t).forEach(([t,i])=>{let a=n?`${n}.${t}`:t,o=i.title||t;if(a===l.currentFieldName||a.startsWith(`${l.currentFieldName}.`))return;let s={value:a,label:`${o} (${t})`,children:void 0};if(i.properties){let t=e(i.properties,a);t.length>0&&(s.children=t)}r.push(s)}),r}return e(l.schema?.properties)});function y(){let e=l.initialReactions;if(!e){f.value=[],p.value=[];return}e.dependencies&&Array.isArray(e.dependencies)&&(f.value=e.dependencies.map(e=>({source:e.source||``,property:e.property||`value`,name:e.name||``,type:e.type||`any`}))),e.fulfill?.state&&(p.value=Object.entries(e.fulfill.state).map(([e,t])=>({state:e,expression:String(t).replace(/^\{\{|\}\}$/g,``).trim()})))}function S(){y()}function w(){f.value.push({source:``,property:`value`,name:``,type:`any`})}function T(e){f.value.splice(e,1)}function D(e){!e.name&&e.source&&(e.name=`${e.source.split(`.`).pop()||e.source}_${e.property}`)}function O(){p.value.push({state:`visible`,expression:``})}function A(e){p.value.splice(e,1)}function j(){let e={};f.value.length>0&&(e.dependencies=f.value.filter(e=>e.source).map(e=>({source:e.source,property:e.property,name:e.name,type:e.type}))),p.value.length>0&&(e.fulfill={state:{}},p.value.forEach(t=>{t.state&&t.expression&&(e.fulfill.state[t.state]=`{{${t.expression}}}`)})),u(`save`,e),d.value=!1}function M(){d.value=!1}return(t,r)=>{let c=C(`ElButton`),l=C(`ElTreeSelect`),u=C(`ElFormItem`),y=C(`ElOption`),b=C(`ElSelect`),N=C(`ElInput`),P=C(`ElForm`),F=C(`ElDialog`);return v(),n(F,{modelValue:d.value,"onUpdate:modelValue":r[0]||=e=>d.value=e,title:`条件渲染配置`,width:`800px`,onOpen:S},{footer:k(()=>[s(c,{onClick:M},{default:k(()=>[...r[8]||=[o(` 取消 `,-1)]]),_:1}),s(c,{type:`primary`,onClick:j},{default:k(()=>[...r[9]||=[o(` 保存 `,-1)]]),_:1})]),default:k(()=>[a(`div`,Ve,[a(`div`,He,[a(`div`,Ue,[r[2]||=a(`span`,{class:`section-title`},`依赖字段`,-1),s(c,{size:`small`,type:`primary`,onClick:w},{default:k(()=>[...r[1]||=[o(` 添加依赖 `,-1)]]),_:1})]),f.value.length===0?(v(),i(`div`,We,` 暂无依赖字段，点击"添加依赖"按钮添加 `)):(v(),i(`div`,Ge,[(v(!0),i(e,null,x(f.value,(t,n)=>(v(),i(`div`,{key:n,class:`dependency-item`},[a(`div`,Ke,[a(`span`,qe,`依赖 `+E(n+1),1),s(c,{size:`small`,type:`danger`,text:``,onClick:e=>T(n)},{default:k(()=>[...r[3]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(P,{"label-width":`80px`},{default:k(()=>[s(u,{label:`字段`},{default:k(()=>[s(l,{modelValue:t.source,"onUpdate:modelValue":e=>t.source=e,data:_.value,placeholder:`选择依赖的字段`,clearable:``,"check-strictly":``,"render-after-expand":!1,onChange:e=>D(t)},null,8,[`modelValue`,`onUpdate:modelValue`,`data`,`onChange`])]),_:2},1024),s(u,{label:`属性`},{default:k(()=>[s(b,{modelValue:t.property,"onUpdate:modelValue":e=>t.property=e,placeholder:`选择属性`,onChange:e=>D(t)},{default:k(()=>[(v(),i(e,null,x(h,e=>s(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`])),64))]),_:1},8,[`modelValue`,`onUpdate:modelValue`,`onChange`])]),_:2},1024),s(u,{label:`变量名`},{default:k(()=>[s(N,{modelValue:t.name,"onUpdate:modelValue":e=>t.name=e,placeholder:`在表达式中使用的变量名`},null,8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(u,{label:`类型`},{default:k(()=>[s(b,{modelValue:t.type,"onUpdate:modelValue":e=>t.type=e,placeholder:`选择类型`},{default:k(()=>[(v(),i(e,null,x(g,e=>s(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`])),64))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024)]),_:2},1024)]))),128))]))]),a(`div`,Je,[a(`div`,Ye,[r[5]||=a(`span`,{class:`section-title`},`状态控制`,-1),s(c,{size:`small`,type:`primary`,onClick:O},{default:k(()=>[...r[4]||=[o(` 添加规则 `,-1)]]),_:1})]),p.value.length===0?(v(),i(`div`,Xe,` 暂无状态规则，点击"添加规则"按钮添加 `)):(v(),i(`div`,Ze,[(v(!0),i(e,null,x(p.value,(t,n)=>(v(),i(`div`,{key:n,class:`state-rule-item`},[a(`div`,Qe,[a(`span`,$e,`规则 `+E(n+1),1),s(c,{size:`small`,type:`danger`,text:``,onClick:e=>A(n)},{default:k(()=>[...r[6]||=[o(` 删除 `,-1)]]),_:1},8,[`onClick`])]),s(P,{"label-width":`80px`},{default:k(()=>[s(u,{label:`状态属性`},{default:k(()=>[s(b,{modelValue:t.state,"onUpdate:modelValue":e=>t.state=e,placeholder:`选择要控制的状态`},{default:k(()=>[(v(),i(e,null,x(m,e=>s(y,{key:e.value,label:e.label,value:e.value},null,8,[`label`,`value`])),64))]),_:1},8,[`modelValue`,`onUpdate:modelValue`])]),_:2},1024),s(u,{label:`表达式`},{default:k(()=>[s(N,{modelValue:t.expression,"onUpdate:modelValue":e=>t.expression=e,type:`textarea`,rows:2,placeholder:`输入 JS 表达式，如：$deps.username_value === '123'`},null,8,[`modelValue`,`onUpdate:modelValue`]),r[7]||=a(`div`,{class:`expression-tip`},` 使用 $deps.变量名 访问依赖字段的值 `,-1)]),_:2},1024)]),_:2},1024)]))),128))]))])])]),_:1},8,[`modelValue`])}}}),[[`__scopeId`,`data-v-0aa160aa`]]);const tt={class:`config-panel`},nt={key:0,class:`config-empty`},rt={key:1,class:`config-content`},it={class:`config-title`};var at=Z(c({__name:`index`,props:{components:{}},setup(e){let c=e,l=q(),{SchemaField:u}=B({components:{FormItem:ee,Input:te,InputNumber:R,Checkbox:L,Radio:ne,Switch:ae,Select:re,Space:ie,ArrayItems:I}}),d=T(null),f=t(()=>l.getSelectedField()),p=t(()=>f.value?f.value[`x-component`]:null),m=t(()=>{let e=p.value;return e?c.components[e]?.setterSchema:null}),h=t(()=>{if(!m.value)return null;let e=m.value.basicSetter;return!e||Object.keys(e).length===0?null:{type:`object`,properties:e}}),g=t(()=>{if(!m.value)return null;let e=m.value.componentSetter;return!e||!e.properties||Object.keys(e.properties).length===0?null:e}),_=t(()=>{if(!m.value)return null;let e=m.value.basicSetter||{},t=m.value.componentSetter?.properties||{};return{type:`object`,properties:{...e,...t}}});O(()=>l.selectedFieldName.value,()=>{f.value&&_.value?d.value=Be(_.value,l):d.value=null},{immediate:!0});let y=T([`base`,`operate`,`component`]),x=t(()=>l.selectedFieldName.value||`empty`),S=b(!1);function w(){S.value=!0}function A(e){let t=l.selectedFieldName.value;if(!t)return;let n=l.getSelectedField();if(!n)return;let r={...n,"x-reactions":Object.keys(e).length>0?e:void 0};l.updateFieldSchema(t,r)}return(e,t)=>{let c=C(`ElCollapseItem`),m=C(`ElButton`),_=C(`ElCollapse`);return v(),i(`div`,tt,[f.value?(v(),i(`div`,rt,[a(`h3`,it,E(p.value)+` 配置 `,1),d.value?(v(),n(D(z),{key:x.value,form:d.value},{default:k(()=>[s(_,{modelValue:y.value,"onUpdate:modelValue":t[0]||=e=>y.value=e,class:`config-section`},{default:k(()=>[h.value?(v(),n(c,{key:0,name:`base`,title:`基本配置`},{default:k(()=>[s(D(u),{schema:h.value},null,8,[`schema`])]),_:1})):r(``,!0),s(c,{name:`operate`,title:`操作配置`},{default:k(()=>[a(`div`,null,[s(m,{type:`primary`,onClick:w},{default:k(()=>[...t[3]||=[o(` 条件渲染 `,-1)]]),_:1})])]),_:1}),g.value?(v(),n(c,{key:1,name:`component`,title:`组件配置`},{default:k(()=>[s(D(u),{schema:g.value},null,8,[`schema`])]),_:1})):r(``,!0)]),_:1},8,[`modelValue`])]),_:1},8,[`form`])):r(``,!0),s(et,{modelValue:S.value,"onUpdate:modelValue":t[1]||=e=>S.value=e,schema:D(l).formSchema.value,"current-field-name":D(l).selectedFieldName.value,"initial-reactions":f.value?.[`x-reactions`],onSave:A},null,8,[`modelValue`,`schema`,`current-field-name`,`initial-reactions`])])):(v(),i(`div`,nt,[...t[2]||=[a(`p`,null,`请选择一个字段`,-1)]]))])}}}),[[`__scopeId`,`data-v-e4320a16`]]);const ot={class:`material-panel`},st={class:`panel-content`},ct={class:`category-title`},lt={class:`component-grid`},ut=[`onClick`,`onDragstart`],dt={class:`component-icon`},ft={class:`component-name`},pt={key:0,class:`component-desc`};var mt=Z(c({__name:`materialPanel`,props:{components:{}},setup(n){let o=n,s=u(_e,null),c=t(()=>{let e={};return Object.entries(o.components).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e});function l(e,t,n){if(!e.dataTransfer)return;let r={type:`new-component`,componentKey:t,componentName:n.config.name,defaultSchema:n.defaultSchema};e.dataTransfer.effectAllowed=`copy`,e.dataTransfer.setData(`application/json`,JSON.stringify(r));let i=e.target;e.dataTransfer.setDragImage(i,10,10),setTimeout(()=>{s?.switchToTreeTab()},100)}function d(e){let t=e.target;t.style.opacity=`1`}function f(e){console.log(`点击组件:`,e)}return(t,n)=>(v(),i(`div`,ot,[n[0]||=a(`div`,{class:`panel-header`},[a(`h3`,null,`组件库`)],-1),a(`div`,st,[(v(!0),i(e,null,x(c.value,(t,n)=>(v(),i(`div`,{key:n,class:`category-group`},[a(`div`,ct,E(n),1),a(`div`,lt,[(v(!0),i(e,null,x(t,({key:e,component:t})=>(v(),i(`div`,{key:e,class:`component-item`,draggable:`true`,onClick:t=>f(e),onDragstart:n=>l(n,e,t),onDragend:d},[a(`div`,dt,E(t.config?.icon?.slice(0,3)),1),a(`div`,ft,E(t.config?.name||e),1),t.config?.description?(v(),i(`div`,pt,E(t.config.description),1)):r(``,!0)],40,ut))),128))])]))),128))])]))}}),[[`__scopeId`,`data-v-93609a69`]]);const ht={class:`component-picker-content`},gt={class:`picker-category-title`},_t={class:`picker-component-grid`},vt=[`onClick`],yt={class:`picker-component-icon`},bt={class:`picker-component-name`};var xt=Z(c({__name:`ComponentPicker`,props:{visible:{type:Boolean},groupedComponents:{}},emits:[`update:visible`,`select`],setup(t,{emit:r}){let o=t,s=r;return(t,r)=>{let c=C(`ElDialog`);return v(),n(c,{"model-value":o.visible,title:`选择组件`,width:`600px`,"close-on-click-modal":!1,"onUpdate:modelValue":r[0]||=e=>s(`update:visible`,e)},{default:k(()=>[a(`div`,ht,[(v(!0),i(e,null,x(o.groupedComponents,(t,n)=>(v(),i(`div`,{key:n,class:`picker-category-group`},[a(`div`,gt,E(n),1),a(`div`,_t,[(v(!0),i(e,null,x(t,({key:e,component:t})=>(v(),i(`div`,{key:e,class:`picker-component-item`,onClick:n=>s(`select`,e,t)},[a(`div`,yt,E(t.config?.icon?.slice(0,3)),1),a(`div`,bt,E(t.config?.name||e),1)],8,vt))),128))])]))),128))])]),_:1},8,[`model-value`])}}}),[[`__scopeId`,`data-v-0981e67d`]]);const St={class:`context-menu`},Ct={key:0,class:`menu-divider`},wt=[`onClick`];var Tt=Z(c({__name:`ContextMenu`,props:{visible:{type:Boolean},virtualRef:{},menuItems:{}},emits:[`update:visible`,`select`],setup(t,{emit:r}){let o=t,c=r;return(t,r)=>{let l=C(`ElIcon`),u=C(`ElPopover`);return v(),n(u,{visible:o.visible,"virtual-ref":o.virtualRef,"virtual-triggering":``,"show-arrow":!1,"popper-class":`schema-tree-context-menu`,placement:`bottom-start`,offset:6,"onUpdate:visible":r[0]||=e=>c(`update:visible`,e)},{default:k(()=>[a(`div`,St,[(v(!0),i(e,null,x(o.menuItems,(t,r)=>(v(),i(e,{key:r},[t===`divider`?(v(),i(`div`,Ct)):(v(),i(`div`,{key:1,class:`menu-item`,onClick:e=>c(`select`,t.type)},[s(l,null,{default:k(()=>[(v(),n(w(t.icon)))]),_:2},1024),a(`span`,null,E(t.label),1)],8,wt))],64))),128))])]),_:1},8,[`visible`,`virtual-ref`])}}}),[[`__scopeId`,`data-v-1ef29c4a`]]);function Et(){let e=b(!1),n=b(null),r=b(`node`),i=b(null),a=b(null),o=t(()=>{if(r.value===`empty`)return[{type:`insertRoot`,label:`插入组件`,icon:W}];let e=n.value;if(!e)return[];let t=[{type:`copy`,label:`复制`,icon:G},{type:`copyTemplate`,label:`复制模板`,icon:G},{type:`delete`,label:`删除`,icon:ue},`divider`,{type:`moveUp`,label:`上移`,icon:pe},{type:`moveDown`,label:`下移`,icon:le},`divider`,{type:`insertBefore`,label:`上方插入`,icon:W},{type:`insertAfter`,label:`下方插入`,icon:W}];return e.isContainer&&t.push({type:`insertInner`,label:`插入内部`,icon:de}),t}),s=e=>{let t=new DOMRect(e.clientX,e.clientY,0,0);i.value={getBoundingClientRect:()=>t,contextElement:document.body}},c=()=>{a.value&&=(document.removeEventListener(`click`,a.value),null)},l=()=>{e.value=!1,c()},u=()=>{c();let e=()=>{l()};a.value=e,document.addEventListener(`click`,e)},d=(t,i,a)=>{t.preventDefault(),t.stopPropagation(),r.value=i,n.value=a,s(t),e.value=!0,setTimeout(()=>{u()},0)};return _(()=>{c()}),{contextMenuVisible:e,contextMenuNode:n,contextMenuMode:r,contextMenuVirtualRef:i,menuItems:o,handleEmptyContextMenu:e=>{d(e,`empty`,null)},handleNodeContextMenu:(e,t)=>{d(e,`node`,t)},closeContextMenu:l}}function Dt(e){return JSON.parse(JSON.stringify(e))}function Ot(e){return e.split(`.`).filter(e=>e!==`properties`&&e!==`items`)}function kt(e,t,n){let r=Ot(t),i=[...r.slice(0,-1),n],a=new Map,o=(e,t,n)=>{let r=Dt(e);if(a.set(t.join(`.`),n.join(`.`)),e.properties&&typeof e.properties==`object`){let i={};Object.entries(e.properties).forEach(([e,r])=>{let a=`f_${j()}`;i[a]=o(r,[...t,e],[...n,a])}),r.properties=i}return e.items&&typeof e.items==`object`&&(r.items=o(e.items,[...t,`items`],[...n,`items`])),r},s=e=>{if(a.has(e))return a.get(e)||null;for(let[t,n]of a.entries())if(e.startsWith(`${t}.`))return`${n}${e.slice(t.length)}`;return null},c=e=>{if(!e||typeof e!=`object`)return;let t=e[`x-reactions`];t&&Array.isArray(t.dependencies)&&(t.dependencies=t.dependencies.map(e=>{if(e&&typeof e.source==`string`){let t=s(e.source);if(t)return{...e,source:t}}return e}),e[`x-reactions`]=t),e.properties&&Object.values(e.properties).forEach(e=>c(e)),e.items&&c(e.items)},l=o(e,r,i);return c(l),l}function At(e){return e[`x-droppable`]===!1?!1:!![`object`,`void`,`array`].includes(e.type)}function Q(e,t=``){let n=[];return!e||typeof e!=`object`?n:(e.properties&&typeof e.properties==`object`&&Object.entries(e.properties).forEach(([e,r])=>{let i=t?`${t}.properties.${e}`:e,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:At(r),children:Q(r,i)};n.push(s)}),e.items?.properties&&Object.entries(e.items.properties).forEach(([e,r])=>{let i=`${t}.items.properties.${e}`,a=r[`x-component`]||`Unknown`,o=r.title||e,s={path:i,label:o,title:o,component:a,isContainer:At(r),children:Q(r,i)};n.push(s)}),n)}function $(e){let t=[];return e.forEach(e=>{t.push(e.path),e.children&&e.children.length>0&&t.push(...$(e.children))}),t}function jt(e,t){let n=t.getBoundingClientRect(),r=e.clientY-n.top,i=n.height*.2;return r<i?`before`:r>n.height-i?`after`:`inner`}function Mt(e,t,n){let r=document.elementFromPoint(t,n)?.closest(`.el-tree-node`);if(!r)return null;let i=r.querySelector(`.el-tree-node__content`);if(!i)return null;let a=(e,t)=>{for(let n of e){if(n.path===t)return n;if(n.children){let e=a(n.children,t);if(e)return e}}return null},o=r.getAttribute(`data-path`)||i.getAttribute(`data-path`);if(o){let t=a(e,o);if(t)return{element:r,data:t}}let s=document.querySelectorAll(`.el-tree-node`),c=Array.from(s).indexOf(r);return c>=0&&c<e.length?{element:r,data:e[c]}:null}function Nt(e){let{components:n,contextMenuNode:r,closeContextMenu:i,treeData:a,expandAll:o,store:s}=e,c=b(!1),l=b(null),u=t(()=>{let e={};return Object.entries(n||{}).forEach(([t,n])=>{if(n.config?.hidden===!0)return;let r=n.config?.category||`其他`;e[r]||(e[r]=[]),e[r].push({key:t,component:n})}),e}),d=(e,t,n)=>{let{defaultSchema:r}=e,i=`f_${j()}`,a;a=n===`inner`?X.Inner:n===`before`?X.Before:X.After,s.insertField(t.path,i,r,a),p(()=>{let e;if(n===`inner`)e=s.getNodeSchema(t.path)?.type===`array`?`${t.path}.items.properties.${i}`:`${t.path}.properties.${i}`;else{let n=t.path.split(`.`).slice(0,-1).join(`.`);e=n?`${n}.${i}`:i}s.selectNode(e),o()})},f=e=>{let{defaultSchema:t}=e,n=`f_${j()}`;s.addField(n,t),s.selectNode(n),p(()=>{o()})},m=(e,t)=>{l.value={targetNode:e,position:t},c.value=!0},h=(e,t)=>{if(!l.value)return;let{targetNode:n,position:r}=l.value,i={componentKey:e,defaultSchema:JSON.parse(JSON.stringify(t.defaultSchema))};r===`root`?f(i):n&&d(i,n,r),c.value=!1,l.value=null},g=e=>{let t=e.split(`.`),n=t[t.length-1],r=t.includes(`items`)&&t.includes(`properties`),i=``;if(r){let e=t.lastIndexOf(`items`);i=t.slice(0,e).join(`.`)}else{let e=t.lastIndexOf(`properties`);e>0&&(i=t.slice(0,e).join(`.`))}let a,o;return i?(a=s.getNodeSchema(i),a&&(o=a.type===`array`?a.items?.properties:a.properties)):(a=s.formSchema.value,o=a.properties),{parentSchema:a,propertiesObj:o,fieldName:n}},_=()=>{if(!r.value)return;let e=r.value.path,t=s.getNodeSchema(e);if(!t)return;let{parentSchema:n,propertiesObj:a,fieldName:o}=g(e);if(!n||!a)return;let c=`f_${j()}`,l=kt(t,e,c),u=Object.entries(a),d=u.findIndex(([e])=>e===o),f=d>=0?d+1:u.length;u.splice(f,0,[c,l]);let p={};u.forEach(([e,t])=>{p[e]=t});let m=e.split(`.`);if(m.length===1)s.formSchema.value.properties=p;else{let e=m.includes(`items`),t;if(e){let e=m.lastIndexOf(`items`);t=`${m.slice(0,e).join(`.`)}.items.properties`}else{let e=m.lastIndexOf(`properties`);t=m.slice(0,e+1).join(`.`)}F(s.formSchema.value.properties,t,p)}i()},v=()=>{if(!r.value)return;let e=r.value.path,t=s.getNodeSchema(e);if(!t)return;let n=JSON.stringify(t);navigator.clipboard.writeText(n),i()},y=()=>{if(!r.value)return;let e=r.value.path;M(s.formSchema.value.properties,e),i()},x=()=>{if(!r.value)return;let e=r.value.path,{parentSchema:t,propertiesObj:n,fieldName:a}=g(e);if(!n||!t)return;let o=Object.entries(n),c=o.findIndex(([e])=>e===a);if(c<=0)return;let l=o[c];o[c]=o[c-1],o[c-1]=l;let u={};o.forEach(([e,t])=>{u[e]=t});let d=e.split(`.`);if(d.length===1)s.formSchema.value.properties=u;else{let e=d.includes(`items`),t;if(e){let e=d.lastIndexOf(`items`);t=`${d.slice(0,e).join(`.`)}.items.properties`}else{let e=d.lastIndexOf(`properties`);t=d.slice(0,e+1).join(`.`)}F(s.formSchema.value.properties,t,u)}i()},S=()=>{if(!r.value)return;let e=r.value.path,{parentSchema:t,propertiesObj:n,fieldName:a}=g(e);if(!n||!t)return;let o=Object.entries(n),c=o.findIndex(([e])=>e===a);if(c===-1||c>=o.length-1)return;let l=o[c];o[c]=o[c+1],o[c+1]=l;let u={};o.forEach(([e,t])=>{u[e]=t});let d=e.split(`.`);if(d.length===1)s.formSchema.value.properties=u;else{let e=d.includes(`items`),t;if(e){let e=d.lastIndexOf(`items`);t=`${d.slice(0,e).join(`.`)}.items.properties`}else{let e=d.lastIndexOf(`properties`);t=d.slice(0,e+1).join(`.`)}F(s.formSchema.value.properties,t,u)}i()};return{groupedComponents:u,componentPickerVisible:c,handleMenuClick:e=>{switch(e){case`insertRoot`:m(null,`root`);break;case`insertBefore`:m(r.value,`before`);break;case`insertAfter`:m(r.value,`after`);break;case`insertInner`:m(r.value,`inner`);break;case`copy`:_();return;case`copyTemplate`:v();return;case`delete`:y();return;case`moveUp`:x();return;case`moveDown`:S();return}i()},handleSelectComponent:h,handleExternalDrop:e=>{if(e.preventDefault(),e.stopPropagation(),e.dataTransfer)try{let t=e.dataTransfer.getData(`application/json`);if(!t)return;let n=JSON.parse(t);if(n.type!==`new-component`)return;let{componentKey:r,defaultSchema:i}=n;if(!i){console.warn(`组件缺少 defaultSchema:`,r);return}let o=Mt(a.value,e.clientX,e.clientY);if(console.log(`targetNode`,o),o){let t=jt(e,o.element);d(n,o.data,t)}else f(n)}catch(e){console.error(`解析拖拽数据失败:`,e)}}}}function Pt(e=q()){let n=b(),r=b(``),i=t(()=>Q(e.formSchema.value));return{treeRef:n,filterText:r,treeData:i,treeProps:{children:`children`,label:`label`},filterNode:(e,t)=>e?t.label.toLowerCase().includes(e.toLowerCase()):!0,handleFilterChange:e=>{n.value?.filter(e)},expandAll:()=>{$(i.value).forEach(e=>{let t=n.value?.getNode(e);t&&(t.expanded=!0)})},collapseAll:()=>{$(i.value).forEach(e=>{let t=n.value?.getNode(e);t&&(t.expanded=!1)})},handleNodeClick:t=>{e.selectNode(t.path)},handleAllowDrag:e=>!0,handleAllowDrop:(e,t,n)=>{let r=t.data;return n===`inner`?r.isContainer:!0},handleNodeDrop:(t,n,r,i)=>{let a=t.data,o=n.data,s;s=r===`inner`?`INNER`:r===`before`?`BEFORE`:`AFTER`,e.moveField(a.path,o.path,s)}}}const Ft={class:`schema-tree`},It={class:`tree-toolbar`},Lt={class:`toolbar-buttons`},Rt={class:`node-label`},zt={class:`node-component`};var Bt=Z(c({__name:`SchemaTree`,setup(e){let t=q(),n=u(`designerComponents`,{}),{treeRef:r,filterText:c,treeData:l,treeProps:f,filterNode:h,handleFilterChange:g,expandAll:_,collapseAll:y,handleNodeClick:b,handleAllowDrop:x,handleAllowDrag:S,handleNodeDrop:w}=Pt(t),{contextMenuVisible:T,contextMenuNode:O,contextMenuVirtualRef:j,menuItems:M,handleEmptyContextMenu:N,handleNodeContextMenu:P,closeContextMenu:F}=Et(),{groupedComponents:I,componentPickerVisible:L,handleMenuClick:ee,handleSelectComponent:te,handleExternalDrop:R}=Nt({store:t,components:n,contextMenuNode:O,closeContextMenu:F,treeData:l,expandAll:_});return p(()=>{_()}),(e,t)=>{let n=C(`ElIcon`),u=C(`ElInput`),p=C(`ElButton`),O=C(`ElEmpty`),F=C(`ElTree`);return v(),i(`div`,Ft,[a(`div`,It,[s(u,{modelValue:D(c),"onUpdate:modelValue":t[0]||=e=>d(c)?c.value=e:null,placeholder:`搜索组件`,clearable:``,size:`small`,onInput:D(g)},{prefix:k(()=>[s(n,null,{default:k(()=>[s(D(fe))]),_:1})]),_:1},8,[`modelValue`,`onInput`]),a(`div`,Lt,[s(p,{size:`small`,text:``,onClick:D(_)},{default:k(()=>[...t[7]||=[o(` 全部展开 `,-1)]]),_:1},8,[`onClick`]),s(p,{size:`small`,text:``,onClick:D(y)},{default:k(()=>[...t[8]||=[o(` 全部折叠 `,-1)]]),_:1},8,[`onClick`])])]),a(`div`,{class:`tree-content`,onDrop:t[2]||=(...e)=>D(R)&&D(R)(...e),onDragover:t[3]||=A(()=>{},[`prevent`]),onContextmenu:t[4]||=(...e)=>D(N)&&D(N)(...e)},[s(F,{ref_key:`treeRef`,ref:r,style:{height:`100%`},data:D(l),props:D(f),"node-key":`path`,draggable:``,"allow-drop":D(x),"allow-drag":D(S),"filter-node-method":(e,t)=>D(h)(e,t),"default-expand-all":``,"highlight-current":``,onNodeClick:D(b),onNodeDrop:D(w),onNodeContextmenu:t[1]||=(e,t)=>D(P)(e,t)},{default:k(({data:e})=>[a(`div`,{class:m([`tree-node`,{"is-container":e.isContainer}])},[a(`span`,Rt,E(e.label),1),a(`span`,zt,`(`+E(e.component)+`)`,1)],2)]),empty:k(()=>[s(O,{description:`暂无组件，请点击右键插入`})]),_:1},8,[`data`,`props`,`allow-drop`,`allow-drag`,`filter-node-method`,`onNodeClick`,`onNodeDrop`])],32),s(Tt,{visible:D(T),"onUpdate:visible":t[5]||=e=>d(T)?T.value=e:null,"virtual-ref":D(j),"menu-items":D(M),onSelect:D(ee)},null,8,[`visible`,`virtual-ref`,`menu-items`,`onSelect`]),s(xt,{visible:D(L),"onUpdate:visible":t[6]||=e=>d(L)?L.value=e:null,"grouped-components":D(I),onSelect:D(te)},null,8,[`visible`,`grouped-components`,`onSelect`])])}}}),[[`__scopeId`,`data-v-1474000a`]]);const Vt={class:`left-panel`};var Ht=Z(c({__name:`index`,props:{components:{},draggable:{type:Boolean,default:!1}},setup(e){let t=e,r=b(`materials`);function a(){r.value!==`tree`&&(r.value=`tree`)}return y(_e,{switchToTreeTab:a}),(a,o)=>{let c=C(`ElTabPane`),l=C(`ElTabs`);return v(),i(`div`,Vt,[t.draggable?(v(),n(l,{key:0,modelValue:r.value,"onUpdate:modelValue":o[0]||=e=>r.value=e,class:`panel-tabs`},{default:k(()=>[s(c,{label:`组件库`,name:`materials`},{default:k(()=>[s(mt,{components:e.components},null,8,[`components`])]),_:1}),s(c,{label:`组件树`,name:`tree`},{default:k(()=>[s(Bt)]),_:1})]),_:1},8,[`modelValue`])):(v(),n(Bt,{key:1}))])}}}),[[`__scopeId`,`data-v-7b552cf6`]]),Ut=c({name:`ArrayInner`,inheritAttrs:!1,__name:`arrayInner`,setup(e){return y(he,V()),(e,t)=>S(e.$slots,`default`)}}),Wt=c({inheritAttrs:!1,__name:`arrayItemInner`,props:{index:{}},setup(e){return y(ge,e),(e,t)=>S(e.$slots,`default`)}});function Gt(e){return Array.isArray(e?.items)?Gt(e.items[0]):e?.items?.type===`array`||e?.items?.type===`object`}function Kt(e){let t=Gt(e),n=null;return n=t?new WeakMap:[],_(()=>{n=null}),{getKey:(e,t)=>n instanceof WeakMap?(n.has(e)||n.set(e,j()),`${n.get(e)}-${t}`):(n&&!n[t]&&(n[t]=j()),n?`${n[t]}-${t}`:void 0)}}function qt(e){return me(c({name:`SchemaWrapper`,props:{value:{type:[String,Number,Boolean,Array,Object],default:void 0},onChange:{type:Function,default:void 0}},setup(n,r){let{setterSchema:i}=e,a=V(),o=se(),s=u(he,void 0),c=u(ge,void 0),{getKey:d}=Kt(o.value),f=t(()=>{let e=a.value,t={...o.value?.[`x-component-props`]||{},value:n.value,onChange:n.onChange};if(e&&!U(e)&&(t.pattern=e.pattern),i.basicSetter)for(let[e,n]of Object.entries(i.basicSetter)){let r=n[`x-path`];if(r){let n=N(o.value,r);n!==void 0&&(t[e]=n)}}if(i.componentSetter?.properties)for(let[e,n]of Object.entries(i.componentSetter.properties)){let r=n[`x-path`];if(r){let n=N(o.value,r);n!==void 0&&(t[e]=n)}}e&&!U(e)&&(t.pattern=e.pattern);let r=o.value?.type===`array`?a.value:s?.value;return r&&(t.onAdd=()=>r.push({}),t.onPush=()=>r.push({}),t.onUnshift=()=>r.unshift({}),t.onRemove=e=>r.remove(e),t.onMove=(e,t)=>r.move(e,t),t.onMoveUp=e=>{e>0&&r.move(e,e-1)},t.onMoveDown=e=>{e<r.value.length-1&&r.move(e,e+1)},c?.index!==void 0&&(t.pattern=r.pattern)),c?.index!==void 0&&(t.arrayIndex=c.index),t});return()=>{let t=a.value;if(!t||t.display!==`visible`)return l(`template`,{},{});let n=()=>{if(!t||U(t))return null;let e=t.errors||[];return e.length===0?null:l(`div`,{class:`formily-validation-errors`,style:{color:`#f56c6c`,fontSize:`12px`,marginTop:`4px`,lineHeight:`1.5`}},l(`div`,{class:`formily-validation-error-item`},e[0].messages))};if(o.value?.type===`array`){let r=t?.value||[],i=r.length>0?r.map((e,t)=>l(Wt,{index:t},{default:()=>l(oe,{key:d(e,t),schema:o.value.items,name:t})})):null;return l(`div`,{},[l(Ut,{},{default:()=>l(e.component,f.value,{default:()=>i})}),n()])}return l(`div`,{},[l(e.component,f.value,r.slots),n()])}}}))}var Jt=c({__name:`index`,props:{schema:{},components:{}},setup(e,{expose:t}){let r=e,i=H(),{SchemaField:a}=B({components:Object.keys(r.components).reduce((e,t)=>(e[t]=qt(r.components[t]),e),{})});return t({form:i}),(t,r)=>(v(),n(D(z),{form:D(i)},{default:k(()=>[s(D(a),{schema:e.schema},null,8,[`schema`])]),_:1},8,[`form`]))}});const Yt={key:0,class:`designer-layout`},Xt={class:`designer-material`},Zt={class:`designer-canvas`},Qt={class:`designer-config`},$t={key:1,class:`designer-preview`};var en=Z(c({__name:`designer`,props:{components:{},mode:{default:`edit`},modelValue:{},draggable:{type:Boolean,default:!1},height:{default:`100vh`}},emits:[`update:modelValue`],setup(e,{expose:n,emit:r}){let o=e,c=r,l=Ce(o.draggable);y(`designerComponents`,o.components);let u=b(null);O(()=>o.modelValue,e=>{e&&JSON.stringify(e)!==JSON.stringify(l.formSchema.value)&&(l.formSchema.value=e)},{immediate:!0,deep:!0}),O(()=>l.formSchema.value,e=>{c(`update:modelValue`,e)},{deep:!0});function d(){return u.value?.form?.values||{}}return n({getFormValues:d,schema:t(()=>l.formSchema.value),store:l}),(t,n)=>(v(),i(`div`,{class:`designer`,style:g({height:o.height})},[o.mode===`edit`?(v(),i(`div`,Yt,[a(`div`,Xt,[s(Ht,{components:e.components,draggable:e.draggable},null,8,[`components`,`draggable`])]),a(`div`,Zt,[s(ze,{components:e.components},null,8,[`components`])]),a(`div`,Qt,[s(at,{components:e.components},null,8,[`components`])])])):(v(),i(`div`,$t,[s(Jt,{ref_key:`renderRef`,ref:u,schema:D(l).formSchema.value,components:e.components},null,8,[`schema`,`components`])]))],4))}}),[[`__scopeId`,`data-v-aaa05eea`]]);const tn=ze,nn=at,rn=mt,an=en,on=Jt;export{tn as Canvas,nn as ConfigPanel,K as DesignStoreKey,an as Designer,rn as MaterialPanel,on as Render,we as schemaToSetterValues,Te as setterValuesToSchema,Ce as useCreateDesignStore,q as useDesignStore};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@formily-djd/designer",
   "type": "module",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "description": "djd formily designer",
   "author": "gaojinsong2010@gmail.com",
   "license": "MIT",
@@ -27,12 +27,13 @@
     "@formily/shared": "^2.3.7",
     "@formily/vue": "^2.3.7",
     "vue": "^3.5.22",
-    "@formily-djd/utils": "0.0.7"
+    "@formily-djd/utils": "0.0.8"
   },
   "devDependencies": {
     "@antfu/eslint-config": "^5.4.1",
     "@antfu/ni": "^26.0.1",
     "@antfu/utils": "^9.2.1",
+    "@popperjs/core": "^2.11.8",
     "@types/node": "^24.5.2",
     "@unocss/reset": "^66.5.2",
     "ansis": "^4.2.0",
@@ -56,7 +57,7 @@
     "vitest": "^3.2.4",
     "vitest-package-exports": "^0.1.1",
     "yaml": "^2.8.1",
-    "@formily-djd/component": "0.0.7"
+    "@formily-djd/component": "0.0.8"
   },
   "publishConfig": {
     "access": "public",