react-ts-custom-widget-flow-editor 1.0.0

package/README.md

@@ -0,0 +1,80 @@
+# react-ts-custom-widget-template
+> amis自定义组件模板（react&ts技术栈）
+- 备注：充当amis-widget-cli中的react&ts技术栈组件模板
+
+### 目录说明
+- src: 自定义组件源码；
+- src/assets: 存放组件静态资源，比如 css、img等；
+- src/widget: 组件源码；
+- src/widget/info-card.jsx: 自定义组件代码；
+- src/index.js: 用于注册一个amis渲染器，注册成功后编辑器画布区中才会正常展示自定义组件内容；
+- src/widget/plugin/info-card-plugin.jsx: 用于注册一个amis-editor插件，注册成功后编辑器左侧组件面板中会展示；
+- src/preview.js: 用于本地预览自定义组件内容；
+- amis.config.js: amis-widget-cli配置文件。
+
+### 开发说明
+
+1. **安装依赖**
+```bash
+$ npm i 或者 yarn
+```
+
+2. **dev: 本地开发模式（带热更新）**
+> dev开发模式：用于在本地editor中调试自定义组件。
+```bash
+$ npm run dev
+```
+
+3. **preview: 组件预览模式（带热更新）**
+> preview模式：用于预览自定义组件内容。
+```bash
+$ npm run preview
+```
+
+4. **linkDebug: 外链调试（amis-saas中预览自定义组件）**
+> linkDebug模式：用于在amis-saas中预览和调试自定义组件。
+```bash
+$ npm run linkDebug
+```
+5. **build2lib: 构建自定义组件输出产物**
+> build2lib模式：用于构建发布到 npm 中的文件，默认存放到 当前dist目录中。
+```bash
+$ npm run build2lib
+```
+6. **package.json添加自定义组件信息，导入组件扩展包时需要**
+> package.json 中添加 amis-widgets 字段，用于放置当前自定义组件信息，有这个amis-widgets 字段才能被识别为amis组件扩展包。
+```bash
+  ...
+    "amis-widgets": [
+    {
+      "name": "react-info-card", // 自定义组件名称，必填项
+      "framework": "react", // 技术栈类型，非必填项，默认为 react 技术栈
+      "usage": "renderer", // 渲染器类型，非必填项，默认为 renderer
+      "type": "react-info-card", // 自定义组件类型，必填项，同一应用下不允许有重复的自定义组件类型
+      "entry": "/dist/reactInfoCard.umd", // 自定义组件入口文件路径，必填项
+      "files": [  // 自定义组件依赖资源文件路径，非必填项
+        "/dist/reactInfoCard.css"
+      ],
+      "editorPlugin": {  // amis-editor自定义插件信息
+        "name": "react-info-card-plugin", // 自定义插件名称，在编辑器左侧组件面板作为title展示，必填项
+        "description": "信息展示卡片", // 自定义插件描述，在编辑器左侧组件面板作为描述信息展示，必填项
+        "pluginEntry": "/dist/reactInfoCardPlugin.umd", // 自定义插件的入口文件，必填项
+        "tag": [  // 自定义插件的分类，必填项
+          "展示"
+        ],
+        "sort": 100 // 自定义插件的排序，非必填项
+      }
+    }
+  ],
+  ...
+}
+```
+7. **发布一个NPM组件扩展包**
+> 需要确保package.json中的name值唯一，version值不重复。
+```bash
+$ npm publish
+```
+8. **发布到制定的NPM仓库**
+> 打开NPM配置文件（src/.npmrc），配置为制定仓库地址即可。
+### 配置项说明（amis-widget-cli）
+[请查看amis-widget-cli](https://github.com/aisuda/amis-widget-cli)

package/dist/reactInfoCard.css

@@ -0,0 +1,7 @@
+/*!
+ * react-ts-custom-widget-template v1.0.0
+ * author: fex
+ * build tool: AKFun
+ * build time: Wed Apr 16 2025 14:24:38 GMT+0800 (中国标准时间)
+ * build tool info: https://github.com/wibetter/akfun
+ */:root{--padding-bottom:20px}.news-card{border-bottom:1px solid #ececec;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0 12px;padding-bottom:var(--padding-bottom);position:relative}.news-card .left{float:left}.news-card .right{float:right}.news-card .news-title{color:#5f5e5e;font-family:PingFangSC-Regular;font-size:16px;line-height:22px;padding:6px 0}.news-card .item-imgbox{background:#f0f0f0;cursor:pointer;height:395px;overflow:hidden;position:relative;text-align:center}.news-card .item-imgbox,.news-card .item-imgbox .news-img{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.news-card .item-imgbox .news-img{background-size:cover;height:100%;width:100%}.news-card .item-imgbox .img-count{background:rgba(0,0,0,.4);color:#fff;font-size:25px;line-height:1.2;min-width:60px;overflow:hidden;padding:6px 8px;position:absolute;right:0;text-align:center;top:0}.news-card .item-imgbox .img-count,.news-card .news-info{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.news-card .news-info{font-family:PingFangSC-Light;height:28px}.news-card .cmt-num,.news-card .media-mark{color:#828282;display:inline-block;font-family:PingFangSC-Light;font-size:18px;height:28px;line-height:28px}#root{height:100%;margin:0 auto;padding:2rem;text-align:center;width:100%}.react-flow__node-default,.react-flow__node-group,.react-flow__node-input,.react-flow__node-output{padding:0}.context-menu{-webkit-box-orient:vertical;-webkit-box-direction:normal;-moz-box-orient:vertical;-moz-box-direction:normal;border:1px solid #ccc;border-radius:6px;display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;position:absolute}.custom-node{background:#fff;border:1px solid #e2e8f0;border-radius:10px;-webkit-box-shadow:0 4px 6px rgba(0,0,0,.1);box-shadow:0 4px 6px rgba(0,0,0,.1);color:#1a202c;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;min-width:180px;padding:16px;text-align:left;-webkit-transition:all .2s ease;transition:all .2s ease}.custom-node-id{color:#2d3748;font-size:12px;font-weight:500;margin-bottom:6px}.custom-node-title{color:#1a202c;font-size:16px;font-weight:600;line-height:1.4;margin-bottom:10px}.custom-node-throughLen{color:#3182ce;font-size:13px;font-weight:600}.custom-node.is-selected{border-color:#4299e1;-webkit-box-shadow:0 0 0 3px rgba(66,153,225,.5);box-shadow:0 0 0 3px rgba(66,153,225,.5);-webkit-transform:translateY(-2px);transform:translateY(-2px)}.custom-node.is-highlight{-webkit-animation:pulse .5s ease-in-out;animation:pulse .5s ease-in-out;border:2px solid #f56565}.custom-node.start{background:linear-gradient(135deg,#f6ad55,#f6871f);color:#fff}.custom-node.analyze,.custom-node.diagnosis,.custom-node.treatment{background:linear-gradient(135deg,#63b3ed,#4299e1);color:#fff}.custom-node.arrange{background:linear-gradient(135deg,#68d391,#48bb78);color:#fff}.custom-node.end{background:linear-gradient(135deg,#f687b3,#ed64a6);color:#fff}.react-flow__viewport .react-flow__nodes .react-flow__node{border:none}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.02);transform:scale(1.02)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.02);transform:scale(1.02)}to{-webkit-transform:scale(1);transform:scale(1)}}

package/dist/reactInfoCard.umd.js

@@ -0,0 +1,2 @@
+/*! For license information please see reactInfoCard.umd.js.LICENSE.txt */
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.amisWidget=t():e.amisWidget=t()}(this,(function(){return function(){var e={534:function(e,t,n){"use strict";function r(e,t){for(var n=[],r={},i=0;i<t.length;i++){var o=t[i],a=o[0],d={id:e+":"+i,css:o[1],media:o[2],sourceMap:o[3]};r[a]?r[a].parts.push(d):n.push(r[a]={id:a,parts:[d]})}return n}n.d(t,{A:function(){return m}});var i="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!i)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var o={},a=i&&(document.head||document.getElementsByTagName("head")[0]),d=null,l=0,s=!1,u=function(){},c=null,f="data-vue-ssr-id",p="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());function m(e,t,n,i){s=n,c=i||{};var a=r(e,t);return g(a),function(t){for(var n=[],i=0;i<a.length;i++){var d=a[i];(l=o[d.id]).refs--,n.push(l)}for(t?g(a=r(e,t)):a=[],i=0;i<n.length;i++){var l;if(0===(l=n[i]).refs){for(var s=0;s<l.parts.length;s++)l.parts[s]();delete o[l.id]}}}}function g(e){for(var t=0;t<e.length;t++){var n=e[t],r=o[n.id];if(r){r.refs++;for(var i=0;i<r.parts.length;i++)r.parts[i](n.parts[i]);for(;i<n.parts.length;i++)r.parts.push(y(n.parts[i]));r.parts.length>n.parts.length&&(r.parts.length=n.parts.length)}else{var a=[];for(i=0;i<n.parts.length;i++)a.push(y(n.parts[i]));o[n.id]={id:n.id,refs:1,parts:a}}}}function h(){var e=document.createElement("style");return e.type="text/css",a.appendChild(e),e}function y(e){var t,n,r=document.querySelector("style["+f+'~="'+e.id+'"]');if(r){if(s)return u;r.parentNode.removeChild(r)}if(p){var i=l++;r=d||(d=h()),t=E.bind(null,r,i,!1),n=E.bind(null,r,i,!0)}else r=h(),t=k.bind(null,r),n=function(){r.parentNode.removeChild(r)};return t(e),function(r){if(r){if(r.css===e.css&&r.media===e.media&&r.sourceMap===e.sourceMap)return;t(e=r)}else n()}}var v,b=(v=[],function(e,t){return v[e]=t,v.filter(Boolean).join("\n")});function E(e,t,n,r){var i=n?"":r.css;if(e.styleSheet)e.styleSheet.cssText=b(t,i);else{var o=document.createTextNode(i),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(o,a[t]):e.appendChild(o)}}function k(e,t){var n=t.css,r=t.media,i=t.sourceMap;if(r&&e.setAttribute("media",r),c.ssrId&&e.setAttribute(f,t.id),i&&(n+="\n/*# sourceURL="+i.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(i))))+" */"),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}},665:function(){},985:function(e,t,n){var r=n(665);r.__esModule&&(r=r.default),"string"==typeof r&&(r=[[e.id,r,""]]),r.locals&&(e.exports=r.locals),(0,n(534).A)("2c1625b5",r,!1,{sourceMap:!1})}},t={};function n(r){var i=t[r];if(void 0!==i)return i.exports;var o=t[r]={id:r,exports:{}};return e[r](o,o.exports,n),o.exports}return n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,{a:t}),t},n.d=function(e,t){for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},function(){"use strict";var e=require("@babel/runtime/helpers/inheritsLoose"),t=n.n(e),r=require("react"),i=n.n(r),o=(n(985),require("antd/lib/radio/style/css"),require("antd/lib/radio")),a=n.n(o),d=(require("antd/lib/input-number/style/css"),require("antd/lib/input-number")),l=n.n(d),s=(require("antd/lib/input/style/css"),require("antd/lib/input")),u=n.n(s),c=(require("antd/lib/form/style/css"),require("antd/lib/form")),f=n.n(c),p=(require("antd/lib/modal/style/css"),require("antd/lib/modal")),m=n.n(p),g=(require("antd/lib/button/style/css"),require("antd/lib/button")),h=n.n(g),y=(require("antd/lib/message/style/css"),require("antd/lib/message")),v=n.n(y),b=require("@babel/runtime/helpers/extends"),E=n.n(b),k=(require("antd/lib/select/style/css"),require("antd/lib/select")),x=n.n(k),C=require("classnames"),q=n.n(C),w=require("@xyflow/react");function L(e,t,n){return{nodes:e.filter((function(e){return e.id!==n})),edges:t.filter((function(e){return e.source!==n&&e.target!==n}))}}require("@xyflow/react/dist/style.css"),require("antd/dist/antd.min.css");var N=[{id:"start",type:"default",position:{x:-477.99288389363477,y:-45.243023195942946},data:{id:"1",title:"开始",type:"start",desc:"应用范围：全部",highlight:!0}},{id:"node-2",type:"default",position:{x:-208.49753694581278,y:-69.82758620689657},data:{type:"diagnosis",title:"诊断-第一诊断",desc:"脓毒性休克;休克",throughLen:1,id:2,highlight:!0}},{id:"node-3",type:"default",position:{x:61.55035885694927,y:-98.24913069836151},data:{type:"analyze",title:"主要条件-识别词",desc:"意识改变;发热;心动过速",throughLen:1,id:3,highlight:!0}},{id:"node-4",type:"default",position:{x:77.89408866995078,y:102.30432094600638},data:{type:"analyze",title:"主要条件-识别词",desc:"24小时尿量<=500ml",throughLen:1,id:4,highlight:!1}},{id:"node-5",type:"default",position:{x:49.88606422573773,y:-260.88076479506816},data:{type:"analyze",title:"主要条件-识别词",desc:"血小板计数100",throughLen:1,id:5,highlight:!1}},{id:"node-6",type:"default",position:{x:281.39509172547736,y:-264.38176785059477},data:{type:"analyze",title:"基本信息-年龄",desc:">=14岁",throughLen:1,id:6,highlight:!1}},{id:"node-7",type:"default",position:{x:287.807881773399,y:-75.4926108374384},data:{type:"analyze",title:"基本信息-年龄",desc:">=3岁",throughLen:1,id:7,highlight:!0}},{id:"node-8",type:"default",position:{x:277.89408866995075,y:76.04679802955667},data:{type:"analyze",title:"基本信息-年龄",desc:">=70岁",throughLen:1,id:8,highlight:!1}},{id:"node-9",type:"default",position:{x:486.7581423419174,y:-68.91093900800182},data:{type:"arrange",title:"大模型诊断",desc:"",throughLen:1,id:9,highlight:!0}},{id:"node-10",type:"default",position:{x:686.7581423419174,y:-68.91093900800182},data:{type:"treatment",title:"推荐结果-治疗方案",desc:"糖皮质激素治疗-脓毒性休克",throughLen:1,id:10,highlight:!1}},{id:"node-11",type:"default",position:{x:886.7581423419174,y:-68.91093900800182},data:{type:"treatment",title:"推荐结果-子方案",desc:"",throughLen:1,id:11,highlight:!1}},{id:"node-12",type:"default",position:{x:680.7581423419174,y:-216.91093900800183},data:{type:"treatment",title:"推荐结果-治疗方案",desc:"脏器功能替代治疗-脓毒性休克",throughLen:1,id:12,highlight:!0}},{id:"node-13",type:"default",position:{x:1120.7581423419174,y:-116.91093900800183},data:{type:"end",title:"结束",desc:"",throughLen:1,id:13,highlight:!0}}],I=[{id:"edge-start-node-2",target:"start",source:"node-2",style:{stroke:"red",strokeWidth:2}},{id:"edge-node-2-node-3",target:"node-2",source:"node-3",style:{stroke:"red",strokeWidth:2}},{id:"edge-node-2-node-4",target:"node-2",source:"node-4",style:{stroke:"#b1b1b7",strokeWidth:1}},{id:"edge-node-2-node-5",target:"node-2",source:"node-5",style:{stroke:"#b1b1b7",strokeWidth:1}},{id:"edge-node-5-node-6",target:"node-5",source:"node-6",style:{stroke:"#b1b1b7",strokeWidth:1}},{id:"edge-node-3-node-7",target:"node-3",source:"node-7",style:{stroke:"red",strokeWidth:2}},{id:"edge-node-4-node-8",target:"node-4",source:"node-8",style:{stroke:"#b1b1b7",strokeWidth:1}},{id:"edge-node-6-node-9",target:"node-6",source:"node-9",style:{stroke:"#b1b1b7",strokeWidth:1}},{source:"node-9",target:"node-7",id:"xy-edge__node-9-node-7",style:{stroke:"red",strokeWidth:2}},{source:"node-9",target:"node-8",id:"xy-edge__node-9-node-8",style:{stroke:"#b1b1b7",strokeWidth:1}},{id:"edge-node-9-node-10",target:"node-9",source:"node-10",style:{stroke:"#b1b1b7",strokeWidth:1}},{id:"edge-node-10-node-11",target:"node-10",source:"node-11",style:{stroke:"#b1b1b7",strokeWidth:1}},{id:"edge-node-9-node-12",target:"node-9",source:"node-12",style:{stroke:"red",strokeWidth:2}},{id:"edge-node-12-node-13",target:"node-12",source:"node-13",style:{stroke:"#b1b1b7",strokeWidth:1}},{source:"node-13",target:"node-11",id:"xy-edge__node-13-node-11",style:{stroke:"red",strokeWidth:2}}],W=x().Option,M={default:function(e){var t=e.data,n=e.selected,r=t.type,o="analyze"===r||"diagnosis"===r?(t.desc||"").split(";").filter((function(e){return(e||"").trim()})):[],a=o.length>0?t.throughLen||1:0;return i().createElement("div",{className:q()("custom-node",t.type,{"is-selected":n,"is-highlight":t.highlight})},i().createElement("div",{className:"custom-node-id"},"ITEM",t.id),i().createElement("div",{className:"custom-node-title"},t.title),a>0&&i().createElement("div",{className:"custom-node-throughLen"},a,"/",o.length),o.length>0?i().createElement("div",{className:"custom-node-options"},o.map((function(e,t){return i().createElement("div",{className:"custom-node-option",key:t},e,";")}))):i().createElement("div",{className:"custom-node-desc"},t.desc),"start"!==t.type&&i().createElement(w.Handle,{type:"source",position:w.Position.Left}),"end"!==t.type&&i().createElement(w.Handle,{type:"target",position:w.Position.Right}))}},S=[{id:"start",type:"default",position:{x:0,y:0},data:{id:"1",title:"开始",type:"start",desc:"应用范围：全部"},style:{padding:0}}],R=[],_=function(){var e=(0,w.useNodesState)(S),t=e[0],n=e[1],o=e[2],d=(0,w.useEdgesState)(R),s=d[0],c=d[1],p=d[2],g=(0,r.useState)(null),y=g[0],b=g[1],k=(0,r.useState)(null),C=k[0],q=k[1],_=(0,r.useState)(null),T=_[0],z=_[1],B=(0,r.useState)(null),O=B[0],j=B[1],P=(0,r.useState)(!1),D=P[0],F=P[1],U=i().createRef(),A=(0,r.useRef)(null),G=(0,r.useRef)(null),V=(0,r.useCallback)((function(e){return c((function(t){return(0,w.addEdge)(e,t)}))}),[c]),J=(0,r.useCallback)((function(e,t){b(t),n((function(e){return e.map((function(e){return E()({},e,{selected:e.id===t.id})}))})),c((function(e){return e.map((function(e){return E()({},e,{selected:!1})}))})),q(null)}),[t,s,n,c]),H=(0,r.useCallback)((function(e,t){q(t),c((function(e){return e.map((function(e){return E()({},e,{selected:e.id===t.id,style:E()({},e.style,{stroke:e.id===t.id?"#ff0072":void 0,strokeWidth:e.id===t.id?3:void 0})})}))})),n((function(e){return e.map((function(e){return E()({},e,{selected:!1})}))})),b(null)}),[n,c]),X=(0,r.useCallback)((function(e){if("Delete"===e.key||"Backspace"===e.key)if(y){var r=L(t,s,y.id),i=r.nodes,o=r.edges;n(i),c(o),b(null)}else if(C){var a=function(e,t){return e.filter((function(e){return e.id!==t}))}(s,C.id);c(a),q(null),v().success("连线已删除")}}),[t,s,y,C,n,c]);i().useEffect((function(){return window.addEventListener("keydown",X),function(){return window.removeEventListener("keydown",X)}}),[X]);var Y=(0,r.useCallback)((function(e,t){e.preventDefault(),z({x:e.clientX,y:e.clientY,nodeId:t.id,data:t.data})}),[]);return(0,r.useEffect)((function(){n(N),c(I)}),[]),i().createElement("div",{style:{width:"100%",height:"100vh",position:"relative"},ref:A},i().createElement(w.ReactFlow,{nodes:t,edges:s,onNodesChange:o,onEdgesChange:p,onConnect:V,onNodeClick:J,onEdgeClick:H,onNodeContextMenu:Y,onPaneClick:function(){z(null)},nodeTypes:M,fitView:!0,onInit:function(e){G.current=e},connectionMode:"loose",snapToGrid:!1,snapGrid:[15,15],connectionRadius:30},i().createElement(w.Background,null),i().createElement(w.Controls,null),i().createElement(w.MiniMap,null),i().createElement(w.Panel,{position:"top-left"},i().createElement(h(),{onClick:function(){var e=function(e,t){return JSON.stringify({nodes:e.map((function(e){return{id:e.id,type:e.type,position:e.position,data:e.data}})),edges:t},null,2)}(t,s);navigator.clipboard.writeText(e),alert("流程已复制到剪贴板")}},"导出流程"),i().createElement(h(),{onClick:function(){var e=prompt("粘贴导出的流程配置");if(e){var t=function(e){var t=JSON.parse(e);return{nodes:t.nodes,edges:t.edges}}(e),r=t.nodes,i=t.edges;n(r),c(i)}}},"导入流程"))),T&&i().createElement("div",{style:{top:T.y,left:T.x},className:"context-menu"},i().createElement(h(),{type:"primary",onClick:function(){F(!0),z(null)}},"添加节点"),i().createElement(h(),{type:"default",onClick:function(){if(null!=T&&T.nodeId){var e=t.find((function(e){return e.id===T.nodeId}));e&&j(e.data),z(null)}}},"编辑节点"),"start"!==T.data.type&&i().createElement(h(),{type:"default",onClick:function(){if(null!=T&&T.nodeId){var e=L(t,s,T.nodeId),r=e.nodes,i=e.edges;n(r),c(i),z(null)}}},"删除节点")),!!O&&i().createElement(m(),{title:"编辑节点",visible:!0,onCancel:function(){j(null)},onOk:function(){return function(e){e&&(n((function(t){return t.map((function(t){return t.data.id===e.id?E()({},t,{data:e}):t}))})),j(null))}(O)}},i().createElement(f(),{layout:"vertical",initialValues:O||{},onValuesChange:function(e,t){j(E()({},O,t))},ref:U},i().createElement(f().Item,{label:"标题",name:"title"},i().createElement(u(),null)),i().createElement(f().Item,{label:"描述",name:"desc"},i().createElement(u(),null)),i().createElement(f().Item,{label:"类型",name:"type"},i().createElement(x(),{disabled:"start"===(null==O?void 0:O.type)},i().createElement(W,{value:"start"},"开始"),i().createElement(W,{value:"end"},"结束"),i().createElement(W,{value:"diagnosis"},"诊断"),i().createElement(W,{value:"analyze"},"分析"),i().createElement(W,{value:"arrange"},"整理"),i().createElement(W,{value:"treatment"},"治疗"))),i().createElement(f().Item,{label:"条件满足个数",name:"throughLen"},i().createElement(l(),{min:1,step:1})),i().createElement(f().Item,{label:"高亮",name:"highlight"},i().createElement(a().Group,null,i().createElement(a(),{value:!0},"是"),i().createElement(a(),{value:!1},"否"))))),D&&i().createElement(m(),{title:"添加节点",visible:!0,onCancel:function(){return F(!1)},onOk:function(){return function(e,t){U.current.validateFields((function(r,i){var o,a,d;if(!r){var l=t?{x:t.position.x+((null==(o=t.measured)?void 0:o.width)||300)+50,y:t.position.y}:T&&G.current?G.current.project({x:T.x-((null==(a=A.current)?void 0:a.getBoundingClientRect().left)||0),y:T.y-((null==(d=A.current)?void 0:d.getBoundingClientRect().top)||0)}):{x:400*Math.random(),y:400*Math.random()},s="node-"+e,u={id:s,type:"default",position:l,data:E()({},i,{id:e}),selected:!0};n((function(e){return[].concat(e.map((function(e){return E()({},e,{selected:!1})})),[u])}));var f={id:"edge-"+t.id+"-"+s,target:t.id,source:s};c((function(e){return(0,w.addEdge)(f,e)})),F(!1),v().success("添加成功"),setTimeout((function(){var e;null==(e=G.current)||e.fitView({padding:.5,duration:500}),b(u)}),100)}}))}(t.length+1,y)}},i().createElement(f(),{layout:"vertical",initialValues:{type:"analyze",title:"主要条件-识别词",throughLen:1,desc:""},ref:U},i().createElement(f().Item,{label:"类型",name:"type"},i().createElement(x(),null,i().createElement(W,{value:"diagnosis"},"诊断"),i().createElement(W,{value:"analyze"},"分析"),i().createElement(W,{value:"arrange"},"处理"),i().createElement(W,{value:"treatment"},"治疗"),i().createElement(W,{value:"end"},"结束"))),i().createElement(f().Item,{label:"标题",name:"title"},i().createElement(u(),null)),i().createElement(f().Item,{label:"描述",name:"desc"},i().createElement(u(),{multiple:!0,placeholder:"请输入描述，多项请用;分号隔开"})),i().createElement(f().Item,{label:"条件满足个数",name:"throughLen"},i().createElement(l(),{min:1,step:1})))))},T=function(){return i().createElement(w.ReactFlowProvider,null,i().createElement(_,null))},z=function(e){function n(t){var n;return(n=e.call(this,t)||this).agreeDataFormat=n.agreeDataFormat.bind(n),n}t()(n,e);var i=n.prototype;return i.agreeDataFormat=function(e){return e&&e<=9999?e:e&&e>9999?Math.floor(e/1e3)/10+"w":""},i.render=function(){var e=this.props;return e.title,e.backgroundImage,e.img_count,e.comment_count,r.createElement(T,null)},n}(r.PureComponent);(0,require("amis-widget").registerRendererByType)(z,{type:"react-info-card",usage:"renderer",weight:99,framework:"react"})}(),{}}()}));

