Flowfile 0.5.1__py3-none-any.whl → 0.5.3__py3-none-any.whl

flowfile/web/static/assets/{Unpivot-91cc5354.js → Unpivot-8da14095.js}

@@ -1,9 +1,11 @@
-import { d as defineComponent, r as ref, n as onMounted, R as nextTick, o as onUnmounted, b as resolveComponent, c as openBlock, e as createElementBlock, f as createVNode, w as withCtx, p as createBaseVNode, F as Fragment, q as renderList, s as normalizeClass, v as withModifiers, t as toDisplayString, h as createBlock, i as createCommentVNode, _ as _export_sfc } from "./index-5429bbf8.js";
-import { u as useNodeStore } from "./vue-codemirror.esm-41b0e0d7.js";
-import ContextMenu from "./ContextMenu-23e909da.js";
-import SettingsSection from "./SettingsSection-f0f75a42.js";
-import { G as GenericNodeSettings } from "./genericNodeSettings-4fe5f36b.js";
-import "./designer-9633482a.js";
+import { d as defineComponent, r as ref, C as onMounted, X as nextTick, k as onUnmounted, l as resolveComponent, o as openBlock, c as createElementBlock, m as createVNode, p as withCtx, b as createBaseVNode, F as Fragment, D as renderList, n as normalizeClass, w as withModifiers, t as toDisplayString, x as createBlock, f as createCommentVNode, i as _export_sfc } from "./index-fb6493ae.js";
+import { u as useNodeStore } from "./PopOver-b22f049e.js";
+import ContextMenu from "./ContextMenu-8e2051c6.js";
+import SettingsSection from "./SettingsSection-0784e157.js";
+import { G as GenericNodeSettings } from "./genericNodeSettings-99014e1d.js";
+import "./DesignerView-e6f5c0e8.js";
+import "./index-3ba44389.js";
+import "./vue-codemirror.esm-0965f39f.js";
 const _hoisted_1 = {
   key: 0,
   class: "listbox-wrapper"
@@ -280,8 +282,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Unpivot_vue_vue_type_style_index_0_scoped_e713e710_lang = "";
-const Unpivot = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-e713e710"]]);
+const Unpivot_vue_vue_type_style_index_0_scoped_46c439e7_lang = "";
+const Unpivot = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-46c439e7"]]);
 export {
   Unpivot as default
 };

flowfile/web/static/assets/{UnpivotValidation-7ee2de44.js → UnpivotValidation-6f7d89ff.js}

@@ -1,4 +1,4 @@
-import { d as defineComponent, l as computed, c as openBlock, h as createBlock, w as withCtx, f as createVNode, p as createBaseVNode, u as unref, ar as ElIcon, e as createElementBlock, i as createCommentVNode, as as ElPopover, _ as _export_sfc } from "./index-5429bbf8.js";
+import { d as defineComponent, A as computed, o as openBlock, x as createBlock, p as withCtx, m as createVNode, b as createBaseVNode, s as unref, au as ElIcon, c as createElementBlock, f as createCommentVNode, av as ElPopover, i as _export_sfc } from "./index-fb6493ae.js";
 const _hoisted_1 = { class: "validation-wrapper" };
 const _hoisted_2 = {
   key: 0,
@@ -44,8 +44,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const UnpivotValidation_vue_vue_type_style_index_0_scoped_1575257f_lang = "";
-const UnpivotValidation = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1575257f"]]);
+const UnpivotValidation_vue_vue_type_style_index_0_scoped_de7ac2a5_lang = "";
+const UnpivotValidation = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-de7ac2a5"]]);
 export {
   UnpivotValidation as default
 };

flowfile/web/static/assets/UnpivotValidation-d5ca3b7b.css

@@ -0,0 +1,13 @@
+
+.validation-wrapper[data-v-de7ac2a5] {
+  background-color: var(--color-background-primary);
+}
+.error-message[data-v-de7ac2a5] {
+  color: #991b1b;
+  margin: 5px 0;
+  font-size: 12px;
+}
+.warning-icon[data-v-de7ac2a5] {
+  cursor: pointer;
+  font-size: 24px;
+}

flowfile/web/static/assets/{VueGraphicWalker-e51b9924.js → VueGraphicWalker-3fb312e1.js}

@@ -1,4 +1,4 @@
-import { k as getDefaultExportFromCjs, d as defineComponent, r as ref, n as onMounted, o as onUnmounted, c as openBlock, e as createElementBlock, aj as toRaw, _ as _export_sfc } from "./index-5429bbf8.js";
+import { z as getDefaultExportFromCjs, d as defineComponent, r as ref, C as onMounted, k as onUnmounted, o as openBlock, c as createElementBlock, aq as toRaw, i as _export_sfc } from "./index-fb6493ae.js";
 function _mergeNamespaces(n10, m10) {
   for (var i = 0; i < m10.length; i++) {
     const e19 = m10[i];
@@ -121411,7 +121411,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const container = ref(null);
     let reactRootInstance = null;
     const internalStoreRef = ref({ current: null });
-    const dummyComputation = async (_payload) => {
+    const dummyComputation = async () => {
       console.warn(
         "Dummy computation function called. This should not happen when providing local data."
       );
@@ -121493,8 +121493,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const VueGraphicWalker_vue_vue_type_style_index_0_scoped_5af75af4_lang = "";
-const VueGraphicWalker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-5af75af4"]]);
+const VueGraphicWalker_vue_vue_type_style_index_0_scoped_3671032b_lang = "";
+const VueGraphicWalker = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-3671032b"]]);
 export {
   VueGraphicWalker as default
 };

flowfile/web/static/assets/{VueGraphicWalker-ed5ab88b.css → VueGraphicWalker-430f0b86.css}

@@ -1,5 +1,5 @@
 
-div[data-v-5af75af4] {
+div[data-v-3671032b] {
   width: 100%;
   min-height: 500px;
   height: 100%;

flowfile/web/static/assets/{api-cf1221f0.js → api-24483f0d.js}

@@ -1,4 +1,4 @@
-import { a as axios } from "./index-5429bbf8.js";
+import { j as axios } from "./index-fb6493ae.js";
 const API_BASE_URL = "/db_connection_lib";
 const toPythonFormat = (connection) => {
   return {

flowfile/web/static/assets/{api-c1bad5ca.js → api-8b81fa73.js}

@@ -1,4 +1,4 @@
-import { a as axios } from "./index-5429bbf8.js";
+import { j as axios } from "./index-fb6493ae.js";
 const API_BASE_URL = "/cloud_connections";
 const toPythonFormat = (connection) => {
   return {

flowfile/web/static/assets/{dropDown-35135ba8.css → dropDown-3d8dc5fa.css}

@@ -1,5 +1,5 @@
 
-.sr-only[data-v-0fe9cf29] {
+.sr-only[data-v-837d0f9b] {
   position: absolute;
   width: 1px;
   height: 1px;
@@ -9,44 +9,44 @@
   clip: rect(0, 0, 0, 0);
   border: 0;
 }
-.dropdown-container[data-v-0fe9cf29] {
+.dropdown-container[data-v-837d0f9b] {
   position: relative;
   width: 100%;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  font-family: var(--font-family-base);
 }
-.input-wrapper[data-v-0fe9cf29] {
+.input-wrapper[data-v-837d0f9b] {
   position: relative;
   display: flex;
   align-items: center;
 }
-.select-box[data-v-0fe9cf29] {
+.select-box[data-v-837d0f9b] {
   width: 100%;
   box-sizing: border-box;
   padding: 8px 30px 8px 12px;
   font-size: 14px;
   line-height: 1.4;
-  border: 1px solid #e0e0e0;
+  border: 1px solid var(--color-border-primary);
   border-radius: 6px;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+  box-shadow: var(--shadow-xs);
   outline: none;
   transition: all 0.2s ease;
-  background-color: white;
-  color: #333;
+  background-color: var(--color-background-primary);
+  color: var(--color-text-primary);
 }
-.select-box[data-v-0fe9cf29]:focus {
+.select-box[data-v-837d0f9b]:focus {
   border-color: #3182ce;
   box-shadow: 0 0 0 3px rgba(49, 130, 206, 0.15);
 }
-.select-box.has-error[data-v-0fe9cf29] {
+.select-box.has-error[data-v-837d0f9b] {
   border-color: #e53e3e;
   box-shadow: 0 0 0 3px rgba(229, 62, 62, 0.15);
 }
-.select-box[data-v-0fe9cf29]:disabled {
-  background-color: #f9f9f9;
+.select-box[data-v-837d0f9b]:disabled {
+  background-color: var(--color-background-muted);
   cursor: not-allowed;
   opacity: 0.7;
 }
-.icon-container[data-v-0fe9cf29] {
+.icon-container[data-v-837d0f9b] {
   position: absolute;
   right: 10px;
   top: 50%;
@@ -56,71 +56,71 @@
   align-items: center;
   justify-content: center;
 }
-.dropdown-icon[data-v-0fe9cf29] {
+.dropdown-icon[data-v-837d0f9b] {
   width: 16px;
   height: 16px;
   color: #718096;
   transition: transform 0.2s ease;
 }
-.options-container[data-v-0fe9cf29] {
+.options-container[data-v-837d0f9b] {
   position: fixed;
   z-index: 9999;
   width: 100%;
   margin-top: 4px;
 }
-.options-list[data-v-0fe9cf29] {
-  background: white;
+.options-list[data-v-837d0f9b] {
+  background: var(--color-background-primary);
   border-radius: 6px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  box-shadow: var(--shadow-lg);
   max-height: 220px;
   overflow-y: auto;
   list-style: none;
   margin: 0;
   padding: 4px 0;
-  border: 1px solid #e2e8f0;
+  border: 1px solid var(--color-border-primary);
   scrollbar-width: thin;
 }
-.options-list[data-v-0fe9cf29]::-webkit-scrollbar {
+.options-list[data-v-837d0f9b]::-webkit-scrollbar {
   width: 6px;
 }
-.options-list[data-v-0fe9cf29]::-webkit-scrollbar-track {
-  background: #f7fafc;
+.options-list[data-v-837d0f9b]::-webkit-scrollbar-track {
+  background: var(--color-background-secondary);
 }
-.options-list[data-v-0fe9cf29]::-webkit-scrollbar-thumb {
-  background-color: #cbd5e0;
+.options-list[data-v-837d0f9b]::-webkit-scrollbar-thumb {
+  background-color: var(--color-border-secondary);
   border-radius: 3px;
 }
-.option-item[data-v-0fe9cf29] {
+.option-item[data-v-837d0f9b] {
   padding: 8px 12px;
   cursor: pointer;
   font-size: 14px;
-  color: #4a5568;
+  color: var(--color-text-primary);
   line-height: 1.5;
   transition: all 0.15s ease;
   border-left: 2px solid transparent;
 }
-.option-item[data-v-0fe9cf29]:hover,
-.option-item.is-active[data-v-0fe9cf29] {
-  background-color: #ebf8ff;
-  color: #3182ce;
-  border-left-color: #3182ce;
+.option-item[data-v-837d0f9b]:hover,
+.option-item.is-active[data-v-837d0f9b] {
+  background-color: var(--color-background-hover);
+  color: var(--color-accent);
+  border-left-color: var(--color-accent);
 }
-.no-options[data-v-0fe9cf29] {
+.no-options[data-v-837d0f9b] {
   padding: 10px 12px;
   font-size: 14px;
   color: #718096;
   text-align: center;
   font-style: italic;
 }
-.spinner[data-v-0fe9cf29] {
+.spinner[data-v-837d0f9b] {
   width: 16px;
   height: 16px;
   border: 2px solid rgba(49, 130, 206, 0.2);
   border-top: 2px solid #3182ce;
   border-radius: 50%;
-  animation: spin-0fe9cf29 0.8s linear infinite;
+  animation: spin-837d0f9b 0.8s linear infinite;
 }
-@keyframes spin-0fe9cf29 {
+@keyframes spin-837d0f9b {
 0% {
     transform: rotate(0deg);
 }
@@ -130,14 +130,14 @@
 }
 
 /* Fade transition for dropdown */
-.fade-enter-active[data-v-0fe9cf29],
-.fade-leave-active[data-v-0fe9cf29] {
+.fade-enter-active[data-v-837d0f9b],
+.fade-leave-active[data-v-837d0f9b] {
   transition:
     opacity 0.15s,
     transform 0.15s;
 }
-.fade-enter-from[data-v-0fe9cf29],
-.fade-leave-to[data-v-0fe9cf29] {
+.fade-enter-from[data-v-837d0f9b],
+.fade-leave-to[data-v-837d0f9b] {
   opacity: 0;
   transform: translateY(-5px);
 }

flowfile/web/static/assets/{dropDown-614b998d.js → dropDown-ac0fda9d.js}

@@ -1,4 +1,4 @@
-import { d as defineComponent, r as ref, l as computed, n as onMounted, o as onUnmounted, m as watch, R as nextTick, c as openBlock, e as createElementBlock, p as createBaseVNode, t as toDisplayString, a8 as withDirectives, a9 as vModelText, s as normalizeClass, f as createVNode, w as withCtx, F as Fragment, q as renderList, v as withModifiers, i as createCommentVNode, ac as Transition, _ as _export_sfc } from "./index-5429bbf8.js";
+import { d as defineComponent, r as ref, A as computed, C as onMounted, k as onUnmounted, B as watch, X as nextTick, o as openBlock, c as createElementBlock, b as createBaseVNode, t as toDisplayString, g as withDirectives, v as vModelText, n as normalizeClass, m as createVNode, p as withCtx, F as Fragment, D as renderList, w as withModifiers, f as createCommentVNode, ag as Transition, i as _export_sfc } from "./index-fb6493ae.js";
 const _hoisted_1 = { class: "input-wrapper" };
 const _hoisted_2 = ["placeholder", "aria-expanded", "aria-controls", "aria-activedescendant", "disabled"];
 const _hoisted_3 = { class: "icon-container" };
@@ -312,8 +312,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const dropDown_vue_vue_type_style_index_0_scoped_0fe9cf29_lang = "";
-const ColumnSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-0fe9cf29"]]);
+const dropDown_vue_vue_type_style_index_0_scoped_837d0f9b_lang = "";
+const ColumnSelector = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-837d0f9b"]]);
 export {
   ColumnSelector as C
 };

flowfile/web/static/assets/{fullEditor-f7971590.js → fullEditor-5497a84a.js}

@@ -4,8 +4,9 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { u as useNodeStore, P as PopOver, V as ViewPlugin, p as Decoration, q as EditorState, r as autocompletion, R as RangeSetBuilder, o as T } from "./vue-codemirror.esm-41b0e0d7.js";
-import { d as defineComponent, r as ref, m as watch, n as onMounted, c as openBlock, e as createElementBlock, q as renderList, p as createBaseVNode, t as toDisplayString, F as Fragment, _ as _export_sfc, s as normalizeClass, f as createVNode, w as withCtx, X as shallowRef, u as unref, a as axios, R as nextTick, i as createCommentVNode, l as computed, aq as debounce, T as normalizeStyle, h as createBlock } from "./index-5429bbf8.js";
+import { u as useNodeStore, P as PopOver } from "./PopOver-b22f049e.js";
+import { d as defineComponent, r as ref, B as watch, C as onMounted, o as openBlock, c as createElementBlock, D as renderList, b as createBaseVNode, t as toDisplayString, F as Fragment, i as _export_sfc, n as normalizeClass, m as createVNode, p as withCtx, a2 as shallowRef, s as unref, j as axios, X as nextTick, f as createCommentVNode, A as computed, at as debounce, Z as normalizeStyle, x as createBlock } from "./index-fb6493ae.js";
+import { V as ViewPlugin, x as Decoration, c as EditorState, d as autocompletion, R as RangeSetBuilder, T } from "./vue-codemirror.esm-0965f39f.js";
 const _hoisted_1$5 = { class: "cool-button-container" };
 const _hoisted_2$4 = ["onClick"];
 const _sfc_main$5 = /* @__PURE__ */ defineComponent({
@@ -70,8 +71,8 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const columnsSelector_vue_vue_type_style_index_0_scoped_93995232_lang = "";
-const ColumnSelector = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-93995232"]]);
+const columnsSelector_vue_vue_type_style_index_0_scoped_1880a394_lang = "";
+const ColumnSelector = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-1880a394"]]);
 const _hoisted_1$4 = { class: "radio-menu" };
 const _hoisted_2$3 = ["onClick"];
 const _sfc_main$4 = /* @__PURE__ */ defineComponent({
@@ -398,8 +399,8 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const instantFuncResults_vue_vue_type_style_index_0_scoped_66ed8b64_lang = "";
-const InstantFuncResults = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-66ed8b64"]]);
+const instantFuncResults_vue_vue_type_style_index_0_scoped_eefd07b6_lang = "";
+const InstantFuncResults = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-eefd07b6"]]);
 const _hoisted_1$1 = ["onClick"];
 const _hoisted_2$1 = {
   key: 0,
@@ -501,8 +502,8 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const FuncSelector_vue_vue_type_style_index_0_scoped_967e57c5_lang = "";
-const FuncSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-967e57c5"]]);
+const FuncSelector_vue_vue_type_style_index_0_scoped_23c7de42_lang = "";
+const FuncSelector = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-23c7de42"]]);
 const _hoisted_1 = { class: "container" };
 const _hoisted_2 = { class: "selector" };
 const _hoisted_3 = {
@@ -622,8 +623,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const fullEditor_vue_vue_type_style_index_0_scoped_9df088eb_lang = "";
-const mainEditorRef = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9df088eb"]]);
+const fullEditor_vue_vue_type_style_index_0_scoped_c3de5604_lang = "";
+const mainEditorRef = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c3de5604"]]);
 export {
   mainEditorRef as default
 };

flowfile/web/static/assets/{fullEditor-178376bb.css → fullEditor-a0be62b3.css}

@@ -1,14 +1,15 @@
 
-.cool-button-container[data-v-93995232] {
+.cool-button-container[data-v-1880a394] {
   display: flex;
   flex-direction: column;
   align-items: start;
 }
-.cool-button[data-v-93995232] {
-  width: 100%; /* Ensure the button takes full width of the container */
-  max-width: 200px; /* Set a max-width if you want to control the maximum button size */
+.cool-button[data-v-1880a394] {
+  width: 100%;
+  max-width: 200px;
   border: none;
-  color: rgb(0, 0, 0);
+  color: var(--color-text-primary);
+  background-color: transparent;
   padding: 3px 3px;
   text-align: left;
   display: inline-block;
@@ -17,15 +18,16 @@
   border-radius: 4px;
   white-space: nowrap;
   overflow: hidden;
-  text-overflow: ellipsis; /* Add ellipsis for overflow text */
+  text-overflow: ellipsis;
 }
-.cool-button[data-v-93995232]:hover {
-  background-color: #bcbcbc;
+.cool-button[data-v-1880a394]:hover {
+  background-color: var(--color-background-hover);
 }
-.sidebar-title[data-v-93995232] {
+.sidebar-title[data-v-1880a394] {
   font-size: 16px;
   font-weight: bold;
   padding: 10px;
+  color: var(--color-text-primary);
 }
 
 .radio-menu[data-v-a8e433fb] {
@@ -62,6 +64,8 @@
   display: flex;
   flex-direction: column;
 }
+
+/* Custom syntax highlighting - these are specific to this editor */
 .cm-function {
   color: #f08d49;
   font-weight: bold;
@@ -73,14 +77,14 @@
   color: #b8bb26;
 }
 
-.container[data-v-66ed8b64] {
+.container[data-v-eefd07b6] {
   width: 100%;
   margin: 12px 0 0 0;
   font-family:
     -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans",
     "Helvetica Neue", sans-serif;
 }
-.result-content[data-v-66ed8b64] {
+.result-content[data-v-eefd07b6] {
   display: flex;
   width: 100%;
   border-radius: 6px;
@@ -88,17 +92,17 @@
   height: auto;
   min-height: 48px;
 }
-.result-content.success .label[data-v-66ed8b64] {
+.result-content.success .label[data-v-eefd07b6] {
   background: #1a202c;
 }
-.result-content.loading .label[data-v-66ed8b64] {
+.result-content.loading .label[data-v-eefd07b6] {
   background: #1a202c;
 }
-.result-content.error .label[data-v-66ed8b64] {
+.result-content.error .label[data-v-eefd07b6] {
   background: #7f1d1d;
   color: rgba(255, 255, 255, 0.9);
 }
-.label[data-v-66ed8b64] {
+.label[data-v-eefd07b6] {
   flex: 0 0 150px;
   padding: 14px 16px;
   display: flex;
@@ -108,7 +112,7 @@
   color: rgba(255, 255, 255, 0.84);
   position: relative;
 }
-.label[data-v-66ed8b64]::after {
+.label[data-v-eefd07b6]::after {
   content: "";
   position: absolute;
   top: 50%;
@@ -118,7 +122,7 @@
   transform: translateY(-50%);
   background-color: rgba(255, 255, 255, 0.1);
 }
-.content[data-v-66ed8b64] {
+.content[data-v-eefd07b6] {
   flex: 1;
   padding: 14px 20px;
   color: rgb(0, 0, 0);
@@ -127,17 +131,17 @@
   line-height: 1.5;
   overflow-wrap: break-word;
   word-break: break-word;
-  background-color: #ffffff;
+  background-color: var(--color-background-primary);
 }
-.result-content.error .content[data-v-66ed8b64] {
-  background-color: #ffffff;
-  color: #000000;
+.result-content.error .content[data-v-eefd07b6] {
+  background-color: var(--color-background-primary);
+  color: var(--color-text-error);
 }
-.result-content.loading .label[data-v-66ed8b64] {
+.result-content.loading .label[data-v-eefd07b6] {
   display: flex;
   align-items: center;
 }
-.result-content .label[data-v-66ed8b64]::before {
+.result-content .label[data-v-eefd07b6]::before {
   content: "";
   display: inline-block;
   width: 10px;
@@ -145,20 +149,20 @@
   margin-right: 8px;
   border-radius: 50%;
 }
-.result-content.success .label[data-v-66ed8b64]::before {
+.result-content.success .label[data-v-eefd07b6]::before {
   background-color: #10b981;
   box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.2);
 }
-.result-content.loading .label[data-v-66ed8b64]::before {
+.result-content.loading .label[data-v-eefd07b6]::before {
   background-color: #8b5cf6;
   box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.2);
-  animation: pulse-66ed8b64 1.5s infinite ease-in-out;
+  animation: pulse-eefd07b6 1.5s infinite ease-in-out;
 }
-.result-content.error .label[data-v-66ed8b64]::before {
+.result-content.error .label[data-v-eefd07b6]::before {
   background-color: #ef4444;
   box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.2);
 }
-@keyframes pulse-66ed8b64 {
+@keyframes pulse-eefd07b6 {
 0% {
     opacity: 0.4;
     transform: scale(0.8);
@@ -173,27 +177,31 @@
 }
 }
 
-.toggle-icon[data-v-967e57c5] {
+.toggle-icon[data-v-23c7de42] {
   margin-left: 10px;
   font-weight: bold;
 }
-.tree-subview[data-v-967e57c5] {
+.tree-node[data-v-23c7de42] {
+  color: var(--color-text-primary);
+}
+.tree-subview[data-v-23c7de42] {
   list-style-type: none;
   padding-left: 20px;
 }
-.tree-leaf[data-v-967e57c5] {
+.tree-leaf[data-v-23c7de42] {
   margin-bottom: 5px;
 }
-.cool-button-container[data-v-967e57c5] {
+.cool-button-container[data-v-23c7de42] {
   display: flex;
   flex-direction: column;
   align-items: start;
 }
-.cool-button[data-v-967e57c5] {
-  width: 100%; /* Ensure the button takes full width of the container */
-  max-width: 200px; /* Set a max-width if you want to control the maximum button size */
+.cool-button[data-v-23c7de42] {
+  width: 100%;
+  max-width: 200px;
   border: none;
-  color: rgb(0, 0, 0);
+  color: var(--color-text-primary);
+  background-color: transparent;
   padding: 3px 3px;
   text-align: left;
   display: inline-block;
@@ -202,55 +210,59 @@
   border-radius: 4px;
   white-space: nowrap;
   overflow: hidden;
-  text-overflow: ellipsis; /* Add ellipsis for overflow text */
+  text-overflow: ellipsis;
 }
-.cool-button[data-v-967e57c5]:hover {
-  background-color: #bcbcbc;
+.cool-button[data-v-23c7de42]:hover {
+  background-color: var(--color-background-hover);
 }
 
-.selector[data-v-9df088eb] {
+.selector[data-v-c3de5604] {
   overflow-y: scroll;
   max-height: 300px;
 }
-.container[data-v-9df088eb] {
+.container[data-v-c3de5604] {
   display: flex;
-  border: 1px solid #ccc;
+  border: 1px solid var(--color-border-primary);
   border-radius: 5px;
   overflow: hidden;
-  height: 100%; /* Make it take full height */
+  height: 100%;
   cursor: auto;
+  background-color: var(--color-background-primary);
 }
-.options-container[data-v-9df088eb] {
-  flex-shrink: 0; /* Prevent shrinking */
-  min-width: 50px; /* Minimum width */
-  max-height: 300px; /* Maximum height */
+.options-container[data-v-c3de5604] {
+  flex-shrink: 0;
+  min-width: 50px;
+  max-height: 300px;
   padding-left: 5px;
   padding-right: 5px;
   z-index: 1;
-  overflow-y: auto; /* Make it scrollable */
+  overflow-y: auto;
+  background-color: var(--color-background-primary);
+  color: var(--color-text-primary);
 }
-.resizer[data-v-9df088eb] {
+.resizer[data-v-c3de5604] {
   width: 5px;
-  cursor: ew-resize; /* East-west resize cursor */
-  background-color: #ddd;
-  border-right: 0.5px solid #ccc;
-  flex-shrink: 0; /* Prevent shrinking */
+  cursor: ew-resize;
+  background-color: var(--color-border-primary);
+  border-right: 0.5px solid var(--color-border-secondary);
+  flex-shrink: 0;
 }
-.editor-wrapper[data-v-9df088eb] {
-  flex-grow: 1; /* Take up the remaining space */
+.editor-wrapper[data-v-c3de5604] {
+  flex-grow: 1;
   flex-direction: column;
-  overflow: hidden; /* Hide overflow */
+  overflow: hidden;
+  background-color: var(--color-background-secondary);
 }
-.prism-editor-ref[data-v-9df088eb] {
+.prism-editor-ref[data-v-c3de5604] {
   flex: 1;
   padding: 1px;
-  min-height: 0px; /* Important to make it respect the parent's height */
+  min-height: 0px;
 }
-.error-box-wrapper[data-v-9df088eb] {
+.error-box-wrapper[data-v-c3de5604] {
   overflow-y: auto;
-  border-top: 1px solid #ccc;
+  border-top: 1px solid var(--color-border-primary);
 }
-.divider[data-v-9df088eb] {
-  border-top: 1px solid #ccc;
+.divider[data-v-c3de5604] {
+  border-top: 1px solid var(--color-border-primary);
   padding-bottom: 10px;
 }