@tmagic/editor 1.5.0-beta.3 → 1.5.0-beta.5

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 (76) hide show
  1. package/dist/style.css +274 -2
  2. package/dist/tmagic-editor.js +103 -46
  3. package/dist/tmagic-editor.umd.cjs +325 -242
  4. package/package.json +7 -9
  5. package/src/Editor.vue +8 -2
  6. package/src/components/CodeBlockEditor.vue +5 -5
  7. package/src/components/SearchInput.vue +1 -0
  8. package/src/components/Tree.vue +10 -2
  9. package/src/components/TreeNode.vue +4 -2
  10. package/src/editorProps.ts +5 -2
  11. package/src/fields/CodeLink.vue +2 -2
  12. package/src/fields/CodeSelect.vue +1 -1
  13. package/src/fields/CodeSelectCol.vue +1 -1
  14. package/src/fields/CondOpSelect.vue +1 -1
  15. package/src/fields/DataSourceFieldSelect/FieldSelect.vue +2 -8
  16. package/src/fields/DataSourceFieldSelect/Index.vue +1 -1
  17. package/src/fields/DataSourceFields.vue +1 -1
  18. package/src/fields/DataSourceInput.vue +4 -4
  19. package/src/fields/DataSourceMethodSelect.vue +1 -1
  20. package/src/fields/DataSourceMethods.vue +1 -1
  21. package/src/fields/DataSourceMocks.vue +1 -1
  22. package/src/fields/DisplayConds.vue +1 -1
  23. package/src/fields/EventSelect.vue +2 -2
  24. package/src/fields/PageFragmentSelect.vue +1 -1
  25. package/src/fields/UISelect.vue +1 -1
  26. package/src/hooks/use-code-block-edit.ts +1 -1
  27. package/src/hooks/use-data-source-edit.ts +1 -1
  28. package/src/hooks/use-data-source-method.ts +3 -3
  29. package/src/hooks/use-filter.ts +1 -1
  30. package/src/hooks/use-node-status.ts +1 -1
  31. package/src/hooks/use-stage.ts +2 -6
  32. package/src/index.ts +27 -7
  33. package/src/initService.ts +11 -3
  34. package/src/layouts/AddPageBox.vue +1 -1
  35. package/src/layouts/CodeEditor.vue +5 -5
  36. package/src/layouts/Framework.vue +2 -2
  37. package/src/layouts/NavMenu.vue +1 -1
  38. package/src/layouts/PropsPanel.vue +1 -1
  39. package/src/layouts/page-bar/AddButton.vue +1 -1
  40. package/src/layouts/page-bar/PageBar.vue +1 -1
  41. package/src/layouts/page-bar/PageBarScrollContainer.vue +1 -1
  42. package/src/layouts/page-bar/PageList.vue +1 -1
  43. package/src/layouts/page-bar/SwitchTypeButton.vue +1 -1
  44. package/src/layouts/sidebar/Sidebar.vue +12 -0
  45. package/src/layouts/sidebar/code-block/CodeBlockList.vue +11 -3
  46. package/src/layouts/sidebar/code-block/CodeBlockListPanel.vue +11 -2
  47. package/src/layouts/sidebar/data-source/DataSourceConfigPanel.vue +1 -1
  48. package/src/layouts/sidebar/data-source/DataSourceList.vue +13 -3
  49. package/src/layouts/sidebar/data-source/DataSourceListPanel.vue +12 -1
  50. package/src/layouts/sidebar/layer/LayerNodeTool.vue +1 -1
  51. package/src/layouts/sidebar/layer/LayerPanel.vue +5 -1
  52. package/src/layouts/sidebar/layer/use-click.ts +1 -1
  53. package/src/layouts/sidebar/layer/use-drag.ts +1 -1
  54. package/src/layouts/sidebar/layer/use-node-status.ts +1 -1
  55. package/src/layouts/workspace/Breadcrumb.vue +1 -1
  56. package/src/layouts/workspace/viewer/NodeListMenu.vue +1 -1
  57. package/src/layouts/workspace/viewer/Stage.vue +7 -3
  58. package/src/layouts/workspace/viewer/StageOverlay.vue +6 -1
  59. package/src/layouts/workspace/viewer/ViewerMenu.vue +1 -1
  60. package/src/services/codeBlock.ts +7 -7
  61. package/src/services/dataSource.ts +3 -4
  62. package/src/services/dep.ts +2 -2
  63. package/src/services/editor.ts +7 -8
  64. package/src/services/history.ts +1 -1
  65. package/src/services/props.ts +3 -3
  66. package/src/services/storage.ts +2 -2
  67. package/src/theme/index.scss +3 -0
  68. package/src/type.ts +13 -10
  69. package/src/utils/config.ts +5 -5
  70. package/src/utils/content-menu.ts +1 -1
  71. package/src/utils/data-source/index.ts +1 -1
  72. package/src/utils/editor.ts +2 -8
  73. package/src/utils/operator.ts +2 -1
  74. package/src/utils/props.ts +1 -1
  75. package/src/utils/tree.ts +1 -1
  76. package/types/index.d.ts +53 -29