package/dist/reactInfoCard.umd.js.LICENSE.txt

@@ -0,0 +1,7 @@
+/*!
+ * react-ts-custom-widget-template v1.0.0
+ * author: fex
+ * build tool: AKFun
+ * build time: Wed Apr 16 2025 14:24:38 GMT+0800 (中国标准时间)
+ * build tool info: https://github.com/wibetter/akfun
+ */

package/dist/reactInfoCardPlugin.umd.js

@@ -0,0 +1,2 @@
+/*! For license information please see reactInfoCardPlugin.umd.js.LICENSE.txt */
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.amisWidget=t():e.amisWidget=t()}(this,(function(){return function(){"use strict";var e={d:function(t,n){for(var r in n)e.o(n,r)&&!e.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:n[r]})},o:function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r:function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{InfoCardPlugin:function(){return r},default:function(){return a}});var n=require("amis-widget"),r=function(){this.rendererName="react-info-card",this.$schema="/schemas/UnkownSchema.json",this.name="react-info-card",this.description="信息展示卡片",this.tags=["自定义"],this.icon="fa fa-file-code-o",this.scaffold={type:"react-info-card",label:"react-info-card",name:"react-info-card"},this.previewSchema={type:"react-info-card",label:"react-info-card"},this.panelTitle="配置",this.panelControls=[{type:"textarea",name:"title",label:"卡片title",value:"amis 是一个低代码前端框架，它使用 JSON 配置来生成页面，可以减少页面开发工作量，极大提升效率。"},{type:"text",name:"backgroundImage",label:"展示图片",value:"https://search-operate.cdn.bcebos.com/64c279f23794a831f9a8e7a4e0b722dd.jpg"},{type:"input-number",name:"img_count",label:"图片数量",value:3},{type:"input-number",name:"comment_count",label:"评论数",value:2021}]};(0,n.registerAmisEditorPlugin)(r,{rendererName:"react-info-card",name:"react-info-card",order:99});var a=r;return t}()}));

