n8n-editor-ui 1.97.1 → 1.98.1

package/dist/assets/{NodeDetailsView-6JHPI3t-.css → NodeDetailsView-DWA1ZgwG.css}

@@ -120,56 +120,58 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._container_86rol_123 {
-  font-weight: var(--font-weight-medium);
-  display: flex;
-  font-size: var(--font-size-m);
-  line-height: var(--font-line-height-compact);
-  overflow-wrap: anywhere;
-  padding-right: var(--spacing-s);
-  overflow: hidden;
-}
-._title_86rol_133 {
-  max-height: 100px;
-  display: -webkit-box;
-  -webkit-line-clamp: 5;
-  -webkit-box-orient: vertical;
-  color: var(--color-text-dark);
+._dragContainer_16elv_123 {
+  pointer-events: all;
 }
-._hoverable_86rol_141:hover {
-  cursor: pointer;
+._dragButton_16elv_127 {
+  background-color: var(--color-background-base);
+  width: 64px;
+  height: 21px;
+  border-top-left-radius: var(--border-radius-base);
+  border-top-right-radius: var(--border-radius-base);
+  cursor: grab;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: visible;
+  position: relative;
+  z-index: 3;
 }
-._hoverable_86rol_141:hover ._editIcon_86rol_144 {
-  display: inline-block;
+._dragButton_16elv_127:hover ._leftArrow_16elv_141,
+._dragButton_16elv_127:hover ._rightArrow_16elv_142 {
+  visibility: visible;
 }
-._iconWrapper_86rol_148 {
-  display: inline-flex;
-  margin-right: var(--spacing-2xs);
+._visible_16elv_146 {
+  visibility: visible !important;
 }
-._editIcon_86rol_144 {
-  display: none;
-  font-size: var(--font-size-xs);
-  color: var(--color-text-base);
+._arrow_16elv_150 {
   position: absolute;
-  bottom: 0;
+  color: var(--color-background-xlight);
+  font-size: var(--font-size-3xs);
+  visibility: hidden;
+  top: 0;
 }
-._editIconContainer_86rol_161 {
-  display: inline-block;
-  position: relative;
-  width: 0;
+._leftArrow_16elv_141 {
+  left: -16px;
 }
-._editButtons_86rol_167 {
-  text-align: right;
-  margin-top: var(--spacing-s);
+._rightArrow_16elv_142 {
+  right: -16px;
 }
-._editButtons_86rol_167 > * {
-  margin-left: var(--spacing-4xs);
+._grid_16elv_168 > div {
+  display: flex;
 }
-._editContainer_86rol_175 {
-  text-align: left;
+._grid_16elv_168 > div:first-child > div {
+  margin-bottom: 2px;
 }
-._editContainer_86rol_175 > *:first-child {
-  margin-bottom: var(--spacing-4xs);
+._grid_16elv_168 > div > div {
+  height: 2px;
+  width: 2px;
+  border-radius: 50%;
+  background-color: var(--color-foreground-xdark);
+  margin-right: 4px;
+}
+._grid_16elv_168 > div > div:last-child {
+  margin-right: 0;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -292,13 +294,105 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-#communityNode > div {
-  cursor: auto;
-  padding-right: 0;
-  padding-left: 0;
+._floatingNodes_1tkq5_123 {
+  position: absolute;
+  bottom: 0;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: 10;
+  pointer-events: none;
+}
+._floatingNodes_1tkq5_123 {
+  right: 0;
+}
+._nodesList_1tkq5_137 {
+  list-style: none;
+  padding: 0;
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  width: min-content;
+  margin: auto;
+  transform-origin: center;
+  gap: var(--spacing-s);
+  transition: transform 0.2s ease-in-out;
+}
+._nodesList_1tkq5_137._inputSub_1tkq5_151, ._nodesList_1tkq5_137._outputSub_1tkq5_151 {
+  right: 0;
+  left: 0;
+  flex-direction: row;
+}
+._nodesList_1tkq5_137._outputSub_1tkq5_151 {
+  top: 0;
+}
+._nodesList_1tkq5_137._inputSub_1tkq5_151 {
+  bottom: 0;
+}
+._nodesList_1tkq5_137._outputMain_1tkq5_162, ._nodesList_1tkq5_137._inputMain_1tkq5_162 {
+  top: 0;
+  bottom: 0;
+}
+._nodesList_1tkq5_137._outputMain_1tkq5_162 {
+  right: 0;
+}
+._nodesList_1tkq5_137._inputMain_1tkq5_162 {
+  left: 0;
+}
+._nodesList_1tkq5_137._outputMain_1tkq5_162 {
+  transform: translateX(50%);
+}
+._nodesList_1tkq5_137._outputSub_1tkq5_151 {
+  transform: translateY(-50%);
+}
+._nodesList_1tkq5_137._inputMain_1tkq5_162 {
+  transform: translateX(-50%);
+}
+._nodesList_1tkq5_137._inputSub_1tkq5_151 {
+  transform: translateY(50%);
+}
+._connectedNode_1tkq5_185 {
+  border: var(--border-base);
+  background-color: var(--color-node-background);
+  border-radius: 100%;
+  padding: var(--spacing-s);
+  cursor: pointer;
+  pointer-events: all;
+  transition: transform 0.2s cubic-bezier(0.19, 1, 0.22, 1);
+  position: relative;
+  transform: scale(0.8);
+  display: flex;
+  justify-self: center;
+  align-self: center;
+}
+._connectedNode_1tkq5_185::after {
+  content: "";
+  position: absolute;
+  top: -35%;
+  right: -15%;
+  bottom: -35%;
+  left: -15%;
+  z-index: -1;
+}
+._outputMain_1tkq5_162 ._connectedNode_1tkq5_185, ._inputMain_1tkq5_162 ._connectedNode_1tkq5_185 {
+  border-radius: var(--border-radius-large);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+._outputMain_1tkq5_162 ._connectedNode_1tkq5_185:hover {
+  transform: scale(1.2) translateX(-50%);
+}
+._outputSub_1tkq5_151 ._connectedNode_1tkq5_185:hover {
+  transform: scale(1.2) translateY(50%);
 }
-#communityNode > div:hover {
-  color: unset;
+._inputMain_1tkq5_162 ._connectedNode_1tkq5_185:hover {
+  transform: scale(1.2) translateX(50%);
+}
+._inputSub_1tkq5_151 ._connectedNode_1tkq5_185:hover {
+  transform: scale(1.2) translateY(-50%);
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -421,83 +515,67 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-.webhooks[data-v-906699cc] {
-  padding-bottom: var(--spacing-xs);
-  margin: var(--spacing-xs) 0;
-  border-bottom: 1px solid var(--color-text-lighter);
-}
-.webhooks .headline[data-v-906699cc] {
-  color: var(--color-primary);
-  font-weight: var(--font-weight-bold);
-  font-size: var(--font-size-2xs);
-}
-.http-field[data-v-906699cc] {
+._dataPanel_181lg_123 {
+  position: absolute;
+  height: calc(100% - 2 * var(--spacing-l));
   position: absolute;
-  width: 50px;
-  display: inline-block;
-  top: calc(50% - 8px);
+  top: var(--spacing-l);
+  z-index: 0;
+  min-width: 280px;
 }
-.http-method[data-v-906699cc] {
-  background-color: var(--color-foreground-xdark);
-  width: 40px;
-  height: 16px;
-  line-height: 16px;
-  margin-left: 5px;
-  text-align: center;
-  border-radius: 2px;
-  font-size: var(--font-size-2xs);
-  font-weight: var(--font-weight-bold);
-  color: var(--color-foreground-xlight);
+._inputPanel_181lg_132 {
+  left: var(--spacing-l);
 }
-.minimize-icon[data-v-906699cc] {
-  font-size: 1.3em;
-  margin-right: 0.5em;
+._inputPanel_181lg_132 > * {
+  border-radius: var(--border-radius-large) 0 0 var(--border-radius-large);
 }
-.mode-selection-headline[data-v-906699cc] {
-  line-height: 1.8em;
+._outputPanel_181lg_140 {
+  right: var(--spacing-l);
 }
-.node-webhooks[data-v-906699cc] {
-  margin-left: 1em;
+._outputPanel_181lg_140 > * {
+  border-radius: 0 var(--border-radius-large) var(--border-radius-large) 0;
 }
-.url-field[data-v-906699cc] {
-  display: inline-block;
-  width: calc(100% - 60px);
-  margin-left: 55px;
+._mainPanel_181lg_148 {
+  position: absolute;
+  height: 100%;
 }
-.url-field-full-width[data-v-906699cc] {
-  display: inline-block;
-  margin: 5px 10px;
+._mainPanel_181lg_148:hover ._draggable_181lg_152 {
+  visibility: visible;
 }
-.url-selection[data-v-906699cc] {
-  margin-top: var(--spacing-xs);
+._mainPanelInner_181lg_156 {
+  height: 100%;
+  border: var(--border-base);
+  border-radius: var(--border-radius-large);
+  box-shadow: 0 4px 16px rgba(50, 61, 85, 0.1);
+  overflow: hidden;
 }
-.minimize-button[data-v-906699cc] {
-  display: inline-block;
-  transition-duration: 0.5s;
-  transition-property: transform;
+._mainPanelInner_181lg_156._dragging_181lg_163 {
+  border-color: var(--color-primary);
+  box-shadow: 0px 6px 16px rgba(255, 74, 51, 0.15);
 }
-.expanded .minimize-button[data-v-906699cc] {
-  transform: rotate(90deg);
+._draggable_181lg_152 {
+  visibility: hidden;
 }
-.webhook-url[data-v-906699cc] {
-  position: relative;
-  top: 0;
+._double-width_181lg_172 {
+  left: 90%;
+}
+._dragButtonContainer_181lg_176 {
+  position: absolute;
+  top: -12px;
   width: 100%;
-  font-size: var(--font-size-2xs);
-  white-space: normal;
-  overflow: visible;
-  text-overflow: initial;
-  color: var(--color-text-dark);
-  text-align: left;
-  direction: ltr;
-  word-break: break-all;
+  height: 12px;
+  display: flex;
+  justify-content: center;
+  pointer-events: none;
 }
-.webhook-wrapper[data-v-906699cc] {
-  line-height: 1.5;
-  position: relative;
-  margin-top: var(--spacing-xs);
-  background-color: var(--color-foreground-xlight);
-  border-radius: 3px;
+._dragButtonContainer_181lg_176 ._draggable_181lg_152 {
+  pointer-events: all;
+}
+._dragButtonContainer_181lg_176:hover ._draggable_181lg_152 {
+  visibility: visible;
+}
+._visible_181lg_192 {
+  visibility: visible;
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -620,138 +698,9 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-@keyframes _horizontal-shake_ac466_1 {
-0% {
-    transform: translateX(0);
-}
-25% {
-    transform: translateX(5px);
-}
-50% {
-    transform: translateX(-5px);
-}
-75% {
-    transform: translateX(5px);
-}
-100% {
-    transform: translateX(0);
-}
-}
-._container_ac466_140 {
-  --node-size: 45px;
-  --plus-button-size: 30px;
-  --animation-duration: 150ms;
-  --collapsed-offset: 10px;
-  padding-top: calc(var(--node-size) + var(--spacing-3xs));
-}
-._connections_ac466_148 {
-  min-height: calc(var(--node-size) + var(--spacing-m));
-  position: absolute;
-  bottom: calc(var(--node-size) / 2 * -1);
-  left: 0;
-  right: 0;
-  -webkit-user-select: none;
-          user-select: none;
-  justify-content: space-between;
-  display: grid;
-  grid-template-columns: repeat(var(--possible-connections), 1fr);
-}
-._connectionType_ac466_160 {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  transition: all calc(var(--animation-duration) - 50ms) ease;
-}
-._connectionLabel_ac466_167 {
-  margin-bottom: var(--spacing-2xs);
-  font-size: var(--font-size-2xs);
-  -webkit-user-select: none;
-          user-select: none;
-  text-wrap: nowrap;
-}
-._connectionLabel_ac466_167._hasIssues_ac466_173 {
-  color: var(--color-danger);
-}
-._connectedNodesWrapper_ac466_177 {
+._tooltipRow_14r7d_123 {
   display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-between;
-  position: relative;
-}
-._plusButton_ac466_185 {
-  transition: all var(--animation-duration) ease;
-  position: absolute;
-  top: var(--spacing-2xs);
-}
-._plusButton_ac466_185._hasIssues_ac466_173 {
-  animation: _horizontal-shake_ac466_1 500ms;
-}
-._plusButton_ac466_185._hasIssues_ac466_173 button {
-  --button-font-color: var(--color-danger);
-  --button-border-color: var(--color-danger);
-}
-._plusButton_ac466_185:not(:last-child) {
-  z-index: 1;
-  right: 100%;
-  margin-right: calc(var(--plus-button-size) * -1 * 0.9);
-  pointer-events: none;
-}
-._connectedNodesWrapperExpanded_ac466_203 ._plusButton_ac466_185:not(:last-child) {
-  margin-right: var(--spacing-2xs);
-  opacity: 1;
-  pointer-events: all;
-}
-._connectedNodesMultiple_ac466_209 {
-  transition: all var(--animation-duration) ease;
-}
-._connectedNodesWrapperExpanded_ac466_203 {
-  z-index: 1;
-}
-._connections_ac466_148:has(._connectedNodesWrapperExpanded_ac466_203) ._connectionType_ac466_160:not(:has(._connectedNodesWrapperExpanded_ac466_203)) {
-  opacity: 0;
-  pointer-events: none;
-  visibility: hidden;
-}
-._connectedNode_ac466_177 {
-  border: var(--border-base);
-  background-color: var(--color-node-background);
-  border-radius: 100%;
-  padding: var(--spacing-xs);
-  cursor: pointer;
-  pointer-events: all;
-  transition: all var(--animation-duration) ease;
-  position: relative;
-  display: flex;
-  justify-self: center;
-  align-self: center;
-}
-._connectedNodes_ac466_177 {
-  display: flex;
-  justify-content: center;
-  margin-right: calc((var(--nodes-length) - 1) * -1 * (var(--node-size) - var(--collapsed-offset)));
-}
-._connectedNodesWrapperExpanded_ac466_203 ._connectedNodes_ac466_177 {
-  margin-right: 0;
-  margin-right: calc((var(--spacing-2xs) + var(--plus-button-size)) * -1);
-}
-._nodeWrapper_ac466_247 {
-  transition: all var(--animation-duration) ease;
-  transform-origin: center;
-  z-index: 1;
-}
-._connectedNodesWrapperExpanded_ac466_203 ._nodeWrapper_ac466_247:not(:first-child) {
-  margin-left: var(--spacing-2xs);
-}
-._nodeWrapper_ac466_247._hasIssues_ac466_173 ._connectedNode_ac466_177 {
-  border-width: calc(var(--border-width-base) * 2);
-  border-color: var(--color-danger);
-}
-._nodeWrapper_ac466_247:not(:first-child) {
-  transform: translateX(calc(var(--node-index) * -1 * (var(--node-size) - var(--collapsed-offset))));
-}
-._connectedNodesWrapperExpanded_ac466_203 ._nodeWrapper_ac466_247 {
-  transform: translateX(0);
+  column-gap: var(--spacing-4xs);
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -874,224 +823,101 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._header_13al3_123 {
-  background-color: var(--color-background-base);
-}
-._warningIcon_13al3_127 {
-  color: var(--color-text-lighter);
-  font-size: var(--font-size-2xl);
+._block_wafm4_123 {
+  padding: var(--spacing-s) 0 var(--spacing-2xs) var(--spacing-2xs);
+  border: 1px solid var(--color-foreground-light);
+  margin-top: var(--spacing-s);
+  border-radius: var(--border-radius-base);
 }
-._descriptionContainer_13al3_132 {
-  display: flex;
-  flex-direction: column;
-}/* BEM support Func
- -------------------------- */
-/* Transition
--------------------------- */
-/* Color
--------------------------- */
-/* Link
--------------------------- */
-/* Border
--------------------------- */
-/* Outline
--------------------------- */
-/* Box shadow
--------------------------- */
-/* Fill
--------------------------- */
-/* Typography
--------------------------- */
-/* z-index
--------------------------- */
-/* Disable base
--------------------------- */
-/* Icon
--------------------------- */
-/* Checkbox
--------------------------- */
-/* Radio
--------------------------- */
-/* Select
--------------------------- */
-/* Alert
--------------------------- */
-/* MessageBox
--------------------------- */
-/* Message
--------------------------- */
-/* Notification
--------------------------- */
-/* Input
--------------------------- */
-/* Cascader
--------------------------- */
-/* Group
--------------------------- */
-/* Tab
--------------------------- */
-/* Button
--------------------------- */
-/* cascader
--------------------------- */
-/* Switch
--------------------------- */
-/* Dialog
--------------------------- */
-/* Table
--------------------------- */
-/* Pagination
--------------------------- */
-/* Popup
--------------------------- */
-/* Popover
--------------------------- */
-/* Tooltip
--------------------------- */
-/* Tag
--------------------------- */
-/* Tree
--------------------------- */
-/* Dropdown
--------------------------- */
-/* Badge
--------------------------- */
-/* Card
---------------------------*/
-/* Slider
---------------------------*/
-/* Steps
---------------------------*/
-/* Menu
---------------------------*/
-/* Rate
---------------------------*/
-/* DatePicker
---------------------------*/
-/* Loading
---------------------------*/
-/* Scrollbar
---------------------------*/
-/* Carousel
---------------------------*/
-/* Collapse
---------------------------*/
-/* Transfer
---------------------------*/
-/* Header
-  --------------------------*/
-/* Footer
---------------------------*/
-/* Main
---------------------------*/
-/* Timeline
---------------------------*/
-/* Backtop
---------------------------*/
-/* Link
---------------------------*/
-/* Calendar
---------------------------*/
-/* Form
--------------------------- */
-/* Avatar
---------------------------*/
-/* Break-point
---------------------------*/
-/* Break-points
- -------------------------- */
-/* Scrollbar
- -------------------------- */
-/* Placeholder
- -------------------------- */
-/* BEM
- -------------------------- */
-.node-settings[data-v-f247a28e] {
-  display: flex;
-  flex-direction: column;
+:root ._blockContent_wafm4_130 {
+  height: 0;
   overflow: hidden;
-  background-color: var(--color-background-xlight);
-  height: 100%;
-  width: 100%;
 }
-.node-settings .no-parameters[data-v-f247a28e] {
-  margin-top: var(--spacing-xs);
+:root ._blockContent_wafm4_130._blockContentExpanded_wafm4_134 {
+  height: auto;
 }
-.node-settings .header-side-menu[data-v-f247a28e] {
-  padding: var(--spacing-s) var(--spacing-s) var(--spacing-s) var(--spacing-s);
-  font-size: var(--font-size-l);
-  display: flex;
-  justify-content: space-between;
+._rawSwitch_wafm4_138 {
+  opacity: 0;
+  height: -moz-fit-content;
+  height: fit-content;
+  margin-left: auto;
+  margin-right: var(--spacing-2xs);
 }
-.node-settings .header-side-menu .node-name[data-v-f247a28e] {
-  padding-top: var(--spacing-5xs);
+._block_wafm4_123:hover ._rawSwitch_wafm4_138 {
+  opacity: 1;
 }
-.node-settings .node-is-not-valid[data-v-f247a28e] {
-  height: 75%;
-  padding: 10px;
+._blockHeader_wafm4_148 {
   display: flex;
-  flex-direction: column;
+  gap: var(--spacing-xs);
+  cursor: pointer;
+  /* This hack is needed to make the whole surface of header clickable  */
+  margin: calc(-1 * var(--spacing-xs));
+  padding: var(--spacing-2xs) var(--spacing-xs);
   align-items: center;
-  justify-content: center;
-  text-align: center;
-  line-height: var(--font-line-height-regular);
 }
-.node-settings .node-parameters-wrapper[data-v-f247a28e] {
-  overflow-y: auto;
-  padding: 0 var(--spacing-m) var(--spacing-l) var(--spacing-m);
-  flex-grow: 1;
+._blockHeader_wafm4_148 * {
+  -webkit-user-select: none;
+          user-select: none;
+}
+._blockTitle_wafm4_161 {
+  font-size: var(--font-size-s);
+  color: var(--color-text-dark);
+  margin: 0;
+  padding-bottom: var(--spacing-4xs);
 }
-.node-settings.dragging[data-v-f247a28e] {
-  border-color: var(--color-primary);
-  box-shadow: 0px 6px 16px rgba(255, 74, 51, 0.15);
+._blockToggle_wafm4_168 {
+  border: none;
+  background: none;
+  padding: 0;
+  color: var(--color-text-base);
+  margin-top: calc(-1 * var(--spacing-3xs));
 }
-.parameter-content[data-v-f247a28e] {
-  font-size: 0.9em;
-  margin-right: -15px;
-  margin-left: -15px;
+._error_wafm4_176 {
+  padding: var(--spacing-s) 0;
 }
-.parameter-content input[data-v-f247a28e] {
-  width: calc(100% - 35px);
-  padding: 5px;
+._container_dypaw_2 {
+	padding: 0 var(--spacing-s) var(--spacing-s);
 }
-.parameter-content select[data-v-f247a28e] {
-  width: calc(100% - 20px);
-  padding: 5px;
+._nodeIcon_dypaw_5 {
+	margin-top: calc(var(--spacing-3xs) * -1);
 }
-.parameter-content[data-v-f247a28e]:before {
-  display: table;
-  content: " ";
-  position: relative;
-  box-sizing: border-box;
-  clear: both;
+._header_dypaw_8 {
+	display: flex;
+	align-items: center;
+	gap: var(--spacing-3xs);
+	margin-bottom: var(--spacing-s);
 }
-.parameter-wrapper[data-v-f247a28e] {
-  padding: 0 1em;
+._headerWrap_dypaw_14 {
+	display: flex;
+	flex-direction: column;
 }
-.color-reset-button-wrapper[data-v-f247a28e] {
-  position: relative;
+._title_dypaw_18 {
+	display: flex;
+	align-items: center;
+	font-size: var(--font-size-s);
+	gap: var(--spacing-3xs);
+	color: var(--color-text-dark);
 }
-.color-reset-button[data-v-f247a28e] {
-  position: absolute;
-  right: 7px;
-  top: -25px;
+._meta_dypaw_25 {
+	list-style: none;
+	display: flex;
+	align-items: center;
+	flex-wrap: wrap;
+	font-size: var(--font-size-xs);
+& > li:not(:last-child) {
+		border-right: 1px solid var(--color-text-base);
+		padding-right: var(--spacing-3xs);
 }
-.node-version[data-v-f247a28e] {
-  border-top: var(--border-base);
-  font-size: var(--font-size-xs);
-  font-size: var(--font-size-2xs);
-  padding: var(--spacing-xs) 0 var(--spacing-2xs) 0;
-  color: var(--color-text-light);
+& > li:not(:first-child) {
+		padding-left: var(--spacing-3xs);
 }
-.parameter-value input.expression[data-v-f247a28e] {
-  border-style: dashed;
-  border-color: #ff9600;
-  display: inline-block;
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
-  background-color: #793300;
-}/* BEM support Func
+}
+._tokensUsage_dypaw_41 {
+	display: flex;
+	align-items: center;
+	gap: var(--spacing-3xs);
+}
+/* BEM support Func
  -------------------------- */
 /* Transition
 -------------------------- */
@@ -1213,587 +1039,110 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-._dragContainer_16elv_123 {
-  pointer-events: all;
+._treeToggle_1qaq4_123 {
+  border: none;
+  background-color: transparent;
+  padding: 0 var(--spacing-3xs);
+  margin: 0 calc(-1 * var(--spacing-3xs));
+  cursor: pointer;
 }
-._dragButton_16elv_127 {
-  background-color: var(--color-background-base);
-  width: 64px;
-  height: 21px;
-  border-top-left-radius: var(--border-radius-base);
-  border-top-right-radius: var(--border-radius-base);
-  cursor: grab;
+._leafLabel_1qaq4_131 {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-3xs);
+}
+._noData_1qaq4_137 {
   display: flex;
   align-items: center;
   justify-content: center;
-  overflow: visible;
-  position: relative;
-  z-index: 3;
+  width: 100%;
+  color: var(--color-text-light);
 }
-._dragButton_16elv_127:hover ._leftArrow_16elv_141,
-._dragButton_16elv_127:hover ._rightArrow_16elv_142 {
-  visibility: visible;
+._empty_1qaq4_145 {
+  padding: var(--spacing-l);
 }
-._visible_16elv_146 {
-  visibility: visible !important;
+._title_1qaq4_149 {
+  font-size: var(--font-size-s);
+  margin-bottom: var(--spacing-xs);
 }
-._arrow_16elv_150 {
-  position: absolute;
-  color: var(--color-background-xlight);
-  font-size: var(--font-size-3xs);
-  visibility: hidden;
-  top: 0;
+._tree_1qaq4_123 {
+  flex-shrink: 0;
+  min-width: 8rem;
+  height: 100%;
+  padding-right: var(--spacing-xs);
+  padding-left: var(--spacing-2xs);
 }
-._leftArrow_16elv_141 {
-  left: -16px;
+._tree_1qaq4_123._slim_1qaq4_161 {
+  min-width: auto;
 }
-._rightArrow_16elv_142 {
-  right: -16px;
+._runData_1qaq4_165 {
+  width: 100%;
+  height: 100%;
+  overflow: auto;
 }
-._grid_16elv_168 > div {
+._container_1qaq4_171 {
+  height: 100%;
+  padding: 0 var(--spacing-xs);
   display: flex;
 }
-._grid_16elv_168 > div:first-child > div {
-  margin-bottom: 2px;
+._container_1qaq4_171 .el-tree > .el-tree-node {
+  position: relative;
 }
-._grid_16elv_168 > div > div {
-  height: 2px;
-  width: 2px;
-  border-radius: 50%;
-  background-color: var(--color-foreground-xdark);
-  margin-right: 4px;
+._container_1qaq4_171 .el-tree > .el-tree-node:after {
+  content: "";
+  position: absolute;
+  top: 2rem;
+  bottom: 1.2rem;
+  left: 0.75rem;
+  width: 0.125rem;
+  background-color: var(--color-foreground-base);
 }
-._grid_16elv_168 > div > div:last-child {
-  margin-right: 0;
-}/* BEM support Func
- -------------------------- */
-/* Transition
--------------------------- */
-/* Color
--------------------------- */
-/* Link
--------------------------- */
-/* Border
--------------------------- */
-/* Outline
--------------------------- */
-/* Box shadow
--------------------------- */
-/* Fill
--------------------------- */
-/* Typography
--------------------------- */
-/* z-index
--------------------------- */
-/* Disable base
--------------------------- */
-/* Icon
--------------------------- */
-/* Checkbox
--------------------------- */
-/* Radio
--------------------------- */
-/* Select
--------------------------- */
-/* Alert
--------------------------- */
-/* MessageBox
--------------------------- */
-/* Message
--------------------------- */
-/* Notification
--------------------------- */
-/* Input
--------------------------- */
-/* Cascader
--------------------------- */
-/* Group
--------------------------- */
-/* Tab
--------------------------- */
-/* Button
--------------------------- */
-/* cascader
--------------------------- */
-/* Switch
--------------------------- */
-/* Dialog
--------------------------- */
-/* Table
--------------------------- */
-/* Pagination
--------------------------- */
-/* Popup
--------------------------- */
-/* Popover
--------------------------- */
-/* Tooltip
--------------------------- */
-/* Tag
--------------------------- */
-/* Tree
--------------------------- */
-/* Dropdown
--------------------------- */
-/* Badge
--------------------------- */
-/* Card
---------------------------*/
-/* Slider
---------------------------*/
-/* Steps
---------------------------*/
-/* Menu
---------------------------*/
-/* Rate
---------------------------*/
-/* DatePicker
---------------------------*/
-/* Loading
---------------------------*/
-/* Scrollbar
---------------------------*/
-/* Carousel
---------------------------*/
-/* Collapse
---------------------------*/
-/* Transfer
---------------------------*/
-/* Header
-  --------------------------*/
-/* Footer
---------------------------*/
-/* Main
---------------------------*/
-/* Timeline
---------------------------*/
-/* Backtop
---------------------------*/
-/* Link
---------------------------*/
-/* Calendar
---------------------------*/
-/* Form
--------------------------- */
-/* Avatar
---------------------------*/
-/* Break-point
---------------------------*/
-/* Break-points
- -------------------------- */
-/* Scrollbar
- -------------------------- */
-/* Placeholder
- -------------------------- */
-/* BEM
- -------------------------- */
-._floatingNodes_1tkq5_123 {
-  position: absolute;
-  bottom: 0;
-  top: 0;
-  right: 0;
-  left: 0;
-  z-index: 10;
-  pointer-events: none;
-}
-._floatingNodes_1tkq5_123 {
-  right: 0;
-}
-._nodesList_1tkq5_137 {
-  list-style: none;
-  padding: 0;
-  position: absolute;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-direction: column;
-  width: min-content;
-  margin: auto;
-  transform-origin: center;
-  gap: var(--spacing-s);
-  transition: transform 0.2s ease-in-out;
-}
-._nodesList_1tkq5_137._inputSub_1tkq5_151, ._nodesList_1tkq5_137._outputSub_1tkq5_151 {
-  right: 0;
-  left: 0;
-  flex-direction: row;
-}
-._nodesList_1tkq5_137._outputSub_1tkq5_151 {
-  top: 0;
-}
-._nodesList_1tkq5_137._inputSub_1tkq5_151 {
-  bottom: 0;
+._container_1qaq4_171 .el-tree-node__expand-icon {
+  display: none;
 }
-._nodesList_1tkq5_137._outputMain_1tkq5_162, ._nodesList_1tkq5_137._inputMain_1tkq5_162 {
-  top: 0;
-  bottom: 0;
+._container_1qaq4_171 .el-tree {
+  margin-left: calc(-1 * var(--spacing-xs));
 }
-._nodesList_1tkq5_137._outputMain_1tkq5_162 {
-  right: 0;
+._container_1qaq4_171 .el-tree-node__content {
+  margin-left: var(--spacing-xs);
 }
-._nodesList_1tkq5_137._inputMain_1tkq5_162 {
-  left: 0;
+._nodeIcon_1qaq4_198 {
+  padding: var(--spacing-3xs) var(--spacing-3xs);
+  border-radius: var(--border-radius-base);
+  margin-right: var(--spacing-4xs);
 }
-._nodesList_1tkq5_137._outputMain_1tkq5_162 {
-  transform: translateX(50%);
+._isSelected_1qaq4_204 {
+  background-color: var(--color-foreground-base);
 }
-._nodesList_1tkq5_137._outputSub_1tkq5_151 {
-  transform: translateY(-50%);
+._treeNode_1qaq4_208 {
+  display: inline-flex;
+  border-radius: var(--border-radius-base);
+  align-items: center;
+  padding-right: var(--spacing-3xs);
+  margin: var(--spacing-4xs) 0;
+  font-size: var(--font-size-2xs);
+  color: var(--color-text-dark);
+  margin-bottom: var(--spacing-3xs);
+  cursor: pointer;
 }
-._nodesList_1tkq5_137._inputMain_1tkq5_162 {
-  transform: translateX(-50%);
+._treeNode_1qaq4_208._isSelected_1qaq4_204 {
+  font-weight: var(--font-weight-bold);
 }
-._nodesList_1tkq5_137._inputSub_1tkq5_151 {
-  transform: translateY(50%);
+._treeNode_1qaq4_208:hover {
+  background-color: var(--color-foreground-base);
 }
-._connectedNode_1tkq5_185 {
-  border: var(--border-base);
-  background-color: var(--color-node-background);
-  border-radius: 100%;
-  padding: var(--spacing-s);
-  cursor: pointer;
-  pointer-events: all;
-  transition: transform 0.2s cubic-bezier(0.19, 1, 0.22, 1);
-  position: relative;
-  transform: scale(0.8);
-  display: flex;
-  justify-self: center;
-  align-self: center;
+._treeNode_1qaq4_208[data-tree-depth="0"] {
+  margin-left: calc(-1 * var(--spacing-2xs));
 }
-._connectedNode_1tkq5_185::after {
+._treeNode_1qaq4_208:after {
   content: "";
   position: absolute;
-  top: -35%;
-  right: -15%;
-  bottom: -35%;
-  left: -15%;
-  z-index: -1;
-}
-._outputMain_1tkq5_162 ._connectedNode_1tkq5_185, ._inputMain_1tkq5_162 ._connectedNode_1tkq5_185 {
-  border-radius: var(--border-radius-large);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-._outputMain_1tkq5_162 ._connectedNode_1tkq5_185:hover {
-  transform: scale(1.2) translateX(-50%);
-}
-._outputSub_1tkq5_151 ._connectedNode_1tkq5_185:hover {
-  transform: scale(1.2) translateY(50%);
-}
-._inputMain_1tkq5_162 ._connectedNode_1tkq5_185:hover {
-  transform: scale(1.2) translateX(50%);
-}
-._inputSub_1tkq5_151 ._connectedNode_1tkq5_185:hover {
-  transform: scale(1.2) translateY(-50%);
-}/* BEM support Func
- -------------------------- */
-/* Transition
--------------------------- */
-/* Color
--------------------------- */
-/* Link
--------------------------- */
-/* Border
--------------------------- */
-/* Outline
--------------------------- */
-/* Box shadow
--------------------------- */
-/* Fill
--------------------------- */
-/* Typography
--------------------------- */
-/* z-index
--------------------------- */
-/* Disable base
--------------------------- */
-/* Icon
--------------------------- */
-/* Checkbox
--------------------------- */
-/* Radio
--------------------------- */
-/* Select
--------------------------- */
-/* Alert
--------------------------- */
-/* MessageBox
--------------------------- */
-/* Message
--------------------------- */
-/* Notification
--------------------------- */
-/* Input
--------------------------- */
-/* Cascader
--------------------------- */
-/* Group
--------------------------- */
-/* Tab
--------------------------- */
-/* Button
--------------------------- */
-/* cascader
--------------------------- */
-/* Switch
--------------------------- */
-/* Dialog
--------------------------- */
-/* Table
--------------------------- */
-/* Pagination
--------------------------- */
-/* Popup
--------------------------- */
-/* Popover
--------------------------- */
-/* Tooltip
--------------------------- */
-/* Tag
--------------------------- */
-/* Tree
--------------------------- */
-/* Dropdown
--------------------------- */
-/* Badge
--------------------------- */
-/* Card
---------------------------*/
-/* Slider
---------------------------*/
-/* Steps
---------------------------*/
-/* Menu
---------------------------*/
-/* Rate
---------------------------*/
-/* DatePicker
---------------------------*/
-/* Loading
---------------------------*/
-/* Scrollbar
---------------------------*/
-/* Carousel
---------------------------*/
-/* Collapse
---------------------------*/
-/* Transfer
---------------------------*/
-/* Header
-  --------------------------*/
-/* Footer
---------------------------*/
-/* Main
---------------------------*/
-/* Timeline
---------------------------*/
-/* Backtop
---------------------------*/
-/* Link
---------------------------*/
-/* Calendar
---------------------------*/
-/* Form
--------------------------- */
-/* Avatar
---------------------------*/
-/* Break-point
---------------------------*/
-/* Break-points
- -------------------------- */
-/* Scrollbar
- -------------------------- */
-/* Placeholder
- -------------------------- */
-/* BEM
- -------------------------- */
-._dataPanel_181lg_123 {
-  position: absolute;
-  height: calc(100% - 2 * var(--spacing-l));
-  position: absolute;
-  top: var(--spacing-l);
-  z-index: 0;
-  min-width: 280px;
-}
-._inputPanel_181lg_132 {
-  left: var(--spacing-l);
-}
-._inputPanel_181lg_132 > * {
-  border-radius: var(--border-radius-large) 0 0 var(--border-radius-large);
-}
-._outputPanel_181lg_140 {
-  right: var(--spacing-l);
-}
-._outputPanel_181lg_140 > * {
-  border-radius: 0 var(--border-radius-large) var(--border-radius-large) 0;
-}
-._mainPanel_181lg_148 {
-  position: absolute;
-  height: 100%;
-}
-._mainPanel_181lg_148:hover ._draggable_181lg_152 {
-  visibility: visible;
-}
-._mainPanelInner_181lg_156 {
-  height: 100%;
-  border: var(--border-base);
-  border-radius: var(--border-radius-large);
-  box-shadow: 0 4px 16px rgba(50, 61, 85, 0.1);
-  overflow: hidden;
-}
-._mainPanelInner_181lg_156._dragging_181lg_163 {
-  border-color: var(--color-primary);
-  box-shadow: 0px 6px 16px rgba(255, 74, 51, 0.15);
-}
-._draggable_181lg_152 {
-  visibility: hidden;
-}
-._double-width_181lg_172 {
-  left: 90%;
-}
-._dragButtonContainer_181lg_176 {
-  position: absolute;
-  top: -12px;
-  width: 100%;
-  height: 12px;
-  display: flex;
-  justify-content: center;
-  pointer-events: none;
-}
-._dragButtonContainer_181lg_176 ._draggable_181lg_152 {
-  pointer-events: all;
-}
-._dragButtonContainer_181lg_176:hover ._draggable_181lg_152 {
-  visibility: visible;
-}
-._visible_181lg_192 {
-  visibility: visible;
-}/* BEM support Func
- -------------------------- */
-/* Transition
--------------------------- */
-/* Color
--------------------------- */
-/* Link
--------------------------- */
-/* Border
--------------------------- */
-/* Outline
--------------------------- */
-/* Box shadow
--------------------------- */
-/* Fill
--------------------------- */
-/* Typography
--------------------------- */
-/* z-index
--------------------------- */
-/* Disable base
--------------------------- */
-/* Icon
--------------------------- */
-/* Checkbox
--------------------------- */
-/* Radio
--------------------------- */
-/* Select
--------------------------- */
-/* Alert
--------------------------- */
-/* MessageBox
--------------------------- */
-/* Message
--------------------------- */
-/* Notification
--------------------------- */
-/* Input
--------------------------- */
-/* Cascader
--------------------------- */
-/* Group
--------------------------- */
-/* Tab
--------------------------- */
-/* Button
--------------------------- */
-/* cascader
--------------------------- */
-/* Switch
--------------------------- */
-/* Dialog
--------------------------- */
-/* Table
--------------------------- */
-/* Pagination
--------------------------- */
-/* Popup
--------------------------- */
-/* Popover
--------------------------- */
-/* Tooltip
--------------------------- */
-/* Tag
--------------------------- */
-/* Tree
--------------------------- */
-/* Dropdown
--------------------------- */
-/* Badge
--------------------------- */
-/* Card
---------------------------*/
-/* Slider
---------------------------*/
-/* Steps
---------------------------*/
-/* Menu
---------------------------*/
-/* Rate
---------------------------*/
-/* DatePicker
---------------------------*/
-/* Loading
---------------------------*/
-/* Scrollbar
---------------------------*/
-/* Carousel
---------------------------*/
-/* Collapse
---------------------------*/
-/* Transfer
---------------------------*/
-/* Header
-  --------------------------*/
-/* Footer
---------------------------*/
-/* Main
---------------------------*/
-/* Timeline
---------------------------*/
-/* Backtop
---------------------------*/
-/* Link
---------------------------*/
-/* Calendar
---------------------------*/
-/* Form
--------------------------- */
-/* Avatar
---------------------------*/
-/* Break-point
---------------------------*/
-/* Break-points
- -------------------------- */
-/* Scrollbar
- -------------------------- */
-/* Placeholder
- -------------------------- */
-/* BEM
- -------------------------- */
-._tooltipRow_14r7d_123 {
-  display: flex;
-  column-gap: var(--spacing-4xs);
+  margin: auto;
+  background-color: var(--color-foreground-base);
+  height: 0.125rem;
+  left: 0.75rem;
+  width: calc(var(--item-depth) * 0.625rem);
+  margin-top: var(--spacing-3xs);
 }/* BEM support Func
  -------------------------- */
 /* Transition
@@ -2576,12 +1925,12 @@
  -------------------------- */
 /* BEM
  -------------------------- */
-.fade-enter-active[data-v-bf6d9e5c],
-.fade-leave-active[data-v-bf6d9e5c] {
+.fade-enter-active[data-v-0f040cf5],
+.fade-leave-active[data-v-0f040cf5] {
   transition: opacity 200ms;
 }
-.fade-enter[data-v-bf6d9e5c],
-.fade-leave-to[data-v-bf6d9e5c] {
+.fade-enter[data-v-0f040cf5],
+.fade-leave-to[data-v-0f040cf5] {
   opacity: 0;
 }/* BEM support Func
  -------------------------- */