@trilogy-data/trilogy-studio-components 0.1.10 → 0.1.12

package/dist/{Sidebar-dZtwrs0v.js → Sidebar-esb9EqnY.js}

@@ -1,7 +1,7 @@
-import { inject as A, ref as g, onMounted as x, computed as G, resolveComponent as D, createBlock as L, openBlock as r, withCtx as k, createElementBlock as y, Fragment as V, renderList as J, createElementVNode as o, createCommentVNode as S, createVNode as N, normalizeClass as U, toDisplayString as K, createTextVNode as H, defineComponent as X, withDirectives as T, vModelText as P, unref as ie, vModelSelect as te, withModifiers as B, watch as le, normalizeStyle as de, vShow as W } from "vue";
-import { S as Y, e as Z, g as q, K as E, a as F, T as Q, L as oe, f as re, u as ne, t as ce, D as ue, h as se, i as ae, j as me, d as ve, k as pe } from "./main-YvioU1lW.js";
-import { d as ee, a as be, L as ye, C as he } from "./LLMConnectionList-CwfSkiq_.js";
-import { D as fe } from "./DashboardCreatorInline-Cp8fI1iG.js";
+import { inject as A, ref as S, onMounted as x, computed as G, resolveComponent as D, createBlock as L, openBlock as r, withCtx as k, createElementBlock as h, Fragment as V, renderList as J, createElementVNode as o, createCommentVNode as g, createVNode as N, normalizeClass as U, toDisplayString as K, createTextVNode as H, defineComponent as X, withDirectives as T, vModelText as P, unref as ie, vModelSelect as te, withModifiers as _, watch as le, normalizeStyle as de, vShow as W } from "vue";
+import { S as Y, e as Z, g as B, K as E, a as F, T as Q, L as oe, f as re, u as ne, t as ce, D as ue, h as se, i as ae, j as me, d as ve, k as pe } from "./main-Bjg9NFbT.js";
+import { d as ee, a as be, L as he, C as ye } from "./LLMConnectionList-DZbu1kGq.js";
+import { D as fe } from "./DashboardCreatorInline-C6fr4jNo.js";
 const ge = {
   name: "DocumentationSidebar",
   props: {
@@ -14,7 +14,7 @@ const ge = {
   setup(e) {
     if (!A("editorStore"))
       throw new Error("Editor store is not provided!");
-    const s = q("documentationKey") || "", n = g({});
+    const s = B("documentationKey") || "", n = S({});
     return x(() => {
       const c = s.split(E)[1];
       let u = `documentation${E}${c}`;
@@ -66,7 +66,7 @@ function Se(e, t, s, n, v, b) {
   return r(), L(p, { title: "Documentation" }, {
     actions: k(() => [...t[0] || (t[0] = [])]),
     default: k(() => [
-      (r(!0), y(V, null, J(n.documentationNodes, (c) => (r(), L(d, {
+      (r(!0), h(V, null, J(n.documentationNodes, (c) => (r(), L(d, {
         key: c.id,
         "item-id": c.id,
         name: c.name,
@@ -94,69 +94,69 @@ const ke = /* @__PURE__ */ F(ge, [["render", Se], ["__scopeId", "data-v-7d844a72
     }
   },
   setup() {
-    const e = A("modelStore"), t = A("saveModels"), s = A("editorStore"), n = A("trilogyResolver"), v = ne(), b = g(!1), d = v.activeModelKey.value || q("model") || "", p = d.split(E)[0];
+    const e = A("modelStore"), t = A("saveModels"), s = A("editorStore"), n = A("trilogyResolver"), v = ne(), b = S(!1), d = v.activeModelKey.value || B("model") || "", p = d.split(E)[0];
     let c = "", u = "", a = d.split(E);
     if (p === "model" ? c = a[1] : (p === "source" || p === "datasource" || p === "concept") && (c = a[1], u = a[2]), !e || !t || !s || !n)
       throw new Error("Model store is not provided!");
     let m = {};
-    Object.values(e.models).forEach((l) => {
-      let $ = ["model", l.name].join(E);
-      l.name !== c && (m[$] = !0), l.sources.forEach((w) => {
-        let _ = ["source", l.name, w.alias].join(E);
-        (l.name !== c || w.alias !== u) && (m[_] = !0), w.datasources.forEach((R) => {
-          let I = ["datasource", l.name, w.alias, R.name].join(E);
+    Object.values(e.models).forEach((i) => {
+      let $ = ["model", i.name].join(E);
+      i.name !== c && (m[$] = !0), i.sources.forEach((w) => {
+        let q = ["source", i.name, w.alias].join(E);
+        (i.name !== c || w.alias !== u) && (m[q] = !0), w.datasources.forEach((R) => {
+          let I = ["datasource", i.name, w.alias, R.name].join(E);
           m[I] = !0;
         });
       });
     });
-    const f = g(m), j = G(() => {
-      const l = [];
-      return Object.values(e.models).sort((w, _) => w.name.localeCompare(_.name)).forEach((w) => {
+    const f = S(m), j = G(() => {
+      const i = [];
+      return Object.values(e.models).sort((w, q) => w.name.localeCompare(q.name)).forEach((w) => {
         if (w.deleted) return;
-        let _ = ["model", w.name].join(E);
-        l.push({
-          id: _,
+        let q = ["model", w.name].join(E);
+        i.push({
+          id: q,
           name: w.name,
           indent: 0,
           count: w.sources.length,
           type: "model",
           concept: null
-        }), f.value[_] || w.sources.forEach((R) => {
+        }), f.value[q] || w.sources.forEach((R) => {
           let I = ["source", w.name, R.alias].join(E);
-          l.push({
+          i.push({
             id: I,
             name: R.alias,
             indent: 1,
             count: R.concepts.length,
             type: "source",
             concept: null
-          }), f.value[I] || (R.concepts.forEach((i) => {
-            l.push({
-              id: ["concept", w.name, R.alias, i.namespace, i.name].join(
+          }), f.value[I] || (R.concepts.forEach((l) => {
+            i.push({
+              id: ["concept", w.name, R.alias, l.namespace, l.name].join(
                 E
               ),
-              name: i.namespace === "local" ? i.name : i.namespace + "." + i.name,
+              name: l.namespace === "local" ? l.name : l.namespace + "." + l.name,
               indent: 2,
               count: 0,
               type: "concept",
-              concept: i
+              concept: l
             });
-          }), R.datasources.forEach((i) => {
-            let C = ["datasource", w.name, R.alias, i.name].join(E);
-            l.push({
+          }), R.datasources.forEach((l) => {
+            let C = ["datasource", w.name, R.alias, l.name].join(E);
+            i.push({
               id: C,
-              name: i.name,
+              name: l.name,
               indent: 2,
-              count: i.concepts.length,
+              count: l.concepts.length,
               type: "datasource",
               concept: null
-            }), f.value[C] || i.concepts.forEach((z) => {
-              l.push({
+            }), f.value[C] || l.concepts.forEach((z) => {
+              i.push({
                 id: [
                   "concept",
                   w.name,
                   R.alias,
-                  i.name,
+                  l.name,
                   z.namespace,
                   z.name
                 ].join(E),
@@ -169,32 +169,32 @@ const ke = /* @__PURE__ */ F(ge, [["render", Se], ["__scopeId", "data-v-7d844a72
             });
           }));
         });
-      }), l;
+      }), i;
     });
     return {
       creatorVisible: b,
       flatList: j,
       collapsed: f,
       saveModels: t,
-      fetchParseResults: (l) => n.resolveModel(
-        l,
-        e.models[l].sources.map(($) => ({
+      fetchParseResults: (i) => n.resolveModel(
+        i,
+        e.models[i].sources.map(($) => ({
           alias: $.alias,
           contents: (s.editors[$.editor] || { contents: "" }).contents
         }))
       ).then(($) => {
-        e.setModelConfigParseResults(l, $);
+        e.setModelConfigParseResults(i, $);
       }).catch(($) => {
-        e.setModelParseError(l, $.message), console.error("Failed to fetch parse results:", $);
+        e.setModelParseError(i, $.message), console.error("Failed to fetch parse results:", $);
       }),
       trilogyIcon: ce,
       navigationStore: v,
-      handleClick: (l) => {
-        const $ = l.lastIndexOf(E), w = $ !== -1 ? l.substring($ + 1) : l;
-        v.openTab("models", w, l);
+      handleClick: (i) => {
+        const $ = i.lastIndexOf(E), w = $ !== -1 ? i.substring($ + 1) : i;
+        v.openTab("models", w, i);
       },
-      handleToggle: (l) => {
-        f.value[l] = !f.value[l];
+      handleToggle: (i) => {
+        f.value[i] = !f.value[i];
       },
       modelStore: e
     };
@@ -235,7 +235,7 @@ function Ke(e, t, s, n, v, b) {
       }, null, 8, ["visible"])
     ]),
     default: k(() => [
-      (r(!0), y(V, null, J(n.flatList, (m) => (r(), L(u, {
+      (r(!0), h(V, null, J(n.flatList, (m) => (r(), L(u, {
         key: m.id,
         "item-id": m.id,
         name: m.name,
@@ -247,14 +247,14 @@ function Ke(e, t, s, n, v, b) {
         onToggle: n.handleToggle
       }, {
         icon: k(() => [
-          m.type === "source" ? (r(), y("img", {
+          m.type === "source" ? (r(), h("img", {
             key: 0,
             src: n.trilogyIcon,
             class: "trilogy-icon"
-          }, null, 8, Me)) : m.type === "concept" ? (r(), y("span", {
+          }, null, 8, Me)) : m.type === "concept" ? (r(), h("span", {
             key: 1,
             class: U(`purpose-${m.concept.purpose.toLowerCase()}`)
-          }, K(m.concept.purpose.charAt(0).toUpperCase()), 3)) : m.type === "datasource" ? (r(), y("i", $e)) : S("", !0)
+          }, K(m.concept.purpose.charAt(0).toUpperCase()), 3)) : m.type === "datasource" ? (r(), h("i", $e)) : g("", !0)
         ]),
         "extra-content": k(() => [
           o("span", Ie, [
@@ -274,7 +274,7 @@ function Ke(e, t, s, n, v, b) {
                 }, 8, ["action"])
               ]),
               _: 2
-            }, 1024)) : S("", !0),
+            }, 1024)) : g("", !0),
             m.type === "model" ? (r(), L(c, {
               key: 1,
               content: "Delete Model",
@@ -287,7 +287,7 @@ function Ke(e, t, s, n, v, b) {
                 }, null, 8, Te)
               ]),
               _: 2
-            }, 1024)) : S("", !0)
+            }, 1024)) : g("", !0)
           ])
         ]),
         _: 2
@@ -308,10 +308,10 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
 }, Pe = { class: "url-input-container" }, Oe = ["disabled"], Re = {
   key: 0,
   class: "error-message"
-}, _e = {
+}, qe = {
   key: 1,
   class: "preview-container"
-}, qe = { class: "json-preview" }, Be = { class: "connection-selector" }, Fe = { class: "form-row" }, He = ["value"], Je = {
+}, Be = { class: "json-preview" }, _e = { class: "connection-selector" }, Fe = { class: "form-row" }, He = ["value"], Je = {
   key: 0,
   class: "form-row"
 }, ze = {
@@ -327,34 +327,34 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
     const s = t, n = A("dashboardStore"), v = A("connectionStore"), b = A("saveDashboards"), d = A("saveAll");
     if (!n || !v || !b || !d)
       throw new Error("Required stores not provided");
-    const p = g(""), c = g(""), u = g(null), a = g(!1), m = g(""), f = g("paste"), j = g(null), h = g({
+    const p = S(""), c = S(""), u = S(null), a = S(!1), m = S(""), f = S("paste"), j = S(null), y = S({
       mdToken: "",
       projectId: "",
       username: "",
       password: "",
       account: "",
       sshPrivateKey: ""
-    }), O = g(!0);
+    }), O = S(!0);
     function M() {
       if (!c.value) {
         O.value = !1;
         return;
       }
-      if (c.value === "new-motherduck" && !h.value.mdToken) {
+      if (c.value === "new-motherduck" && !y.value.mdToken) {
         O.value = !1;
         return;
       }
-      if (c.value === "new-bigquery-oauth" && !h.value.projectId) {
+      if (c.value === "new-bigquery-oauth" && !y.value.projectId) {
         O.value = !1;
         return;
       }
-      if (c.value === "new-snowflake" && (!h.value.username || !h.value.account || !h.value.sshPrivateKey)) {
+      if (c.value === "new-snowflake" && (!y.value.username || !y.value.account || !y.value.sshPrivateKey)) {
         O.value = !1;
         return;
       }
       O.value = !0;
     }
-    const l = async () => {
+    const i = async () => {
       if (!m.value) {
         j.value = "Please enter a URL", setTimeout(() => {
           j.value = null;
@@ -366,8 +366,8 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
         const I = await fetch(m.value);
         if (!I.ok)
           throw new Error(`HTTP error! Status: ${I.status}`);
-        const i = await I.text();
-        p.value = i, a.value = !1;
+        const l = await I.text();
+        p.value = l, a.value = !1;
       } catch (I) {
         console.error("Error fetching dashboard:", I), j.value = `Failed to fetch from URL: ${I instanceof Error ? I.message : "Unknown error"}`, a.value = !1, setTimeout(() => {
           j.value = null;
@@ -377,19 +377,19 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
       try {
         const I = ue.fromSerialized(JSON.parse(p.value));
         I.storage = "local";
-        let i = c.value;
-        if (i.startsWith("new-")) {
-          let C = i.replace("new-", "");
-          i = `dashboard-${I.name || "imported"}-connection`, v.connections[i] || v.newConnection(i, C, {
-            mdToken: h.value.mdToken,
-            projectId: h.value.projectId,
-            username: h.value.username,
-            password: h.value.password,
-            account: h.value.account,
-            privateKey: h.value.sshPrivateKey
+        let l = c.value;
+        if (l.startsWith("new-")) {
+          let C = l.replace("new-", "");
+          l = `dashboard-${I.name || "imported"}-connection`, v.connections[l] || v.newConnection(l, C, {
+            mdToken: y.value.mdToken,
+            projectId: y.value.projectId,
+            username: y.value.username,
+            password: y.value.password,
+            account: y.value.account,
+            privateKey: y.value.sshPrivateKey
           });
         }
-        I.connection = i, I.id = Math.random().toString(36).substring(2, 15), n.addDashboard(I), w.value = !0, p.value = "", m.value = "", h.value = {
+        I.connection = l, I.id = Math.random().toString(36).substring(2, 15), n.addDashboard(I), w.value = !0, p.value = "", m.value = "", y.value = {
           mdToken: "",
           projectId: "",
           username: "",
@@ -404,10 +404,10 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
           u.value = null;
         }, 3e3);
       }
-    }, w = g(!1), _ = g(null), R = (I) => {
-      _.value && !_.value.contains(I.target) && s("close");
+    }, w = S(!1), q = S(null), R = (I) => {
+      q.value && !q.value.contains(I.target) && s("close");
     };
-    return M(), (I, i) => e.isOpen ? (r(), y("div", {
+    return M(), (I, l) => e.isOpen ? (r(), h("div", {
       key: 0,
       class: "popup-overlay",
       onClick: R
@@ -415,13 +415,13 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
       o("div", {
         class: "popup-content",
         ref_key: "popupContent",
-        ref: _,
+        ref: q,
         "data-testid": "dashboard-import-popup"
       }, [
         o("div", Ee, [
-          i[11] || (i[11] = o("h3", null, "Import Dashboard", -1)),
+          l[11] || (l[11] = o("h3", null, "Import Dashboard", -1)),
           o("button", {
-            onClick: i[0] || (i[0] = (C) => s("close")),
+            onClick: l[0] || (l[0] = (C) => s("close")),
             class: "close-button",
             "data-testid": "close-popup-button"
           }, " ✕ ")
@@ -430,20 +430,20 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
           o("div", Ae, [
             o("button", {
               class: U(["mode-button", { active: f.value === "paste" }]),
-              onClick: i[1] || (i[1] = (C) => f.value = "paste"),
+              onClick: l[1] || (l[1] = (C) => f.value = "paste"),
               "data-testid": "paste-mode-button"
             }, " Paste JSON ", 2),
             o("button", {
               class: U(["mode-button", { active: f.value === "url" }]),
-              onClick: i[2] || (i[2] = (C) => f.value = "url"),
+              onClick: l[2] || (l[2] = (C) => f.value = "url"),
               "data-testid": "url-mode-button"
             }, " From URL ", 2)
           ]),
-          f.value === "paste" ? (r(), y("div", Ve, [
-            i[12] || (i[12] = o("label", { for: "dashboard-json" }, "Paste Dashboard JSON", -1)),
+          f.value === "paste" ? (r(), h("div", Ve, [
+            l[12] || (l[12] = o("label", { for: "dashboard-json" }, "Paste Dashboard JSON", -1)),
             T(o("textarea", {
               id: "dashboard-json",
-              "onUpdate:modelValue": i[3] || (i[3] = (C) => p.value = C),
+              "onUpdate:modelValue": l[3] || (l[3] = (C) => p.value = C),
               placeholder: "Paste your dashboard JSON here",
               rows: "16",
               class: "dashboard-textarea",
@@ -451,15 +451,15 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
             }, null, 512), [
               [P, p.value]
             ]),
-            u.value ? (r(), y("div", je, K(u.value), 1)) : S("", !0)
-          ])) : S("", !0),
-          f.value === "url" ? (r(), y("div", Ue, [
-            i[14] || (i[14] = o("label", { for: "dashboard-url" }, "Dashboard URL", -1)),
+            u.value ? (r(), h("div", je, K(u.value), 1)) : g("", !0)
+          ])) : g("", !0),
+          f.value === "url" ? (r(), h("div", Ue, [
+            l[14] || (l[14] = o("label", { for: "dashboard-url" }, "Dashboard URL", -1)),
             o("div", Pe, [
               T(o("input", {
                 type: "text",
                 id: "dashboard-url",
-                "onUpdate:modelValue": i[4] || (i[4] = (C) => m.value = C),
+                "onUpdate:modelValue": l[4] || (l[4] = (C) => m.value = C),
                 placeholder: "https://example.com/dashboard.json",
                 class: "url-input",
                 "data-testid": "dashboard-url-input"
@@ -467,52 +467,52 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
                 [P, m.value]
               ]),
               o("button", {
-                onClick: l,
+                onClick: i,
                 class: "fetch-button",
                 disabled: a.value,
                 "data-testid": "fetch-url-button"
               }, K(a.value ? "Loading..." : "Fetch"), 9, Oe)
             ]),
-            j.value ? (r(), y("div", Re, K(j.value), 1)) : S("", !0),
-            p.value && f.value === "url" ? (r(), y("div", _e, [
-              i[13] || (i[13] = o("label", null, "Dashboard JSON Preview", -1)),
-              o("div", qe, [
+            j.value ? (r(), h("div", Re, K(j.value), 1)) : g("", !0),
+            p.value && f.value === "url" ? (r(), h("div", qe, [
+              l[13] || (l[13] = o("label", null, "Dashboard JSON Preview", -1)),
+              o("div", Be, [
                 o("pre", null, K(p.value.length > 500 ? p.value.substring(0, 500) + "..." : p.value), 1)
               ])
-            ])) : S("", !0)
-          ])) : S("", !0)
+            ])) : g("", !0)
+          ])) : g("", !0)
         ]),
-        o("div", Be, [
+        o("div", _e, [
           o("div", Fe, [
-            i[20] || (i[20] = o("label", { for: "connection-select" }, "Assign To Connection", -1)),
+            l[20] || (l[20] = o("label", { for: "connection-select" }, "Assign To Connection", -1)),
             T(o("select", {
               id: "connection-select",
-              "onUpdate:modelValue": i[5] || (i[5] = (C) => c.value = C),
+              "onUpdate:modelValue": l[5] || (l[5] = (C) => c.value = C),
               class: "connection-dropdown",
               "data-testid": "connection-select",
               onChange: M
             }, [
-              i[15] || (i[15] = o("option", {
+              l[15] || (l[15] = o("option", {
                 value: "",
                 disabled: ""
               }, "-- Select Connection --", -1)),
-              (r(!0), y(V, null, J(ie(v).connections, (C) => (r(), y("option", {
+              (r(!0), h(V, null, J(ie(v).connections, (C) => (r(), h("option", {
                 key: C.name,
                 value: C.name
               }, K(C.name), 9, He))), 128)),
-              i[16] || (i[16] = o("option", { value: "new-duckdb" }, "New DuckDB", -1)),
-              i[17] || (i[17] = o("option", { value: "new-motherduck" }, "New MotherDuck", -1)),
-              i[18] || (i[18] = o("option", { value: "new-bigquery-oauth" }, "New Bigquery Oauth", -1)),
-              i[19] || (i[19] = o("option", { value: "new-snowflake" }, "New Snowflake", -1))
+              l[16] || (l[16] = o("option", { value: "new-duckdb" }, "New DuckDB", -1)),
+              l[17] || (l[17] = o("option", { value: "new-motherduck" }, "New MotherDuck", -1)),
+              l[18] || (l[18] = o("option", { value: "new-bigquery-oauth" }, "New Bigquery Oauth", -1)),
+              l[19] || (l[19] = o("option", { value: "new-snowflake" }, "New Snowflake", -1))
             ], 544), [
               [te, c.value]
             ])
           ]),
-          c.value === "new-motherduck" ? (r(), y("div", Je, [
-            i[21] || (i[21] = o("label", { for: "md-token" }, "MotherDuck Token", -1)),
+          c.value === "new-motherduck" ? (r(), h("div", Je, [
+            l[21] || (l[21] = o("label", { for: "md-token" }, "MotherDuck Token", -1)),
             T(o("input", {
               type: "text",
-              "onUpdate:modelValue": i[6] || (i[6] = (C) => h.value.mdToken = C),
+              "onUpdate:modelValue": l[6] || (l[6] = (C) => y.value.mdToken = C),
               id: "md-token",
               placeholder: "MotherDuck Token",
               class: "connection-input",
@@ -520,17 +520,17 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
             }, null, 544), [
               [
                 P,
-                h.value.mdToken,
+                y.value.mdToken,
                 void 0,
                 { trim: !0 }
               ]
             ])
-          ])) : S("", !0),
-          c.value === "new-bigquery-oauth" ? (r(), y("div", ze, [
-            i[22] || (i[22] = o("label", { for: "project-id" }, "BigQuery Project ID", -1)),
+          ])) : g("", !0),
+          c.value === "new-bigquery-oauth" ? (r(), h("div", ze, [
+            l[22] || (l[22] = o("label", { for: "project-id" }, "BigQuery Project ID", -1)),
             T(o("input", {
               type: "text",
-              "onUpdate:modelValue": i[7] || (i[7] = (C) => h.value.projectId = C),
+              "onUpdate:modelValue": l[7] || (l[7] = (C) => y.value.projectId = C),
               id: "project-id",
               placeholder: "Billing Project ID",
               class: "connection-input",
@@ -538,18 +538,18 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
             }, null, 544), [
               [
                 P,
-                h.value.projectId,
+                y.value.projectId,
                 void 0,
                 { trim: !0 }
               ]
             ])
-          ])) : S("", !0),
-          c.value === "new-snowflake" ? (r(), y(V, { key: 2 }, [
+          ])) : g("", !0),
+          c.value === "new-snowflake" ? (r(), h(V, { key: 2 }, [
             o("div", We, [
-              i[23] || (i[23] = o("label", { for: "snowflake-username" }, "Username", -1)),
+              l[23] || (l[23] = o("label", { for: "snowflake-username" }, "Username", -1)),
               T(o("input", {
                 type: "text",
-                "onUpdate:modelValue": i[8] || (i[8] = (C) => h.value.username = C),
+                "onUpdate:modelValue": l[8] || (l[8] = (C) => y.value.username = C),
                 id: "snowflake-username",
                 placeholder: "Snowflake Username",
                 class: "connection-input",
@@ -557,17 +557,17 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
               }, null, 544), [
                 [
                   P,
-                  h.value.username,
+                  y.value.username,
                   void 0,
                   { trim: !0 }
                 ]
               ])
             ]),
             o("div", Ge, [
-              i[24] || (i[24] = o("label", { for: "snowflake-account" }, "Account", -1)),
+              l[24] || (l[24] = o("label", { for: "snowflake-account" }, "Account", -1)),
               T(o("input", {
                 type: "text",
-                "onUpdate:modelValue": i[9] || (i[9] = (C) => h.value.account = C),
+                "onUpdate:modelValue": l[9] || (l[9] = (C) => y.value.account = C),
                 id: "snowflake-account",
                 placeholder: "Snowflake Account",
                 class: "connection-input",
@@ -575,17 +575,17 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
               }, null, 544), [
                 [
                   P,
-                  h.value.account,
+                  y.value.account,
                   void 0,
                   { trim: !0 }
                 ]
               ])
             ]),
             o("div", Qe, [
-              i[25] || (i[25] = o("label", { for: "snowflake-ssh-private-key" }, "Private Key", -1)),
+              l[25] || (l[25] = o("label", { for: "snowflake-ssh-private-key" }, "Private Key", -1)),
               T(o("input", {
                 type: "text",
-                "onUpdate:modelValue": i[10] || (i[10] = (C) => h.value.sshPrivateKey = C),
+                "onUpdate:modelValue": l[10] || (l[10] = (C) => y.value.sshPrivateKey = C),
                 id: "snowflake-ssh-private-key",
                 placeholder: "Private Key",
                 class: "connection-input",
@@ -593,13 +593,13 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
               }, null, 544), [
                 [
                   P,
-                  h.value.sshPrivateKey,
+                  y.value.sshPrivateKey,
                   void 0,
                   { trim: !0 }
                 ]
               ])
             ])
-          ], 64)) : S("", !0)
+          ], 64)) : g("", !0)
         ]),
         o("div", Xe, [
           o("button", {
@@ -610,7 +610,7 @@ const Le = /* @__PURE__ */ F(Ce, [["render", Ke], ["__scopeId", "data-v-a71c2207
           }, K(w.value ? "Imported!" : "Import"), 9, Ye)
         ])
       ], 512)
-    ])) : S("", !0);
+    ])) : g("", !0);
   }
 }), xe = /* @__PURE__ */ F(Ze, [["__scopeId", "data-v-f89b7efa"]]), et = {
   name: "DashboardCreatorIcon",
@@ -652,7 +652,7 @@ function tt(e, t, s, n, v, b) {
   }, {
     default: k(() => [
       o("span", {
-        onClick: t[0] || (t[0] = B((...p) => n.createDashboard && n.createDashboard(...p), ["stop"])),
+        onClick: t[0] || (t[0] = _((...p) => n.createDashboard && n.createDashboard(...p), ["stop"])),
         class: "dashboard-creator-icon"
       }, [...t[1] || (t[1] = [
         o("i", { class: "mdi mdi-table-plus" }, null, -1)
@@ -741,18 +741,18 @@ function ct(e, t, s, n, v, b) {
           o("i", { class: "mdi mdi-view-dashboard node-icon" }, null, -1)
         ])]),
         _: 1
-      })) : S("", !0)
+      })) : g("", !0)
     ]),
     name: k(() => {
       var a, m;
       return [
         H(K(s.item.label) + " ", 1),
-        s.item.type === "connection" ? (r(), y("span", st, " (" + K((a = n.connectionInfo) != null && a.model ? (m = n.connectionInfo) == null ? void 0 : m.model : "No Model Set") + ") ", 1)) : S("", !0)
+        s.item.type === "connection" ? (r(), h("span", st, " (" + K((a = n.connectionInfo) != null && a.model ? (m = n.connectionInfo) == null ? void 0 : m.model : "No Model Set") + ") ", 1)) : g("", !0)
       ];
     }),
     "extra-content": k(() => [
       o("div", at, [
-        s.item.type === "connection" ? (r(), y(V, { key: 0 }, [
+        s.item.type === "connection" ? (r(), h(V, { key: 0 }, [
           o("span", it, [
             N(p, {
               connection: s.item.label,
@@ -760,8 +760,8 @@ function ct(e, t, s, n, v, b) {
             }, null, 8, ["connection"])
           ]),
           N(c, { status: n.connectionStatus }, null, 8, ["status"])
-        ], 64)) : S("", !0),
-        s.item.type === "dashboard" ? (r(), y(V, { key: 1 }, [
+        ], 64)) : g("", !0),
+        s.item.type === "dashboard" ? (r(), h(V, { key: 1 }, [
           N(d, {
             content: "Clone Dashboard",
             position: "left"
@@ -769,7 +769,7 @@ function ct(e, t, s, n, v, b) {
             default: k(() => [
               o("span", {
                 class: "clone-btn hover-icon",
-                onClick: t[0] || (t[0] = B((...a) => b.handleClone && b.handleClone(...a), ["stop"])),
+                onClick: t[0] || (t[0] = _((...a) => b.handleClone && b.handleClone(...a), ["stop"])),
                 "data-testid": `clone-dashboard-${s.item.label}`
               }, [...t[4] || (t[4] = [
                 o("i", { class: "mdi mdi-content-copy" }, null, -1)
@@ -784,7 +784,7 @@ function ct(e, t, s, n, v, b) {
             default: k(() => [
               o("span", {
                 class: "remove-btn hover-icon",
-                onClick: t[1] || (t[1] = B((...a) => b.handleDelete && b.handleDelete(...a), ["stop"])),
+                onClick: t[1] || (t[1] = _((...a) => b.handleDelete && b.handleDelete(...a), ["stop"])),
                 "data-testid": `delete-dashboard-${s.item.label}`
               }, [...t[5] || (t[5] = [
                 o("i", { class: "mdi mdi-trash-can-outline" }, null, -1)
@@ -792,11 +792,11 @@ function ct(e, t, s, n, v, b) {
             ]),
             _: 1
           })
-        ], 64)) : S("", !0)
+        ], 64)) : g("", !0)
       ])
     ]),
     _: 1
-  }, 8, ["item-id", "name", "indent", "is-selected", "is-collapsible", "is-collapsed", "onClick", "onToggle"])) : (r(), y("div", {
+  }, 8, ["item-id", "name", "indent", "is-selected", "is-collapsible", "is-collapsed", "onClick", "onToggle"])) : (r(), h("div", {
     key: 1,
     "data-testid": `dashboard-list-id-${s.item.key}`,
     class: "creator-item",
@@ -857,9 +857,9 @@ const vt = {
     const e = A("dashboardStore"), t = A("connectionStore"), s = A("saveDashboards");
     if (!e || !t || !s)
       throw new Error("Dashboard or connection store is not provided!");
-    const n = g({}), v = g(!1), b = g(!1), d = (u) => {
+    const n = S({}), v = S(!1), b = S(!1), d = (u) => {
       n.value[u] === void 0 && (n.value[u] = !1), n.value[u] = !n.value[u];
-    }, p = q("dashboard") || "";
+    }, p = B("dashboard") || "";
     x(() => {
       if (Object.values(e.dashboards).forEach((u) => {
         let a = `s-${u.storage}`, m = `c-${u.storage}-${u.connection}`;
@@ -911,7 +911,7 @@ const vt = {
     SidebarList: Z,
     LoadingButton: oe
   }
-}, pt = { class: "button-container" }, bt = ["data-testid"], yt = { class: "confirmation-dialog" }, ht = { class: "dialog-actions" };
+}, pt = { class: "button-container" }, bt = ["data-testid"], ht = { class: "confirmation-dialog" }, yt = { class: "dialog-actions" };
 function ft(e, t, s, n, v, b) {
   const d = D("dashboard-creator-inline"), p = D("dashboard-import-popup"), c = D("dashboard-list-item"), u = D("sidebar-list");
   return r(), L(u, { title: "Dashboards" }, {
@@ -938,7 +938,7 @@ function ft(e, t, s, n, v, b) {
       }, null, 8, ["isOpen"])
     ]),
     default: k(() => [
-      (r(!0), y(V, null, J(n.contentList, (a) => (r(), L(c, {
+      (r(!0), h(V, null, J(n.contentList, (a) => (r(), L(c, {
         key: a.key,
         item: a,
         "is-active": s.activeDashboardKey === a.id,
@@ -946,15 +946,15 @@ function ft(e, t, s, n, v, b) {
         onClick: (m) => b.clickAction(a),
         onDelete: b.showDeleteConfirmation
       }, null, 8, ["item", "is-active", "is-collapsed", "onClick", "onDelete"]))), 128)),
-      v.showDeleteConfirmationState ? (r(), y("div", {
+      v.showDeleteConfirmationState ? (r(), h("div", {
         key: 0,
         class: "confirmation-overlay",
-        onClick: t[6] || (t[6] = B((...a) => b.cancelDelete && b.cancelDelete(...a), ["self"]))
+        onClick: t[6] || (t[6] = _((...a) => b.cancelDelete && b.cancelDelete(...a), ["self"]))
       }, [
-        o("div", yt, [
+        o("div", ht, [
           t[7] || (t[7] = o("h3", null, "Confirm Deletion", -1)),
           t[8] || (t[8] = o("p", null, "Are you sure you want to delete this dashboard? Contents cannot be recovered.", -1)),
-          o("div", ht, [
+          o("div", yt, [
             o("button", {
               class: "cancel-btn",
               "data-testid": "cancel-dashboard-deletion",
@@ -967,7 +967,7 @@ function ft(e, t, s, n, v, b) {
             }, " Delete ")
           ])
         ])
-      ])) : S("", !0)
+      ])) : g("", !0)
     ]),
     _: 1
   });
@@ -1021,21 +1021,21 @@ const gt = /* @__PURE__ */ F(vt, [["render", ft], ["__scopeId", "data-v-311270bc
       onToggle: d
     }, {
       icon: k(() => [
-        e.item.type === "root" ? (r(), y("i", St)) : e.item.type === "engine" ? (r(), y("span", kt, [
+        e.item.type === "root" ? (r(), h("i", St)) : e.item.type === "engine" ? (r(), h("span", kt, [
           N(be, {
             "connection-type": e.item.label
           }, null, 8, ["connection-type"])
-        ])) : S("", !0)
+        ])) : g("", !0)
       ]),
       "extra-content": k(() => {
         var j;
         return [
-          e.item.type === "model" ? (r(), y("span", Ct, [
-            (r(!0), y(V, null, J(((j = e.item.model) == null ? void 0 : j.tags) || [], (h) => (r(), y("span", {
-              key: h,
+          e.item.type === "model" ? (r(), h("span", Ct, [
+            (r(!0), h(V, null, J(((j = e.item.model) == null ? void 0 : j.tags) || [], (y) => (r(), h("span", {
+              key: y,
               class: "tag"
-            }, K(h), 1))), 128))
-          ])) : e.item.type === "engine" ? (r(), y("span", Dt)) : e.item.type === "root" ? (r(), y("span", wt, [
+            }, K(y), 1))), 128))
+          ])) : e.item.type === "engine" ? (r(), h("span", Dt)) : e.item.type === "root" ? (r(), h("span", wt, [
             e.item.store && !c(e.item.store) ? (r(), L(Q, {
               key: 0,
               content: "Remove Store",
@@ -1044,21 +1044,21 @@ const gt = /* @__PURE__ */ F(vt, [["render", ft], ["__scopeId", "data-v-311270bc
               default: k(() => [
                 o("span", {
                   class: "remove-btn hover-icon",
-                  onClick: f[0] || (f[0] = B((h) => n("delete-store", e.item.store), ["stop"])),
+                  onClick: f[0] || (f[0] = _((y) => n("delete-store", e.item.store), ["stop"])),
                   "data-testid": `delete-store-${e.item.store.id}`
                 }, [...f[1] || (f[1] = [
                   o("i", { class: "mdi mdi-trash-can-outline" }, null, -1)
                 ])], 8, Mt)
               ]),
               _: 1
-            })) : S("", !0),
+            })) : g("", !0),
             e.item.store ? (r(), L(se, {
               key: 1,
               status: u(e.item.store),
               message: a(e.item.store),
               "test-name": e.item.store.id
-            }, null, 8, ["status", "message", "test-name"])) : S("", !0)
-          ])) : S("", !0)
+            }, null, 8, ["status", "message", "test-name"])) : g("", !0)
+          ])) : g("", !0)
         ];
       }),
       _: 1
@@ -1078,7 +1078,7 @@ const gt = /* @__PURE__ */ F(vt, [["render", ft], ["__scopeId", "data-v-311270bc
   },
   emits: ["close", "add"],
   setup(e, { emit: t }) {
-    const s = g("generic"), n = g(""), v = g(""), b = g(""), d = g(""), p = g("main"), c = g(null);
+    const s = S("generic"), n = S(""), v = S(""), b = S(""), d = S(""), p = S("main"), c = S(null);
     return le(
       () => e.show,
       (a) => {
@@ -1135,7 +1135,7 @@ const gt = /* @__PURE__ */ F(vt, [["render", ft], ["__scopeId", "data-v-311270bc
   "data-testid": "add-store-error"
 }, Pt = { class: "dialog-actions" }, Ot = ["disabled"];
 function Rt(e, t, s, n, v, b) {
-  return s.show ? (r(), y("div", {
+  return s.show ? (r(), h("div", {
     key: 0,
     class: "confirmation-overlay",
     onClick: t[10] || (t[10] = (d) => e.$emit("close"))
@@ -1143,12 +1143,12 @@ function Rt(e, t, s, n, v, b) {
     o("div", {
       class: "confirmation-dialog",
       "data-testid": "add-store-modal",
-      onClick: t[9] || (t[9] = B(() => {
+      onClick: t[9] || (t[9] = _(() => {
       }, ["stop"]))
     }, [
       t[20] || (t[20] = o("h3", null, "Add Model Store", -1)),
       o("form", {
-        onSubmit: t[8] || (t[8] = B((...d) => n.handleSubmit && n.handleSubmit(...d), ["prevent"]))
+        onSubmit: t[8] || (t[8] = _((...d) => n.handleSubmit && n.handleSubmit(...d), ["prevent"]))
       }, [
         o("div", Kt, [
           t[12] || (t[12] = o("label", null, [
@@ -1165,7 +1165,7 @@ function Rt(e, t, s, n, v, b) {
             [te, n.storeType]
           ])
         ]),
-        n.storeType === "generic" ? (r(), y(V, { key: 0 }, [
+        n.storeType === "generic" ? (r(), h(V, { key: 0 }, [
           o("div", Lt, [
             t[13] || (t[13] = o("label", null, [
               H("Store Name: "),
@@ -1197,8 +1197,8 @@ function Rt(e, t, s, n, v, b) {
             ]),
             t[15] || (t[15] = o("small", null, "URL should serve an index.json file at /index.json", -1))
           ])
-        ], 64)) : S("", !0),
-        n.storeType === "github" ? (r(), y(V, { key: 1 }, [
+        ], 64)) : g("", !0),
+        n.storeType === "github" ? (r(), h(V, { key: 1 }, [
           o("div", Nt, [
             t[16] || (t[16] = o("label", null, [
               H("Display Name: "),
@@ -1259,8 +1259,8 @@ function Rt(e, t, s, n, v, b) {
               [P, n.branch]
             ])
           ])
-        ], 64)) : S("", !0),
-        n.error ? (r(), y("div", Ut, K(n.error), 1)) : S("", !0),
+        ], 64)) : g("", !0),
+        n.error ? (r(), h("div", Ut, K(n.error), 1)) : g("", !0),
         o("div", Pt, [
           o("button", {
             type: "button",
@@ -1277,9 +1277,9 @@ function Rt(e, t, s, n, v, b) {
         ])
       ], 32)
     ])
-  ])) : S("", !0);
+  ])) : g("", !0);
 }
-const _t = /* @__PURE__ */ F(Tt, [["render", Rt], ["__scopeId", "data-v-9b0c5261"]]), qt = (e = {}, t = [], s = {}) => {
+const qt = /* @__PURE__ */ F(Tt, [["render", Rt], ["__scopeId", "data-v-9b0c5261"]]), Bt = (e = {}, t = [], s = {}) => {
   const n = [];
   return t.forEach((v) => {
     const b = v.id, d = v.name, p = {
@@ -1322,25 +1322,25 @@ const _t = /* @__PURE__ */ F(Tt, [["render", Rt], ["__scopeId", "data-v-9b0c5261
       });
     }
   }), n;
-}, Bt = X({
+}, _t = X({
   name: "CommunityModelList",
   setup() {
-    const e = ae(), t = ne(), s = g({}), n = t.activeCommunityModelKey.value || "", v = (M) => {
-      const l = M.split("+");
-      if (l.length > 0 && (s.value[l[0]] = !1, l.length > 1)) {
-        const $ = `${l[0]}+${l[1]}`;
+    const e = ae(), t = ne(), s = S({}), n = t.activeCommunityModelKey.value || "", v = (M) => {
+      const i = M.split("+");
+      if (i.length > 0 && (s.value[i[0]] = !1, i.length > 1)) {
+        const $ = `${i[0]}+${i[1]}`;
         s.value[$] = !1;
       }
     };
     for (const M of e.stores)
       s.value[M.id] = !0;
     n ? v(n) : e.stores.length > 0 && (s.value[e.stores[0].id] = !1);
-    const b = g(null), d = g(!1), p = g(null), c = async (M) => {
+    const b = S(null), d = S(!1), p = S(null), c = async (M) => {
       b.value = null;
       try {
         await e.addStore(M), e.closeAddStoreModal();
-      } catch (l) {
-        b.value = l instanceof Error ? l.message : "Failed to add store";
+      } catch (i) {
+        b.value = i instanceof Error ? i.message : "Failed to add store";
       }
     }, u = (M) => {
       p.value = M, d.value = !0;
@@ -1348,13 +1348,13 @@ const _t = /* @__PURE__ */ F(Tt, [["render", Rt], ["__scopeId", "data-v-9b0c5261
       d.value = !1, p.value = null;
     }, m = () => {
       p.value && e.removeStore(p.value.id), d.value = !1, p.value = null;
-    }, f = (M, l, $) => {
-      t.openTab("community-models", M.name, l), console.log("Selected model:", M.name, "from root:", $);
-    }, j = (M, l, $) => {
-      t.openTab("community-models", null, l);
-    }, h = (M, l, $) => {
-      s.value[l] = !s.value[l];
-    }, O = G(() => qt(
+    }, f = (M, i, $) => {
+      t.openTab("community-models", M.name, i), console.log("Selected model:", M.name, "from root:", $);
+    }, j = (M, i, $) => {
+      t.openTab("community-models", null, i);
+    }, y = (M, i, $) => {
+      s.value[i] = !s.value[i];
+    }, O = G(() => Bt(
       s.value,
       e.stores,
       e.filesByStore
@@ -1372,7 +1372,7 @@ const _t = /* @__PURE__ */ F(Tt, [["render", Rt], ["__scopeId", "data-v-9b0c5261
       showDeleteConfirmationState: d,
       handleModelSelected: f,
       handleItemClick: j,
-      handleItemToggle: h,
+      handleItemToggle: y,
       collapsed: s,
       displayTree: O
     };
@@ -1380,7 +1380,7 @@ const _t = /* @__PURE__ */ F(Tt, [["render", Rt], ["__scopeId", "data-v-9b0c5261
   components: {
     SidebarList: Z,
     CommunityModelListItem: It,
-    AddStoreModal: _t
+    AddStoreModal: qt
   }
 }), Ft = { class: "button-container" }, Ht = ["disabled"], Jt = ["disabled"], zt = {
   key: 0,
@@ -1402,8 +1402,8 @@ function Yt(e, t, s, n, v, b) {
       ])
     ]),
     default: k(() => [
-      e.communityStore.hasErrors ? (r(), y("div", zt, [
-        (r(!0), y(V, null, J(e.communityStore.errorList, (u) => (r(), y("div", {
+      e.communityStore.hasErrors ? (r(), h("div", zt, [
+        (r(!0), h(V, null, J(e.communityStore.errorList, (u) => (r(), h("div", {
           key: u.root,
           class: "error-item"
         }, [
@@ -1413,8 +1413,8 @@ function Yt(e, t, s, n, v, b) {
             class: "clear-error"
           }, "×", 8, Gt)
         ]))), 128))
-      ])) : S("", !0),
-      (r(!0), y(V, null, J(e.displayTree, (u) => (r(), L(d, {
+      ])) : g("", !0),
+      (r(!0), h(V, null, J(e.displayTree, (u) => (r(), L(d, {
         key: u.key,
         item: u,
         "is-collapsed": e.collapsed[u.key],
@@ -1430,10 +1430,10 @@ function Yt(e, t, s, n, v, b) {
         onClose: t[2] || (t[2] = (u) => e.communityStore.closeAddStoreModal()),
         onAdd: e.handleAddStoreSubmit
       }, null, 8, ["show", "loading", "onAdd"]),
-      e.showDeleteConfirmationState ? (r(), y("div", {
+      e.showDeleteConfirmationState ? (r(), h("div", {
         key: 1,
         class: "confirmation-overlay",
-        onClick: t[5] || (t[5] = B((...u) => e.cancelDeleteStore && e.cancelDeleteStore(...u), ["self"]))
+        onClick: t[5] || (t[5] = _((...u) => e.cancelDeleteStore && e.cancelDeleteStore(...u), ["self"]))
       }, [
         o("div", Qt, [
           t[6] || (t[6] = o("h3", null, "Confirm Store Removal", -1)),
@@ -1451,41 +1451,41 @@ function Yt(e, t, s, n, v, b) {
             }, " Remove ")
           ])
         ])
-      ])) : S("", !0)
+      ])) : g("", !0)
     ]),
     _: 1
   });
 }
-const Zt = /* @__PURE__ */ F(Bt, [["render", Yt], ["__scopeId", "data-v-abc5c56b"]]), xt = X({
+const Zt = /* @__PURE__ */ F(_t, [["render", Yt], ["__scopeId", "data-v-abc5c56b"]]), xt = X({
   name: "Sidebar",
   props: {
     active: {
       type: String,
-      default: q("screen")
+      default: B("screen")
     },
     activeEditor: {
       type: String,
-      default: q("editor")
+      default: B("editor")
     },
     activeModelKey: {
       type: String,
-      default: q("model")
+      default: B("model")
     },
     activeDocumentationKey: {
       type: String,
-      default: q("documentationKey")
+      default: B("documentationKey")
     },
     activeConnectionKey: {
       type: String,
-      default: q("connection")
+      default: B("connection")
     },
     activeLLMKey: {
       type: String,
-      default: q("llm")
+      default: B("llm")
     },
     activeDashboardKey: {
       type: String,
-      default: q("dashboard")
+      default: B("dashboard")
     },
     containerWidth: {
       type: Number,
@@ -1493,7 +1493,7 @@ const Zt = /* @__PURE__ */ F(Bt, [["render", Yt], ["__scopeId", "data-v-abc5c56b
     }
   },
   setup() {
-    const e = g(!1), t = g(null);
+    const e = S(!1), t = S(null);
     return {
       isSaving: e,
       previousUnSaved: t
@@ -1561,20 +1561,24 @@ const Zt = /* @__PURE__ */ F(Bt, [["render", Yt], ["__scopeId", "data-v-abc5c56b
       isMobile: s,
       unSaved: v,
       saveAll: n,
-      notMobile: !s
+      notMobile: !s,
+      contentCollapsed: !1
     };
   },
   components: {
     EditorList: ve,
-    ConnectionList: he,
+    ConnectionList: ye,
     Tooltip: Q,
     TutorialSidebar: ke,
     ModelSidebar: Le,
-    LLMConnectionList: ye,
+    LLMConnectionList: he,
     DashboardList: gt,
     CommunityModelList: Zt
   },
   watch: {
+    contentCollapsed(e) {
+      this.$emit("content-collapsed", e);
+    },
     unSaved: {
       handler(e, t) {
         t > 0 && e === 0 && !this.isSaving && this.triggerSaveAnimation(), this.previousUnSaved = e;
@@ -1594,7 +1598,14 @@ const Zt = /* @__PURE__ */ F(Bt, [["render", Yt], ["__scopeId", "data-v-abc5c56b
       }, 500);
     },
     selectItem(e) {
-      this.$emit("screen-selected", e);
+      if (this.isMobile) {
+        this.$emit("screen-selected", e);
+        return;
+      }
+      e === this.active ? this.contentCollapsed = !this.contentCollapsed : (this.contentCollapsed = !1, this.$emit("screen-selected", e));
+    },
+    toggleCollapse() {
+      this.contentCollapsed = !this.contentCollapsed;
     },
     editorSelected(e) {
       this.$emit("editor-selected", e);
@@ -1643,121 +1654,131 @@ const Zt = /* @__PURE__ */ F(Bt, [["render", Yt], ["__scopeId", "data-v-abc5c56b
 }), eo = { class: "sidebar-container" }, to = {
   class: "sidebar-icons",
   "data-testid": "sidebar-icons"
-}, oo = { class: "trilogy-icon" }, no = { class: "trilogy-icon-wrapper" }, so = ["src"], ao = ["title"], io = {
-  key: 0,
-  class: "sidebar-divider"
-}, lo = ["onClick", "data-testid"], ro = ["onClick", "href", "data-testid"], co = ["data-testid"], uo = {
+}, oo = { class: "trilogy-icon" }, no = { class: "trilogy-icon-wrapper" }, so = ["src"], ao = ["title"], io = ["title"], lo = {
   key: 1,
   class: "sidebar-divider"
-}, mo = ["onClick", "data-testid"], vo = ["onClick", "href", "data-testid"], po = ["data-testid"];
-function bo(e, t, s, n, v, b) {
-  var h, O, M;
+}, ro = ["onClick", "data-testid"], co = ["onClick", "href", "data-testid"], uo = ["data-testid"], mo = {
+  key: 2,
+  class: "sidebar-divider"
+}, vo = ["onClick", "data-testid"], po = ["onClick", "href", "data-testid"], bo = ["data-testid"];
+function ho(e, t, s, n, v, b) {
+  var y, O, M;
   const d = D("tooltip"), p = D("EditorList"), c = D("ConnectionList"), u = D("LLMConnectionList"), a = D("ModelSidebar"), m = D("TutorialSidebar"), f = D("DashboardList"), j = D("CommunityModelList");
-  return r(), y("div", eo, [
+  return r(), h("div", eo, [
     o("div", to, [
       o("div", oo, [
         o("div", no, [
           N(d, {
-            content: e.unSaved ? `Save ${e.unSaved} ${(((h = e.unSaved) == null ? void 0 : h.valueOf()) || 0) > 1 ? "changes" : "change"}` : "All changes saved!"
+            content: e.unSaved ? `Save ${e.unSaved} ${(((y = e.unSaved) == null ? void 0 : y.valueOf()) || 0) > 1 ? "changes" : "change"}` : "All changes saved!"
           }, {
             default: k(() => [
               o("img", {
                 class: U(["trilogy-icon", { spinning: e.isSaving }]),
-                onClick: t[0] || (t[0] = (...l) => e.handleSave && e.handleSave(...l)),
+                onClick: t[0] || (t[0] = (...i) => e.handleSave && e.handleSave(...i)),
                 src: e.trilogyIcon,
                 "data-testid": "trilogy-icon"
               }, null, 10, so)
             ]),
             _: 1
           }, 8, ["content"]),
-          (((O = e.unSaved) == null ? void 0 : O.valueOf()) || 0) > 0 ? (r(), y("div", {
+          (((O = e.unSaved) == null ? void 0 : O.valueOf()) || 0) > 0 ? (r(), h("div", {
             key: 0,
             class: "unsaved-badge",
             title: `${e.unSaved} unsaved ${(((M = e.unSaved) == null ? void 0 : M.valueOf()) || 0) > 1 ? "changes" : "change"}`
-          }, K(e.unSaved), 9, ao)) : S("", !0)
+          }, K(e.unSaved), 9, ao)) : g("", !0)
         ])
       ]),
-      t[9] || (t[9] = o("div", { class: "trilogy-icon-padding" }, null, -1)),
-      e.isMobile ? S("", !0) : (r(), y("div", io)),
-      (r(!0), y(V, null, J(e.sidebarItems, (l, $) => (r(), y("div", {
-        key: l.name,
-        class: U(["sidebar-icon", { selected: e.active == l.screen, "sidebar-icon-margin": !e.isMobile }]),
-        onClick: (w) => e.selectItem(l.screen),
-        "data-testid": `sidebar-icon-${l.screen}`
+      t[10] || (t[10] = o("div", { class: "trilogy-icon-padding" }, null, -1)),
+      e.isMobile ? g("", !0) : (r(), h("div", {
+        key: 0,
+        class: "sidebar-collapse-btn",
+        onClick: t[1] || (t[1] = (...i) => e.toggleCollapse && e.toggleCollapse(...i)),
+        title: e.contentCollapsed ? "Expand sidebar" : "Collapse sidebar"
+      }, [
+        o("i", {
+          class: U(e.contentCollapsed ? "mdi mdi-chevron-right" : "mdi mdi-chevron-left")
+        }, null, 2)
+      ], 8, io)),
+      e.isMobile ? g("", !0) : (r(), h("div", lo)),
+      (r(!0), h(V, null, J(e.sidebarItems, (i, $) => (r(), h("div", {
+        key: i.name,
+        class: U(["sidebar-icon", { selected: e.active == i.screen, "sidebar-icon-margin": !e.isMobile }]),
+        onClick: (w) => e.selectItem(i.screen),
+        "data-testid": `sidebar-icon-${i.screen}`
       }, [
-        e.isMobile ? (r(), y(V, { key: 1 }, [
+        e.isMobile ? (r(), h(V, { key: 1 }, [
           o("i", {
-            class: U(l.icon),
-            "data-testid": `sidebar-link-${l.screen}`
-          }, null, 10, co),
-          o("div", null, K(l.tooltip), 1)
+            class: U(i.icon),
+            "data-testid": `sidebar-link-${i.screen}`
+          }, null, 10, uo),
+          o("div", null, K(i.tooltip), 1)
         ], 64)) : (r(), L(d, {
           key: 0,
-          content: l.tooltip
+          content: i.tooltip
         }, {
           default: k(() => [
             o("a", {
-              onClick: B((w) => e.selectItem(l.screen), ["prevent"]),
-              href: e.getUrl(l.screen),
+              onClick: _((w) => e.selectItem(i.screen), ["prevent", "stop"]),
+              href: e.getUrl(i.screen),
               target: "_blank",
-              "data-testid": `sidebar-link-${l.screen}`
+              "data-testid": `sidebar-link-${i.screen}`
             }, [
               o("i", {
-                class: U(l.icon)
+                class: U(i.icon)
               }, null, 2)
-            ], 8, ro)
+            ], 8, co)
           ]),
           _: 2
         }, 1032, ["content"]))
-      ], 10, lo))), 128)),
-      e.isMobile ? S("", !0) : (r(), y("div", uo)),
-      (r(!0), y(V, null, J(e.sidebarFeatureItems, (l, $) => (r(), y("div", {
-        key: l.name,
-        class: U(["sidebar-icon", { selected: e.active == l.screen, "sidebar-icon-margin": !e.isMobile }]),
-        onClick: (w) => e.selectItem(l.screen),
-        "data-testid": `sidebar-icon-${l.screen}`
+      ], 10, ro))), 128)),
+      e.isMobile ? g("", !0) : (r(), h("div", mo)),
+      (r(!0), h(V, null, J(e.sidebarFeatureItems, (i, $) => (r(), h("div", {
+        key: i.name,
+        class: U(["sidebar-icon", { selected: e.active == i.screen, "sidebar-icon-margin": !e.isMobile }]),
+        onClick: (w) => e.selectItem(i.screen),
+        "data-testid": `sidebar-icon-${i.screen}`
       }, [
-        e.isMobile ? (r(), y(V, { key: 1 }, [
+        e.isMobile ? (r(), h(V, { key: 1 }, [
           o("i", {
-            class: U(l.icon),
-            "data-testid": `sidebar-link-${l.screen}`
-          }, null, 10, po),
-          o("div", null, K(l.tooltip), 1)
+            class: U(i.icon),
+            "data-testid": `sidebar-link-${i.screen}`
+          }, null, 10, bo),
+          o("div", null, K(i.tooltip), 1)
         ], 64)) : (r(), L(d, {
           key: 0,
-          content: l.tooltip
+          content: i.tooltip
         }, {
           default: k(() => [
             o("a", {
-              onClick: B((w) => e.selectItem(l.screen), ["prevent"]),
-              href: e.getUrl(l.screen),
+              onClick: _((w) => e.selectItem(i.screen), ["prevent", "stop"]),
+              href: e.getUrl(i.screen),
               target: "_blank",
-              "data-testid": `sidebar-link-${l.screen}`
+              "data-testid": `sidebar-link-${i.screen}`
             }, [
               o("i", {
-                class: U(l.icon)
+                class: U(i.icon)
               }, null, 2)
-            ], 8, vo)
+            ], 8, po)
           ]),
           _: 2
         }, 1032, ["content"]))
-      ], 10, mo))), 128)),
+      ], 10, vo))), 128)),
       o("div", {
         class: U(["sidebar-bottom-icons", { "sidebar-bottom-icons-mobile": e.isMobile }])
       }, [
         o("div", {
           class: U(["sidebar-icon", { selected: e.active == "settings", "sidebar-icon-margin": !e.isMobile }]),
-          onClick: t[1] || (t[1] = (l) => e.selectItem("settings")),
+          onClick: t[2] || (t[2] = (i) => e.selectItem("settings")),
           "data-testid": "sidebar-icon-settings"
         }, [
-          e.isMobile ? (r(), y(V, { key: 1 }, [
-            t[4] || (t[4] = o("i", { class: "mdi mdi-cog-outline" }, null, -1)),
-            t[5] || (t[5] = o("div", null, "Settings", -1))
+          e.isMobile ? (r(), h(V, { key: 1 }, [
+            t[5] || (t[5] = o("i", { class: "mdi mdi-cog-outline" }, null, -1)),
+            t[6] || (t[6] = o("div", null, "Settings", -1))
           ], 64)) : (r(), L(d, {
             key: 0,
             content: "Settings"
           }, {
-            default: k(() => [...t[3] || (t[3] = [
+            default: k(() => [...t[4] || (t[4] = [
               o("i", { class: "mdi mdi-cog-outline" }, null, -1)
             ])]),
             _: 1
@@ -1766,16 +1787,16 @@ function bo(e, t, s, n, v, b) {
         o("div", {
           class: U(["sidebar-icon", { selected: e.active == "profile", "sidebar-icon-margin": !e.isMobile }]),
           "data-testid": "sidebar-icon-profile",
-          onClick: t[2] || (t[2] = (l) => e.selectItem("profile"))
+          onClick: t[3] || (t[3] = (i) => e.selectItem("profile"))
         }, [
-          e.isMobile ? (r(), y(V, { key: 1 }, [
-            t[7] || (t[7] = o("i", { class: "mdi mdi-account-outline" }, null, -1)),
-            t[8] || (t[8] = o("div", null, "Profile", -1))
+          e.isMobile ? (r(), h(V, { key: 1 }, [
+            t[8] || (t[8] = o("i", { class: "mdi mdi-account-outline" }, null, -1)),
+            t[9] || (t[9] = o("div", null, "Profile", -1))
           ], 64)) : (r(), L(d, {
             key: 0,
             content: "Profile"
           }, {
-            default: k(() => [...t[6] || (t[6] = [
+            default: k(() => [...t[7] || (t[7] = [
               o("i", { class: "mdi mdi-account-outline" }, null, -1)
             ])]),
             _: 1
@@ -1784,8 +1805,8 @@ function bo(e, t, s, n, v, b) {
       ], 2)
     ]),
     o("div", {
-      class: "sidebar-content",
-      style: de({ width: e.containerWidth - 40 + "px" })
+      class: U(["sidebar-content", { "sidebar-content-collapsed": e.contentCollapsed && !e.isMobile }]),
+      style: de(e.contentCollapsed && !e.isMobile ? {} : { width: e.containerWidth - 40 + "px" })
     }, [
       T(N(p, {
         activeEditor: e.activeEditor,
@@ -1832,10 +1853,10 @@ function bo(e, t, s, n, v, b) {
       T(N(j, null, null, 512), [
         [W, e.active === "community-models"]
       ])
-    ], 4)
+    ], 6)
   ]);
 }
-const So = /* @__PURE__ */ F(xt, [["render", bo], ["__scopeId", "data-v-9b956f89"]]);
+const ko = /* @__PURE__ */ F(xt, [["render", ho], ["__scopeId", "data-v-1c35bb00"]]);
 export {
-  So as default
+  ko as default
 };