@kp-ui/lowcode-pc 1.0.0 → 1.0.2

package/assets/styles/style.css

@@ -1,248 +1,49 @@
-@charset "UTF-8";
-.context-menu-trigger[data-v-8adfdf56] {
-        width: 1px;
-        height: 1px;
-        z-index: 9999;
-}
-.drag-handler[data-v-f7343dfb] {
-  position: absolute;
-  top: -1px;
-  left: -1px;
-  height: 20px;
-  line-height: 20px;
-  z-index: 10;
-  background: var(--ant-primary-color);
-  display: flex;
-  align-items: center;
-  padding: 0 4px;
-  opacity: 0;
-  transition: opacity 0.2s;
-  visibility: hidden;
-}
-.drag-handler.selected[data-v-f7343dfb] {
-  opacity: 0.6;
-  visibility: visible;
-}
-.drag-handler.selected[data-v-f7343dfb]:hover {
-  opacity: 1;
+@charset "UTF-8";/* 全局css变量 */
+.primary-color {
+  color: var(--ant-primary-color);
 }
-.drag-handler i[data-v-f7343dfb] {
-  font-size: 12px;
-  font-style: normal;
-  color: #fff;
-  margin: 0 2px;
-  cursor: move;
-  display: flex;
-  align-items: center;
-}/* 调试面板样式 */
-.debug-panel[data-v-68185782] {
-  position: absolute;
-  top: 0;
-  right: 0;
-  width: 400px;
-  height: 100vh;
-  background-color: #fff;
-  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
-  z-index: 9999;
-  transition: transform 0.3s ease-in-out;
-  display: flex;
-  flex-direction: column;
-  border-top-left-radius: 8px;
-  border-bottom-left-radius: 8px;
+.background-opacity {
+  background: var(--ant-primary-4);
 }
-.debug-panel[data-v-68185782] .jv-container .jv-code {
+.form-widget-list .ghost {
+  content: '';
+  font-size: 0;
+  height: 3px;
+  box-sizing: border-box;
+  background: var(--ant-primary-4);
+  border: 2px solid var(--ant-primary-4);
+  outline-width: 0;
   padding: 0;
+  overflow: hidden;
 }
-.debug-panel.collapsed[data-v-68185782] {
-  transform: translateX(400px);
-}
-.debug-panel.collapsed .debug-toggle[data-v-68185782] {
-  left: -40px;
-  border-radius: 8px 0 0 8px;
-  width: 40px;
-}
-.debug-panel .debug-toggle[data-v-68185782] {
-  position: absolute;
-  left: -40px;
-  top: 20px;
-  width: 40px;
-  height: 40px;
-  background-color: var(--ant-primary-color);
-  color: #fff;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  border-radius: 8px 0 0 8px;
-  font-size: 12px;
-  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
-  writing-mode: vertical-lr;
-  padding: 8px 0;
-  user-select: none;
-}
-.debug-panel .debug-content[data-v-68185782] {
-  flex: 1;
-  overflow: auto;
-  padding: 16px;
-  background-color: #f5f7fa;
-}
-.debug-panel .debug-content .debug-section[data-v-68185782] {
-  margin-bottom: 24px;
-  background-color: #fff;
-  border-radius: 8px;
-  padding: 16px;
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
-}
-.debug-panel .debug-content .debug-section h3[data-v-68185782] {
-  margin: 0 0 12px 0;
-  font-size: 14px;
-  font-weight: 600;
-  color: #333;
-  border-bottom: 1px solid #e8e8e8;
-  padding-bottom: 8px;
-}
-.debug-panel .debug-content .debug-section .empty-state[data-v-68185782] {
-  color: #999;
-  font-size: 12px;
-  text-align: center;
-  padding: 20px;
-}
-.debug-panel .debug-content .debug-section .widget-list[data-v-68185782] {
-  display: flex;
-  flex-direction: column;
-  gap: 2px;
-}
-.debug-panel .debug-content .debug-section .widget-list .widget-item[data-v-68185782] {
-  border: 1px solid #e8e8e8;
-  border-radius: 4px;
-  padding: 2px 4px;
-  line-height: 1.2;
-  background-color: #fafafa;
-  cursor: pointer;
-}
-.debug-panel .debug-content .debug-section .widget-list .widget-item .widget-key[data-v-68185782] {
-  font-weight: 600;
+/* 滚动条样式 end */
+.button-text-highlight.ant-btn {
+  font-weight: bold;
   color: var(--ant-primary-color);
-  font-size: 12px;
-}
-.debug-panel .debug-content pre[data-v-68185782] {
-  margin: 0;
-  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
-  font-size: 12px;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-  background-color: #f5f5f5;
-  padding: 8px;
-  border-radius: 4px;
-  color: #333;
-}
-.widget-wrapper[data-v-3afaf1f7] {
-  position: relative;
-  padding: 2px;
-  min-height: 20px;
-  cursor: pointer;
-  border: 1px dashed #cccccc;
-  gap: 3px;
 }
-.widget-wrapper.container-wrapper[data-v-3afaf1f7] {
-  border-width: 2px;
-}
-.widget-wrapper.container-wrapper.selected[data-v-3afaf1f7] {
-  outline: solid var(--ant-primary-color);
-}
-.widget-wrapper.selected[data-v-3afaf1f7] {
-  /* background-color: rgba(24, 144, 255, 0.1); */
-  outline: 2px solid var(--ant-primary-color);
-}
-.widget-wrapper .action-buttons[data-v-3afaf1f7] {
-  position: absolute;
-  bottom: -2px;
-  right: -2px;
-  height: 22px;
-  width: 22px;
-  background-color: var(--ant-primary-color);
-  color: #fff;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  z-index: 11;
+.custom-divider.ant-divider {
   font-size: 14px;
+  margin: 5px;
 }
-.widget-wrapper .action-buttons[data-v-3afaf1f7]:hover {
-  background-color: #ff4d4f;
-}
-.designer-widget-list[data-v-49600cf3] {
-  position: relative;
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-}
-.designer-widget-list.empty-list[data-v-49600cf3] {
-  min-height: 100px;
-}
-.designer-widget-list .empty-drop-zone[data-v-49600cf3] {
-  position: absolute;
-  left: 0;
-  width: 100%;
-  z-index: 2;
-}
-.designer-widget-list[data-v-49600cf3] .sortable-ghost {
-  z-index: 99;
-}
-.list-transition-container[data-v-49600cf3] {
-  display: flex;
-  flex-direction: column;
-  padding: 2px;
-}
-.transition-group-el[data-v-49600cf3] {
-  position: relative;
-  padding: 1px;
-}
-.transition-group-el .sortable-ghost[data-v-49600cf3] {
-  width: 100%;
-}
-
-/* SortableJS 自动应用的类 */
-.ghost-placeholder[data-v-49600cf3] {
-  opacity: 0.5;
-  background: #c8ebfb;
-  border: 2px dashed var(--ant-primary-color);
-  height: 40px;
-  margin: 4px 0;
-  border-radius: 4px;
-}
-.sortable-chosen[data-v-49600cf3] {
-  background: #fdfdfd;
-}
-.empty-drop-zone[data-v-49600cf3] {
-  margin: 2px 0;
-  height: 90px;
-  background: #f5f5f5;
-  border: 1px dashed #d9d9d9;
-  border-radius: 2px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #999;
-  font-size: 14px;
+.field-wrapper .full-width-input {
+  width: 100% !important;
 }
-.desginer-canvas[data-v-49600cf3] .ant-form-item {
-  margin-bottom: 0;
-}.sub-form-container[data-v-ddd06b7d] {
+@tailwind components;
+@tailwind utilities;
+.sub-form-container[data-v-a3f1d201] {
   margin-bottom: 16px;
   text-align: left;
   background: #fafafa;
   border-radius: 8px;
   padding: 10px;
 }
-.sub-form-container .header-row[data-v-ddd06b7d] {
+.sub-form-container .header-row[data-v-a3f1d201] {
   margin-top: 15px;
 }
-.sub-form-container .header-row[data-v-ddd06b7d] .action-button {
+.sub-form-container .header-row[data-v-a3f1d201] .action-button {
   height: 35px;
 }
-.sub-form-container .sub-form-row[data-v-ddd06b7d] {
+.sub-form-container .sub-form-row[data-v-a3f1d201] {
   display: flex;
   align-items: center;
   background: white;
@@ -250,22 +51,22 @@
   border-radius: 6px;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
 }
-.sub-form-container .sub-form-row .row-number-span[data-v-ddd06b7d] {
+.sub-form-container .sub-form-row .row-number-span[data-v-a3f1d201] {
   margin-left: 16px;
 }
-.sub-form-action-column[data-v-ddd06b7d] {
+.sub-form-action-column[data-v-a3f1d201] {
   display: inline-block;
   align-items: center;
   text-align: center;
   padding: 8px;
 }
-.grid-sub-form-data-row[data-v-ddd06b7d] {
+.grid-sub-form-data-row[data-v-a3f1d201] {
   display: inline-block;
   flex: 1;
   padding: 10px;
   position: relative;
 }
-.grid-sub-form-data-row[data-v-ddd06b7d]:before, .grid-sub-form-data-row[data-v-ddd06b7d]:after {
+.grid-sub-form-data-row[data-v-a3f1d201]:before, .grid-sub-form-data-row[data-v-a3f1d201]:after {
   content: "";
   display: inline-block;
   width: 1px;
@@ -275,16 +76,16 @@
   top: 50%;
   transform: translateY(-50%);
 }
-.grid-sub-form-data-row[data-v-ddd06b7d]:before {
+.grid-sub-form-data-row[data-v-a3f1d201]:before {
   left: 0;
 }
-.grid-sub-form-data-row[data-v-ddd06b7d]:after {
+.grid-sub-form-data-row[data-v-a3f1d201]:after {
   right: 0;
 }
-.grid-sub-form-data-row[data-v-ddd06b7d] .ant-form-item {
+.grid-sub-form-data-row[data-v-a3f1d201] .ant-form-item {
   margin-bottom: 0;
 }
-div.row-no-column[data-v-ddd06b7d] {
+div.row-no-column[data-v-a3f1d201] {
   display: flex;
   align-items: center;
   width: 50px;
@@ -295,7 +96,7 @@ div.row-no-column[data-v-ddd06b7d] {
   font-size: 14px;
   color: #666;
 }
-.action-button-column[data-v-ddd06b7d] {
+.action-button-column[data-v-a3f1d201] {
   width: 140px;
 }.grid-cell[data-v-13ad810a] {
   padding: 3px;
@@ -303,116 +104,130 @@ div.row-no-column[data-v-ddd06b7d] {
 }
 .grid-cell .form-widget-list[data-v-13ad810a] {
   min-height: 28px;
-}.main-container {
-  background: #fff;
+}.loading-wrapper[data-v-ce96bd20] {
+  min-height: 300px;
+  padding: 20px;
 }
-.main-container .ant-layout-sider {
-  background: #fff;
+.ant-form .ant-form-item-explain.ant-form-item-explain-connected[data-v-ce96bd20] {
+  display: none;
 }
-.main-container :deep(aside) {
-  /* 防止aside样式被外部样式覆盖！！ */
-  margin: 0;
-  padding: 0;
-  background: inherit;
+.button-list-container[data-v-37429548] {
+  flex: 1;
+  display: flex;
+  justify-content: var(--flex);
 }
-.main-container .form-widget-main {
-  padding: 0;
-  position: relative;
-  overflow-x: hidden;
-  flex: 1 0 0;
+.button-list-container .button-icon[data-v-37429548] {
+  margin-right: 4px;
+}.dialog-content {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-height: 300px;
 }
-.main-container .full-height {
-  height: 100%;
-  overflow-y: hidden;
+.column-row[data-v-7ae2c55f] {
+  height: 400px;
+  display: flex;
 }
-.main-container .center-layout-container {
-  min-width: 680px;
-  border-left: 2px solid #ebeef5;
-  border-right: 2px dotted #ebeef5;
+.column-row .col-left[data-v-7ae2c55f],
+.column-row .col-right[data-v-7ae2c55f] {
   display: flex;
   flex-direction: column;
+  height: 100%;
 }
-.main-container .form-widget-footer {
-  flex: 0 0 50px;
-  align-items: center;
-  background: #fff;
+.column-row .col-left[data-v-7ae2c55f] {
+  padding-left: 20px !important;
+  padding-right: 10px !important;
+  border-right: 1px solid #f0f0f0;
+}
+.column-row .col-right[data-v-7ae2c55f] {
+  padding-left: 10px !important;
+}
+.column-row .col-left-title[data-v-7ae2c55f],
+.column-row .col-right-title[data-v-7ae2c55f] {
   display: flex;
   justify-content: space-between;
-  padding: 0 15px;
-}
-.main-container .main-header {
-  border-bottom: 2px solid #ebeef5;
-  background: #fff;
-  padding: 0;
-  height: 48px !important;
-  line-height: 48px !important;
-  min-width: 800px;
+  align-items: center;
+  margin-bottom: 10px;
 }
-.main-container .container-scroll-bar {
-  height: 100%;
+.column-row .col-left-title .title[data-v-7ae2c55f],
+.column-row .col-right-title .title[data-v-7ae2c55f] {
+  font-weight: 500;
+  color: #333;
 }
-.main-container .container-scroll-bar > .form-widget-container {
-  height: 100%;
+.column-row .col-left-title .search[data-v-7ae2c55f],
+.column-row .col-right-title .search[data-v-7ae2c55f] {
+  width: 150px;
 }
-.main-container .toolbar-header {
-  font-size: 14px;
-  border-bottom: 1px solid rgba(5, 5, 5, 0.06);
-  height: 42px !important;
-  background: #fff;
-  padding: 0;
+.column-row .col-left-content[data-v-7ae2c55f],
+.column-row .col-right-content[data-v-7ae2c55f] {
+  flex: 1 0 0;
+  overflow-y: auto;
+  overflow-x: hidden;
 }
-.main-container .side-panel {
-  width: 260px !important;
-  overflow-y: hidden;
+.column-row .checkbox-row[data-v-7ae2c55f] {
+  margin-top: 10px;
 }
-div.main-title {
-  font-size: 18px;
-  color: #242424;
+.column-row .col-right-content-item[data-v-7ae2c55f] {
+  margin-right: 5px;
+  height: 32px;
   display: flex;
   align-items: center;
-  justify-items: center;
 }
-div.main-title img {
-  cursor: pointer;
-  width: 36px;
-  height: 36px;
+.column-row .col-right-content-item .col-right-content-item-left[data-v-7ae2c55f] {
+  flex: 1 0 0;
+  display: flex;
+  align-items: center;
 }
-div.main-title span.bold {
-  font-size: 20px;
-  font-weight: bold;
-  margin: 0 6px 0 6px;
+.column-row .col-right-content-item .col-right-content-item-left .drag-handle[data-v-7ae2c55f] {
+  cursor: move;
+  margin-right: 8px;
+  flex-shrink: 0;
 }
-div.main-title span.version-span {
+.column-row .col-right-content-item .col-right-content-item-left .title[data-v-7ae2c55f] {
+  flex: 1 0 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   font-size: 14px;
-  color: #101f1c;
-  margin-left: 6px;
 }
-.float-left {
-  float: left;
+.column-row .col-right-content-item .col-right-content-item-left .icon-ding[data-v-7ae2c55f] {
+  margin-left: 8px;
+  flex-shrink: 0;
+  opacity: 0;
+  transition: opacity 0.2s;
 }
-.float-right {
-  float: right;
+.column-row .col-right-content-item .col-right-content-item-left .icon-ding[data-v-7ae2c55f]:hover {
+  opacity: 1;
 }
-.button-list-container[data-v-37429548] {
-  flex: 1;
-  display: flex;
-  justify-content: var(--flex);
+.column-row .col-right-content-item .col-right-content-item-left .icon-ding.showIcon[data-v-7ae2c55f] {
+  opacity: 1;
 }
-.button-list-container .button-icon[data-v-37429548] {
-  margin-right: 4px;
-}.dialog-content {
+.column-row .col-right-content-item:hover .icon-ding[data-v-7ae2c55f] {
+  opacity: 1;
+}
+.column-row .col-right-content-item .col-right-content-item-right[data-v-7ae2c55f] {
+  flex: 1 0 0;
   display: flex;
-  flex: 1;
-  flex-direction: column;
-  min-height: 300px;
+  justify-content: flex-end;
+  padding-right: 10px;
+}
+.column-row .col-right-content-item .col-right-content-item-right[data-v-7ae2c55f] .icon-guanbi {
+  opacity: 0.6;
+}
+.column-row .col-right-content-item .col-right-content-item-right[data-v-7ae2c55f] .icon-guanbi:hover {
+  opacity: 1;
 }
-.talbe-wrapper[data-v-598f1ef3] {
+.talbe-wrapper[data-v-02a5f9df] {
   width: 100%;
 }
-.talbe-wrapper .vxe-grid[data-v-598f1ef3] {
+.talbe-wrapper .table-toolbar[data-v-02a5f9df] {
+  padding: 8px 0;
+  margin-bottom: 8px;
+}
+.talbe-wrapper .vxe-grid[data-v-02a5f9df] {
   width: 100%;
 }
-.talbe-wrapper__pagination[data-v-598f1ef3] {
+.talbe-wrapper__pagination[data-v-02a5f9df] {
   margin-top: 10px;
   display: flex;
   justify-content: end;
@@ -446,91 +261,340 @@ div.main-title span.version-span {
 }
 .tab-container[data-v-1080446b] .tab-content-wrapper {
   min-height: 100px;
-}.loading-wrapper[data-v-bedb1a87] {
-  min-height: 300px;
+}.drag-handler[data-v-d93fc5cc] {
+  position: absolute;
+  top: -1px;
+  left: -1px;
+  height: 20px;
+  line-height: 20px;
+  z-index: 12;
+  background: var(--ant-primary-color);
+  display: flex;
+  align-items: center;
+  padding: 0 4px;
+  opacity: 0;
+  transition: opacity 0.2s;
+  visibility: hidden;
+}
+.drag-handler.selected[data-v-d93fc5cc] {
+  opacity: 0.6;
+  visibility: visible;
+}
+.drag-handler.selected[data-v-d93fc5cc]:hover {
+  opacity: 1;
+}
+.drag-handler i[data-v-d93fc5cc] {
+  font-size: 12px;
+  font-style: normal;
+  color: #fff;
+  margin: 0 2px;
+  cursor: move;
+  display: flex;
+  align-items: center;
+}
+.context-menu-trigger[data-v-8adfdf56] {
+        width: 1px;
+        height: 1px;
+        z-index: 9999;
+}
+.widget-wrapper[data-v-f2552afd] {
+  position: relative;
+  padding: 2px;
+  min-height: 20px;
+  cursor: pointer;
+  border: 1px dashed #cccccc;
+  gap: 3px;
+}
+.widget-wrapper.container-wrapper[data-v-f2552afd] {
+  border-width: 2px;
+}
+.widget-wrapper.container-wrapper.selected[data-v-f2552afd] {
+  outline: solid var(--ant-primary-color);
+}
+.widget-wrapper.selected[data-v-f2552afd] {
+  /* background-color: rgba(24, 144, 255, 0.1); */
+  outline: 2px solid var(--ant-primary-color);
+}
+.widget-wrapper .widget-hidden[data-v-f2552afd] {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1) 10px, rgba(0, 0, 0, 0.2) 10px, rgba(0, 0, 0, 0.2) 20px);
+  z-index: 11;
+}
+.widget-wrapper .action-buttons[data-v-f2552afd] {
+  position: absolute;
+  bottom: -2px;
+  right: -2px;
+  height: 22px;
+  width: 22px;
+  background-color: var(--ant-primary-color);
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  z-index: 11;
+  font-size: 14px;
+}
+.widget-wrapper .action-buttons[data-v-f2552afd]:hover {
+  background-color: #ff4d4f;
+}
+.designer-widget-list[data-v-0fdc8abe] {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+}
+.designer-widget-list.empty-list[data-v-0fdc8abe] {
+  min-height: 96px;
+}
+.designer-widget-list .empty-drop-zone[data-v-0fdc8abe] {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  z-index: 2;
+}
+.designer-widget-list[data-v-0fdc8abe] .sortable-ghost {
+  z-index: 99;
+}
+.list-transition-container[data-v-0fdc8abe] {
+  display: flex;
+  flex-direction: column;
+  padding: 2px;
+}
+.transition-group-el[data-v-0fdc8abe] {
+  position: relative;
+  padding: 1px;
+}
+.transition-group-el .sortable-ghost[data-v-0fdc8abe] {
+  width: 100%;
+}
+
+/* SortableJS 自动应用的类 */
+.ghost-placeholder[data-v-0fdc8abe] {
+  opacity: 0.5;
+  background: #c8ebfb;
+  border: 2px dashed var(--ant-primary-color);
+  height: 40px;
+  margin: 4px 0;
+  border-radius: 4px;
+}
+.sortable-chosen[data-v-0fdc8abe] {
+  background: #fdfdfd;
+}
+.empty-drop-zone[data-v-0fdc8abe] {
+  line-height: 1.2;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  font-size: 12px;
+  margin: 2px 0;
+  height: 90px;
+  background: rgba(0, 0, 0, 0.05);
+  border: 1px dashed #d9d9d9;
+  border-radius: 2px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #999;
+  font-size: 14px;
+}
+.desginer-canvas[data-v-0fdc8abe] .ant-form-item {
+  margin-bottom: 0;
+}/* 调试面板样式 */
+.debug-panel[data-v-10eb5e61] {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 400px;
+  height: 100vh;
+  background-color: #fff;
+  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
+  z-index: 9999;
+  transition: transform 0.3s ease-in-out;
+  display: flex;
+  flex-direction: column;
+  border-top-left-radius: 8px;
+  border-bottom-left-radius: 8px;
+}
+.debug-panel[data-v-10eb5e61] .jv-container .jv-code {
+  padding: 0;
+}
+.debug-panel.collapsed[data-v-10eb5e61] {
+  transform: translateX(400px);
+}
+.debug-panel.collapsed .debug-toggle[data-v-10eb5e61] {
+  left: -40px;
+  border-radius: 8px 0 0 8px;
+  width: 40px;
+}
+.debug-panel .debug-toggle[data-v-10eb5e61] {
+  position: absolute;
+  left: -40px;
+  top: 20px;
+  width: 40px;
+  height: 40px;
+  background-color: var(--ant-primary-color);
+  color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  border-radius: 8px 0 0 8px;
+  font-size: 12px;
+  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.15);
+  writing-mode: vertical-lr;
+  padding: 8px 0;
+  user-select: none;
+}
+.debug-panel .debug-content[data-v-10eb5e61] {
+  flex: 1;
+  overflow: auto;
+  padding: 16px;
+  background-color: #f5f7fa;
+}
+.debug-panel .debug-content .debug-section[data-v-10eb5e61] {
+  margin-bottom: 24px;
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 16px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+.debug-panel .debug-content .debug-section h3[data-v-10eb5e61] {
+  margin: 0 0 12px 0;
+  font-size: 14px;
+  font-weight: 600;
+  color: #333;
+  border-bottom: 1px solid #e8e8e8;
+  padding-bottom: 8px;
+}
+.debug-panel .debug-content .debug-section .empty-state[data-v-10eb5e61] {
+  color: #999;
+  font-size: 12px;
+  text-align: center;
   padding: 20px;
 }
-.ant-form .ant-form-item-explain.ant-form-item-explain-connected[data-v-bedb1a87] {
-  display: none;
+.debug-panel .debug-content .debug-section .widget-list[data-v-10eb5e61] {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.debug-panel .debug-content .debug-section .widget-list .widget-item[data-v-10eb5e61] {
+  border: 1px solid #e8e8e8;
+  border-radius: 4px;
+  padding: 2px 4px;
+  line-height: 1.2;
+  background-color: #fafafa;
+  cursor: pointer;
+}
+.debug-panel .debug-content .debug-section .widget-list .widget-item .widget-key[data-v-10eb5e61] {
+  font-weight: 600;
+  color: var(--ant-primary-color);
+  font-size: 12px;
+}
+.debug-panel .debug-content pre[data-v-10eb5e61] {
+  margin: 0;
+  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+  font-size: 12px;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  background-color: #f5f5f5;
+  padding: 8px;
+  border-radius: 4px;
+  color: #333;
 }
 
-.field-wrapper[data-v-4322845c] {
+.field-wrapper[data-v-fe290edb] {
   position: relative;
 }
-.ant-form-item[data-v-4322845c] {
+.ant-form-item[data-v-fe290edb] {
   position: relative;
   /* 隐藏Chrome浏览器中el-input数字输入框右侧的上下调整小箭头 */
 }
-.ant-form-item[data-v-4322845c] .ant-form-item-label {
+.ant-form-item[data-v-fe290edb] .ant-form-item-label {
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-.ant-form-item span.custom-label[data-v-4322845c] {
+.ant-form-item span.custom-label[data-v-fe290edb] {
   display: flex;
 }
-.ant-form-item span.custom-label i[data-v-4322845c] {
+.ant-form-item span.custom-label i[data-v-fe290edb] {
   margin: 0 3px;
 }
-.ant-form-item[data-v-4322845c] .hide-spin-button input::-webkit-outer-spin-button,
-.ant-form-item[data-v-4322845c] .hide-spin-button input::-webkit-inner-spin-button {
+.ant-form-item[data-v-fe290edb] .hide-spin-button input::-webkit-outer-spin-button,
+.ant-form-item[data-v-fe290edb] .hide-spin-button input::-webkit-inner-spin-button {
   -webkit-appearance: none !important;
-}
-/* form-item-wrapper已引入，还需要重复引入吗？ */
-[data-v-038cba28] .bjs-powered-by {
+}[data-v-3974eef4] .bjs-powered-by {
   display: none;
 }
-[data-v-038cba28] .bjs-breadcrumbs {
+[data-v-3974eef4] .bjs-breadcrumbs {
   display: none;
-}.flex[data-v-b51e000d] {
+}.flex[data-v-198d712e] {
   flex: 1;
   display: flex;
   justify-content: var(--flex);
-}.hide-text-span[data-v-7e3e590f] span {
+}.hide-text-span[data-v-f3a8f507] span {
   display: none;
+}.designer[data-v-7291d54f] {
+  position: relative;
+}
+.designer[data-v-7291d54f]::before {
+  position: absolute;
+  z-index: 99;
+  content: "";
+  display: inline-block;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.01);
 }
 /* form-item-wrapper已引入，还需要重复引入吗？ */
 /* form-item-wrapper已引入，还需要重复引入吗？ */
-.auto-full-width[data-v-deec5b65] {
+.auto-full-width[data-v-e160e0cb] {
   width: 100%;
 }
 /* form-item-wrapper已引入，还需要重复引入吗？ */
-.auto-full-width[data-v-932f89e4] {
+.auto-full-width[data-v-4aad080a] {
   width: 100%;
 }
-.auto-full-width[data-v-932f89e4] .ant-picker {
+.auto-full-width[data-v-4aad080a] .ant-picker {
   width: 100% !important;
-}.hide-text-span[data-v-41213ad4] span {
+}.hide-text-span[data-v-8b716c42] span {
   display: none;
-}.fileUploadTip[data-v-fd798690] {
+}.fileUploadTip[data-v-69c9393f] {
   font-size: 12px;
   margin-top: 10px;
 }
 /* form-item-wrapper已引入，还需要重复引入吗？ */
 /* form-item-wrapper已引入，还需要重复引入吗？ */
-/* form-item-wrapper已引入，还需要重复引入吗？ */.rich-editor-widget[data-v-c4e08a91] .ql-toolbar.ql-snow {
+/* form-item-wrapper已引入，还需要重复引入吗？ */.rich-editor-widget[data-v-4fccf1cc] .ql-toolbar.ql-snow {
   border-color: #d9d9d9;
   border-top-left-radius: 8px;
   border-top-right-radius: 8px;
 }
-.rich-editor-widget[data-v-c4e08a91] .ql-container.ql-snow {
+.rich-editor-widget[data-v-4fccf1cc] .ql-container.ql-snow {
   border-bottom-left-radius: 8px;
   border-bottom-right-radius: 8px;
   border-color: #d9d9d9;
 }
 /* form-item-wrapper已引入，还需要重复引入吗？ */
-.design-select-box[data-v-c3c936a7] {
+.design-select-box[data-v-d0796c07] {
   display: flex;
   width: 100%;
 }
-.design-select-box.useModal[data-v-c3c936a7] .ant-select-selector {
+.design-select-box.useModal[data-v-d0796c07] .ant-select-selector {
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
 }
-.design-select-box .ant-select[data-v-c3c936a7] {
+.design-select-box .ant-select[data-v-d0796c07] {
   flex: 1 0 0;
   min-width: 0;
 }
-.design-select-box .useModal-svg[data-v-c3c936a7] {
+.design-select-box .useModal-svg[data-v-d0796c07] {
   border: 1px solid #d9d9d9;
   cursor: pointer;
   width: 40px;
@@ -542,9 +606,9 @@ div.main-title span.version-span {
   border-bottom-right-radius: 6px;
 }
 /* form-item-wrapper已引入，还需要重复引入吗？ */
-.readonly-mode-switch[data-v-55619f83] {
+.readonly-mode-switch[data-v-abb9e521] {
   display: none;
-}.readonly-mode-field[data-v-04869c36] {
+}.readonly-mode-field[data-v-ee000014] {
   display: inline-block;
   white-space: pre-wrap;
   line-height: 1.5;
@@ -552,48 +616,54 @@ div.main-title span.version-span {
   overflow-y: auto;
 }
 /* form-item-wrapper已引入，还需要重复引入吗？ */
-.auto-full-width[data-v-1b009c7b] {
+.auto-full-width[data-v-f1f3f35c] {
   width: 100%;
 }
-.auto-full-width[data-v-1b009c7b] .ant-picker {
+.auto-full-width[data-v-f1f3f35c] .ant-picker {
   width: 100% !important;
 }
-.readonly-mode-time-range[data-v-1b009c7b] .ant-picker {
+.readonly-mode-time-range[data-v-f1f3f35c] .ant-picker {
   display: none;
 }
 /* form-item-wrapper已引入，还需要重复引入吗？ */
-.auto-full-width[data-v-5c22cb89] {
+.auto-full-width[data-v-3bf11597] {
   width: 100%;
 }
-.auto-full-width[data-v-5c22cb89] .ant-picker {
+.auto-full-width[data-v-3bf11597] .ant-picker {
   width: 100% !important;
 }
-.readonly-mode-time[data-v-5c22cb89] .ant-picker {
+.readonly-mode-time[data-v-3bf11597] .ant-picker {
   display: none;
-}[data-v-bad9595c] .ant-tree {
+}[data-v-83ba983b] .ant-tree {
   background: transparent;
 }
-[data-v-bad9595c] .ant-tree .ant-tree-checkbox {
+[data-v-83ba983b] .ant-tree .ant-tree-checkbox {
   margin-block-start: 0;
-}.grid-cell[data-v-046dd94b] {
+}.grid-cell[data-v-aac76d55] {
   min-height: 38px !important;
   padding: 3px;
   border: 1px dashed #336699;
   position: relative;
 }
-.grid-cell.selected[data-v-046dd94b] {
+.grid-cell.selected[data-v-aac76d55] {
   outline: 1px solid var(--ant-primary-color) !important;
 }
-.grid-cell[data-v-046dd94b] .widget-wrapper.container-wrapper {
+.grid-cell[data-v-aac76d55] .widget-wrapper.container-wrapper {
   border-width: 1px !important;
 }
-.grid-cell[data-v-046dd94b] .widget-wrapper.container-wrapper.selected {
+.grid-cell[data-v-aac76d55] .widget-wrapper.container-wrapper.selected {
   outline: 1px solid var(--ant-primary-color) !important;
 }
-.grid-cell .form-widget-list[data-v-046dd94b] {
+.grid-cell .form-widget-list[data-v-aac76d55] {
   min-height: 28px;
 }
-.grid-cell .grid-col-action[data-v-046dd94b] {
+.grid-cell[data-v-aac76d55] .designer-widget-list.empty-list {
+  min-height: 48px;
+}
+.grid-cell[data-v-aac76d55] .designer-widget-list.empty-list .empty-drop-zone {
+  height: 42px;
+}
+.grid-cell .grid-col-action[data-v-aac76d55] {
   position: absolute;
   bottom: 0;
   right: -2px;
@@ -602,13 +672,13 @@ div.main-title span.version-span {
   background: var(--ant-primary-4);
   z-index: 999;
 }
-.grid-cell .grid-col-action i[data-v-046dd94b] {
+.grid-cell .grid-col-action i[data-v-aac76d55] {
   font-size: 14px;
   color: #fff;
   margin: 0 5px;
   cursor: pointer;
 }
-.grid-cell .grid-col-handler[data-v-046dd94b] {
+.grid-cell .grid-col-handler[data-v-aac76d55] {
   position: absolute;
   top: -2px;
   left: -2px;
@@ -617,79 +687,81 @@ div.main-title span.version-span {
   background: var(--ant-primary-4);
   z-index: 9;
 }
-.grid-cell .grid-col-handler i[data-v-046dd94b] {
+.grid-cell .grid-col-handler i[data-v-aac76d55] {
   font-size: 14px;
   font-style: normal;
   color: #fff;
   margin: 4px;
   cursor: default;
 }
-.grid-col-action[data-v-046dd94b] .svg-icon,
-.grid-col-handler[data-v-046dd94b] .svg-icon {
+.grid-col-action[data-v-aac76d55] .svg-icon,
+.grid-col-handler[data-v-aac76d55] .svg-icon {
   margin-left: 0.1em;
   margin-right: 0.1em;
-}.grid-container[data-v-40047deb] {
+}.grid-container[data-v-d41dbfac] {
   min-height: 50px;
-  padding: 5px 10px;
+  padding: 3px;
 }
-.grid-container .form-widget-list[data-v-40047deb] {
+.grid-container .form-widget-list[data-v-d41dbfac] {
   min-height: 28px;
-}.talbe-wrapper[data-v-ad6fb3c4] {
+}.top-action[data-v-d47a2444] {
+  display: flex;
+  gap: 8px;
+  padding: 4px 0 8px;
+}
+.talbe-wrapper[data-v-d47a2444] {
   width: 100%;
 }
-.talbe-wrapper .vxe-grid[data-v-ad6fb3c4] {
+.talbe-wrapper .vxe-grid[data-v-d47a2444] {
   width: 100%;
 }
-.talbe-wrapper__pagination[data-v-ad6fb3c4] {
+.talbe-wrapper__pagination[data-v-d47a2444] {
   margin-top: 10px;
   display: flex;
   justify-content: end;
-}.sub-form-container[data-v-49c81f5e] {
-  min-height: 100px;
 }.tab-container .form-widget-list[data-v-3280ee5e] {
   min-height: 28px;
 }
 .tab-container[data-v-3280ee5e] .ant-tabs.ant-tabs-bottom .ant-tabs-nav-wrap, .tab-container[data-v-3280ee5e] .ant-tabs.ant-tabs-top .ant-tabs-nav-wrap {
   padding-left: 26px;
-}.collapse-container[data-v-3032d8b6] {
+}.collapse-container[data-v-eefdb1f5] {
   display: flex;
   margin: 2px;
   height: 100%;
   width: 100%;
   flex: 1 0 0;
 }
-.collapse-container .form-widget-list[data-v-3032d8b6] {
+.collapse-container .form-widget-list[data-v-eefdb1f5] {
   min-height: 28px;
 }
-.collapse-container[data-v-3032d8b6] .header-right {
-  background-color: #fff;
-}
-.collapse-container[data-v-3032d8b6] .header-right .form-widget-list {
+.collapse-container[data-v-eefdb1f5] .header-right .form-widget-list {
   min-width: 200px;
 }
-.tpf-collapse[data-v-3032d8b6] {
+.tpf-collapse[data-v-eefdb1f5] {
   padding: 5px;
 }
-.tpf-collapse .collapse-right[data-v-3032d8b6] {
+.tpf-collapse .collapse-right[data-v-eefdb1f5] {
   min-width: 200px;
   min-height: 30px;
-  border: 1px dashed #666;
 }
-.tpf-collapse .collapse-right[data-v-3032d8b6] .designer-widget-list {
+.tpf-collapse .collapse-right[data-v-eefdb1f5] .designer-widget-list {
   min-height: 34px;
 }
-.tpf-collapse .collapse-right[data-v-3032d8b6] .designer-widget-list .empty-drop-zone {
+.tpf-collapse .collapse-right[data-v-eefdb1f5] .designer-widget-list .empty-drop-zone {
+  background: #fff;
+}
+.tpf-collapse .collapse-right[data-v-eefdb1f5] .designer-widget-list .empty-drop-zone {
   height: 30px;
   top: 0;
 }
-.tpf-collapse[data-v-3032d8b6] .design-time-bottom-margin {
+.tpf-collapse[data-v-eefdb1f5] .design-time-bottom-margin {
   margin-bottom: 0;
 }
-.tpf-collapse[data-v-3032d8b6] .design-time-bottom-margin .static-content-item {
+.tpf-collapse[data-v-eefdb1f5] .design-time-bottom-margin .static-content-item {
   margin-bottom: 0;
   padding: 3px;
 }
-.tpf-collapse[data-v-3032d8b6] .tpf-collapse-content-wrapper {
+.tpf-collapse[data-v-eefdb1f5] .tpf-collapse-content-wrapper {
   overflow: hidden;
   background-color: #fff;
 }
@@ -708,13 +780,16 @@ div.main-title span.version-span {
   display: flex;
   align-items: center;
   height: 35px;
-}.box-container[data-v-e33faf2b] {
+}.box-container[data-v-e857478a] {
   width: 100%;
   position: relative;
   padding-bottom: 20px;
   display: flex;
-  min-height: 100px;
+  min-width: 0;
+  overflow: hidden;
 }
-.box-container[data-v-e33faf2b] .designer-widget-list {
+.box-container[data-v-e857478a] .designer-widget-list {
   flex: 1;
+  overflow: hidden;
+  min-width: 0;
 }