@tmagic/editor 1.8.0-beta.7 → 1.8.0-manmanyu.10

package/dist/es/style.css

@@ -48,7 +48,7 @@
   margin-right: 3px;
 }
 .m-fields-ui-select span {
-  color: #2882e0;
+  color: var(--el-color-primary, #2882e0);
 }
 .tmagic-design-popper {
   min-width: 150px;
@@ -101,6 +101,54 @@
   transform: rotate(45deg);
 }
 
+.tmagic-design-card.tmagic-design-card--flat {
+  background: #fff;
+  box-shadow: none !important;
+  border-top: 0;
+  border-left: 0;
+  border-right: 0;
+  border-radius: 0;
+  border-bottom: 0;
+}
+.tmagic-design-card.tmagic-design-card--flat.m-fields-group-list-item {
+  margin-bottom: 0;
+}
+.tmagic-design-card.tmagic-design-card--flat.is-always-shadow {
+  box-shadow: none;
+}
+.tmagic-design-card.tmagic-design-card--flat .el-card__header {
+  border-bottom: none;
+  padding: 16px;
+}
+.tmagic-design-card.tmagic-design-card--flat .el-card__header:hover {
+  background: transparent;
+  box-shadow: none;
+  cursor: default;
+}
+.tmagic-design-card.tmagic-design-card--flat .el-card__body {
+  padding: 0 16px 0 16px;
+}
+.tmagic-design-card.tmagic-design-card--flat .el-card__body .tmagic-design-form-item:not(tbody .tmagic-design-form-item) {
+  margin-bottom: 16px;
+}
+.tmagic-design-card.tmagic-design-card--flat .el-card__body > .m-container-row {
+  overflow-x: hidden;
+}
+.m-split-title-card-container > .tmagic-design-card.tmagic-design-card--flat {
+  background-color: transparent;
+}
+.m-split-title-card-container > .tmagic-design-card.tmagic-design-card--flat > .el-card__header {
+  margin-bottom: 10px;
+  padding: 0;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 24px;
+}
+.m-split-title-card-container > .tmagic-design-card.tmagic-design-card--flat > .el-card__body {
+  background-color: #fff;
+  padding-top: 16px;
+}
+
 .m-table .el-button.action-btn + .el-button.action-btn {
   margin-left: 0;
 }
@@ -132,6 +180,9 @@
 .m-form-container .tmagic-design-form-item.show-before-diff {
   background: #f7dadd;
 }
+.m-form-container .m-form-title-extra {
+  margin-left: 8px;
+}
 
 .m-form-dialog .el-dialog__body {
   padding: 0 !important;
@@ -192,6 +243,10 @@
   margin-bottom: var(--td-comp-margin-xxl);
 }
 
+.m-form-container .m-form-container-expand {
+  text-align: center;
+}
+
 .magic-datetime-picker-popper .el-picker-panel__footer button:first-child {
   display: none;
 }
@@ -201,6 +256,24 @@
   align-items: center;
   width: 100%;
 }