package/dist/style.css CHANGED
@@ -1,4 +1,4 @@
1
- .m-fields-ui-select {
1
+ @charset "UTF-8";.m-fields-ui-select {
2
2
  cursor: pointer;
3
3
  }
4
4
  .m-fields-ui-select i {
@@ -49,7 +49,279 @@
49
49
  }
50
50
  .m-editor-scroll-bar:hover.vertical .m-editor-scroll-bar-thumb, .m-editor-scroll-bar:focus.vertical .m-editor-scroll-bar-thumb {
51
51
  width: 11px;
52
- }.tmagic-design-input.search-input {
52
+ }
53
+ .tmagic-design-popper {
54
+ min-width: 150px;
55
+ line-height: 1.4;
56
+ background-color: #fff;
57
+ box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.12);
58
+ color: #606266;
59
+ border: 1px solid #e4e7ed;
60
+ border-radius: 4px;
61
+ font-size: 14px;
62
+ overflow-wrap: break-word;
63
+ box-sizing: border-box;
64
+ padding: 10px;
65
+ }
66
+ .tmagic-design-popper:focus {
67
+ outline: none;
68
+ }
69
+ .tmagic-design-popper[data-popper-placement^=top] > .tmagic-design-popper-arrow {
70
+ bottom: -4px;
71
+ }
72
+ .tmagic-design-popper[data-popper-placement^=bottom] > .tmagic-design-popper-arrow {
73
+ top: -4px;
74
+ }
75
+ .tmagic-design-popper[data-popper-placement^=left] > .tmagic-design-popper-arrow {
76
+ right: -4px;
77
+ }
78
+ .tmagic-design-popper[data-popper-placement^=right] > .tmagic-design-popper-arrow {
79
+ left: -4px;
80
+ }
81
+ .tmagic-design-popper-arrow,
82
+ .tmagic-design-popper-arrow::before {
83
+ position: absolute;
84
+ width: 8px;
85
+ height: 8px;
86
+ background: inherit;
87
+ }
88
+ .tmagic-design-popper-arrow {
89
+ visibility: hidden;
90
+ }
91
+ .tmagic-design-popper-arrow::before {
92
+ visibility: visible;
93
+ content: "";
94
+ transform: rotate(45deg);
95
+ }
96
+ .m-table .el-button.action-btn + .el-button.action-btn {
97
+ margin-left: 0;
98
+ }
99
+ .m-table .keep-all {
100
+ word-break: keep-all;
101
+ }
102
+ .m-table .el-table .cell > div {
103
+ display: inline-block;
104
+ vertical-align: middle;
105
+ }
106
+ .m-table .el-table__row.el-table__row--level-1 {
107
+ color: #999;
108
+ }
109
+ .tmagic-design-form-inline .m-form-container {
110
+ display: inline-flex;
111
+ }
112
+ .m-form-dialog .el-dialog__body {
113
+ padding: 0 !important;
114
+ }
115
+ .m-form-dialog .m-dialog-body {
116
+ padding: 0 20px;
117
+ }
118
+ .m-form-dialog .el-table .m-form-item .el-form-item {
119
+ margin-bottom: 0;
120
+ }
121
+ .m-form-drawer .el-drawer__header {
122
+ margin: 0;
123
+ }
124
+ .m-form-drawer .m-drawer-body {
125
+ height: 100%;
126
+ overflow-y: auto;
127
+ overflow-x: hidden;
128
+ }
129
+ .fade-enter-active,
130
+ .fade-leave-active {
131
+ transition: opacity 0.5s;
132
+ }
133
+ .fade-enter, .fade-leave-to {
134
+ opacity: 0;
135
+ }
136
+ .m-form .m-form-tip {
137
+ color: rgba(0, 0, 0, 0.45);
138
+ font-size: 12px;
139
+ transition: color 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
140
+ }
141
+ .m-form .m-form-schematic {
142
+ max-width: 50%;
143
+ height: 100%;
144
+ }
145
+ .m-form .el-table .cell > div.m-form-container {
146
+ display: block;
147
+ }
148
+ .m-form .el-tabs {
149
+ margin-bottom: 10px;
150
+ }
151
+ .m-form .el-form-item.hidden > .el-form-item__label {
152
+ display: none;
153
+ }
154
+ .m-form .t-form__item.hidden > .t-form__label {
155
+ display: none;
156
+ }
157
+ .magic-datetime-picker-popper .el-picker-panel__footer button:first-child {
158
+ display: none;
159
+ }
160
+ .m-form-validate__warning {
161
+ color: var(--el-color-warning);
162
+ font-size: 12px;
163
+ width: 100%;
164
+ line-height: 1.4;
165
+ }
166
+ div.m-fields-link {
167
+ width: fit-content;
168
+ }
169
+ fieldset.m-fieldset {
170
+ position: relative;
171
+ border: 1px solid rgb(229, 229, 229);
172
+ margin-top: 10px;
173
+ margin-bottom: 10px;
174
+ min-inline-size: auto;
175
+ }
176
+ fieldset.m-fieldset .el-checkbox {
177
+ height: 22px;
178
+ }
179
+ fieldset.m-fieldset legend {
180
+ font-size: 14px;
181
+ position: absolute;
182
+ border: 0;
183
+ top: -10px;
184
+ left: 20px;
185
+ background: rgb(255, 255, 255);
186
+ width: auto;
187
+ padding: 0px 3px;
188
+ font-weight: bold;
189
+ line-height: 20px;
190
+ }
191
+ fieldset.m-fieldset .m-form-tip {
192
+ margin-left: 5px;
193
+ }
194
+ .m-fields-group-list .el-button--text {
195
+ padding: 0;
196
+ margin-bottom: 7px;
197
+ }
198
+ .m-fields-group-list .el-tree-node__expand-icon {
199
+ padding: 0;
200
+ margin-bottom: 7px;
201
+ }
202
+ .m-fields-group-list .el-tree-node__expand-icon.expand {
203
+ transform: rotate(90deg);
204
+ }
205
+ .m-fields-group-list .m-fields-group-list-item {
206
+ border-bottom: 1px solid #ebeef5;
207
+ margin-bottom: 7px;
208
+ }
209
+ .m-fields-group-list .m-fields-group-list-item:last-of-type {
210
+ border-bottom: 0;
211
+ }
212
+ .m-form-panel .el-card__header:hover {
213
+ background: #f2f6fc;
214
+ }
215
+ .m-form-panel .el-card__header a {
216
+ color: #409eff;
217
+ }
218
+ .m-form-panel .el-card__body {
219
+ padding: 10px;
220
+ }
221
+ .m-form-panel .m-form-tip {
222
+ margin-left: 5px;
223
+ }
224
+ .m-container-panel:not(:last-of-type) {
225
+ margin-bottom: 20px;
226
+ }
227
+ .m-fields-table-wrap {
228
+ width: 100%;
229
+ }
230
+ .m-fields-table {
231
+ width: 100%;
232
+ }
233
+ .m-fields-table.fixed {
234
+ position: fixed;
235
+ height: 100%;
236
+ overflow: auto;
237
+ top: 0;
238
+ right: 0;
239
+ left: 0;
240
+ bottom: 0;
241
+ z-index: 100;
242
+ background: rgba(0, 0, 0, 0.5);
243
+ }
244
+ .m-fields-table.fixed > .el-form-item__content {
245
+ z-index: 101;
246
+ position: relative;
247
+ margin: 10vh auto;
248
+ max-width: fit-content;
249
+ }
250
+ .m-fields-table.fixed table {
251
+ width: 95vw !important;
252
+ }
253
+ .m-fields-table th {
254
+ background-color: #f2f2f2 !important;
255
+ color: #333 !important;
256
+ }
257
+ .m-fields-table .el-table th {
258
+ padding: 0 !important;
259
+ }
260
+ .m-fields-table .el-table__column--dropable {
261
+ cursor: move;
262
+ }
263
+ .m-fields-table .el-form-item__content .el-input-group {
264
+ vertical-align: middle;
265
+ }
266
+ .m-fields-table.m-fields-table-item-extra tr.expanded td {
267
+ border-bottom: 0;
268
+ }
269
+ .m-fields-table .el-table__expanded-cell .m-form-tip {
270
+ margin-left: 80px;
271
+ }
272
+ .m-fields-table .el-form-item {
273
+ margin-bottom: 0;
274
+ }
275
+ .m-fields-table .m-table-delete-icon {
276
+ color: #f56c6c;
277
+ cursor: pointer;
278
+ }
279
+ .m-select {
280
+ width: 100%;
281
+ }
282
+ .magic-form-dynamic-tab .el-tabs__header.is-top {
283
+ padding-right: 8px;
284
+ }
285
+ .magic-form-dynamic-tab .el-tabs__header.is-top .el-tabs__new-tab {
286
+ margin-right: auto;
287
+ min-width: 50px;
288
+ outline: none;
289
+ border-color: #409eff;
290
+ color: #409eff;
291
+ width: 10px;
292
+ }
293
+ .magic-form-dynamic-tab .el-tabs__header.is-top .el-tabs__new-tab::before {
294
+ content: "添加";
295
+ }
296
+ .magic-form-dynamic-tab .el-tabs__header.is-top .el-tabs__new-tab .el-icon-plus {
297
+ display: none;
298
+ }
299
+ .magic-form-tab {
300
+ margin-bottom: 10px;
301
+ }
302
+ .diff-count-badge {
303
+ top: -10px;
304
+ }
305
+ .m-fields-number-range {
306
+ display: flex;
307
+ align-items: center;
308
+ }
309
+ .m-fields-number-range .split-tag {
310
+ margin: 0 5px;
311
+ }
312
+ .m-form-box {
313
+ display: flex;
314
+ flex-direction: column;
315
+ }
316
+ .m-form-box .el-box__header {
317
+ margin: 0;
318
+ }
319
+ .m-form-box .dialog-footer {
320
+ display: flex;
321
+ align-items: center;
322
+ justify-content: space-between;
323
+ }
324
+ .tmagic-design-input.search-input {
53
325
  background: #fff;
54
326
  color: #bbbbbb;
55
327
  padding: 10px;