fdb2 1.0.6 → 1.0.8

package/packages/vscode/resources/webview/connection.css

@@ -0,0 +1,69 @@
+
+.connection-form[data-v-d5bbc9a6] {
+  padding: 20px;
+  max-width: 600px;
+  margin: 0 auto;
+}
+.panel-title[data-v-d5bbc9a6] {
+  font-size: 18px;
+  font-weight: 600;
+  margin-bottom: 24px;
+  color: var(--vscode-foreground);
+}
+.form-group[data-v-d5bbc9a6] {
+  margin-bottom: 20px;
+}
+.form-label[data-v-d5bbc9a6] {
+  display: block;
+  margin-bottom: 8px;
+  font-weight: 500;
+  color: var(--vscode-foreground);
+}
+.form-control[data-v-d5bbc9a6] {
+  width: 100%;
+  padding: 8px 12px;
+  border: 1px solid var(--vscode-input-border);
+  background-color: var(--vscode-input-background);
+  color: var(--vscode-input-foreground);
+  border-radius: 4px;
+  font-size: 14px;
+}
+.form-control[data-v-d5bbc9a6]:focus {
+  outline: none;
+  border-color: var(--vscode-focusBorder);
+}
+.form-row[data-v-d5bbc9a6] {
+  display: flex;
+  gap: 12px;
+}
+.form-col[data-v-d5bbc9a6] {
+  flex: 1;
+}
+.form-actions[data-v-d5bbc9a6] {
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+  margin-top: 24px;
+}
+.btn[data-v-d5bbc9a6] {
+  padding: 8px 16px;
+  border: none;
+  border-radius: 4px;
+  font-size: 14px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+.btn-primary[data-v-d5bbc9a6] {
+  background-color: var(--vscode-button-background);
+  color: var(--vscode-button-foreground);
+}
+.btn-primary[data-v-d5bbc9a6]:hover {
+  background-color: var(--vscode-button-hoverBackground);
+}
+.btn-secondary[data-v-d5bbc9a6] {
+  background-color: var(--vscode-button-secondaryBackground);
+  color: var(--vscode-button-secondaryForeground);
+}
+.btn-secondary[data-v-d5bbc9a6]:hover {
+  background-color: var(--vscode-button-secondaryHoverBackground);
+}

package/packages/vscode/resources/webview/connection.js

@@ -0,0 +1,228 @@
+import { d as defineComponent, g as getVSCodeBridge, o as onMounted, a as openBlock, c as createElementBlock, b as createBaseVNode, t as toDisplayString, w as withDirectives, v as vModelText, e as vModelSelect, F as Fragment, r as renderList, f as createCommentVNode, h as withModifiers, i as ref, j as reactive, _ as _export_sfc, k as createApp } from "./_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "connection-form" };
+const _hoisted_2 = { class: "panel-title" };
+const _hoisted_3 = { class: "form-group" };
+const _hoisted_4 = { class: "form-group" };
+const _hoisted_5 = ["value"];
+const _hoisted_6 = {
+  key: 0,
+  class: "form-row"
+};
+const _hoisted_7 = { class: "form-col form-group" };
+const _hoisted_8 = { class: "form-col form-group" };
+const _hoisted_9 = ["id"];
+const _hoisted_10 = { class: "form-label" };
+const _hoisted_11 = ["placeholder"];
+const _hoisted_12 = {
+  key: 1,
+  class: "form-group"
+};
+const _hoisted_13 = { class: "form-row" };
+const _hoisted_14 = { class: "form-col" };
+const _hoisted_15 = { class: "form-col" };
+const _hoisted_16 = { class: "form-actions" };
+const _hoisted_17 = {
+  type: "submit",
+  class: "btn btn-primary"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ConnectionPanel",
+  setup(__props) {
+    const vscode = getVSCodeBridge();
+    const isEditMode = ref(false);
+    const editingConnection = ref(null);
+    const form = reactive({
+      name: "",
+      type: "mysql",
+      host: "localhost",
+      port: 3306,
+      database: "",
+      username: "",
+      password: ""
+    });
+    const databaseTypes = [
+      { type: "mysql", name: "MySQL", defaultPort: 3306 },
+      { type: "postgresql", name: "PostgreSQL", defaultPort: 5432 },
+      { type: "sqlite", name: "SQLite", defaultPort: 0 },
+      { type: "sqlserver", name: "SQL Server", defaultPort: 1433 },
+      { type: "oracle", name: "Oracle", defaultPort: 1521 }
+    ];
+    onMounted(() => {
+      vscode.onMessage((message) => {
+        if (message.command === "editConnection") {
+          enterEditMode(message.data);
+        } else if (message.command === "testResult") {
+          handleTestResult(message.data);
+        }
+      });
+    });
+    function enterEditMode(connection) {
+      editingConnection.value = connection;
+      isEditMode.value = true;
+      Object.assign(form, {
+        name: connection.name,
+        type: connection.type,
+        host: connection.host,
+        port: connection.port,
+        database: connection.database || "",
+        username: connection.username || "",
+        password: connection.password || ""
+      });
+    }
+    function handleTypeChange() {
+      const dbType = databaseTypes.find((db) => db.type === form.type);
+      if (dbType && dbType.defaultPort > 0) {
+        form.port = dbType.defaultPort;
+      }
+    }
+    function handleSubmit() {
+      const connectionData = { ...form };
+      if (isEditMode.value && editingConnection.value) {
+        connectionData.id = editingConnection.value.id;
+        vscode.postMessage({ command: "updateConnection", data: connectionData });
+      } else {
+        vscode.postMessage({ command: "addConnection", data: connectionData });
+      }
+    }
+    function handleTestConnection() {
+      vscode.postMessage({ command: "testConnection", data: { ...form } });
+    }
+    function handleTestResult(data) {
+      if (data.success) {
+        alert("连接测试成功");
+      } else {
+        alert("连接测试失败");
+      }
+    }
+    function handleCancel() {
+      vscode.postMessage({ command: "close" });
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createBaseVNode("h1", _hoisted_2, toDisplayString(isEditMode.value ? "编辑" : "添加") + "数据库连接", 1),
+        createBaseVNode("form", {
+          onSubmit: withModifiers(handleSubmit, ["prevent"])
+        }, [
+          createBaseVNode("div", _hoisted_3, [
+            _cache[7] || (_cache[7] = createBaseVNode("label", { class: "form-label" }, "连接名称", -1)),
+            withDirectives(createBaseVNode("input", {
+              type: "text",
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => form.name = $event),
+              class: "form-control",
+              placeholder: "例如：生产环境 MySQL",
+              required: ""
+            }, null, 512), [
+              [vModelText, form.name]
+            ])
+          ]),
+          createBaseVNode("div", _hoisted_4, [
+            _cache[8] || (_cache[8] = createBaseVNode("label", { class: "form-label" }, "数据库类型", -1)),
+            withDirectives(createBaseVNode("select", {
+              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => form.type = $event),
+              class: "form-control",
+              onChange: handleTypeChange,
+              required: ""
+            }, [
+              (openBlock(), createElementBlock(Fragment, null, renderList(databaseTypes, (db) => {
+                return createBaseVNode("option", {
+                  key: db.type,
+                  value: db.type
+                }, toDisplayString(db.name), 9, _hoisted_5);
+              }), 64))
+            ], 544), [
+              [vModelSelect, form.type]
+            ])
+          ]),
+          form.type !== "sqlite" ? (openBlock(), createElementBlock("div", _hoisted_6, [
+            createBaseVNode("div", _hoisted_7, [
+              _cache[9] || (_cache[9] = createBaseVNode("label", { class: "form-label" }, "主机地址", -1)),
+              withDirectives(createBaseVNode("input", {
+                type: "text",
+                "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => form.host = $event),
+                class: "form-control",
+                placeholder: "localhost",
+                required: ""
+              }, null, 512), [
+                [vModelText, form.host]
+              ])
+            ]),
+            createBaseVNode("div", _hoisted_8, [
+              _cache[10] || (_cache[10] = createBaseVNode("label", { class: "form-label" }, "端口", -1)),
+              withDirectives(createBaseVNode("input", {
+                type: "number",
+                "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => form.port = $event),
+                class: "form-control",
+                placeholder: "3306",
+                required: ""
+              }, null, 512), [
+                [
+                  vModelText,
+                  form.port,
+                  void 0,
+                  { number: true }
+                ]
+              ])
+            ])
+          ])) : createCommentVNode("", true),
+          createBaseVNode("div", {
+            class: "form-group",
+            id: form.type === "sqlite" ? "sqlite-path" : "database-name"
+          }, [
+            createBaseVNode("label", _hoisted_10, toDisplayString(form.type === "sqlite" ? "数据库文件路径" : "数据库名称"), 1),
+            withDirectives(createBaseVNode("input", {
+              type: "text",
+              "onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => form.database = $event),
+              class: "form-control",
+              placeholder: form.type === "sqlite" ? "/path/to/database.sqlite" : "数据库名称"
+            }, null, 8, _hoisted_11), [
+              [vModelText, form.database]
+            ])
+          ], 8, _hoisted_9),
+          form.type !== "sqlite" ? (openBlock(), createElementBlock("div", _hoisted_12, [
+            createBaseVNode("div", _hoisted_13, [
+              createBaseVNode("div", _hoisted_14, [
+                _cache[11] || (_cache[11] = createBaseVNode("label", { class: "form-label" }, "用户名", -1)),
+                withDirectives(createBaseVNode("input", {
+                  type: "text",
+                  "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => form.username = $event),
+                  class: "form-control",
+                  placeholder: "root"
+                }, null, 512), [
+                  [vModelText, form.username]
+                ])
+              ]),
+              createBaseVNode("div", _hoisted_15, [
+                _cache[12] || (_cache[12] = createBaseVNode("label", { class: "form-label" }, "密码", -1)),
+                withDirectives(createBaseVNode("input", {
+                  type: "password",
+                  "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => form.password = $event),
+                  class: "form-control",
+                  placeholder: "••••••••"
+                }, null, 512), [
+                  [vModelText, form.password]
+                ])
+              ])
+            ])
+          ])) : createCommentVNode("", true),
+          createBaseVNode("div", _hoisted_16, [
+            createBaseVNode("button", {
+              type: "button",
+              onClick: handleTestConnection,
+              class: "btn btn-secondary"
+            }, " 测试连接 "),
+            createBaseVNode("button", {
+              type: "button",
+              onClick: handleCancel,
+              class: "btn btn-secondary"
+            }, " 取消 "),
+            createBaseVNode("button", _hoisted_17, toDisplayString(isEditMode.value ? "保存" : "添加"), 1)
+          ])
+        ], 32)
+      ]);
+    };
+  }
+});
+const ConnectionPanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d5bbc9a6"]]);
+const app = createApp(ConnectionPanel);
+app.mount("#app");
+//# sourceMappingURL=connection.js.map