package/dist/reactInfoCardPlugin.umd.js.LICENSE.txt

@@ -0,0 +1,7 @@
+/*!
+ * react-ts-custom-widget-template v1.0.0
+ * author: fex
+ * build tool: AKFun
+ * build time: Wed Apr 16 2025 14:24:38 GMT+0800 (中国标准时间)
+ * build tool info: https://github.com/wibetter/akfun
+ */

package/package.json

@@ -0,0 +1,87 @@
+{
+  "name": "react-ts-custom-widget-flow-editor",
+  "version": "1.0.0",
+  "description": "amis自定义组件模板（react&ts技术栈）",
+  "keywords": [
+    "自定义组件模板",
+    "react&ts技术栈",
+    "amis自定义组件",
+    "amis-editor自定义插件"
+  ],
+  "author": "fex",
+  "license": "MIT",
+  "scripts": {
+    "dev": "amis dev",
+    "preview": "amis preview",
+    "linkDebug": "amis linkDebug",
+    "build2lib": "amis build2lib",
+    "format": "prettier --write \"src/**/**/*.{js,jsx,ts,tsx,vue,scss,json}\""
+  },
+  "files": [
+    "dist/*"
+  ],
+  "framework": "react",
+  "amis-widgets": [
+    {
+      "name": "react-info-card",
+      "framework": "react",
+      "usage": "renderer",
+      "type": "react-info-card",
+      "entry": "/dist/reactInfoCard.umd",
+      "files": [
+        "/dist/reactInfoCard.css"
+      ],
+      "editorPlugin": {
+        "name": "react-info-card-plugin",
+        "description": "信息展示卡片",
+        "pluginEntry": "/dist/reactInfoCardPlugin.umd",
+        "tag": [
+          "展示"
+        ],
+        "sort": 100
+      }
+    }
+  ],
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged",
+      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
+    }
+  },
+  "lint-staged": {
+    "src/**/**/*.{js,jsx,ts,tsx,vue,scss,json}": [
+      "prettier --write"
+    ]
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://git@github.com:aisuda/react-ts-custom-widget-template.git"
+  },
+  "bugs": {
+    "url": "https://github.com/aisuda/react-ts-custom-widget-template/issues"
+  },
+  "dependencies": {
+    "@xyflow/react": "^12.5.5",
+    "amis-widget": "^3.2.0",
+    "antd": "^3.26.20",
+    "classnames": "^2.5.1",
+    "react": "^16.14.0",
+    "react-dom": "^16.14.0",
+    "reactflow": "^11.11.4",
+    "sass": "^1.86.3"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^8.3.5",
+    "@commitlint/config-conventional": "^9.1.1",
+    "@types/react": "^16.9.11",
+    "@types/react-dom": "^16.9.25",
+    "amis-widget-cli": "^3.1.11",
+    "husky": "^4.2.5",
+    "lint-staged": "^10.2.9",
+    "prettier": "^2.0.5"
+  },
+  "engines": {
+    "node": ">= 10.13.0",
+    "npm": ">= 6.4.1"
+  }
+}