Flowfile 0.3.0__py3-none-any.whl → 0.3.0.2__py3-none-any.whl

flowfile/web/static/assets/DatabaseReader-dc0c6881.js

@@ -0,0 +1,426 @@
+import { d as defineComponent, c as openBlock, e as createElementBlock, p as createBaseVNode, _ as _export_sfc, r as ref, n as onMounted, b as resolveComponent, f as createVNode, w as withCtx, F as Fragment, q as renderList, h as createBlock, u as unref, aj as ElRadio, g as createTextVNode, t as toDisplayString, a4 as withDirectives, ae as vModelSelect, a5 as vModelText, i as createCommentVNode, a as axios, z as ElMessage, R as nextTick, a6 as Teleport } from "./index-552863fd.js";
+import { C as CodeLoader } from "./vue-content-loader.es-6b36f05e.js";
+import { u as useNodeStore } from "./PopOver-b37ff9be.js";
+import { f as fetchDatabaseConnectionsInterfaces } from "./api-22b338bd.js";
+import { D as DatabaseConnectionSettings } from "./DatabaseConnectionSettings-f2cecf33.js";
+import { G as GenericNodeSettings } from "./genericNodeSettings-65587f20.js";
+import { N as NodeButton, a as NodeTitle } from "./nodeTitle-cf9bae3c.js";
+import "./secretApi-3ad510e1.js";
+import "./designer-e5bbe26f.js";
+const createNodeDatabaseReader = (flowId, nodeId) => {
+  const databaseSettings = {
+    query_mode: "table",
+    connection_mode: "reference",
+    schema_name: void 0,
+    table_name: void 0,
+    query: "",
+    database_connection: {
+      database_type: "postgresql",
+      username: "",
+      password_ref: "",
+      host: "localhost",
+      port: 4322,
+      database: "",
+      url: void 0
+    }
+  };
+  const nodePolarsCode = {
+    flow_id: flowId,
+    node_id: nodeId,
+    pos_x: 0,
+    pos_y: 0,
+    database_settings: databaseSettings,
+    cache_results: false,
+    fields: []
+  };
+  return nodePolarsCode;
+};
+const _hoisted_1$2 = { class: "query-section" };
+const _hoisted_2$1 = { class: "form-group" };
+const _hoisted_3$1 = ["value"];
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  __name: "SQLQueryComponent",
+  props: {
+    modelValue: {}
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const onInput = (event) => {
+      const target = event.target;
+      emit("update:modelValue", target.value);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$2, [
+        _cache[0] || (_cache[0] = createBaseVNode("h4", { class: "section-subtitle" }, "SQL Query", -1)),
+        createBaseVNode("div", _hoisted_2$1, [
+          createBaseVNode("textarea", {
+            id: "query",
+            value: _ctx.modelValue,
+            class: "form-control textarea",
+            placeholder: "Enter SQL query",
+            rows: "4",
+            onInput
+          }, null, 40, _hoisted_3$1)
+        ])
+      ]);
+    };
+  }
+});
+const SQLQueryComponent_vue_vue_type_style_index_0_scoped_29602f2f_lang = "";
+const SqlQueryComponent = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-29602f2f"]]);
+const _hoisted_1$1 = {
+  key: 0,
+  class: "db-container"
+};
+const _hoisted_2 = { class: "listbox-wrapper" };
+const _hoisted_3 = { class: "form-group" };
+const _hoisted_4 = { key: 0 };
+const _hoisted_5 = { key: 1 };
+const _hoisted_6 = { key: 0 };
+const _hoisted_7 = { key: 1 };
+const _hoisted_8 = ["value"];
+const _hoisted_9 = { class: "listbox-wrapper" };
+const _hoisted_10 = { class: "form-group" };
+const _hoisted_11 = {
+  key: 0,
+  class: "query-section"
+};
+const _hoisted_12 = { class: "form-row" };
+const _hoisted_13 = { class: "form-group half" };
+const _hoisted_14 = { class: "form-group half" };
+const _hoisted_15 = { class: "validation-section" };
+const _hoisted_16 = ["disabled"];
+const _hoisted_17 = {
+  key: 0,
+  class: "error-box"
+};
+const _hoisted_18 = { class: "error-message" };
+const _hoisted_19 = {
+  key: 1,
+  class: "success-box"
+};
+const _hoisted_20 = { class: "success-message" };
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "DatabaseReader",
+  props: {
+    nodeId: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const connectionModeOptions = ref(["inline", "reference"]);
+    const connectionInterfaces = ref([]);
+    const nodeStore = useNodeStore();
+    const nodeDatabaseReader = ref(null);
+    const dataLoaded = ref(false);
+    const validationError = ref(null);
+    const validationSuccess = ref(null);
+    const isValidating = ref(false);
+    const connectionsAreLoading = ref(false);
+    const handleQueryModeChange = (event) => {
+      const target = event.target;
+      const selectedMode = target.value;
+      validationError.value = null;
+      validationSuccess.value = null;
+      if (nodeDatabaseReader.value) {
+        nodeDatabaseReader.value.fields = [];
+        if (selectedMode === "table") {
+          nodeDatabaseReader.value.database_settings.query = "";
+        } else {
+          nodeDatabaseReader.value.database_settings.schema_name = void 0;
+          nodeDatabaseReader.value.database_settings.table_name = void 0;
+        }
+      }
+    };
+    const loadNodeData = async (nodeId) => {
+      var _a;
+      try {
+        const nodeData = await nodeStore.getNodeData(nodeId, false);
+        if (nodeData) {
+          const hasValidSetup = Boolean((_a = nodeData.setting_input) == null ? void 0 : _a.is_setup);
+          nodeDatabaseReader.value = hasValidSetup ? nodeData.setting_input : createNodeDatabaseReader(nodeStore.flow_id, nodeId);
+        }
+        dataLoaded.value = true;
+      } catch (error) {
+        console.error("Error loading node data:", error);
+        dataLoaded.value = false;
+      }
+    };
+    const validateQuery = () => {
+      var _a, _b;
+      if (!((_b = (_a = nodeDatabaseReader.value) == null ? void 0 : _a.database_settings) == null ? void 0 : _b.query)) {
+        validationError.value = "Please enter a SQL query";
+        validationSuccess.value = null;
+        return;
+      }
+      validateDatabaseSettings();
+    };
+    const resetFields = () => {
+      if (nodeDatabaseReader.value) {
+        nodeDatabaseReader.value.fields = [];
+      }
+    };
+    const validateDatabaseSettings = async () => {
+      var _a;
+      if (!((_a = nodeDatabaseReader.value) == null ? void 0 : _a.database_settings)) {
+        validationError.value = "Database settings are incomplete";
+        validationSuccess.value = null;
+        return;
+      }
+      validationError.value = null;
+      validationSuccess.value = null;
+      isValidating.value = true;
+      resetFields();
+      try {
+        const response = await axios.post(
+          "/validate_db_settings",
+          nodeDatabaseReader.value.database_settings
+        );
+        validationSuccess.value = response.data.message || "Settings are valid";
+      } catch (error) {
+        if (error.response && error.response.data && error.response.data.detail) {
+          validationError.value = error.response.data.detail;
+        } else {
+          validationError.value = "An error occurred during validation";
+          console.error("Validation error:", error);
+        }
+      } finally {
+        isValidating.value = false;
+      }
+    };
+    const pushNodeData = async () => {
+      if (!nodeDatabaseReader.value || !nodeDatabaseReader.value.database_settings) {
+        return;
+      }
+      nodeDatabaseReader.value.is_setup = true;
+      nodeStore.updateSettings(nodeDatabaseReader);
+      dataLoaded.value = false;
+    };
+    const fetchConnections = async () => {
+      connectionsAreLoading.value = true;
+      try {
+        connectionInterfaces.value = await fetchDatabaseConnectionsInterfaces();
+      } catch (error) {
+        console.error("Error fetching connections:", error);
+        ElMessage.error("Failed to load database connections");
+      } finally {
+        connectionsAreLoading.value = false;
+      }
+    };
+    onMounted(async () => {
+      await fetchConnections();
+    });
+    __expose({
+      loadNodeData,
+      pushNodeData
+    });
+    return (_ctx, _cache) => {
+      const _component_el_radio_group = resolveComponent("el-radio-group");
+      return dataLoaded.value && nodeDatabaseReader.value ? (openBlock(), createElementBlock("div", _hoisted_1$1, [
+        createVNode(GenericNodeSettings, {
+          modelValue: nodeDatabaseReader.value,
+          "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => nodeDatabaseReader.value = $event)
+        }, {
+          default: withCtx(() => [
+            createBaseVNode("div", _hoisted_2, [
+              createBaseVNode("div", _hoisted_3, [
+                _cache[8] || (_cache[8] = createBaseVNode("label", null, "Connection Mode", -1)),
+                createVNode(_component_el_radio_group, {
+                  modelValue: nodeDatabaseReader.value.database_settings.connection_mode,
+                  "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => nodeDatabaseReader.value.database_settings.connection_mode = $event)
+                }, {
+                  default: withCtx(() => [
+                    (openBlock(true), createElementBlock(Fragment, null, renderList(connectionModeOptions.value, (option) => {
+                      return openBlock(), createBlock(unref(ElRadio), {
+                        key: option,
+                        label: option
+                      }, {
+                        default: withCtx(() => [
+                          createTextVNode(toDisplayString(option), 1)
+                        ]),
+                        _: 2
+                      }, 1032, ["label"]);
+                    }), 128))
+                  ]),
+                  _: 1
+                }, 8, ["modelValue"])
+              ]),
+              createBaseVNode("div", null, [
+                nodeDatabaseReader.value.database_settings.connection_mode == "inline" && nodeDatabaseReader.value.database_settings.database_connection ? (openBlock(), createElementBlock("div", _hoisted_4, [
+                  createVNode(DatabaseConnectionSettings, {
+                    modelValue: nodeDatabaseReader.value.database_settings.database_connection,
+                    "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => nodeDatabaseReader.value.database_settings.database_connection = $event),
+                    onChange: resetFields
+                  }, null, 8, ["modelValue"])
+                ])) : (openBlock(), createElementBlock("div", _hoisted_5, [
+                  connectionsAreLoading.value ? (openBlock(), createElementBlock("div", _hoisted_6, _cache[9] || (_cache[9] = [
+                    createBaseVNode("div", { class: "loading-spinner" }, null, -1),
+                    createBaseVNode("p", null, "Loading connections...", -1)
+                  ]))) : (openBlock(), createElementBlock("div", _hoisted_7, [
+                    withDirectives(createBaseVNode("select", {
+                      id: "connection-select",
+                      "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => nodeDatabaseReader.value.database_settings.database_connection_name = $event),
+                      class: "form-control minimal-select"
+                    }, [
+                      _cache[10] || (_cache[10] = createBaseVNode("option", {
+                        disabled: "",
+                        value: ""
+                      }, "Choose a connection", -1)),
+                      (openBlock(true), createElementBlock(Fragment, null, renderList(connectionInterfaces.value, (conn) => {
+                        return openBlock(), createElementBlock("option", {
+                          key: conn.connectionName,
+                          value: conn.connectionName
+                        }, toDisplayString(conn.connectionName) + " (" + toDisplayString(conn.databaseType) + " - " + toDisplayString(conn.database) + ") ", 9, _hoisted_8);
+                      }), 128))
+                    ], 512), [
+                      [vModelSelect, nodeDatabaseReader.value.database_settings.database_connection_name]
+                    ])
+                  ]))
+                ]))
+              ])
+            ]),
+            createBaseVNode("div", _hoisted_9, [
+              createBaseVNode("div", _hoisted_10, [
+                _cache[12] || (_cache[12] = createBaseVNode("label", { for: "query-mode" }, "Query Mode", -1)),
+                withDirectives(createBaseVNode("select", {
+                  id: "query-mode",
+                  "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => nodeDatabaseReader.value.database_settings.query_mode = $event),
+                  class: "form-control",
+                  onChange: handleQueryModeChange
+                }, _cache[11] || (_cache[11] = [
+                  createBaseVNode("option", { value: "table" }, "Table", -1),
+                  createBaseVNode("option", { value: "query" }, "Query", -1)
+                ]), 544), [
+                  [vModelSelect, nodeDatabaseReader.value.database_settings.query_mode]
+                ])
+              ]),
+              nodeDatabaseReader.value.database_settings.query_mode === "table" ? (openBlock(), createElementBlock("div", _hoisted_11, [
+                _cache[15] || (_cache[15] = createBaseVNode("h4", { class: "section-subtitle" }, "Table Selection", -1)),
+                createBaseVNode("div", _hoisted_12, [
+                  createBaseVNode("div", _hoisted_13, [
+                    _cache[13] || (_cache[13] = createBaseVNode("label", { for: "schema-name" }, "Schema", -1)),
+                    withDirectives(createBaseVNode("input", {
+                      id: "schema-name",
+                      "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => nodeDatabaseReader.value.database_settings.schema_name = $event),
+                      type: "text",
+                      class: "form-control",
+                      placeholder: "Enter schema name",
+                      onInput: resetFields
+                    }, null, 544), [
+                      [vModelText, nodeDatabaseReader.value.database_settings.schema_name]
+                    ])
+                  ]),
+                  createBaseVNode("div", _hoisted_14, [
+                    _cache[14] || (_cache[14] = createBaseVNode("label", { for: "table-name" }, "Table", -1)),
+                    withDirectives(createBaseVNode("input", {
+                      id: "table-name",
+                      "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => nodeDatabaseReader.value.database_settings.table_name = $event),
+                      type: "text",
+                      class: "form-control",
+                      placeholder: "Enter table name",
+                      onInput: resetFields
+                    }, null, 544), [
+                      [vModelText, nodeDatabaseReader.value.database_settings.table_name]
+                    ])
+                  ])
+                ])
+              ])) : createCommentVNode("", true),
+              nodeDatabaseReader.value.database_settings.query_mode === "query" ? (openBlock(), createBlock(SqlQueryComponent, {
+                key: 1,
+                modelValue: nodeDatabaseReader.value.database_settings.query,
+                "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => nodeDatabaseReader.value.database_settings.query = $event),
+                onValidate: validateQuery,
+                onInput: resetFields
+              }, null, 8, ["modelValue"])) : createCommentVNode("", true),
+              createBaseVNode("div", _hoisted_15, [
+                createBaseVNode("button", {
+                  class: "validate-button",
+                  disabled: isValidating.value,
+                  onClick: validateDatabaseSettings
+                }, toDisplayString(isValidating.value ? "Validating..." : "Validate Settings"), 9, _hoisted_16),
+                validationError.value ? (openBlock(), createElementBlock("div", _hoisted_17, [
+                  _cache[16] || (_cache[16] = createBaseVNode("div", { class: "error-title" }, "Validation Error", -1)),
+                  createBaseVNode("div", _hoisted_18, toDisplayString(validationError.value), 1)
+                ])) : createCommentVNode("", true),
+                validationSuccess.value ? (openBlock(), createElementBlock("div", _hoisted_19, [
+                  createBaseVNode("div", _hoisted_20, toDisplayString(validationSuccess.value), 1)
+                ])) : createCommentVNode("", true)
+              ])
+            ])
+          ]),
+          _: 1
+        }, 8, ["modelValue"])
+      ])) : (openBlock(), createBlock(unref(CodeLoader), { key: 1 }));
+    };
+  }
+});
+const DatabaseReader_vue_vue_type_style_index_0_scoped_ae4d7dc5_lang = "";
+const DatabaseReader = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-ae4d7dc5"]]);
+const _hoisted_1 = { ref: "el" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "DatabaseReader",
+  props: {
+    nodeId: {
+      type: Number,
+      required: true
+    }
+  },
+  setup(__props) {
+    const nodeStore = useNodeStore();
+    const childComp = ref(null);
+    const props = __props;
+    const drawer = ref(false);
+    const closeOnDrawer = () => {
+      var _a;
+      drawer.value = false;
+      (_a = childComp.value) == null ? void 0 : _a.pushNodeData();
+    };
+    const openDrawer = async () => {
+      if (nodeStore.node_id === props.nodeId) {
+        return;
+      }
+      nodeStore.closeDrawer();
+      drawer.value = true;
+      const drawerOpen = nodeStore.isDrawerOpen;
+      nodeStore.isDrawerOpen = true;
+      await nextTick();
+      if (nodeStore.node_id === props.nodeId && drawerOpen) {
+        return;
+      }
+      if (childComp.value) {
+        childComp.value.loadNodeData(props.nodeId);
+        nodeStore.openDrawer(closeOnDrawer);
+      }
+    };
+    onMounted(async () => {
+      await nextTick();
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(NodeButton, {
+          ref: "nodeButton",
+          "node-id": __props.nodeId,
+          "image-src": "database_reader.svg",
+          title: `${__props.nodeId}: Database reader`,
+          onClick: openDrawer
+        }, null, 8, ["node-id", "title"]),
+        drawer.value ? (openBlock(), createBlock(Teleport, {
+          key: 0,
+          to: "#nodesettings"
+        }, [
+          createVNode(NodeTitle, {
+            title: "Read data from database",
+            intro: "Read data from database"
+          }),
+          createVNode(DatabaseReader, {
+            ref_key: "childComp",
+            ref: childComp,
+            "node-id": __props.nodeId
+          }, null, 8, ["node-id"])
+        ])) : createCommentVNode("", true)
+      ], 512);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

flowfile/web/static/assets/DatabaseReader-f50c6558.css

@@ -0,0 +1,158 @@
+
+.query-section[data-v-29602f2f] {
+  margin-top: 1rem;
+  padding-top: 1rem;
+  border-top: 1px solid #edf2f7;
+}
+.section-subtitle[data-v-29602f2f] {
+  margin: 0 0 0.75rem 0;
+  font-size: 0.95rem;
+  font-weight: 600;
+  color: #4a5568;
+}
+.form-group[data-v-29602f2f] {
+  margin-bottom: 1rem;
+}
+.form-control[data-v-29602f2f] {
+  width: 100%;
+  padding: 0.5rem;
+  border: 1px solid #e2e8f0;
+  border-radius: 4px;
+  font-size: 0.875rem;
+}
+.textarea[data-v-29602f2f] {
+  resize: vertical;
+  min-height: 100px;
+  font-family: monospace;
+}
+
+.db-container[data-v-ae4d7dc5] {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  max-width: 100%;
+  color: #333;
+}
+.section-subtitle[data-v-ae4d7dc5] {
+  margin: 0 0 0.75rem 0;
+  font-size: 0.95rem;
+  font-weight: 600;
+  color: #4a5568;
+}
+.query-section[data-v-ae4d7dc5] {
+  margin-top: 1rem;
+  padding-top: 1rem;
+  border-top: 1px solid #edf2f7;
+}
+.form-row[data-v-ae4d7dc5] {
+  display: flex;
+  gap: 0.75rem;
+  margin-bottom: 0.75rem;
+  width: 100%;
+  box-sizing: border-box;
+}
+.half[data-v-ae4d7dc5] {
+  flex: 1;
+  min-width: 0; /* Allow fields to shrink below their content size */
+  max-width: calc(50% - 0.375rem); /* Account for the gap between items */
+}
+.form-control[data-v-ae4d7dc5] {
+  width: 100%;
+  padding: 0.5rem;
+  border: 1px solid #e2e8f0;
+  border-radius: 4px;
+  font-size: 0.875rem;
+  box-sizing: border-box;
+}
+.form-group[data-v-ae4d7dc5] {
+  margin-bottom: 0.75rem;
+  width: 100%;
+}
+label[data-v-ae4d7dc5] {
+  display: block;
+  margin-bottom: 0.25rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: #4a5568;
+}
+.form-control[data-v-ae4d7dc5] {
+  width: 100%;
+  padding: 0.5rem;
+  border: 1px solid #e2e8f0;
+  border-radius: 4px;
+  font-size: 0.875rem;
+}
+select.form-control[data-v-ae4d7dc5] {
+  appearance: none;
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%234a5568' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 0.5rem center;
+  background-size: 1em;
+  padding-right: 2rem;
+}
+
+/* Validation section styling */
+.validation-section[data-v-ae4d7dc5] {
+  margin-top: 1.5rem;
+  padding-top: 1rem;
+  border-top: 1px solid #edf2f7;
+}
+.validate-button[data-v-ae4d7dc5] {
+  background-color: #4299e1;
+  color: white;
+  border: none;
+  border-radius: 4px;
+  padding: 0.5rem 1rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+.validate-button[data-v-ae4d7dc5]:hover {
+  background-color: #3182ce;
+}
+.validate-button[data-v-ae4d7dc5]:disabled {
+  background-color: #a0aec0;
+  cursor: not-allowed;
+}
+.error-box[data-v-ae4d7dc5] {
+  margin-top: 1rem;
+  padding: 0.75rem;
+  border-radius: 4px;
+  background-color: #fff5f5;
+  border: 1px solid #fed7d7;
+}
+.error-title[data-v-ae4d7dc5] {
+  color: #e53e3e;
+  font-weight: 600;
+  margin-bottom: 0.25rem;
+}
+.error-message[data-v-ae4d7dc5] {
+  color: #c53030;
+  font-size: 0.875rem;
+  white-space: pre-wrap;
+  overflow-wrap: break-word;
+}
+.success-box[data-v-ae4d7dc5] {
+  margin-top: 1rem;
+  padding: 0.75rem;
+  border-radius: 4px;
+  background-color: #f0fff4;
+  border: 1px solid #c6f6d5;
+}
+.success-message[data-v-ae4d7dc5] {
+  color: #38a169;
+  font-size: 0.875rem;
+}
+@media (max-width: 640px) {
+.form-row[data-v-ae4d7dc5] {
+    flex-direction: column;
+    gap: 0.5rem;
+}
+}
+.el-radio-group[data-v-ae4d7dc5] {
+  display: flex !important;
+  flex-direction: row !important;
+  gap: 1rem;
+}
+.el-radio[data-v-ae4d7dc5] {
+  margin-right: 0 !important; /* Override any existing margins */
+}

flowfile/web/static/assets/DatabaseWriter-2f570e53.css

@@ -0,0 +1,96 @@
+
+.db-container[data-v-90b52fee] {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+  max-width: 100%;
+  color: #333;
+}
+.section-subtitle[data-v-90b52fee] {
+  margin: 0 0 0.75rem 0;
+  font-size: 0.95rem;
+  font-weight: 600;
+  color: #4a5568;
+}
+.form-row[data-v-90b52fee] {
+  display: flex;
+  gap: 0.75rem;
+  margin-bottom: 0.75rem;
+  width: 100%;
+  box-sizing: border-box;
+}
+.half[data-v-90b52fee] {
+  flex: 1;
+  min-width: 0; /* Allow fields to shrink below their content size */
+  max-width: calc(50% - 0.375rem); /* Account for the gap between items */
+}
+.form-control[data-v-90b52fee] {
+  width: 100%;
+  padding: 0.5rem;
+  border: 1px solid #e2e8f0;
+  border-radius: 4px;
+  font-size: 0.875rem;
+  box-sizing: border-box;
+}
+.form-group[data-v-90b52fee] {
+  margin-bottom: 0.75rem;
+  width: 100%;
+}
+label[data-v-90b52fee] {
+  display: block;
+  margin-bottom: 0.25rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: #4a5568;
+}
+select.form-control[data-v-90b52fee] {
+  appearance: none;
+  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%234a5568' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 0.5rem center;
+  background-size: 1em;
+  padding-right: 2rem;
+}
+.loading-spinner[data-v-90b52fee] {
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  border: 2px solid rgba(66, 153, 225, 0.3);
+  border-radius: 50%;
+  border-top-color: #4299e1;
+  animation: spin-90b52fee 1s ease-in-out infinite;
+  margin-right: 8px;
+}
+@keyframes spin-90b52fee {
+to {
+    transform: rotate(360deg);
+}
+}
+.option-description[data-v-90b52fee] {
+  font-size: 0.875rem;
+  color: #718096;
+  margin: 0.5rem 0;
+  padding: 0.75rem;
+  background-color: #f7fafc;
+  border-radius: 4px;
+  border-left: 3px solid #4299e1;
+}
+.el-radio-group[data-v-90b52fee] {
+  display: flex !important;
+  flex-direction: row !important;
+  gap: 1rem;
+}
+.el-radio[data-v-90b52fee] {
+  margin-right: 0 !important; /* Override any existing margins */
+}
+@media (max-width: 640px) {
+.form-row[data-v-90b52fee] {
+    flex-direction: column;
+    gap: 0.5rem;
+}
+.half[data-v-90b52fee] {
+    max-width: 100%;
+}
+.el-radio-group[data-v-90b52fee] {
+    flex-direction: column !important;
+    gap: 0.5rem;
+}
+}