package/packages/vscode/resources/webview/connection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"connection.js","sources":["../../../../src/platform/vscode/components/ConnectionPanel.vue","../../../../src/platform/vscode/entry/connection.ts"],"sourcesContent":["<template>\r\n  <div class=\"connection-form\">\r\n    <h1 class=\"panel-title\">{{ isEditMode ? '编辑' : '添加' }}数据库连接</h1>\r\n\r\n    <form @submit.prevent=\"handleSubmit\">\r\n      <div class=\"form-group\">\r\n        <label class=\"form-label\">连接名称</label>\r\n        <input\r\n          type=\"text\"\r\n          v-model=\"form.name\"\r\n          class=\"form-control\"\r\n          placeholder=\"例如：生产环境 MySQL\"\r\n          required\r\n        />\r\n      </div>\r\n\r\n      <div class=\"form-group\">\r\n        <label class=\"form-label\">数据库类型</label>\r\n        <select v-model=\"form.type\" class=\"form-control\" @change=\"handleTypeChange\" required>\r\n          <option v-for=\"db in databaseTypes\" :key=\"db.type\" :value=\"db.type\">\r\n            {{ db.name }}\r\n          </option>\r\n        </select>\r\n      </div>\r\n\r\n      <div class=\"form-row\" v-if=\"form.type !== 'sqlite'\">\r\n        <div class=\"form-col form-group\">\r\n          <label class=\"form-label\">主机地址</label>\r\n          <input\r\n            type=\"text\"\r\n            v-model=\"form.host\"\r\n            class=\"form-control\"\r\n            placeholder=\"localhost\"\r\n            required\r\n          />\r\n        </div>\r\n\r\n        <div class=\"form-col form-group\">\r\n          <label class=\"form-label\">端口</label>\r\n          <input\r\n            type=\"number\"\r\n            v-model.number=\"form.port\"\r\n            class=\"form-control\"\r\n            placeholder=\"3306\"\r\n            required\r\n          />\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"form-group\" :id=\"form.type === 'sqlite' ? 'sqlite-path' : 'database-name'\">\r\n        <label class=\"form-label\">\r\n          {{ form.type === 'sqlite' ? '数据库文件路径' : '数据库名称' }}\r\n        </label>\r\n        <input\r\n          type=\"text\"\r\n          v-model=\"form.database\"\r\n          class=\"form-control\"\r\n          :placeholder=\"form.type === 'sqlite' ? '/path/to/database.sqlite' : '数据库名称'\"\r\n        />\r\n      </div>\r\n\r\n      <div class=\"form-group\" v-if=\"form.type !== 'sqlite'\">\r\n        <div class=\"form-row\">\r\n          <div class=\"form-col\">\r\n            <label class=\"form-label\">用户名</label>\r\n            <input\r\n              type=\"text\"\r\n              v-model=\"form.username\"\r\n              class=\"form-control\"\r\n              placeholder=\"root\"\r\n            />\r\n          </div>\r\n\r\n          <div class=\"form-col\">\r\n            <label class=\"form-label\">密码</label>\r\n            <input\r\n              type=\"password\"\r\n              v-model=\"form.password\"\r\n              class=\"form-control\"\r\n              placeholder=\"••••••••\"\r\n            />\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"form-actions\">\r\n        <button type=\"button\" @click=\"handleTestConnection\" class=\"btn btn-secondary\">\r\n          测试连接\r\n        </button>\r\n        <button type=\"button\" @click=\"handleCancel\" class=\"btn btn-secondary\">\r\n          取消\r\n        </button>\r\n        <button type=\"submit\" class=\"btn btn-primary\">\r\n          {{ isEditMode ? '保存' : '添加' }}\r\n        </button>\r\n      </div>\r\n    </form>\r\n  </div>\r\n</template>\r\n\r\n<script setup lang=\"ts\">\r\nimport { ref, reactive, onMounted } from 'vue';\r\nimport { getVSCodeBridge } from '../bridge';\r\n\r\nconst vscode = getVSCodeBridge();\r\n\r\nconst isEditMode = ref(false);\r\nconst editingConnection = ref<any>(null);\r\n\r\nconst form = reactive({\r\n  name: '',\r\n  type: 'mysql',\r\n  host: 'localhost',\r\n  port: 3306,\r\n  database: '',\r\n  username: '',\r\n  password: ''\r\n});\r\n\r\nconst databaseTypes = [\r\n  { type: 'mysql', name: 'MySQL', defaultPort: 3306 },\r\n  { type: 'postgresql', name: 'PostgreSQL', defaultPort: 5432 },\r\n  { type: 'sqlite', name: 'SQLite', defaultPort: 0 },\r\n  { type: 'sqlserver', name: 'SQL Server', defaultPort: 1433 },\r\n  { type: 'oracle', name: 'Oracle', defaultPort: 1521 }\r\n];\r\n\r\nonMounted(() => {\r\n  // 监听来自扩展的消息\r\n  vscode.onMessage((message: any) => {\r\n    if (message.command === 'editConnection') {\r\n      enterEditMode(message.data);\r\n    } else if (message.command === 'testResult') {\r\n      handleTestResult(message.data);\r\n    }\r\n  });\r\n});\r\n\r\nfunction enterEditMode(connection: any) {\r\n  editingConnection.value = connection;\r\n  isEditMode.value = true;\r\n\r\n  Object.assign(form, {\r\n    name: connection.name,\r\n    type: connection.type,\r\n    host: connection.host,\r\n    port: connection.port,\r\n    database: connection.database || '',\r\n    username: connection.username || '',\r\n    password: connection.password || ''\r\n  });\r\n}\r\n\r\nfunction handleTypeChange() {\r\n  const dbType = databaseTypes.find(db => db.type === form.type);\r\n  if (dbType && dbType.defaultPort > 0) {\r\n    form.port = dbType.defaultPort;\r\n  }\r\n}\r\n\r\nfunction handleSubmit() {\r\n  const connectionData = { ...form };\r\n\r\n  if (isEditMode.value && editingConnection.value) {\r\n    connectionData.id = editingConnection.value.id;\r\n    vscode.postMessage({ command: 'updateConnection', data: connectionData });\r\n  } else {\r\n    vscode.postMessage({ command: 'addConnection', data: connectionData });\r\n  }\r\n}\r\n\r\nfunction handleTestConnection() {\r\n  vscode.postMessage({ command: 'testConnection', data: { ...form } });\r\n}\r\n\r\nfunction handleTestResult(data: any) {\r\n  if (data.success) {\r\n    alert('连接测试成功');\r\n  } else {\r\n    alert('连接测试失败');\r\n  }\r\n}\r\n\r\nfunction handleCancel() {\r\n  // 在 WebView 中无法直接关闭，通知扩展关闭\r\n  vscode.postMessage({ command: 'close' });\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.connection-form {\r\n  padding: 20px;\r\n  max-width: 600px;\r\n  margin: 0 auto;\r\n}\r\n\r\n.panel-title {\r\n  font-size: 18px;\r\n  font-weight: 600;\r\n  margin-bottom: 24px;\r\n  color: var(--vscode-foreground);\r\n}\r\n\r\n.form-group {\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.form-label {\r\n  display: block;\r\n  margin-bottom: 8px;\r\n  font-weight: 500;\r\n  color: var(--vscode-foreground);\r\n}\r\n\r\n.form-control {\r\n  width: 100%;\r\n  padding: 8px 12px;\r\n  border: 1px solid var(--vscode-input-border);\r\n  background-color: var(--vscode-input-background);\r\n  color: var(--vscode-input-foreground);\r\n  border-radius: 4px;\r\n  font-size: 14px;\r\n}\r\n\r\n.form-control:focus {\r\n  outline: none;\r\n  border-color: var(--vscode-focusBorder);\r\n}\r\n\r\n.form-row {\r\n  display: flex;\r\n  gap: 12px;\r\n}\r\n\r\n.form-col {\r\n  flex: 1;\r\n}\r\n\r\n.form-actions {\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  gap: 12px;\r\n  margin-top: 24px;\r\n}\r\n\r\n.btn {\r\n  padding: 8px 16px;\r\n  border: none;\r\n  border-radius: 4px;\r\n  font-size: 14px;\r\n  cursor: pointer;\r\n  transition: background-color 0.2s;\r\n}\r\n\r\n.btn-primary {\r\n  background-color: var(--vscode-button-background);\r\n  color: var(--vscode-button-foreground);\r\n}\r\n\r\n.btn-primary:hover {\r\n  background-color: var(--vscode-button-hoverBackground);\r\n}\r\n\r\n.btn-secondary {\r\n  background-color: var(--vscode-button-secondaryBackground);\r\n  color: var(--vscode-button-secondaryForeground);\r\n}\r\n\r\n.btn-secondary:hover {\r\n  background-color: var(--vscode-button-secondaryHoverBackground);\r\n}\r\n</style>\r\n","/**\r\n * VSCode WebView - Connection Entry Point\r\n * 连接管理面板入口\r\n */\r\n\r\nimport { createApp } from 'vue';\r\nimport ConnectionPanel from '../components/ConnectionPanel.vue';\r\n\r\n// 创建 Vue 应用\r\nconst app = createApp(ConnectionPanel);\r\n\r\n// 挂载\r\napp.mount('#app');\r\n"],"names":["_openBlock","_createElementBlock","_createElementVNode","_toDisplayString","_vModelText","_Fragment","_renderList","_vModelSelect"],"mappings":"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"}

