@korso/shepherd-ui 0.2.0 → 0.2.2

package/dist/lib/index.js

@@ -1,457 +1,398 @@
-import { u as $, d as I, D as U } from "./Dashboard-CG6KeFQ3.js";
-import { S as ne, a as te, c as ae } from "./Dashboard-CG6KeFQ3.js";
-import { jsxs as b, jsx as e } from "react/jsx-runtime";
-import { useId as O, useState as i, useEffect as H, useRef as _, useCallback as D } from "react";
-function F({ workspaceId: c, refreshKey: t = 0, canRemove: l = !1, onLeft: k }) {
-  const f = $(), R = O(), [w, v] = i([]), [N, y] = i(null), [p, C] = i(null), [E, d] = i(!0), [u, n] = i(null), [o, m] = i(!1);
-  async function s({ keepError: h = !1 } = {}) {
-    h || y(null);
+import { u as j, d as C, D as W } from "./Dashboard-B7nioe5N.js";
+import { E as Y, S as Z, a as ee, c as ne } from "./Dashboard-B7nioe5N.js";
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { useId as O, useState as i, useEffect as _, useCallback as $ } from "react";
+function A({ workspaceId: d, refreshKey: a = 0, canRemove: l = !1, onLeft: k }) {
+  const p = j(), N = O(), [g, b] = i([]), [u, v] = i(null), [m, s] = i(null), [w, h] = i(!0), [c, f] = i(null), [R, S] = i(!1);
+  async function I({ keepError: o = !1 } = {}) {
+    o || v(null);
     try {
-      const g = await f.listMembers(c);
-      v(g.members);
-    } catch (g) {
-      y(I(g));
+      const y = await p.listMembers(d);
+      b(y.members);
+    } catch (y) {
+      v(C(y));
     } finally {
-      d(!1);
+      h(!1);
     }
   }
-  H(() => {
-    d(!0), s();
-  }, [f, c, t]);
-  async function S(h, g) {
-    if (!u) {
-      n(h), y(null), C(null), v((T) => T.filter((r) => r.accountId !== h));
+  _(() => {
+    h(!0), I();
+  }, [p, d, a]);
+  async function L(o, y) {
+    if (!c) {
+      f(o), v(null), s(null), b((E) => E.filter((t) => t.accountId !== o));
       try {
-        await f.removeMember(c, h), C(`Removed ${g}`);
-      } catch (T) {
-        y(I(T)), s({ keepError: !0 });
+        await p.removeMember(d, o), s(`Removed ${y}`);
+      } catch (E) {
+        v(C(E)), I({ keepError: !0 });
       } finally {
-        n(null);
+        f(null);
       }
     }
   }
   async function x() {
-    if (!o) {
-      m(!0), y(null), C(null);
+    if (!R) {
+      S(!0), v(null), s(null);
       try {
-        await f.leave(c), C("Left workspace"), k == null || k();
-      } catch (h) {
-        y(I(h));
+        await p.leave(d), s("Left workspace"), k == null || k();
+      } catch (o) {
+        v(C(o));
       } finally {
-        m(!1);
+        S(!1);
       }
     }
   }
-  return /* @__PURE__ */ b("section", { className: "shepherd-members", "aria-labelledby": R, children: [
-    /* @__PURE__ */ e("h3", { id: R, children: "Members" }),
-    N && /* @__PURE__ */ e("p", { role: "alert", children: N }),
-    p && /* @__PURE__ */ e("p", { role: "status", children: p }),
-    E ? /* @__PURE__ */ e("p", { role: "status", children: "Loading…" }) : w.length === 0 ? /* @__PURE__ */ e("p", { children: "No members." }) : /* @__PURE__ */ e("ul", { children: w.map((h) => {
-      const g = h.displayName ?? h.githubLogin ?? h.accountId;
-      return /* @__PURE__ */ b("li", { children: [
-        /* @__PURE__ */ e("span", { children: g }),
-        /* @__PURE__ */ e("span", { className: "role", children: h.role }),
-        l && /* @__PURE__ */ e(
-          "button",
-          {
-            type: "button",
-            "aria-label": `Remove ${g}`,
-            onClick: () => void S(h.accountId, g),
-            disabled: u === h.accountId,
-            children: "Remove"
-          }
-        )
-      ] }, h.accountId);
-    }) }),
-    /* @__PURE__ */ e("button", { type: "button", onClick: () => void x(), disabled: o, children: "Leave workspace" })
+  return /* @__PURE__ */ r("section", { className: "shepherd-members", "aria-labelledby": N, children: [
+    /* @__PURE__ */ e("div", { className: "card-head", children: /* @__PURE__ */ e("h3", { id: N, children: "Members" }) }),
+    /* @__PURE__ */ r("div", { className: "card-body", children: [
+      u && /* @__PURE__ */ e("p", { role: "alert", children: u }),
+      m && /* @__PURE__ */ e("p", { role: "status", children: m }),
+      w ? /* @__PURE__ */ e("p", { role: "status", children: "Loading…" }) : g.length === 0 ? /* @__PURE__ */ e("p", { children: "No members." }) : /* @__PURE__ */ e("ul", { children: g.map((o) => {
+        const y = o.displayName ?? o.githubLogin ?? o.accountId;
+        return /* @__PURE__ */ r("li", { children: [
+          /* @__PURE__ */ e("span", { children: y }),
+          /* @__PURE__ */ e("span", { className: "role", children: o.role }),
+          l && /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              "aria-label": `Remove ${y}`,
+              onClick: () => void L(o.accountId, y),
+              disabled: c === o.accountId,
+              children: "Remove"
+            }
+          )
+        ] }, o.accountId);
+      }) }),
+      /* @__PURE__ */ e("button", { type: "button", onClick: () => void x(), disabled: R, children: "Leave workspace" })
+    ] })
   ] });
 }
-function M({ workspaces: c, selected: t, onChanged: l, onSelect: k }) {
-  const f = $(), R = O(), [w, v] = i(""), [N, y] = i(""), [p, C] = i(null), [E, d] = i(null), [u, n] = i(!1), [o, m] = i(0), s = (t == null ? void 0 : t.role) === "admin";
-  async function S() {
-    if (!(!w.trim() || u)) {
-      n(!0), d(null);
+function F({ workspaces: d, selected: a, onChanged: l, onSelect: k }) {
+  const p = j(), N = O(), [g, b] = i(""), [u, v] = i(""), [m, s] = i(null), [w, h] = i(null), [c, f] = i(!1), [R, S] = i(0), I = (a == null ? void 0 : a.role) === "admin";
+  async function L() {
+    if (!(!g.trim() || c)) {
+      f(!0), h(null);
       try {
-        await f.createWorkspace({ name: w.trim() }), v(""), l();
-      } catch (r) {
-        d(I(r));
+        await p.createWorkspace({ name: g.trim() }), b(""), l();
+      } catch (t) {
+        h(C(t));
       } finally {
-        n(!1);
+        f(!1);
       }
     }
   }
   async function x() {
-    if (!(!N.trim() || u)) {
-      n(!0), d(null);
+    if (!(!u.trim() || c)) {
+      f(!0), h(null);
       try {
-        await f.redeemInvite(N.trim()), y(""), l(), m((r) => r + 1);
-      } catch (r) {
-        d(I(r));
+        await p.redeemInvite(u.trim()), v(""), l(), S((t) => t + 1);
+      } catch (t) {
+        h(C(t));
       } finally {
-        n(!1);
+        f(!1);
       }
     }
   }
-  async function h() {
-    if (!(!t || u)) {
-      n(!0), d(null);
+  async function o() {
+    if (!(!a || c)) {
+      f(!0), h(null);
       try {
-        const r = await f.createInvite(t.id, {});
-        C(r), m((j) => j + 1);
-      } catch (r) {
-        d(I(r));
+        const t = await p.createInvite(a.id, {});
+        s(t), S((H) => H + 1);
+      } catch (t) {
+        h(C(t));
       } finally {
-        n(!1);
+        f(!1);
       }
     }
   }
-  async function g() {
-    if (!(!t || !p || u)) {
-      n(!0), d(null);
+  async function y() {
+    if (!(!a || !m || c)) {
+      f(!0), h(null);
       try {
-        await f.revokeInvite(t.id, p.code), C(null);
-      } catch (r) {
-        d(I(r));
+        await p.revokeInvite(a.id, m.code), s(null);
+      } catch (t) {
+        h(C(t));
       } finally {
-        n(!1);
+        f(!1);
       }
     }
   }
-  H(() => {
-    C(null);
-  }, [t == null ? void 0 : t.id]);
-  const T = p ? `${window.location.origin}/join/${encodeURIComponent(p.code)}` : null;
-  return /* @__PURE__ */ b("section", { className: "shepherd-workspaces", "aria-labelledby": R, children: [
-    /* @__PURE__ */ e("h3", { id: R, children: "Workspace management" }),
-    E && /* @__PURE__ */ e("p", { role: "alert", children: E }),
-    c.length > 1 && k && /* @__PURE__ */ b("div", { className: "switcher", children: [
-      /* @__PURE__ */ e("label", { htmlFor: "ws-switcher", children: "Active workspace" }),
-      /* @__PURE__ */ e(
-        "select",
-        {
-          id: "ws-switcher",
-          value: (t == null ? void 0 : t.id) ?? "",
-          onChange: (r) => k(r.target.value),
-          children: c.map((r) => /* @__PURE__ */ e("option", { value: r.id, children: r.name }, r.id))
-        }
-      )
+  _(() => {
+    s(null);
+  }, [a == null ? void 0 : a.id]);
+  const E = m ? `${window.location.origin}/join/${encodeURIComponent(m.code)}` : null;
+  return /* @__PURE__ */ r("section", { className: "shepherd-workspaces", "aria-labelledby": N, children: [
+    /* @__PURE__ */ r("div", { className: "card-head", children: [
+      /* @__PURE__ */ e("h3", { id: N, children: "Workspace management" }),
+      /* @__PURE__ */ e("p", { className: "card-sub", children: "Create a workspace to get started, or join an existing one with an invite code." })
     ] }),
-    /* @__PURE__ */ b("div", { className: "create", children: [
-      /* @__PURE__ */ e("label", { htmlFor: "ws-name", children: "Workspace name" }),
-      /* @__PURE__ */ e(
-        "input",
-        {
-          id: "ws-name",
-          type: "text",
-          value: w,
-          onChange: (r) => v(r.target.value)
-        }
-      ),
-      /* @__PURE__ */ e("button", { type: "button", onClick: () => void S(), disabled: u, children: "Create workspace" })
-    ] }),
-    /* @__PURE__ */ b("div", { className: "join", children: [
-      /* @__PURE__ */ e("label", { htmlFor: "invite-code", children: "Invite code" }),
-      /* @__PURE__ */ e(
-        "input",
-        {
-          id: "invite-code",
-          type: "text",
-          value: N,
-          onChange: (r) => y(r.target.value)
-        }
-      ),
-      /* @__PURE__ */ e("button", { type: "button", onClick: () => void x(), disabled: u, children: "Join" })
-    ] }),
-    s && t && /* @__PURE__ */ b("div", { className: "admin", children: [
-      /* @__PURE__ */ b("div", { className: "invites", children: [
-        /* @__PURE__ */ e("button", { type: "button", onClick: () => void h(), disabled: u, children: "Create invite" }),
-        p && /* @__PURE__ */ b("div", { className: "invite-result", children: [
-          /* @__PURE__ */ e("code", { children: p.code }),
-          /* @__PURE__ */ e("a", { href: T ?? void 0, children: T }),
-          /* @__PURE__ */ b("span", { className: "invite-uses", children: [
-            p.useCount,
-            " / ",
-            p.maxUses,
-            " uses"
-          ] }),
-          /* @__PURE__ */ e("button", { type: "button", onClick: () => void g(), disabled: u, children: "Revoke invite" })
+    /* @__PURE__ */ r("div", { className: "card-body", children: [
+      w && /* @__PURE__ */ e("p", { role: "alert", children: w }),
+      d.length > 1 && k && /* @__PURE__ */ r("div", { className: "field switcher", children: [
+        /* @__PURE__ */ e("label", { htmlFor: "ws-switcher", children: "Active workspace" }),
+        /* @__PURE__ */ e(
+          "select",
+          {
+            id: "ws-switcher",
+            value: (a == null ? void 0 : a.id) ?? "",
+            onChange: (t) => k(t.target.value),
+            children: d.map((t) => /* @__PURE__ */ e("option", { value: t.id, children: t.name }, t.id))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ r("div", { className: "field create", children: [
+        /* @__PURE__ */ e("label", { htmlFor: "ws-name", children: "Workspace name" }),
+        /* @__PURE__ */ e("p", { className: "helper", children: "Start a fresh workspace — you'll be its admin." }),
+        /* @__PURE__ */ r("div", { className: "field__row", children: [
+          /* @__PURE__ */ e(
+            "input",
+            {
+              id: "ws-name",
+              type: "text",
+              placeholder: "e.g. Acme Engineering",
+              value: g,
+              onChange: (t) => b(t.target.value)
+            }
+          ),
+          /* @__PURE__ */ e("button", { type: "button", onClick: () => void L(), disabled: c, children: "Create workspace" })
         ] })
       ] }),
-      /* @__PURE__ */ e(
-        F,
-        {
-          workspaceId: t.id,
-          refreshKey: o,
-          onLeft: l,
-          canRemove: !0
-        }
-      )
+      /* @__PURE__ */ r("div", { className: "field join", children: [
+        /* @__PURE__ */ e("label", { htmlFor: "invite-code", children: "Invite code" }),
+        /* @__PURE__ */ e("p", { className: "helper", children: "Paste an invite code someone shared to join their workspace." }),
+        /* @__PURE__ */ r("div", { className: "field__row", children: [
+          /* @__PURE__ */ e(
+            "input",
+            {
+              id: "invite-code",
+              type: "text",
+              placeholder: "Invite code",
+              value: u,
+              onChange: (t) => v(t.target.value)
+            }
+          ),
+          /* @__PURE__ */ e("button", { type: "button", onClick: () => void x(), disabled: c, children: "Join" })
+        ] })
+      ] }),
+      I && a && /* @__PURE__ */ r("div", { className: "admin", children: [
+        /* @__PURE__ */ r("div", { className: "invites", children: [
+          /* @__PURE__ */ e("button", { type: "button", onClick: () => void o(), disabled: c, children: "Create invite" }),
+          m && /* @__PURE__ */ r("div", { className: "invite-result", children: [
+            /* @__PURE__ */ e("code", { children: m.code }),
+            /* @__PURE__ */ e("a", { href: E ?? void 0, children: E }),
+            /* @__PURE__ */ r("span", { className: "invite-uses", children: [
+              m.useCount,
+              " / ",
+              m.maxUses,
+              " uses"
+            ] }),
+            /* @__PURE__ */ e("button", { type: "button", onClick: () => void y(), disabled: c, children: "Revoke invite" })
+          ] })
+        ] }),
+        /* @__PURE__ */ e(
+          A,
+          {
+            workspaceId: a.id,
+            refreshKey: R,
+            onLeft: l,
+            canRemove: !0
+          }
+        )
+      ] })
     ] })
   ] });
 }
-const P = [
+const K = [
   { id: "claude", label: "Claude Code" },
   { id: "codex", label: "Codex" },
   { id: "pi", label: "Pi" },
   { id: "generic", label: "Generic (JSON)" }
-], B = "shp_<paste-after-generating>", G = {
+], M = "shp_<paste-after-generating>", D = {
   claude: "claude mcp add shepherd -s user \\",
   codex: "codex mcp add shepherd \\",
   pi: "pi mcp add shepherd \\"
 };
-function J(c, t, l) {
-  return c === "generic" ? JSON.stringify(
+function B(d, a, l) {
+  return d === "generic" ? JSON.stringify(
     {
       mcpServers: {
         shepherd: {
           command: "npx",
           args: ["-y", "@korso/shepherd"],
-          env: { HUB_URL: t, SHEPHERD_TOKEN: l }
+          env: { HUB_URL: a, SHEPHERD_TOKEN: l }
         }
       }
     },
     null,
     2
   ) : [
-    G[c],
-    `  -e HUB_URL=${t} \\`,
+    D[d],
+    `  -e HUB_URL=${a} \\`,
     `  -e SHEPHERD_TOKEN=${l} \\`,
     "  -- npx -y @korso/shepherd"
   ].join(`
 `);
 }
-function V({ workspaceId: c, hubUrl: t }) {
-  const l = $(), k = t ?? l.baseUrl, f = O(), [R, w] = i("claude"), [v, N] = i(""), [y, p] = i(null), [C, E] = i([]), [d, u] = i(null), [n, o] = i(null), [m, s] = i(!1), [S, x] = i(!0), [h, g] = i(null);
-  async function T() {
+function G({ workspaceId: d, hubUrl: a }) {
+  const l = j(), k = a ?? l.baseUrl, p = O(), [N, g] = i("claude"), [b, u] = i(""), [v, m] = i(null), [s, w] = i([]), [h, c] = i(null), [f, R] = i(null), [S, I] = i(!1), [L, x] = i(!0), [o, y] = i(null);
+  async function E() {
     try {
-      const a = await l.listTokens(c);
-      E(a.tokens);
-    } catch (a) {
-      u(I(a));
+      const n = await l.listTokens(d);
+      w(n.tokens);
+    } catch (n) {
+      c(C(n));
     } finally {
       x(!1);
     }
   }
-  H(() => {
-    x(!0), T();
-  }, [l, c]), H(() => {
-    p(null);
-  }, [c]);
-  async function r() {
-    s(!0), u(null);
+  _(() => {
+    x(!0), E();
+  }, [l, d]), _(() => {
+    m(null);
+  }, [d]);
+  async function t() {
+    I(!0), c(null);
     try {
-      const a = await l.mintToken(
-        c,
-        v.trim() ? { name: v.trim() } : {}
+      const n = await l.mintToken(
+        d,
+        b.trim() ? { name: b.trim() } : {}
       );
-      p(a.token), N(""), await T();
-    } catch (a) {
-      u(I(a));
+      m(n.token), u(""), await E();
+    } catch (n) {
+      c(C(n));
     } finally {
-      s(!1);
+      I(!1);
     }
   }
-  async function j(a) {
-    if (!h) {
-      g(a), u(null), o(null);
+  async function H(n) {
+    if (!o) {
+      y(n), c(null), R(null);
       try {
-        await l.revokeToken(c, a), E((L) => L.filter((A) => A.id !== a)), o("Token revoked");
-      } catch (L) {
-        u(I(L));
+        await l.revokeToken(d, n), w((T) => T.filter((U) => U.id !== n)), R("Token revoked");
+      } catch (T) {
+        c(C(T));
       } finally {
-        g(null);
+        y(null);
       }
     }
   }
-  const W = J(R, k, y ?? B);
-  return /* @__PURE__ */ b("section", { className: "shepherd-connect-agent", "aria-labelledby": f, children: [
-    /* @__PURE__ */ e("h3", { id: f, children: "Connect your agent" }),
-    /* @__PURE__ */ e("label", { htmlFor: "connect-tool", children: "Tool" }),
-    /* @__PURE__ */ e(
-      "select",
-      {
-        id: "connect-tool",
-        value: R,
-        onChange: (a) => w(a.target.value),
-        children: P.map((a) => /* @__PURE__ */ e("option", { value: a.id, children: a.label }, a.id))
-      }
-    ),
-    /* @__PURE__ */ b("div", { className: "generate", children: [
-      /* @__PURE__ */ e("label", { htmlFor: "token-name", children: "Token name (optional)" }),
-      /* @__PURE__ */ e(
-        "input",
-        {
-          id: "token-name",
-          type: "text",
-          value: v,
-          onChange: (a) => N(a.target.value),
-          placeholder: "e.g. laptop"
-        }
-      ),
-      /* @__PURE__ */ e("button", { type: "button", onClick: () => void r(), disabled: m, children: "Generate token" })
+  const P = B(N, k, v ?? M);
+  return /* @__PURE__ */ r("section", { className: "shepherd-connect-agent", "aria-labelledby": p, children: [
+    /* @__PURE__ */ r("div", { className: "card-head", children: [
+      /* @__PURE__ */ e("h3", { id: p, children: "Connect your agent" }),
+      /* @__PURE__ */ e("p", { className: "card-sub", children: "Generate a token, then paste the command into your coding tool." })
     ] }),
-    d && /* @__PURE__ */ e("p", { role: "alert", children: d }),
-    n && /* @__PURE__ */ e("p", { role: "status", children: n }),
-    y && /* @__PURE__ */ e("p", { className: "token-once", role: "status", children: "Copy this token now — it won't be shown again." }),
-    /* @__PURE__ */ e("pre", { "data-testid": "install-command", children: W }),
-    /* @__PURE__ */ e("h4", { children: "Existing tokens" }),
-    S ? /* @__PURE__ */ e("p", { role: "status", children: "Loading…" }) : C.length === 0 ? /* @__PURE__ */ e("p", { children: "No tokens yet." }) : /* @__PURE__ */ e("ul", { children: C.map((a) => {
-      const L = a.name ?? a.id;
-      return /* @__PURE__ */ b("li", { children: [
-        /* @__PURE__ */ e("span", { children: L }),
-        a.revokedAt ? /* @__PURE__ */ e("span", { className: "revoked", children: "revoked" }) : /* @__PURE__ */ e(
-          "button",
+    /* @__PURE__ */ r("div", { className: "card-body", children: [
+      /* @__PURE__ */ r("div", { className: "field", children: [
+        /* @__PURE__ */ e("label", { htmlFor: "connect-tool", children: "Tool" }),
+        /* @__PURE__ */ e(
+          "select",
           {
-            type: "button",
-            "aria-label": `Revoke token ${L}`,
-            onClick: () => void j(a.id),
-            disabled: h === a.id,
-            children: "Revoke"
+            id: "connect-tool",
+            value: N,
+            onChange: (n) => g(n.target.value),
+            children: K.map((n) => /* @__PURE__ */ e("option", { value: n.id, children: n.label }, n.id))
           }
         )
-      ] }, a.id);
-    }) })
-  ] });
-}
-function X({
-  title: c = "No workspace yet",
-  children: t,
-  onGetStarted: l,
-  ctaLabel: k = "Go to Config"
-}) {
-  return /* @__PURE__ */ b("section", { className: "shepherd-empty-state", "aria-labelledby": "empty-state-heading", children: [
-    /* @__PURE__ */ e("h2", { id: "empty-state-heading", children: c }),
-    /* @__PURE__ */ e("p", { children: t ?? "Create a workspace or join one with an invite code to get started." }),
-    l && /* @__PURE__ */ e("button", { type: "button", onClick: l, children: k })
+      ] }),
+      /* @__PURE__ */ r("div", { className: "field generate", children: [
+        /* @__PURE__ */ e("label", { htmlFor: "token-name", children: "Token name (optional)" }),
+        /* @__PURE__ */ r("div", { className: "field__row", children: [
+          /* @__PURE__ */ e(
+            "input",
+            {
+              id: "token-name",
+              type: "text",
+              value: b,
+              onChange: (n) => u(n.target.value),
+              placeholder: "e.g. laptop"
+            }
+          ),
+          /* @__PURE__ */ e("button", { type: "button", onClick: () => void t(), disabled: S, children: "Generate token" })
+        ] })
+      ] }),
+      h && /* @__PURE__ */ e("p", { role: "alert", children: h }),
+      f && /* @__PURE__ */ e("p", { role: "status", children: f }),
+      v && /* @__PURE__ */ e("p", { className: "token-once", role: "status", children: "Copy this token now — it won't be shown again." }),
+      /* @__PURE__ */ e("pre", { "data-testid": "install-command", children: P }),
+      /* @__PURE__ */ e("h4", { children: "Existing tokens" }),
+      L ? /* @__PURE__ */ e("p", { role: "status", children: "Loading…" }) : s.length === 0 ? /* @__PURE__ */ e("p", { children: "No tokens yet." }) : /* @__PURE__ */ e("ul", { children: s.map((n) => {
+        const T = n.name ?? n.id;
+        return /* @__PURE__ */ r("li", { children: [
+          /* @__PURE__ */ e("span", { children: T }),
+          n.revokedAt ? /* @__PURE__ */ e("span", { className: "revoked", children: "revoked" }) : /* @__PURE__ */ e(
+            "button",
+            {
+              type: "button",
+              "aria-label": `Revoke token ${T}`,
+              onClick: () => void H(n.id),
+              disabled: o === n.id,
+              children: "Revoke"
+            }
+          )
+        ] }, n.id);
+      }) })
+    ] })
   ] });
 }
-const K = [
-  { id: "board", label: "Board" },
-  { id: "config", label: "Config" }
-];
-function Y({ hubUrl: c }) {
-  const t = $(), [l, k] = i({ status: "loading" }), [f, R] = i(null), [w, v] = i("board"), N = _([]), y = D(
-    (n, o) => {
-      var S;
-      const m = K.length - 1;
-      let s = null;
-      switch (n.key) {
-        case "ArrowRight":
-          s = o === m ? 0 : o + 1;
-          break;
-        case "ArrowLeft":
-          s = o === 0 ? m : o - 1;
-          break;
-        case "Home":
-          s = 0;
-          break;
-        case "End":
-          s = m;
-          break;
-        default:
-          return;
-      }
-      n.preventDefault(), v(K[s].id), (S = N.current[s]) == null || S.focus();
-    },
-    []
-  ), p = D(
-    async (n) => {
-      try {
-        const o = await t.listWorkspaces();
-        k({ status: "ready", workspaces: o.workspaces }), R(
-          (m) => {
-            var s;
-            return m && o.workspaces.some((S) => S.id === m) ? m : ((s = o.workspaces[0]) == null ? void 0 : s.id) ?? null;
-          }
-        ), n && v(o.workspaces.length === 0 ? "config" : "board");
-      } catch (o) {
-        k({
-          status: "error",
-          message: I(o)
-        });
-      }
-    },
-    [t]
-  );
-  H(() => {
-    p(!0);
-  }, []);
-  const C = D(() => p(!1), [p]), E = l.status === "ready" ? l.workspaces : [], d = E.find((n) => n.id === f) ?? null;
+function z({ hubUrl: d }) {
+  const a = j(), [l, k] = i({ status: "loading" }), [p, N] = i(null), g = $(async () => {
+    try {
+      const s = await a.listWorkspaces();
+      k({ status: "ready", workspaces: s.workspaces }), N(
+        (w) => {
+          var h;
+          return w && s.workspaces.some((c) => c.id === w) ? w : ((h = s.workspaces[0]) == null ? void 0 : h.id) ?? null;
+        }
+      );
+    } catch (s) {
+      k({ status: "error", message: C(s) });
+    }
+  }, [a]);
+  _(() => {
+    g();
+  }, [g]);
+  const b = l.status === "ready" ? l.workspaces : [], u = b.find((s) => s.id === p) ?? null;
   if (l.status === "loading")
     return /* @__PURE__ */ e("div", { className: "shepherd-root", children: /* @__PURE__ */ e("p", { role: "status", children: "Loading…" }) });
   if (l.status === "error")
     return /* @__PURE__ */ e("div", { className: "shepherd-root", children: /* @__PURE__ */ e("p", { role: "alert", children: l.message }) });
-  const u = E.length > 0;
-  return /* @__PURE__ */ b("div", { className: "shepherd-root", children: [
-    /* @__PURE__ */ b("header", { children: [
-      /* @__PURE__ */ e("h1", { className: "brand", style: { margin: 0, font: "inherit" }, children: "Shepherd" }),
-      /* @__PURE__ */ e("nav", { className: "tabs", role: "tablist", "aria-label": "Shepherd views", children: K.map(({ id: n, label: o }, m) => /* @__PURE__ */ e(
-        "button",
-        {
-          ref: (s) => {
-            N.current[m] = s;
-          },
-          type: "button",
-          role: "tab",
-          id: `tab-${n}`,
-          "aria-controls": `panel-${n}`,
-          "aria-selected": w === n,
-          tabIndex: w === n ? 0 : -1,
-          onClick: () => v(n),
-          onKeyDown: (s) => y(s, m),
-          children: o
+  const v = b.length > 0, m = /* @__PURE__ */ r("section", { className: "shepherd-config", "aria-labelledby": "config-heading", children: [
+    /* @__PURE__ */ e("h2", { id: "config-heading", children: "Configuration" }),
+    /* @__PURE__ */ e(
+      F,
+      {
+        workspaces: b,
+        selected: u,
+        onChanged: () => {
+          g();
         },
-        n
-      )) })
-    ] }),
-    /* @__PURE__ */ b("main", { children: [
-      w === "board" && /* @__PURE__ */ e(
-        "div",
-        {
-          role: "tabpanel",
-          id: "panel-board",
-          "aria-labelledby": "tab-board",
-          tabIndex: 0,
-          children: u && d ? /* @__PURE__ */ e(U, { workspaceId: d.id }) : /* @__PURE__ */ e(X, { onGetStarted: () => v("config") })
-        }
-      ),
-      w === "config" && /* @__PURE__ */ e(
-        "div",
-        {
-          role: "tabpanel",
-          id: "panel-config",
-          "aria-labelledby": "tab-config",
-          tabIndex: 0,
-          children: /* @__PURE__ */ b("section", { className: "shepherd-config", "aria-labelledby": "config-heading", children: [
-            /* @__PURE__ */ e("h2", { id: "config-heading", children: "Configuration" }),
-            /* @__PURE__ */ e(
-              M,
-              {
-                workspaces: E,
-                selected: d,
-                onChanged: () => {
-                  C();
-                },
-                onSelect: R
-              }
-            ),
-            d && /* @__PURE__ */ e(V, { workspaceId: d.id, hubUrl: c })
-          ] })
-        }
-      )
-    ] })
+        onSelect: N
+      }
+    ),
+    u && /* @__PURE__ */ e(G, { workspaceId: u.id, hubUrl: d })
   ] });
+  return /* @__PURE__ */ e("div", { className: "shepherd-root", children: /* @__PURE__ */ e(
+    W,
+    {
+      workspaceId: u == null ? void 0 : u.id,
+      config: m,
+      hasWorkspace: v
+    }
+  ) });
 }
 export {
-  V as ConnectAgent,
-  U as Dashboard,
-  X as EmptyState,
-  F as Members,
-  ne as ShepherdClientError,
-  te as ShepherdClientProvider,
-  Y as ShepherdRoot,
-  M as Workspaces,
-  ae as createShepherdClient,
-  I as describeError,
-  $ as useShepherdClient
+  G as ConnectAgent,
+  W as Dashboard,
+  Y as EmptyState,
+  A as Members,
+  Z as ShepherdClientError,
+  ee as ShepherdClientProvider,
+  z as ShepherdRoot,
+  F as Workspaces,
+  ne as createShepherdClient,
+  C as describeError,
+  j as useShepherdClient
 };