+.m-fields-text--static {
+  gap: 6px;
+  min-height: 32px;
+}
+.m-fields-text--static .m-fields-text__prepend {
+  color: var(--el-text-color-secondary, #909399);
+}
+.m-fields-text--static .m-fields-text__value {
+  color: var(--el-text-color-regular, #606266);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.m-fields-text--static .m-fields-text__icon {
+  width: 16px;
+  height: 16px;
+  cursor: pointer;
+}
 
 .m-form-validate__warning {
   color: var(--el-color-warning);
@@ -226,6 +299,16 @@
   outline: none;
 }
 
+.m-container-text.m-fields-title-container .tmagic-design-form-item .el-form-item__label {
+  color: #0f1113;
+  font-weight: 500;
+  font-size: 16px;
+}
+.m-container-text.m-fields-title-container .tmagic-design-form-item {
+  line-height: 24px;
+  margin-bottom: 16px;
+}
+
 .tmagic-form-text-popper[data-popper-placement^=top] > .tmagic-form-text-popper-arrow {
   bottom: -4px;
 }
@@ -264,6 +347,65 @@ div.m-fields-link {
   width: fit-content;
 }
 
+a.magic-admin-link {
+  width: 100%;
+  box-sizing: border-box;
+  border-radius: 4px;
+  border: 1px solid #e6e6e6;
+  background-color: #fafafa;
+  padding: 0 8px;
+  height: 28px;
+  display: inline-flex;
+  gap: 4px;
+  align-items: center;
+  text-decoration: none;
+}
+a.magic-admin-link i {
+  margin-right: 4px;
+}
+
+.m-container-fieldset.no-border-fieldset.fieldset-in-row > fieldset.m-fieldset legend {
+  left: 0;
+}
+.m-container-fieldset.no-border-fieldset > fieldset.m-fieldset {
+  border: 0;
+}
+.m-container-fieldset.no-border-fieldset > fieldset.m-fieldset legend {
+  position: relative;
+  left: -5px;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 24px;
+  padding: 0;
+}
+.m-container-fieldset.fieldset-in-card-fit {
+  border-bottom: 1px solid #e6e6e6;
+}
+.m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset {
+  padding: 16px 0 16px 0 !important;
+  border: 0;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+.m-container-fieldset.fieldset-in-card-fit > fieldset.m-fieldset legend {
+  position: relative;
+  top: 10px;
+}
+.m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-last {
+  padding-bottom: 0 !important;
+  border-bottom: 0;
+}
+.m-container-fieldset.fieldset-in-card-fit.fieldset-in-card-fit-first {
+  padding-top: 0 !important;
+}
+.m-container-fieldset.fieldset-in-card-fit:last-child {
+  padding-bottom: 0 !important;
+  border-bottom: 0;
+}
+.m-container-fieldset.fieldset-in-card-fit:first {
+  padding-top: 0 !important;
+}
+
 fieldset.m-fieldset {
   position: relative;
   border: 1px solid rgb(229, 229, 229);
@@ -290,6 +432,9 @@ fieldset.m-fieldset .m-form-tip {
   margin-left: 5px;
 }
 
+.m-fields-group-list .m-fields-group-list-item.tmagic-design-card--flat:last-child {
+  border: 0;
+}
 .m-fields-group-list .el-button--text {
   padding: 0;
   margin-bottom: 7px;
@@ -308,11 +453,10 @@ fieldset.m-fieldset .m-form-tip {
 .m-fields-group-list .m-fields-group-list-item:last-of-type {
   border-bottom: 0;
 }
-.m-fields-group-list .tmagic-design-card .el-card__header {
-  padding: 5px 20px;
-}
-.m-fields-group-list .tmagic-design-card .t-card__header {
-  padding: 5px 0;
+.m-fields-group-list .m-fields-group-list-item .m-fields-group-list-item-header {
+  display: flex;
+  align-items: center;
+  gap: 8px;
 }
 .m-fields-group-list .m-fields-group-list-footer {
   display: flex;
@@ -324,7 +468,7 @@ fieldset.m-fieldset .m-form-tip {
   background: #f2f6fc;
 }
 .m-form-panel .el-card__header a {
-  color: #409eff;
+  color: var(--el-color-primary, #409eff);
 }
 .m-form-panel .el-card__body {
   padding: 10px;
@@ -403,8 +547,8 @@ fieldset.m-fieldset .m-form-tip {
   margin-right: auto;
   min-width: 50px;
   outline: none;
-  border-color: #409eff;
-  color: #409eff;
+  border-color: var(--el-color-primary, #409eff);
+  color: var(--el-color-primary, #409eff);
   width: 10px;
 }
 .magic-form-dynamic-tab .el-tabs__header.is-top .el-tabs__new-tab::before {
@@ -443,6 +587,22 @@ fieldset.m-fieldset .m-form-tip {
   justify-content: space-between;
 }
 
+.m-fields-radio-group__option {
+  display: flex;
+  align-items: center;
+}
+
+.m-fields-radio-group__text {
+  display: inline-block;
+  vertical-align: middle;
+  white-space: pre-line;
+  line-height: 20px;
+}
+
+.m-fields-radio-group__icon_with_text {
+  margin-right: 8px;
+}
+
 .tmagic-design-input.search-input {
   background: #fff;
   color: #bbbbbb;
@@ -600,7 +760,7 @@ fieldset.m-fieldset .m-form-tip {
   color: #909399;
 }
 .m-editor-history-list-popover .m-editor-history-list-close:hover {
-  color: #409eff;
+  color: var(--el-color-primary, #409eff);
 }
 .m-editor-history-list-popover .m-editor-history-list-tabs .el-tabs__header,
 .m-editor-history-list-popover .m-editor-history-list-tabs .t-tabs__header {
@@ -656,14 +816,14 @@ fieldset.m-fieldset .m-form-tip {
 }
 .m-editor-history-list-popover .m-editor-history-list-item.is-current:not(.m-editor-history-list-group.is-merged) {
   background-color: rgba(64, 158, 255, 0.1);
-  box-shadow: inset 2px 0 0 #409eff;
+  box-shadow: inset 2px 0 0 var(--el-color-primary, #409eff);
 }
 .m-editor-history-list-popover .m-editor-history-list-item.is-current:not(.m-editor-history-list-group.is-merged):hover {
   background-color: rgba(64, 158, 255, 0.16);
 }
 .m-editor-history-list-popover .m-editor-history-list-item.is-current:not(.m-editor-history-list-group.is-merged) .m-editor-history-list-item-desc {
   font-weight: 600;
-  color: #409eff;
+  color: var(--el-color-primary, #409eff);
 }
 .m-editor-history-list-popover .m-editor-history-list-group {
   flex-direction: column;
@@ -718,11 +878,11 @@ fieldset.m-fieldset .m-form-tip {
 .m-editor-history-list-popover .m-editor-history-list-group.is-merged.is-current {
   background-color: rgba(64, 158, 255, 0.08);
   border-color: rgba(64, 158, 255, 0.3);
-  border-left-color: #409eff;
+  border-left-color: var(--el-color-primary, #409eff);
   box-shadow: none;
 }
 .m-editor-history-list-popover .m-editor-history-list-group.is-merged.is-current .m-editor-history-list-group-head {
-  color: #409eff;
+  color: var(--el-color-primary, #409eff);
 }
 .m-editor-history-list-popover .m-editor-history-list-substeps {
   margin: 6px 0 0 6px;
@@ -750,7 +910,7 @@ fieldset.m-fieldset .m-form-tip {
   color: #c0c4cc;
 }
 .m-editor-history-list-popover .m-editor-history-list-substeps li.is-current {
-  color: #409eff;
+  color: var(--el-color-primary, #409eff);
   font-weight: 600;
   background-color: rgba(64, 158, 255, 0.08);
   border-radius: 3px;
@@ -762,7 +922,7 @@ fieldset.m-fieldset .m-form-tip {
   font-size: 10px;
   line-height: 16px;
   color: #fff;
-  background-color: #409eff;
+  background-color: var(--el-color-primary, #409eff);
   font-weight: 500;
 }
 .m-editor-history-list-popover .m-editor-history-list-item-index {
@@ -839,6 +999,18 @@ fieldset.m-fieldset .m-form-tip {
   white-space: nowrap;
   font-weight: 400;
 }
+.m-editor-history-list-popover .m-editor-history-list-item-operator {
+  flex: 0 0 auto;
+  padding: 0 6px;
+  border: 1px solid #c6e2ff;
+  border-radius: 8px;
+  font-size: 10px;
+  line-height: 14px;
+  color: #409eff;
+  background-color: #ecf5ff;
+  white-space: nowrap;
+  font-weight: 400;
+}
 .m-editor-history-list-popover .m-editor-history-list-item-saved {
   flex: 0 0 auto;
   padding: 0 6px;
@@ -879,7 +1051,7 @@ fieldset.m-fieldset .m-form-tip {
   border-radius: 2px;
   font-size: 10px;
   line-height: 16px;
-  color: #409eff;
+  color: var(--el-color-primary, #409eff);
   background-color: rgba(64, 158, 255, 0.1);
   cursor: pointer;
   user-select: none;
@@ -942,7 +1114,7 @@ fieldset.m-fieldset .m-form-tip {
   flex: 1 1 auto;
   font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
   font-size: 11px;
-  color: #409eff;
+  color: var(--el-color-primary, #409eff);
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -1068,8 +1240,8 @@ fieldset.m-fieldset .m-form-tip {
   margin-top: 5px;
 }
 .m-editor-empty-button:hover {
-  border-color: #2882e0;
-  color: #2882e0;
+  border-color: var(--el-color-primary, #2882e0);
+  color: var(--el-color-primary, #2882e0);
 }
 
 .m-editor-sidebar {
@@ -1078,7 +1250,7 @@ fieldset.m-fieldset .m-form-tip {
   position: relative;
 }
 .m-editor-sidebar .m-editor-sidebar-header {
-  background: #2882e0;
+  background: var(--el-color-primary, #2882e0);
   height: 100%;
   width: 40px;
 }
@@ -1260,9 +1432,9 @@ fieldset.m-fieldset .m-form-tip {
 }
 .ui-component-panel.tmagic-design-collapse .el-collapse-item__wrap .component-item i:hover,
 .ui-component-panel.tmagic-design-collapse .t-collapse-panel__body .component-item i:hover {
-  background: #2882e0;
+  background: var(--el-color-primary, #2882e0);
   color: #fff;
-  border-color: #4e8be1;
+  border-color: var(--el-color-primary, #4e8be1);
 }
 .ui-component-panel.tmagic-design-collapse .el-collapse-item__wrap .component-item span,
 .ui-component-panel.tmagic-design-collapse .t-collapse-panel__body .component-item span {
@@ -1412,7 +1584,7 @@ fieldset.m-fieldset .m-form-tip {
 }
 .m-editor-page-bar-item-icon .icon-active {
   font-weight: bold;
-  color: #2882e0;
+  color: var(--el-color-primary, #2882e0);
 }
 .m-editor-page-bar-item-title {
   max-width: 150px;
@@ -1446,7 +1618,7 @@ fieldset.m-fieldset .m-form-tip {
   background-color: #f3f5f9;
 }
 .page-bar-popover .menu-item.active .tmagic-design-button {
-  color: #2882e0;
+  color: var(--el-color-primary, #2882e0);
 }
 
 .m-editor-page-bar-search-panel {
@@ -1557,7 +1729,8 @@ fieldset.m-fieldset .m-form-tip {
   padding-left: 10px;
 }
 .m-editor-props-form-panel-form > .m-container-tab > .tmagic-design-tabs > .el-tabs__content {
-  padding-top: 55px;
+  margin-top: var(--el-tabs-header-height);
+  padding-top: 15px;
 }
 .m-editor-props-form-panel-form > .m-container-tab > .tmagic-design-tabs > .el-tabs__header.is-top {
   position: absolute;
@@ -1626,7 +1799,7 @@ fieldset.m-fieldset .m-form-tip {
   color: #313a40;
 }
 .magic-editor-content-menu .menu-item.button.active {
-  background-color: #2882e0;
+  background-color: var(--el-color-primary, #2882e0);
 }
 .magic-editor-content-menu .menu-item.button.active .tmagic-design-button,
 .magic-editor-content-menu .menu-item.button.active .tmagic-design-button:active,
@@ -1757,12 +1930,51 @@ fieldset.m-fieldset .m-form-tip {
 .m-fields-code-select {
   width: 100%;
 }
+.m-fields-code-select > .el-card.tmagic-design-card--flat {
+  background-color: transparent;
+  margin-bottom: 10px;
+}
+.m-fields-code-select > .el-card.tmagic-design-card--flat > .el-card__body {
+  padding-left: 0;
+}
+.m-fields-code-select > .el-card.tmagic-design-card--flat > .el-card__body .code-select-content > .m-fields-group-list > .tmagic-design-card--flat.el-card {
+  padding-left: 16px;
+  padding-right: 16px;
+  margin-bottom: 10px;
+  border: 0 !important;
+}
+.m-fields-code-select .el-card__body .tmagic-design-form-item {
+  margin-bottom: 18px;
+}
+.m-fields-code-select .code-select-content > .m-fields-group-list > .tmagic-design-card--flat > .el-card__header {
+  padding: 16px 0;
+}
+.m-fields-code-select .create-button.fullWidth {
+  width: 100%;
+  margin: 0 0 16px 0;
+}
 
 .m-fields-event-select {
   width: 100%;
 }
 .m-fields-event-select .fullWidth {
   width: 100%;
+  box-sizing: border-box;
+}
+.m-fields-event-select .event-select-container {
+  padding: 0 16px;
+}
+.m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__header {
+  border-bottom: 1px solid #ebeef5;
+}
+.m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__body {
+  padding-bottom: 16px;
+}
+.m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__body .m-fields-group-list-footer div {
+  justify-content: flex-start !important;
+}
+.m-fields-event-select .event-select-container > .el-card.tmagic-design-card--flat > .el-card__body .el-card.tmagic-design-card--flat > .el-card__header {
+  padding: 16px 0;
 }
 .m-fields-event-select .event-select-code {
   margin-left: 20px;
@@ -1796,6 +2008,40 @@ fieldset.m-fieldset .m-form-tip {
   margin-right: 5px;
 }
 
+.event-select-container {
+  padding: 0 16px;
+}
+
+.event-select-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 8px;
+}
+.event-select-header .event-select-title {
+  color: #0f1113;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 24px;
+}
+
+.event-item-header {
+  position: relative;
+  width: 100%;
+}
+.event-item-header .event-item-title {
+  color: #0f1113;
+  font-size: 16px;
+  font-weight: 500;
+  line-height: 24px;
+  margin-bottom: 16px;
+}
+.event-item-header .event-item-delete-button {
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
 .m-editor-layout {
   width: 100%;
   display: flex;
@@ -1932,18 +2178,18 @@ fieldset.m-fieldset .m-form-tip {
   color: #313a40;
 }
 .m-editor-tree .m-editor-tree-node .tree-node.selected {
-  background-color: #2882e0;
+  background-color: var(--el-color-primary, #2882e0);
   color: #f3f5f9;
 }
 .m-editor-tree .m-editor-tree-node .tree-node.drag-inner .tree-node-content {
-  background-color: rgba(40, 130, 224, 0.5);
+  background-color: rgba(var(--el-color-primary, #2882e0), 0.5);
   color: #f3f5f9;
 }
 .m-editor-tree .m-editor-tree-node .tree-node.drag-before .tree-node-content {
-  border-top-color: rgba(40, 130, 224, 0.5);
+  border-top-color: rgba(var(--el-color-primary, #2882e0), 0.5);
 }
 .m-editor-tree .m-editor-tree-node .tree-node.drag-after .tree-node-content {
-  border-bottom-color: rgba(40, 130, 224, 0.5);
+  border-bottom-color: rgba(var(--el-color-primary, #2882e0), 0.5);
 }
 .m-editor-tree .m-editor-tree-node .tree-node .expand-icon {
   padding: 4px;
@@ -2038,6 +2284,15 @@ fieldset.m-fieldset .m-form-tip {
   display: flex;
   align-items: center;
 }
+.m-fields-data-source-select.data-source-field-img-upload, .m-fields-data-source-select.data-source-field-big-img-upload,
+.m-fields-data-source-field-select.data-source-field-img-upload,
+.m-fields-data-source-field-select.data-source-field-big-img-upload,
+.m-fields-data-source-method-select .data-source-method-select-container.data-source-field-img-upload,
+.m-fields-data-source-method-select .data-source-method-select-container.data-source-field-big-img-upload,
+.m-fields-code-select-col .code-select-container.data-source-field-img-upload,
+.m-fields-code-select-col .code-select-container.data-source-field-big-img-upload {
+  align-items: flex-start;
+}
 .m-fields-data-source-select .m-fields-select-action-button,
 .m-fields-data-source-field-select .m-fields-select-action-button,
 .m-fields-data-source-method-select .data-source-method-select-container .m-fields-select-action-button,
@@ -2064,8 +2319,19 @@ fieldset.m-fieldset .m-form-tip {
   padding: 5px 8px;
 }
 
+.m-container-text.display-conds-title .tmagic-design-form-item .el-form-item__label {
+  color: #111;
+  font-weight: 500;
+  font-size: 16px;
+}
+.m-container-text.display-conds-title .tmagic-design-form-item {
+  line-height: 24px;
+  margin-bottom: 10px;
+}
+
 .border-box-container {
   display: flex;
+  --unuse-border-style: dashed;
 }
 .border-box-container .border-icon-container {
   display: flex;
@@ -2097,24 +2363,27 @@ fieldset.m-fieldset .m-form-tip {
   border-color: var(--el-color-success, var(--td-success-color, #2ba471));
 }
 .border-box-container .border-icon-container .border-icon.active {
+  border-color: var(--el-color-primary);
+  border-width: 1px;
+}
+.border-box-container .border-icon-container .border-icon.center {
   border-width: 1px;
-  border-color: var(--el-color-primary, var(--td-brand-color, #0052d9));
 }
 .border-box-container .border-icon-container .border-icon.border-icon-top {
   border-top-width: 2px;
-  border-style: solid dashed dashed dashed;
+  border-style: solid var(--unuse-border-style) var(--unuse-border-style) var(--unuse-border-style);
 }
 .border-box-container .border-icon-container .border-icon.border-icon-right {
   border-right-width: 2px;
-  border-style: dashed solid dashed dashed;
+  border-style: var(--unuse-border-style) solid var(--unuse-border-style) var(--unuse-border-style);
 }
 .border-box-container .border-icon-container .border-icon.border-icon-bottom {
   border-bottom-width: 2px;
-  border-style: dashed dashed solid dashed;
+  border-style: var(--unuse-border-style) var(--unuse-border-style) solid var(--unuse-border-style);
 }
 .border-box-container .border-icon-container .border-icon.border-icon-left {
   border-left-width: 2px;
-  border-style: dashed dashed dashed solid;
+  border-style: var(--unuse-border-style) var(--unuse-border-style) var(--unuse-border-style) solid;
 }
 .border-box-container .border-value-container {
   margin-left: 16px;
@@ -2334,7 +2603,7 @@ fieldset.m-fieldset .m-form-tip {
   border: 1px solid #1d1f24;
 }
 .background-position-container .presets-value-list .position-icon.active {
-  background-color: #2882e0;
+  background-color: var(--el-color-primary, #2882e0);
 }
 .background-position-container .presets-value-list .position-icon.active::after {
   border: 1px solid #fff;

package/dist/es/utils/const.js

@@ -6,7 +6,7 @@ var RIGHT_COLUMN_WIDTH_STORAGE_KEY = "$MagicEditorRightColumnWidthData";
 var PROPS_PANEL_WIDTH_STORAGE_KEY = "$MagicEditorPropsPanelWidthData";
 var DEFAULT_LEFT_COLUMN_WIDTH = 310;
 var DEFAULT_RIGHT_COLUMN_WIDTH = 480;
-var MIN_LEFT_COLUMN_WIDTH = 200;
+var MIN_LEFT_COLUMN_WIDTH = 238;
 var MIN_CENTER_COLUMN_WIDTH = 400;
 var MIN_RIGHT_COLUMN_WIDTH = 300;
 var H_GUIDE_LINE_STORAGE_KEY = "$MagicStageHorizontalGuidelinesData";