package/packages/vscode/resources/webview/database.css

@@ -0,0 +1,259 @@
+
+.database-panel[data-v-974a0a17] {
+  padding: 16px;
+  height: 100vh;
+  overflow: auto;
+}
+.panel-header[data-v-974a0a17] {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 20px;
+  padding-bottom: 16px;
+  border-bottom: 1px solid var(--vscode-panel-border);
+}
+.panel-title[data-v-974a0a17] {
+  font-size: 18px;
+  font-weight: 600;
+  margin: 0;
+  color: var(--vscode-foreground);
+}
+.panel-actions[data-v-974a0a17] {
+  display: flex;
+  gap: 8px;
+}
+.connection-selector[data-v-974a0a17] {
+  width: 300px;
+  padding: 6px 10px;
+  border: 1px solid var(--vscode-input-border);
+  background-color: var(--vscode-input-background);
+  color: var(--vscode-input-foreground);
+  border-radius: 4px;
+  font-size: 13px;
+}
+.btn[data-v-974a0a17] {
+  padding: 6px 14px;
+  border: none;
+  border-radius: 4px;
+  font-size: 13px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+.btn-primary[data-v-974a0a17] {
+  background-color: var(--vscode-button-background);
+  color: var(--vscode-button-foreground);
+}
+.btn-primary[data-v-974a0a17]:hover {
+  background-color: var(--vscode-button-hoverBackground);
+}
+.btn-secondary[data-v-974a0a17] {
+  background-color: var(--vscode-button-secondaryBackground);
+  color: var(--vscode-button-secondaryForeground);
+}
+.btn-secondary[data-v-974a0a17]:hover {
+  background-color: var(--vscode-button-secondaryHoverBackground);
+}
+.database-grid[data-v-974a0a17] {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+  gap: 16px;
+}
+.database-card[data-v-974a0a17] {
+  padding: 16px;
+  background-color: var(--vscode-editor-background);
+  border: 1px solid var(--vscode-panel-border);
+  border-radius: 8px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+.database-card[data-v-974a0a17]:hover {
+  border-color: var(--vscode-focusBorder);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  transform: translateY(-2px);
+}
+.database-header[data-v-974a0a17] {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  margin-bottom: 12px;
+}
+.database-icon[data-v-974a0a17] {
+  font-size: 28px;
+  color: var(--vscode-textLink-foreground);
+}
+.database-name[data-v-974a0a17] {
+  flex: 1;
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--vscode-foreground);
+}
+.database-info[data-v-974a0a17] {
+  display: flex;
+  gap: 16px;
+  font-size: 12px;
+  color: var(--vscode-descriptionForeground);
+}
+.database-stat[data-v-974a0a17] {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+.section-title[data-v-974a0a17] {
+  font-size: 16px;
+  font-weight: 600;
+  margin: 24px 0 16px 0;
+  padding-bottom: 8px;
+  border-bottom: 1px solid var(--vscode-panel-border);
+  color: var(--vscode-foreground);
+}
+.tabs[data-v-974a0a17] {
+  display: flex;
+  gap: 4px;
+  margin-bottom: 16px;
+  border-bottom: 1px solid var(--vscode-panel-border);
+}
+.tab[data-v-974a0a17] {
+  padding: 8px 16px;
+  border: none;
+  background-color: transparent;
+  color: var(--vscode-foreground);
+  font-size: 13px;
+  cursor: pointer;
+  border-bottom: 2px solid transparent;
+  transition: all 0.2s;
+}
+.tab[data-v-974a0a17]:hover {
+  background-color: var(--vscode-list-hoverBackground);
+}
+.tab.active[data-v-974a0a17] {
+  border-bottom-color: var(--vscode-focusBorder);
+  color: var(--vscode-textLink-foreground);
+}
+.tab-content[data-v-974a0a17] {
+  display: none;
+}
+.tab-content.active[data-v-974a0a17] {
+  display: block;
+}
+.table-list[data-v-974a0a17] {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.table-item[data-v-974a0a17] {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px;
+  border-radius: 6px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+}
+.table-item[data-v-974a0a17]:hover {
+  background-color: var(--vscode-list-hoverBackground);
+}
+.table-icon[data-v-974a0a17] {
+  font-size: 20px;
+  color: var(--vscode-textLink-foreground);
+  width: 24px;
+  text-align: center;
+}
+.table-info[data-v-974a0a17] {
+  flex: 1;
+}
+.table-name[data-v-974a0a17] {
+  font-size: 14px;
+  font-weight: 500;
+  margin-bottom: 2px;
+  color: var(--vscode-foreground);
+}
+.table-comment[data-v-974a0a17] {
+  font-size: 12px;
+  color: var(--vscode-descriptionForeground);
+}
+.table-meta[data-v-974a0a17] {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  font-size: 12px;
+  color: var(--vscode-descriptionForeground);
+  margin-top: 4px;
+}
+.table-type[data-v-974a0a17] {
+  padding: 2px 8px;
+  border-radius: 12px;
+  background-color: var(--vscode-badge-background);
+  font-weight: 500;
+  font-size: 12px;
+}
+.table-type.table[data-v-974a0a17] {
+  background-color: var(--vscode-badge-background);
+}
+.table-type.view[data-v-974a0a17] {
+  background-color: var(--vscode-gitDecorationModifiedResourceForeground);
+  color: white;
+}
+.table-actions[data-v-974a0a17] {
+  display: flex;
+  gap: 8px;
+  opacity: 0;
+  transition: opacity 0.2s;
+}
+.table-item:hover .table-actions[data-v-974a0a17] {
+  opacity: 1;
+}
+.action-btn[data-v-974a0a17] {
+  padding: 4px 8px;
+  font-size: 12px;
+  background-color: var(--vscode-button-secondaryBackground);
+  color: var(--vscode-button-secondaryForeground);
+  border: none;
+  border-radius: 4px;
+  cursor: pointer;
+}
+.action-btn[data-v-974a0a17]:hover {
+  background-color: var(--vscode-button-secondaryHoverBackground);
+}
+.empty-state[data-v-974a0a17] {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 80px 20px;
+  text-align: center;
+}
+.empty-icon[data-v-974a0a17] {
+  font-size: 64px;
+  margin-bottom: 16px;
+  opacity: 0.3;
+}
+.empty-title[data-v-974a0a17] {
+  font-size: 16px;
+  font-weight: 600;
+  margin-bottom: 8px;
+  color: var(--vscode-foreground);
+}
+.empty-text[data-v-974a0a17] {
+  font-size: 14px;
+  color: var(--vscode-descriptionForeground);
+}
+.loading[data-v-974a0a17] {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 40px;
+}
+.spinner[data-v-974a0a17] {
+  width: 32px;
+  height: 32px;
+  border: 3px solid var(--vscode-progressBar-background);
+  border-top-color: var(--vscode-progressBar-foreground);
+  border-radius: 50%;
+  animation: spin-974a0a17 0.6s linear infinite;
+}
+@keyframes spin-974a0a17 {
+to {
+    transform: rotate(360deg);
+}
+}