@vef-framework/components 1.0.133 → 1.0.134

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (99) hide show
  1. package/cjs/index.cjs +1 -1
  2. package/cjs/vef-layout/components/user-avatar.cjs +1 -1
  3. package/esm/index.js +1 -1
  4. package/esm/vef-layout/components/user-avatar.js +1 -1
  5. package/package.json +4 -6
  6. package/types/index.d.ts +0 -2
  7. package/types/vef-layout/props.d.ts +8 -0
  8. package/cjs/internal/base.css.cjs +0 -495
  9. package/cjs/vef-approval-flow-editor/components/edge.cjs +0 -7
  10. package/cjs/vef-approval-flow-editor/components/label-value.cjs +0 -18
  11. package/cjs/vef-approval-flow-editor/components/node-content.cjs +0 -17
  12. package/cjs/vef-approval-flow-editor/components/node-selector.cjs +0 -13
  13. package/cjs/vef-approval-flow-editor/components/node-toolbar.cjs +0 -2
  14. package/cjs/vef-approval-flow-editor/components/nodes/approval.cjs +0 -2
  15. package/cjs/vef-approval-flow-editor/components/nodes/condition.cjs +0 -2
  16. package/cjs/vef-approval-flow-editor/components/nodes/end.cjs +0 -2
  17. package/cjs/vef-approval-flow-editor/components/nodes/handle.cjs +0 -2
  18. package/cjs/vef-approval-flow-editor/components/nodes/index.cjs +0 -2
  19. package/cjs/vef-approval-flow-editor/components/nodes/submit.cjs +0 -2
  20. package/cjs/vef-approval-flow-editor/components/selector-content.cjs +0 -25
  21. package/cjs/vef-approval-flow-editor/components/source-handle.cjs +0 -2
  22. package/cjs/vef-approval-flow-editor/components/target-handle.cjs +0 -2
  23. package/cjs/vef-approval-flow-editor/constants.cjs +0 -2
  24. package/cjs/vef-approval-flow-editor/helper.cjs +0 -2
  25. package/cjs/vef-approval-flow-editor/hooks/use-edges-interaction.cjs +0 -2
  26. package/cjs/vef-approval-flow-editor/hooks/use-element-selection.cjs +0 -2
  27. package/cjs/vef-approval-flow-editor/hooks/use-nodes-interaction.cjs +0 -2
  28. package/cjs/vef-approval-flow-editor/index.cjs +0 -2
  29. package/cjs/vef-approval-flow-editor/models/edge-node.cjs +0 -2
  30. package/cjs/vef-approval-flow-editor/models/flow-node.cjs +0 -2
  31. package/cjs/vef-approval-flow-editor/props.cjs +0 -2
  32. package/cjs/vef-approval-flow-editor/store.cjs +0 -2
  33. package/cjs/vef-approval-flow-editor/styles.cjs +0 -42
  34. package/cjs/vef-approval-flow-editor/types.cjs +0 -2
  35. package/cjs/vef-data-grid/index.cjs +0 -2
  36. package/cjs/vef-data-grid/props.cjs +0 -2
  37. package/cjs/vef-data-table/index.cjs +0 -2
  38. package/cjs/vef-data-table/props.cjs +0 -2
  39. package/esm/internal/base.css.js +0 -495
  40. package/esm/vef-approval-flow-editor/components/edge.js +0 -7
  41. package/esm/vef-approval-flow-editor/components/label-value.js +0 -18
  42. package/esm/vef-approval-flow-editor/components/node-content.js +0 -17
  43. package/esm/vef-approval-flow-editor/components/node-selector.js +0 -13
  44. package/esm/vef-approval-flow-editor/components/node-toolbar.js +0 -2
  45. package/esm/vef-approval-flow-editor/components/nodes/approval.js +0 -2
  46. package/esm/vef-approval-flow-editor/components/nodes/condition.js +0 -2
  47. package/esm/vef-approval-flow-editor/components/nodes/end.js +0 -2
  48. package/esm/vef-approval-flow-editor/components/nodes/handle.js +0 -2
  49. package/esm/vef-approval-flow-editor/components/nodes/index.js +0 -2
  50. package/esm/vef-approval-flow-editor/components/nodes/submit.js +0 -2
  51. package/esm/vef-approval-flow-editor/components/selector-content.js +0 -25
  52. package/esm/vef-approval-flow-editor/components/source-handle.js +0 -2
  53. package/esm/vef-approval-flow-editor/components/target-handle.js +0 -2
  54. package/esm/vef-approval-flow-editor/constants.js +0 -2
  55. package/esm/vef-approval-flow-editor/helper.js +0 -2
  56. package/esm/vef-approval-flow-editor/hooks/use-edges-interaction.js +0 -2
  57. package/esm/vef-approval-flow-editor/hooks/use-element-selection.js +0 -2
  58. package/esm/vef-approval-flow-editor/hooks/use-nodes-interaction.js +0 -2
  59. package/esm/vef-approval-flow-editor/index.js +0 -2
  60. package/esm/vef-approval-flow-editor/models/edge-node.js +0 -2
  61. package/esm/vef-approval-flow-editor/models/flow-node.js +0 -2
  62. package/esm/vef-approval-flow-editor/props.js +0 -2
  63. package/esm/vef-approval-flow-editor/store.js +0 -2
  64. package/esm/vef-approval-flow-editor/styles.js +0 -42
  65. package/esm/vef-approval-flow-editor/types.js +0 -2
  66. package/esm/vef-data-grid/index.js +0 -2
  67. package/esm/vef-data-grid/props.js +0 -2
  68. package/esm/vef-data-table/index.js +0 -2
  69. package/esm/vef-data-table/props.js +0 -2
  70. package/types/vef-approval-flow-editor/components/edge.d.ts +0 -4
  71. package/types/vef-approval-flow-editor/components/label-value.d.ts +0 -10
  72. package/types/vef-approval-flow-editor/components/node-content.d.ts +0 -9
  73. package/types/vef-approval-flow-editor/components/node-selector.d.ts +0 -12
  74. package/types/vef-approval-flow-editor/components/node-toolbar.d.ts +0 -8
  75. package/types/vef-approval-flow-editor/components/nodes/approval.d.ts +0 -3
  76. package/types/vef-approval-flow-editor/components/nodes/condition.d.ts +0 -3
  77. package/types/vef-approval-flow-editor/components/nodes/end.d.ts +0 -3
  78. package/types/vef-approval-flow-editor/components/nodes/handle.d.ts +0 -3
  79. package/types/vef-approval-flow-editor/components/nodes/index.d.ts +0 -15
  80. package/types/vef-approval-flow-editor/components/nodes/submit.d.ts +0 -3
  81. package/types/vef-approval-flow-editor/components/selector-content.d.ts +0 -16
  82. package/types/vef-approval-flow-editor/components/source-handle.d.ts +0 -2
  83. package/types/vef-approval-flow-editor/components/target-handle.d.ts +0 -2
  84. package/types/vef-approval-flow-editor/constants.d.ts +0 -15
  85. package/types/vef-approval-flow-editor/helper.d.ts +0 -31
  86. package/types/vef-approval-flow-editor/hooks/use-edges-interaction.d.ts +0 -11
  87. package/types/vef-approval-flow-editor/hooks/use-element-selection.d.ts +0 -9
  88. package/types/vef-approval-flow-editor/hooks/use-nodes-interaction.d.ts +0 -5
  89. package/types/vef-approval-flow-editor/index.d.ts +0 -5
  90. package/types/vef-approval-flow-editor/models/edge-node.d.ts +0 -32
  91. package/types/vef-approval-flow-editor/models/flow-node.d.ts +0 -106
  92. package/types/vef-approval-flow-editor/props.d.ts +0 -5
  93. package/types/vef-approval-flow-editor/store.d.ts +0 -25
  94. package/types/vef-approval-flow-editor/styles.d.ts +0 -2
  95. package/types/vef-approval-flow-editor/types.d.ts +0 -73
  96. package/types/vef-data-grid/index.d.ts +0 -4
  97. package/types/vef-data-grid/props.d.ts +0 -5
  98. package/types/vef-data-table/index.d.ts +0 -4
  99. package/types/vef-data-table/props.d.ts +0 -5
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";var e=require("../types.cjs"),d=Object.defineProperty,p=(l,o,a)=>o in l?d(l,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):l[o]=a,s=(l,o,a)=>p(l,typeof o!="symbol"?o+"":o,a);class t{constructor(o,a,i){s(this,"id"),s(this,"type"),s(this,"label"),this.id=o,this.type=a,this.label=i}getId(){return this.id}getType(){return this.type}getLabel(){return this.label}setLabel(o){this.label=o}}class N extends t{constructor(o,a){super(o,e.NodeType.Submit,a),s(this,"_availablePreviousNodeTypes"),s(this,"_availableNextNodeTypes"),this._availablePreviousNodeTypes=[],this._availableNextNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition]}getAvailablePreviousNodeTypes(){return this._availablePreviousNodeTypes}getAvailableNextNodeTypes(){return this._availableNextNodeTypes}}class r extends t{constructor(o,a){super(o,e.NodeType.Approval,a),s(this,"_availablePreviousNodeTypes"),s(this,"_availableNextNodeTypes"),this._availablePreviousNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition],this._availableNextNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition]}getAvailablePreviousNodeTypes(){return this._availablePreviousNodeTypes}getAvailableNextNodeTypes(){return this._availableNextNodeTypes}}class y extends t{constructor(o,a){super(o,e.NodeType.Handle,a),s(this,"_availablePreviousNodeTypes"),s(this,"_availableNextNodeTypes"),this._availablePreviousNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition],this._availableNextNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition]}getAvailablePreviousNodeTypes(){return this._availablePreviousNodeTypes}getAvailableNextNodeTypes(){return this._availableNextNodeTypes}}class v extends t{constructor(o,a){super(o,e.NodeType.Condition,a),s(this,"_availablePreviousNodeTypes"),s(this,"_availableNextNodeTypes"),this._availablePreviousNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition],this._availableNextNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition]}getAvailablePreviousNodeTypes(){return this._availablePreviousNodeTypes}getAvailableNextNodeTypes(){return this._availableNextNodeTypes}}class T extends t{constructor(o,a){super(o,e.NodeType.End,a),s(this,"_availablePreviousNodeTypes"),s(this,"_availableNextNodeTypes"),this._availablePreviousNodeTypes=[e.NodeType.Approval,e.NodeType.Handle,e.NodeType.Condition],this._availableNextNodeTypes=[]}getAvailablePreviousNodeTypes(){return this._availablePreviousNodeTypes}getAvailableNextNodeTypes(){return this._availableNextNodeTypes}}exports.AbstractFlowNode=t,exports.VefApprovalFlowNode=r,exports.VefConditionFlowNode=v,exports.VefEndFlowNode=T,exports.VefHandleFlowNode=y,exports.VefSubmitFlowNode=N;
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";var r=require("@vef-framework/shared");const{StoreProvider:t,useStore:d,useStoreApi:l}=r.createComponentStore("ApprovalFlowEditor",()=>e=>({selectedNode:null,setSelectedNode:o=>e({selectedNode:o})}));exports.ApprovalFlowEditorStoreProvider=t,exports.useApprovalFlowEditorStore=d,exports.useApprovalFlowEditorStoreApi=l;
@@ -1,42 +0,0 @@
1
- "use strict";
2
- "use strict";var r=require("@emotion/react"),e=require("@vef-framework/shared"),o=require("../internal/base.css.cjs");const t=r.css`
3
- height: 80%;
4
-
5
- ${o.default}
6
- `,a=r.css`
7
- --xy-edge-stroke-width: 2px;
8
- --xy-edge-stroke: rgb(177, 177, 183);
9
- --xy-edge-stroke-selected: rgb(177, 177, 183);
10
-
11
- .react-flow__attribution {
12
- display: none;
13
- }
14
- .react-flow__nodesselection-rect,
15
- .react-flow__selection {
16
- background-color: oklch(from ${e.themeVariables.colorPrimary} l c h / 0.06);
17
- border: ${e.themeVariables.lineWidth} ${e.themeVariables.lineType} ${e.themeVariables.colorPrimary};
18
- border-radius: ${e.themeVariables.borderRadius};
19
- }
20
-
21
- .react-flow__node {
22
- width: 240px;
23
- border-radius: ${e.themeVariables.borderRadiusLg};
24
- padding: ${e.themeVariables.paddingSm};
25
- background-color: ${e.themeVariables.colorBgContainer};
26
-
27
- &:hover:not(.selected) {
28
- box-shadow: ${e.themeVariables.boxShadowElevated};
29
- }
30
-
31
- &.selected {
32
- outline: 2px ${e.themeVariables.lineType} ${e.themeVariables.colorPrimary};
33
- outline-offset: -2px;
34
- }
35
- }
36
-
37
- .react-flow__handle {
38
- min-width: 12px;
39
- min-height: 12px;
40
- background-color: transparent;
41
- }
42
- `;exports.flowEditorContainerStyle=t,exports.flowEditorStyle=a;
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";var e=(d=>(d.Submit="submit",d.Approval="approval",d.Handle="handle",d.Condition="condition",d.End="end",d))(e||{}),i=(d=>(d.Vef="vef",d))(i||{});exports.EdgeType=i,exports.NodeType=e;
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var r=require("@emotion/react/jsx-runtime"),i=require("@handsontable/react-wrapper"),n=require("handsontable/i18n"),s=require("handsontable/registry"),u=require("react");s.registerAllModules(),n.registerLanguageDictionary(n.zhCN);const g=Array.from({length:1e3}).map((a,e)=>({name:`Name${e+1}`,gender:e%2===0?"Male":"Female",age:Math.floor(Math.random()*100)+18,id:e+1,desc:`Description may be very long, very long, very long, very long, very long, very long, very long, very long, very long, very long${e+1}`})),d=[{data:"id",title:"ID",fixedColumnsStart:1},{data:"name",title:"Name"},{data:"gender",title:"Gender"},{data:"age",title:"Age"},{data:"desc",title:"Description",width:200}];function c(a){console.log("file: index.tsx:49 ~ props:",a);const e=u.useRef(null);return r.jsx("div",{style:{width:"100%",maxHeight:"500px"},children:r.jsx(i.HotTable,{ref:e,autoColumnSize:!0,autoRowSize:!0,colHeaders:!0,disableVisualSelection:!0,manualColumnMove:!0,manualColumnResize:!0,multiColumnSorting:!0,readOnly:!0,rowHeaders:!0,columns:d,data:g,language:n.zhCN.languageCode,licenseKey:"non-commercial-and-evaluation",locale:n.zhCN.languageCode,themeName:"ht-theme-main",beforeColumnSort:(m,t)=>{if(console.log("file: index.tsx:68 ~ sortConfigs:",t),t.length>0){const l=e.current?.hotInstance?.getColHeader(t[0].column);console.log("file: index.tsx:77 ~ header:",l);const o=e.current?.hotInstance?.getColumnMeta(t[0].column);console.log("file: index.tsx:79 ~ meta:",o)}}})})}exports.default=c;
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@emotion/react/jsx-runtime");function r(e){return console.log("file: index.tsx:3 ~ props:",e),t.jsx("div",{children:"data table"})}exports.default=r;
@@ -1,2 +0,0 @@
1
- "use strict";
2
- "use strict";
@@ -1,495 +0,0 @@
1
- var n=`/* this will be exported as base.css and can be used for a basic styling */
2
- /* these are the necessary styles for React/Svelte Flow, they get used by base.css and style.css */
3
- .react-flow {
4
- direction: ltr;
5
-
6
- --xy-edge-stroke-default: #b1b1b7;
7
- --xy-edge-stroke-width-default: 1;
8
- --xy-edge-stroke-selected-default: #555;
9
-
10
- --xy-connectionline-stroke-default: #b1b1b7;
11
- --xy-connectionline-stroke-width-default: 1;
12
-
13
- --xy-attribution-background-color-default: rgba(255, 255, 255, 0.5);
14
-
15
- --xy-minimap-background-color-default: #fff;
16
- --xy-minimap-mask-background-color-default: rgba(240, 240, 240, 0.6);
17
- --xy-minimap-mask-stroke-color-default: transparent;
18
- --xy-minimap-mask-stroke-width-default: 1;
19
- --xy-minimap-node-background-color-default: #e2e2e2;
20
- --xy-minimap-node-stroke-color-default: transparent;
21
- --xy-minimap-node-stroke-width-default: 2;
22
-
23
- --xy-background-color-default: transparent;
24
- --xy-background-pattern-dots-color-default: #91919a;
25
- --xy-background-pattern-lines-color-default: #eee;
26
- --xy-background-pattern-cross-color-default: #e2e2e2;
27
- background-color: var(--xy-background-color, var(--xy-background-color-default));
28
- --xy-node-border-default: 1px solid #bbb;
29
- --xy-node-border-selected-default: 1px solid #555;
30
-
31
- --xy-handle-background-color-default: #333;
32
-
33
- --xy-selection-background-color-default: rgba(150, 150, 180, 0.1);
34
- --xy-selection-border-default: 1px dotted rgba(155, 155, 155, 0.8);
35
- --xy-resize-background-color-default: #3367d9;
36
- }
37
- .react-flow.dark {
38
- --xy-edge-stroke-default: #3e3e3e;
39
- --xy-edge-stroke-width-default: 1;
40
- --xy-edge-stroke-selected-default: #727272;
41
-
42
- --xy-connectionline-stroke-default: #b1b1b7;
43
- --xy-connectionline-stroke-width-default: 1;
44
-
45
- --xy-attribution-background-color-default: rgba(150, 150, 150, 0.25);
46
-
47
- --xy-minimap-background-color-default: #141414;
48
- --xy-minimap-mask-background-color-default: rgba(60, 60, 60, 0.6);
49
- --xy-minimap-mask-stroke-color-default: transparent;
50
- --xy-minimap-mask-stroke-width-default: 1;
51
- --xy-minimap-node-background-color-default: #2b2b2b;
52
- --xy-minimap-node-stroke-color-default: transparent;
53
- --xy-minimap-node-stroke-width-default: 2;
54
-
55
- --xy-background-color-default: #141414;
56
- --xy-background-pattern-dots-color-default: #777;
57
- --xy-background-pattern-lines-color-default: #777;
58
- --xy-background-pattern-cross-color-default: #777;
59
- --xy-node-color-default: #f8f8f8;
60
- }
61
- .react-flow__background {
62
- background-color: var(--xy-background-color, var(--xy-background-color-props, var(--xy-background-color-default)));
63
- pointer-events: none;
64
- z-index: -1;
65
- }
66
- .react-flow__container {
67
- position: absolute;
68
- width: 100%;
69
- height: 100%;
70
- top: 0;
71
- left: 0;
72
- }
73
- .react-flow__pane {
74
- z-index: 1;
75
- }
76
- .react-flow__pane.draggable {
77
- cursor: grab;
78
- }
79
- .react-flow__pane.dragging {
80
- cursor: grabbing;
81
- }
82
- .react-flow__pane.selection {
83
- cursor: pointer;
84
- }
85
- .react-flow__viewport {
86
- transform-origin: 0 0;
87
- z-index: 2;
88
- pointer-events: none;
89
- }
90
- .react-flow__renderer {
91
- z-index: 4;
92
- }
93
- .react-flow__selection {
94
- z-index: 6;
95
- }
96
- .react-flow__nodesselection-rect:focus,
97
- .react-flow__nodesselection-rect:focus-visible {
98
- outline: none;
99
- }
100
- .react-flow__edge-path {
101
- stroke: var(--xy-edge-stroke, var(--xy-edge-stroke-default));
102
- stroke-width: var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));
103
- fill: none;
104
- }
105
- .react-flow__connection-path {
106
- stroke: var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));
107
- stroke-width: var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));
108
- fill: none;
109
- }
110
- .react-flow .react-flow__edges {
111
- position: absolute;
112
- }
113
- .react-flow .react-flow__edges svg {
114
- overflow: visible;
115
- position: absolute;
116
- pointer-events: none;
117
- }
118
- .react-flow__edge {
119
- pointer-events: visibleStroke;
120
- }
121
- .react-flow__edge.selectable {
122
- cursor: pointer;
123
- }
124
- .react-flow__edge.animated path {
125
- stroke-dasharray: 5;
126
- animation: dashdraw 0.5s linear infinite;
127
- }
128
- .react-flow__edge.animated path.react-flow__edge-interaction {
129
- stroke-dasharray: none;
130
- animation: none;
131
- }
132
- .react-flow__edge.inactive {
133
- pointer-events: none;
134
- }
135
- .react-flow__edge.selected,
136
- .react-flow__edge:focus,
137
- .react-flow__edge:focus-visible {
138
- outline: none;
139
- }
140
- .react-flow__edge.selected .react-flow__edge-path,
141
- .react-flow__edge.selectable:focus .react-flow__edge-path,
142
- .react-flow__edge.selectable:focus-visible .react-flow__edge-path {
143
- stroke: var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default));
144
- }
145
- .react-flow__edge-textwrapper {
146
- pointer-events: all;
147
- }
148
- .react-flow__edge .react-flow__edge-text {
149
- pointer-events: none;
150
- -webkit-user-select: none;
151
- -moz-user-select: none;
152
- user-select: none;
153
- }
154
- .react-flow__connection {
155
- pointer-events: none;
156
- }
157
- .react-flow__connection .animated {
158
- stroke-dasharray: 5;
159
- animation: dashdraw 0.5s linear infinite;
160
- }
161
- svg.react-flow__connectionline {
162
- z-index: 1001;
163
- overflow: visible;
164
- position: absolute;
165
- }
166
- .react-flow__nodes {
167
- pointer-events: none;
168
- transform-origin: 0 0;
169
- }
170
- .react-flow__node {
171
- position: absolute;
172
- -webkit-user-select: none;
173
- -moz-user-select: none;
174
- user-select: none;
175
- pointer-events: all;
176
- transform-origin: 0 0;
177
- box-sizing: border-box;
178
- cursor: default;
179
- }
180
- .react-flow__node.selectable {
181
- cursor: pointer;
182
- }
183
- .react-flow__node.draggable {
184
- cursor: grab;
185
- pointer-events: all;
186
- }
187
- .react-flow__node.draggable.dragging {
188
- cursor: grabbing;
189
- }
190
- .react-flow__nodesselection {
191
- z-index: 3;
192
- transform-origin: left top;
193
- pointer-events: none;
194
- }
195
- .react-flow__nodesselection-rect {
196
- position: absolute;
197
- pointer-events: all;
198
- cursor: grab;
199
- }
200
- .react-flow__handle {
201
- position: absolute;
202
- pointer-events: none;
203
- min-width: 5px;
204
- min-height: 5px;
205
- background-color: var(--xy-handle-background-color, var(--xy-handle-background-color-default));
206
- }
207
- .react-flow__handle.connectingfrom {
208
- pointer-events: all;
209
- }
210
- .react-flow__handle.connectionindicator {
211
- pointer-events: all;
212
- cursor: crosshair;
213
- }
214
- .react-flow__handle-bottom {
215
- top: auto;
216
- left: 50%;
217
- bottom: 0;
218
- transform: translate(-50%, 50%);
219
- }
220
- .react-flow__handle-top {
221
- top: 0;
222
- left: 50%;
223
- transform: translate(-50%, -50%);
224
- }
225
- .react-flow__handle-left {
226
- top: 50%;
227
- left: 0;
228
- transform: translate(-50%, -50%);
229
- }
230
- .react-flow__handle-right {
231
- top: 50%;
232
- right: 0;
233
- transform: translate(50%, -50%);
234
- }
235
- .react-flow__edgeupdater {
236
- cursor: move;
237
- pointer-events: all;
238
- }
239
- .react-flow__panel {
240
- position: absolute;
241
- z-index: 5;
242
- margin: 15px;
243
- }
244
- .react-flow__panel.top {
245
- top: 0;
246
- }
247
- .react-flow__panel.bottom {
248
- bottom: 0;
249
- }
250
- .react-flow__panel.top.center, .react-flow__panel.bottom.center {
251
- left: 50%;
252
- transform: translateX(-50%);
253
- }
254
- .react-flow__panel.left {
255
- left: 0;
256
- }
257
- .react-flow__panel.right {
258
- right: 0;
259
- }
260
- .react-flow__panel.left.center, .react-flow__panel.right.center {
261
- top: 50%;
262
- transform: translateY(-50%);
263
- }
264
- .react-flow__attribution {
265
- font-size: 10px;
266
- background: var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));
267
- padding: 2px 3px;
268
- margin: 0;
269
- }
270
- .react-flow__attribution a {
271
- text-decoration: none;
272
- color: #999;
273
- }
274
- @keyframes dashdraw {
275
- from {
276
- stroke-dashoffset: 10;
277
- }
278
- }
279
- .react-flow__edgelabel-renderer {
280
- position: absolute;
281
- width: 100%;
282
- height: 100%;
283
- pointer-events: none;
284
- -webkit-user-select: none;
285
- -moz-user-select: none;
286
- user-select: none;
287
- left: 0;
288
- top: 0;
289
- }
290
- .react-flow__viewport-portal {
291
- position: absolute;
292
- width: 100%;
293
- height: 100%;
294
- left: 0;
295
- top: 0;
296
- -webkit-user-select: none;
297
- -moz-user-select: none;
298
- user-select: none;
299
- }
300
- .react-flow__minimap {
301
- background: var(
302
- --xy-minimap-background-color-props,
303
- var(--xy-minimap-background-color, var(--xy-minimap-background-color-default))
304
- );
305
- }
306
- .react-flow__minimap-svg {
307
- display: block;
308
- }
309
- .react-flow__minimap-mask {
310
- fill: var(
311
- --xy-minimap-mask-background-color-props,
312
- var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default))
313
- );
314
- stroke: var(
315
- --xy-minimap-mask-stroke-color-props,
316
- var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default))
317
- );
318
- stroke-width: var(
319
- --xy-minimap-mask-stroke-width-props,
320
- var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default))
321
- );
322
- }
323
- .react-flow__minimap-node {
324
- fill: var(
325
- --xy-minimap-node-background-color-props,
326
- var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default))
327
- );
328
- stroke: var(
329
- --xy-minimap-node-stroke-color-props,
330
- var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default))
331
- );
332
- stroke-width: var(
333
- --xy-minimap-node-stroke-width-props,
334
- var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default))
335
- );
336
- }
337
- .react-flow__background-pattern.dots {
338
- fill: var(
339
- --xy-background-pattern-color-props,
340
- var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default))
341
- );
342
- }
343
- .react-flow__background-pattern.lines {
344
- stroke: var(
345
- --xy-background-pattern-color-props,
346
- var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default))
347
- );
348
- }
349
- .react-flow__background-pattern.cross {
350
- stroke: var(
351
- --xy-background-pattern-color-props,
352
- var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default))
353
- );
354
- }
355
- .react-flow__controls {
356
- display: flex;
357
- flex-direction: column;
358
- }
359
- .react-flow__controls.horizontal {
360
- flex-direction: row;
361
- }
362
- .react-flow__controls-button {
363
- display: flex;
364
- justify-content: center;
365
- align-items: center;
366
- height: 26px;
367
- width: 26px;
368
- padding: 4px;
369
- }
370
- .react-flow__controls-button svg {
371
- width: 100%;
372
- max-width: 12px;
373
- max-height: 12px;
374
- fill: currentColor;
375
- }
376
- .react-flow__node-input,
377
- .react-flow__node-default,
378
- .react-flow__node-output,
379
- .react-flow__node-group {
380
- border: var(--xy-node-border, var(--xy-node-border-default));
381
- color: var(--xy-node-color, var(--xy-node-color-default));
382
- }
383
- .react-flow__node-input.selected,
384
- .react-flow__node-input:focus,
385
- .react-flow__node-input:focus-visible,
386
- .react-flow__node-default.selected,
387
- .react-flow__node-default:focus,
388
- .react-flow__node-default:focus-visible,
389
- .react-flow__node-output.selected,
390
- .react-flow__node-output:focus,
391
- .react-flow__node-output:focus-visible,
392
- .react-flow__node-group.selected,
393
- .react-flow__node-group:focus,
394
- .react-flow__node-group:focus-visible {
395
- outline: none;
396
- border: var(--xy-node-border-selected, var(--xy-node-border-selected-default));
397
- }
398
- .react-flow__nodesselection-rect,
399
- .react-flow__selection {
400
- background: var(--xy-selection-background-color, var(--xy-selection-background-color-default));
401
- border: var(--xy-selection-border, var(--xy-selection-border-default));
402
- }
403
- .react-flow__resize-control {
404
- position: absolute;
405
- }
406
- .react-flow__resize-control.left,
407
- .react-flow__resize-control.right {
408
- cursor: ew-resize;
409
- }
410
- .react-flow__resize-control.top,
411
- .react-flow__resize-control.bottom {
412
- cursor: ns-resize;
413
- }
414
- .react-flow__resize-control.top.left,
415
- .react-flow__resize-control.bottom.right {
416
- cursor: nwse-resize;
417
- }
418
- .react-flow__resize-control.bottom.left,
419
- .react-flow__resize-control.top.right {
420
- cursor: nesw-resize;
421
- }
422
- /* handle styles */
423
- .react-flow__resize-control.handle {
424
- width: 4px;
425
- height: 4px;
426
- border: 1px solid #fff;
427
- border-radius: 1px;
428
- background-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));
429
- transform: translate(-50%, -50%);
430
- }
431
- .react-flow__resize-control.handle.left {
432
- left: 0;
433
- top: 50%;
434
- }
435
- .react-flow__resize-control.handle.right {
436
- left: 100%;
437
- top: 50%;
438
- }
439
- .react-flow__resize-control.handle.top {
440
- left: 50%;
441
- top: 0;
442
- }
443
- .react-flow__resize-control.handle.bottom {
444
- left: 50%;
445
- top: 100%;
446
- }
447
- .react-flow__resize-control.handle.top.left {
448
- left: 0;
449
- }
450
- .react-flow__resize-control.handle.bottom.left {
451
- left: 0;
452
- }
453
- .react-flow__resize-control.handle.top.right {
454
- left: 100%;
455
- }
456
- .react-flow__resize-control.handle.bottom.right {
457
- left: 100%;
458
- }
459
- /* line styles */
460
- .react-flow__resize-control.line {
461
- border-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));
462
- border-width: 0;
463
- border-style: solid;
464
- }
465
- .react-flow__resize-control.line.left,
466
- .react-flow__resize-control.line.right {
467
- width: 1px;
468
- transform: translate(-50%, 0);
469
- top: 0;
470
- height: 100%;
471
- }
472
- .react-flow__resize-control.line.left {
473
- left: 0;
474
- border-left-width: 1px;
475
- }
476
- .react-flow__resize-control.line.right {
477
- left: 100%;
478
- border-right-width: 1px;
479
- }
480
- .react-flow__resize-control.line.top,
481
- .react-flow__resize-control.line.bottom {
482
- height: 1px;
483
- transform: translate(0, -50%);
484
- left: 0;
485
- width: 100%;
486
- }
487
- .react-flow__resize-control.line.top {
488
- top: 0;
489
- border-top-width: 1px;
490
- }
491
- .react-flow__resize-control.line.bottom {
492
- border-bottom-width: 1px;
493
- top: 100%;
494
- }
495
- `;export{n as default};
@@ -1,7 +0,0 @@
1
- "use strict";
2
- import{jsxs as F,Fragment as S,jsx as e}from"@emotion/react/jsx-runtime";import{css as T}from"@emotion/react";import{useReactFlow as W,getBezierPath as j,BaseEdge as z,EdgeLabelRenderer as B}from"@xyflow/react";import{useCallback as C}from"react";import{createNode as R,createEdge as n}from"../helper.js";import $ from"./node-selector.js";const H=T`
3
- position: absolute;
4
- pointer-events: all;
5
- transform-origin: center;
6
- transform: translate(-50%, -50%) translate(var(--vef-edge-label-x), var(--vef-edge-label-y));
7
- `;function L({id:t,data:d,source:r,target:o,sourceX:l,sourceY:c,targetX:g,targetY:m,sourcePosition:u,targetPosition:f,markerEnd:p,markerStart:v,interactionWidth:h,style:b,selected:x}){const{getNode:i}=W(),P=C(a=>{const s=R(a);return[s,[n(r,s.id),n(s.id,o)],[t]]},[t,r,o]),[y,N,k]=j({sourceX:l,sourceY:c,targetX:g,targetY:m,sourcePosition:u,targetPosition:f,curvature:.16}),E=d?.edge.isHovering()??!1,A=i(r).data.node,X=i(o).data.node,Y=new Set(X.getAvailablePreviousNodeTypes()),w=A.getAvailableNextNodeTypes().filter(a=>Y.has(a));return F(S,{children:[e(z,{id:t,interactionWidth:h,markerEnd:p,markerStart:v,path:y,style:b}),(E||x)&&e(B,{children:e("div",{className:"nodrag nopan",css:H,style:{"--vef-edge-label-x":`${N}px`,"--vef-edge-label-y":`${k}px`},children:e($,{items:w,selectorContentPosition:"right",onAddNode:P})})})]})}export{L as default};
@@ -1,18 +0,0 @@
1
- "use strict";
2
- import{jsxs as i,jsx as o}from"@emotion/react/jsx-runtime";import{css as t}from"@emotion/react";import{themeVariables as r}from"@vef-framework/shared";import{ChevronRightIcon as a}from"lucide-react";import s from"../../vef-icon/index.js";const d=t`
3
- display: grid;
4
- grid-template-columns: max-content 1fr max-content;
5
- align-items: center;
6
- column-gap: ${r.marginXs};
7
- background-color: ${r.colorFillTertiary};
8
- padding: ${r.paddingXxs} ${r.paddingXxs} ${r.paddingXxs} ${r.paddingXs};
9
- border-radius: ${r.borderRadius};
10
-
11
- & > span:first-of-type {
12
- color: ${r.colorTextSecondary};
13
- }
14
-
15
- & > span:last-of-type {
16
- color: ${r.colorText};
17
- }
18
- `;function c({label:n,value:e}){return i("div",{css:d,children:[i("span",{children:[n,":"]}),o("span",{children:e}),o(s,{children:o(a,{})})]})}export{c as default};
@@ -1,17 +0,0 @@
1
- "use strict";
2
- import{jsxs as i,Fragment as l,jsx as e}from"@emotion/react/jsx-runtime";import{css as r}from"@emotion/react";import{useColorTokens as a}from"@vef-framework/hooks";import{themeVariables as o}from"@vef-framework/shared";import{useNodesData as f,useNodeId as p}from"@xyflow/react";import g from"../../vef-icon/index.js";import u from"./node-toolbar.js";import h from"./source-handle.js";import b from"./target-handle.js";const x=r`
3
- display: flex;
4
- flex-direction: row;
5
- align-items: center;
6
- column-gap: ${o.marginSm};
7
- margin-bottom: ${o.marginSm};
8
- `,$=r`
9
- display: flex;
10
- align-items: center;
11
- justify-content: center;
12
- color: ${o.colorWhite};
13
- border-radius: ${o.borderRadius};
14
- padding: ${o.paddingXxs};
15
- `,y=r`
16
- font-size: ${o.fontSizeLg};
17
- `;function C({icon:t,iconColor:n,selected:s,children:d}){const m=f(p()).data.node,c=a().get(n);return i(l,{children:[e(h,{}),e(b,{}),e(u,{selected:s}),i("div",{css:x,children:[e("div",{css:$,style:{backgroundColor:c},children:e(g,{children:t})}),e("h3",{css:y,children:m.getLabel()})]}),d]})}export{C as default};
@@ -1,13 +0,0 @@
1
- "use strict";
2
- import{jsx as r}from"@emotion/react/jsx-runtime";import{css as i}from"@emotion/react";import{themeVariables as o}from"@vef-framework/shared";import{PlusIcon as c}from"lucide-react";import m from"../../vef-icon/index.js";import s from"../../vef-popover/index.js";import d from"./selector-content.js";const l=i`
3
- cursor: pointer;
4
- transform-origin: center;
5
- background-color: ${o.colorPrimary};
6
- color: ${o.colorWhite};
7
- border-radius: 50%;
8
- width: 1.5rem;
9
- height: 1.5rem;
10
- display: flex;
11
- align-items: center;
12
- justify-content: center;
13
- `,p={"--vef-popover-inner-content-padding":"6px"};function f({selectorContentPosition:e,items:t,onAddNode:n}){return r(s,{content:r(d,{items:t,onAddNode:n}),contentStyle:p,placement:e,children:r("div",{css:l,children:r(m,{children:r(c,{})})})})}export{f as default};
@@ -1,2 +0,0 @@
1
- "use strict";
2
- import{jsx as o}from"@emotion/react/jsx-runtime";import{NodeToolbar as i,Position as t}from"@xyflow/react";import{Trash2Icon as e}from"lucide-react";import s from"../../vef-button/index.js";import n from"../../vef-icon/index.js";function l({selected:r}){return o(i,{align:"end",isVisible:r,offset:4,position:t.Top,children:o(s,{color:"error",size:"small",tip:"删除",variant:"solid",icon:o(n,{children:o(e,{})})})})}export{l as default};
@@ -1,2 +0,0 @@
1
- "use strict";
2
- import{jsx as o}from"@emotion/react/jsx-runtime";import{nodesMetadata as c}from"../../constants.js";import{NodeType as i}from"../../types.js";import l from"../label-value.js";import n from"../node-content.js";const m=c[i.Approval];function p({selected:r}){const{icon:t,color:e}=m;return o(n,{icon:t,iconColor:e,selected:r,children:o(l,{label:"审批人",value:"无"})})}export{p as default};
@@ -1,2 +0,0 @@
1
- "use strict";
2
- import{jsx as o}from"@emotion/react/jsx-runtime";import{nodesMetadata as i}from"../../constants.js";import{NodeType as n}from"../../types.js";import c from"../label-value.js";import l from"../node-content.js";const m=i[n.Condition];function s({selected:t}){const{icon:e,color:r}=m;return o(l,{icon:e,iconColor:r,selected:t,children:o(c,{label:"条件",value:"无"})})}export{s as default};
@@ -1,2 +0,0 @@
1
- "use strict";
2
- import{jsx as o}from"@emotion/react/jsx-runtime";import{nodesMetadata as c}from"../../constants.js";import{NodeType as i}from"../../types.js";import n from"../label-value.js";import l from"../node-content.js";const m=c[i.End];function p({selected:r}){const{icon:t,color:e}=m;return o(l,{icon:t,iconColor:e,selected:r,children:o(n,{label:"通知人",value:"无"})})}export{p as default};
@@ -1,2 +0,0 @@
1
- "use strict";
2
- import{jsx as o}from"@emotion/react/jsx-runtime";import{nodesMetadata as c}from"../../constants.js";import{NodeType as i}from"../../types.js";import l from"../label-value.js";import n from"../node-content.js";const m=c[i.Handle];function p({selected:e}){const{icon:r,color:t}=m;return o(n,{icon:r,iconColor:t,selected:e,children:o(l,{label:"办理人",value:"无"})})}export{p as default};
@@ -1,2 +0,0 @@
1
- "use strict";
2
- import{NodeType as o}from"../../types.js";import r from"./approval.js";import m from"./condition.js";import p from"./end.js";import t from"./handle.js";import i from"./submit.js";const e={[o.Submit]:i,[o.Approval]:r,[o.Handle]:t,[o.Condition]:m,[o.End]:p};export{e as nodeTypes};
@@ -1,2 +0,0 @@
1
- "use strict";
2
- import{jsx as o}from"@emotion/react/jsx-runtime";import{nodesMetadata as i}from"../../constants.js";import{NodeType as m}from"../../types.js";import c from"../label-value.js";import l from"../node-content.js";const n=i[m.Submit];function s({selected:t}){const{icon:r,color:e}=n;return o(l,{icon:r,iconColor:e,selected:t,children:o(c,{label:"提交人",value:"全员"})})}export{s as default};