@lunora/studio 1.0.0-alpha.26 → 1.0.0-alpha.28

package/dist/packem_shared/{HomePanel-BewOCuag.js → home-panel-VdQI_8oX.js}

@@ -2,16 +2,375 @@ import { c } from 'react/compiler-runtime';
 import { useNavigate } from '@tanstack/react-router';
 import { B as Bar, E as EvilBarChart } from './bar-chart-CzJAgqkp.js';
 import { B as Badge } from './badge-B2PKA1-5.js';
-import { C as Card, a as CardContent } from './card-DURq3ElK.js';
+import { a as CardContent, C as Card } from './card-DURq3ElK.js';
 import { E as EmptyState } from './empty-state-DY_oe0k6.js';
-import { u as useAdminQuery } from './use-admin-query-BkbdNFNz.js';
+import { u as useAdminQuery } from './use-admin-query-CFl5GUg_.js';
 import { useT } from './DEFAULT_LOCALE-CiX4W7Kr.js';
 import { ADMIN_FUNCTIONS } from './ADMIN_FUNCTIONS-CdaxLGkE.js';
-import { d as formatBytes, f as fireAndForget } from './internal-rXJEAhXS.js';
+import { f as fireAndForget, c as callOptions, a as adminRef, h as formatBytes } from './internal-CvMZCVd6.js';
 import { c as cn } from './utils-B05Dmz_H.js';
 import { deriveInsights } from './DEFAULT_INSIGHT_THRESHOLDS-DjF0h-gA.js';
+import { useLunora } from '@lunora/react';
+import { useState, useEffect } from 'react';
 import { jsxDEV } from 'react/jsx-dev-runtime';
 
+const STUDIO_FEATURES = adminRef(ADMIN_FUNCTIONS.studioFeatures);
+const DEFAULT_STUDIO_FEATURES = {
+  analytics: true,
+  auth: true,
+  flags: true,
+  kv: true,
+  mail: true,
+  payments: true,
+  queues: true,
+  scheduler: true,
+  storage: true,
+  vectors: true,
+  workflows: true
+};
+const coerceFeatures = (raw) => {
+  if (raw === null || typeof raw !== "object") {
+    return DEFAULT_STUDIO_FEATURES;
+  }
+  const record = raw;
+  const flag = (key) => typeof record[key] === "boolean" ? record[key] : true;
+  return {
+    analytics: flag("analytics"),
+    auth: flag("auth"),
+    flags: flag("flags"),
+    kv: flag("kv"),
+    mail: flag("mail"),
+    payments: flag("payments"),
+    queues: flag("queues"),
+    scheduler: flag("scheduler"),
+    storage: flag("storage"),
+    vectors: flag("vectors"),
+    workflows: flag("workflows")
+  };
+};
+const useStudioFeatures = () => {
+  const $ = c(3);
+  const client = useLunora();
+  const [features, setFeatures] = useState(DEFAULT_STUDIO_FEATURES);
+  let t0;
+  let t1;
+  if ($[0] !== client) {
+    t0 = () => {
+      fireAndForget((async () => {
+        try {
+          setFeatures(coerceFeatures(await client.query(STUDIO_FEATURES, {}, callOptions(""))));
+        } catch {
+        }
+      })());
+    };
+    t1 = [client];
+    $[0] = client;
+    $[1] = t0;
+    $[2] = t1;
+  } else {
+    t0 = $[1];
+    t1 = $[2];
+  }
+  useEffect(t0, t1);
+  return features;
+};
+
+const ChevronRight$1 = () => {
+  const $ = c(1);
+  let t0;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /* @__PURE__ */ jsxDEV("svg", {
+      "aria-hidden": "true",
+      className: "size-4 text-muted-foreground",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 1.6,
+      viewBox: "0 0 24 24",
+      children: /* @__PURE__ */ jsxDEV("path", {
+        d: "m9 6 6 6-6 6",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }, void 0, false)
+    }, void 0, false);
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  return t0;
+};
+const BindingCard = (t0) => {
+  const $ = c(24);
+  const {
+    group
+  } = t0;
+  const t = useT();
+  const navigate = useNavigate();
+  let t1;
+  if ($[0] !== group.tab || $[1] !== navigate) {
+    t1 = () => {
+      fireAndForget(navigate({
+        to: `/${group.tab}`
+      }));
+    };
+    $[0] = group.tab;
+    $[1] = navigate;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  const onOpen = t1;
+  const count = group.bindings.length;
+  let t2;
+  if ($[3] !== group.label) {
+    t2 = /* @__PURE__ */ jsxDEV("span", {
+      className: "text-sm font-medium text-foreground",
+      children: group.label
+    }, void 0, false);
+    $[3] = group.label;
+    $[4] = t2;
+  } else {
+    t2 = $[4];
+  }
+  let t3;
+  if ($[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t3 = /* @__PURE__ */ jsxDEV(ChevronRight$1, {}, void 0, false);
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  let t4;
+  if ($[6] !== t2) {
+    t4 = /* @__PURE__ */ jsxDEV("div", {
+      className: "flex items-center justify-between",
+      children: [t2, t3]
+    }, void 0, true);
+    $[6] = t2;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[8] !== count || $[9] !== t) {
+    t5 = count === 1 ? t("1 binding") : t("{count} bindings", {
+      count
+    });
+    $[8] = count;
+    $[9] = t;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+  let t6;
+  if ($[11] !== t5) {
+    t6 = /* @__PURE__ */ jsxDEV("span", {
+      className: "text-xs text-muted-foreground",
+      children: t5
+    }, void 0, false);
+    $[11] = t5;
+    $[12] = t6;
+  } else {
+    t6 = $[12];
+  }
+  let t7;
+  if ($[13] !== count || $[14] !== group.bindings) {
+    t7 = count > 0 && /* @__PURE__ */ jsxDEV("div", {
+      className: "flex flex-wrap gap-1.5",
+      children: group.bindings.map(_temp$1)
+    }, void 0, false);
+    $[13] = count;
+    $[14] = group.bindings;
+    $[15] = t7;
+  } else {
+    t7 = $[15];
+  }
+  let t8;
+  if ($[16] !== t4 || $[17] !== t6 || $[18] !== t7) {
+    t8 = /* @__PURE__ */ jsxDEV(CardContent, {
+      className: "flex flex-col gap-2 py-4",
+      children: [t4, t6, t7]
+    }, void 0, true);
+    $[16] = t4;
+    $[17] = t6;
+    $[18] = t7;
+    $[19] = t8;
+  } else {
+    t8 = $[19];
+  }
+  let t9;
+  if ($[20] !== group.testId || $[21] !== onOpen || $[22] !== t8) {
+    t9 = /* @__PURE__ */ jsxDEV(Card, {
+      className: "cursor-pointer gap-0 py-0 transition-colors hover:bg-muted/40",
+      "data-testid": group.testId,
+      onClick: onOpen,
+      children: t8
+    }, void 0, false);
+    $[20] = group.testId;
+    $[21] = onOpen;
+    $[22] = t8;
+    $[23] = t9;
+  } else {
+    t9 = $[23];
+  }
+  return t9;
+};
+const TAB_ORDER = ["kv", "files", "vectors"];
+const upsertCard = (current, card) => [...current.filter((group) => group.tab !== card.tab), card].toSorted((a, b) => TAB_ORDER.indexOf(a.tab) - TAB_ORDER.indexOf(b.tab));
+const BindingsOverview = () => {
+  const $ = c(19);
+  const client = useLunora();
+  const features = useStudioFeatures();
+  const t = useT();
+  let t0;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t0 = [];
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  const [groups, setGroups] = useState(t0);
+  let t1;
+  let t2;
+  if ($[1] !== client || $[2] !== features.kv || $[3] !== features.storage || $[4] !== features.vectors || $[5] !== t) {
+    t1 = () => {
+      const token = {
+        cancelled: false
+      };
+      const sources = [{
+        enabled: features.kv,
+        label: t("KV Namespaces"),
+        load: async () => {
+          const namespaces = await client.listKvNamespaces();
+          return namespaces.map(_temp2$1);
+        },
+        tab: "kv",
+        testId: "home-binding-kv"
+      }, {
+        enabled: features.storage,
+        label: t("R2 Buckets"),
+        load: () => client.listStorageBuckets(),
+        tab: "files",
+        testId: "home-binding-r2"
+      }, {
+        enabled: features.vectors,
+        label: t("Vectorize Indexes"),
+        load: async () => {
+          const indexes = await client.listVectorIndexes();
+          return indexes.map(_temp3$1);
+        },
+        tab: "vectors",
+        testId: "home-binding-vectors"
+      }];
+      for (const source of sources) {
+        if (!source.enabled) {
+          continue;
+        }
+        fireAndForget((async () => {
+          try {
+            const bindings = await source.load();
+            if (!token.cancelled) {
+              const card = {
+                bindings,
+                label: source.label,
+                tab: source.tab,
+                testId: source.testId
+              };
+              setGroups((current) => upsertCard(current, card));
+            }
+          } catch {
+          }
+        })());
+      }
+      return () => {
+        token.cancelled = true;
+      };
+    };
+    t2 = [client, features.kv, features.storage, features.vectors, t];
+    $[1] = client;
+    $[2] = features.kv;
+    $[3] = features.storage;
+    $[4] = features.vectors;
+    $[5] = t;
+    $[6] = t1;
+    $[7] = t2;
+  } else {
+    t1 = $[6];
+    t2 = $[7];
+  }
+  useEffect(t1, t2);
+  if (groups.length === 0) {
+    return null;
+  }
+  let t3;
+  if ($[8] !== t) {
+    t3 = t("Bindings");
+    $[8] = t;
+    $[9] = t3;
+  } else {
+    t3 = $[9];
+  }
+  let t4;
+  if ($[10] !== t3) {
+    t4 = /* @__PURE__ */ jsxDEV("h2", {
+      className: "text-sm font-semibold tracking-tight text-foreground",
+      children: t3
+    }, void 0, false);
+    $[10] = t3;
+    $[11] = t4;
+  } else {
+    t4 = $[11];
+  }
+  let t5;
+  if ($[12] !== groups) {
+    t5 = groups.map(_temp4$1);
+    $[12] = groups;
+    $[13] = t5;
+  } else {
+    t5 = $[13];
+  }
+  let t6;
+  if ($[14] !== t5) {
+    t6 = /* @__PURE__ */ jsxDEV("div", {
+      className: "grid gap-3 sm:grid-cols-2 lg:grid-cols-3",
+      children: t5
+    }, void 0, false);
+    $[14] = t5;
+    $[15] = t6;
+  } else {
+    t6 = $[15];
+  }
+  let t7;
+  if ($[16] !== t4 || $[17] !== t6) {
+    t7 = /* @__PURE__ */ jsxDEV("section", {
+      className: "flex flex-col gap-3",
+      "data-testid": "home-bindings",
+      children: [t4, t6]
+    }, void 0, true);
+    $[16] = t4;
+    $[17] = t6;
+    $[18] = t7;
+  } else {
+    t7 = $[18];
+  }
+  return t7;
+};
+function _temp$1(binding) {
+  return /* @__PURE__ */ jsxDEV(Badge, {
+    variant: "secondary",
+    children: binding
+  }, binding, false);
+}
+function _temp2$1(ns) {
+  return ns.binding;
+}
+function _temp3$1(index) {
+  return index.name;
+}
+function _temp4$1(group) {
+  return /* @__PURE__ */ jsxDEV(BindingCard, {
+    group
+  }, group.tab, false);
+}
+
 const formatMs = (ms) => {
   if (ms < 1e3) {
     return `${String(Math.round(ms))}ms`;
@@ -676,7 +1035,7 @@ const averageLatencyMs = (functions) => {
   return functions.reduce((sum, function_) => sum + function_.totalDurationMs, 0) / calls;
 };
 const HomePanel = (t0) => {
-  const $ = c(149);
+  const $ = c(150);
   const {
     initialShardKey
   } = t0;
@@ -1048,84 +1407,91 @@ const HomePanel = (t0) => {
     t26 = $[93];
   }
   let t27;
-  if ($[94] !== functions) {
-    t27 = /* @__PURE__ */ jsxDEV("div", {
+  if ($[94] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t27 = /* @__PURE__ */ jsxDEV(BindingsOverview, {}, void 0, false);
+    $[94] = t27;
+  } else {
+    t27 = $[94];
+  }
+  let t28;
+  if ($[95] !== functions) {
+    t28 = /* @__PURE__ */ jsxDEV("div", {
       className: "lg:col-span-2",
       children: /* @__PURE__ */ jsxDEV(TopFunctionsCard, {
         functions
       }, void 0, false)
     }, void 0, false);
-    $[94] = functions;
-    $[95] = t27;
+    $[95] = functions;
+    $[96] = t28;
   } else {
-    t27 = $[95];
+    t28 = $[96];
   }
-  let t28;
-  if ($[96] !== subscriptions) {
-    t28 = /* @__PURE__ */ jsxDEV(LiveConnectionsCard, {
+  let t29;
+  if ($[97] !== subscriptions) {
+    t29 = /* @__PURE__ */ jsxDEV(LiveConnectionsCard, {
       subs: subscriptions
     }, void 0, false);
-    $[96] = subscriptions;
-    $[97] = t28;
+    $[97] = subscriptions;
+    $[98] = t29;
   } else {
-    t28 = $[97];
+    t29 = $[98];
   }
-  let t29;
-  if ($[98] !== activity) {
-    t29 = /* @__PURE__ */ jsxDEV(RecentActivityCard, {
+  let t30;
+  if ($[99] !== activity) {
+    t30 = /* @__PURE__ */ jsxDEV(RecentActivityCard, {
       entries: activity
     }, void 0, false);
-    $[98] = activity;
-    $[99] = t29;
+    $[99] = activity;
+    $[100] = t30;
   } else {
-    t29 = $[99];
+    t30 = $[100];
   }
-  let t30;
-  if ($[100] !== t28 || $[101] !== t29) {
-    t30 = /* @__PURE__ */ jsxDEV("div", {
+  let t31;
+  if ($[101] !== t29 || $[102] !== t30) {
+    t31 = /* @__PURE__ */ jsxDEV("div", {
       className: "flex flex-col gap-3",
-      children: [t28, t29]
+      children: [t29, t30]
     }, void 0, true);
-    $[100] = t28;
     $[101] = t29;
     $[102] = t30;
+    $[103] = t31;
   } else {
-    t30 = $[102];
+    t31 = $[103];
   }
-  let t31;
-  if ($[103] !== t27 || $[104] !== t30) {
-    t31 = /* @__PURE__ */ jsxDEV("div", {
+  let t32;
+  if ($[104] !== t28 || $[105] !== t31) {
+    t32 = /* @__PURE__ */ jsxDEV("div", {
       className: "grid gap-3 lg:grid-cols-3",
-      children: [t27, t30]
+      children: [t28, t31]
     }, void 0, true);
-    $[103] = t27;
-    $[104] = t30;
+    $[104] = t28;
     $[105] = t31;
+    $[106] = t32;
   } else {
-    t31 = $[105];
+    t32 = $[106];
   }
-  let t32;
-  if ($[106] !== t) {
-    t32 = t("Advisors");
-    $[106] = t;
-    $[107] = t32;
+  let t33;
+  if ($[107] !== t) {
+    t33 = t("Advisors");
+    $[107] = t;
+    $[108] = t33;
   } else {
-    t32 = $[107];
+    t33 = $[108];
   }
-  let t33;
-  if ($[108] !== t32) {
-    t33 = /* @__PURE__ */ jsxDEV("h2", {
+  let t34;
+  if ($[109] !== t33) {
+    t34 = /* @__PURE__ */ jsxDEV("h2", {
       className: "text-sm font-semibold tracking-tight text-foreground",
-      children: t32
+      children: t33
     }, void 0, false);
-    $[108] = t32;
     $[109] = t33;
+    $[110] = t34;
   } else {
-    t33 = $[109];
+    t34 = $[110];
   }
-  let t34;
-  if ($[110] !== performanceCount || $[111] !== securityCount || $[112] !== t || $[113] !== viewPerformance || $[114] !== viewSecurity) {
-    t34 = securityCount === 0 && performanceCount === 0 ? /* @__PURE__ */ jsxDEV(EmptyState, {
+  let t35;
+  if ($[111] !== performanceCount || $[112] !== securityCount || $[113] !== t || $[114] !== viewPerformance || $[115] !== viewSecurity) {
+    t35 = securityCount === 0 && performanceCount === 0 ? /* @__PURE__ */ jsxDEV(EmptyState, {
       description: t("No security or performance issues detected."),
       icon: /* @__PURE__ */ jsxDEV("svg", {
         "aria-hidden": "true",
@@ -1157,148 +1523,148 @@ const HomePanel = (t0) => {
         title: t("Performance issues")
       }, void 0, false)]
     }, void 0, true);
-    $[110] = performanceCount;
-    $[111] = securityCount;
-    $[112] = t;
-    $[113] = viewPerformance;
-    $[114] = viewSecurity;
-    $[115] = t34;
+    $[111] = performanceCount;
+    $[112] = securityCount;
+    $[113] = t;
+    $[114] = viewPerformance;
+    $[115] = viewSecurity;
+    $[116] = t35;
   } else {
-    t34 = $[115];
+    t35 = $[116];
   }
-  let t35;
-  if ($[116] !== t33 || $[117] !== t34) {
-    t35 = /* @__PURE__ */ jsxDEV("section", {
+  let t36;
+  if ($[117] !== t34 || $[118] !== t35) {
+    t36 = /* @__PURE__ */ jsxDEV("section", {
       className: "flex flex-col gap-3",
       "data-testid": "home-advisors",
-      children: [t33, t34]
+      children: [t34, t35]
     }, void 0, true);
-    $[116] = t33;
     $[117] = t34;
     $[118] = t35;
+    $[119] = t36;
   } else {
-    t35 = $[118];
+    t36 = $[119];
   }
-  let t36;
-  if ($[119] !== t) {
-    t36 = t("Get connected");
-    $[119] = t;
-    $[120] = t36;
+  let t37;
+  if ($[120] !== t) {
+    t37 = t("Get connected");
+    $[120] = t;
+    $[121] = t37;
   } else {
-    t36 = $[120];
+    t37 = $[121];
   }
-  let t37;
-  if ($[121] !== t36) {
-    t37 = /* @__PURE__ */ jsxDEV("h2", {
+  let t38;
+  if ($[122] !== t37) {
+    t38 = /* @__PURE__ */ jsxDEV("h2", {
       className: "text-sm font-semibold tracking-tight text-foreground",
-      children: t36
+      children: t37
     }, void 0, false);
-    $[121] = t36;
     $[122] = t37;
+    $[123] = t38;
   } else {
-    t37 = $[122];
+    t38 = $[123];
   }
-  let t38;
-  if ($[123] !== t) {
-    t38 = t("Client SDK");
-    $[123] = t;
-    $[124] = t38;
+  let t39;
+  if ($[124] !== t) {
+    t39 = t("Client SDK");
+    $[124] = t;
+    $[125] = t39;
   } else {
-    t38 = $[124];
+    t39 = $[125];
   }
-  let t39;
-  if ($[125] !== t38) {
-    t39 = /* @__PURE__ */ jsxDEV(ConnectCard, {
+  let t40;
+  if ($[126] !== t39) {
+    t40 = /* @__PURE__ */ jsxDEV(ConnectCard, {
       command: "npm i @lunora/client",
-      label: t38
+      label: t39
     }, void 0, false);
-    $[125] = t38;
     $[126] = t39;
+    $[127] = t40;
   } else {
-    t39 = $[126];
+    t40 = $[127];
   }
-  let t40;
-  if ($[127] !== t) {
-    t40 = t("React");
-    $[127] = t;
-    $[128] = t40;
+  let t41;
+  if ($[128] !== t) {
+    t41 = t("React");
+    $[128] = t;
+    $[129] = t41;
   } else {
-    t40 = $[128];
+    t41 = $[129];
   }
-  let t41;
-  if ($[129] !== t40) {
-    t41 = /* @__PURE__ */ jsxDEV(ConnectCard, {
+  let t42;
+  if ($[130] !== t41) {
+    t42 = /* @__PURE__ */ jsxDEV(ConnectCard, {
       command: "npm i @lunora/react",
-      label: t40
+      label: t41
     }, void 0, false);
-    $[129] = t40;
     $[130] = t41;
+    $[131] = t42;
   } else {
-    t41 = $[130];
+    t42 = $[131];
   }
-  let t42;
-  if ($[131] !== t) {
-    t42 = t("CLI");
-    $[131] = t;
-    $[132] = t42;
+  let t43;
+  if ($[132] !== t) {
+    t43 = t("CLI");
+    $[132] = t;
+    $[133] = t43;
   } else {
-    t42 = $[132];
+    t43 = $[133];
   }
-  let t43;
-  if ($[133] !== t42) {
-    t43 = /* @__PURE__ */ jsxDEV(ConnectCard, {
+  let t44;
+  if ($[134] !== t43) {
+    t44 = /* @__PURE__ */ jsxDEV(ConnectCard, {
       command: "lunora dev",
-      label: t42
+      label: t43
     }, void 0, false);
-    $[133] = t42;
     $[134] = t43;
+    $[135] = t44;
   } else {
-    t43 = $[134];
+    t44 = $[135];
   }
-  let t44;
-  if ($[135] !== t39 || $[136] !== t41 || $[137] !== t43) {
-    t44 = /* @__PURE__ */ jsxDEV("div", {
+  let t45;
+  if ($[136] !== t40 || $[137] !== t42 || $[138] !== t44) {
+    t45 = /* @__PURE__ */ jsxDEV("div", {
       className: "grid gap-3 sm:grid-cols-3",
-      children: [t39, t41, t43]
+      children: [t40, t42, t44]
     }, void 0, true);
-    $[135] = t39;
-    $[136] = t41;
-    $[137] = t43;
+    $[136] = t40;
+    $[137] = t42;
     $[138] = t44;
+    $[139] = t45;
   } else {
-    t44 = $[138];
+    t45 = $[139];
   }
-  let t45;
-  if ($[139] !== t37 || $[140] !== t44) {
-    t45 = /* @__PURE__ */ jsxDEV("section", {
+  let t46;
+  if ($[140] !== t38 || $[141] !== t45) {
+    t46 = /* @__PURE__ */ jsxDEV("section", {
       className: "flex flex-col gap-3",
       "data-testid": "home-get-connected",
-      children: [t37, t44]
+      children: [t38, t45]
     }, void 0, true);
-    $[139] = t37;
-    $[140] = t44;
+    $[140] = t38;
     $[141] = t45;
+    $[142] = t46;
   } else {
-    t45 = $[141];
+    t46 = $[142];
   }
-  let t46;
-  if ($[142] !== t18 || $[143] !== t19 || $[144] !== t26 || $[145] !== t31 || $[146] !== t35 || $[147] !== t45) {
-    t46 = /* @__PURE__ */ jsxDEV("div", {
+  let t47;
+  if ($[143] !== t18 || $[144] !== t19 || $[145] !== t26 || $[146] !== t32 || $[147] !== t36 || $[148] !== t46) {
+    t47 = /* @__PURE__ */ jsxDEV("div", {
       className: t18,
       "data-testid": t19,
-      children: [t26, t31, t35, t45]
+      children: [t26, t27, t32, t36, t46]
     }, void 0, true);
-    $[142] = t18;
-    $[143] = t19;
-    $[144] = t26;
-    $[145] = t31;
-    $[146] = t35;
-    $[147] = t45;
+    $[143] = t18;
+    $[144] = t19;
+    $[145] = t26;
+    $[146] = t32;
+    $[147] = t36;
     $[148] = t46;
+    $[149] = t47;
   } else {
-    t46 = $[148];
+    t47 = $[149];
   }
-  return t46;
+  return t47;
 };
 function _temp(value, index) {
   return {
@@ -1331,4 +1697,4 @@ function _temp4(function_) {
   return function_.maxDurationMs;
 }
 
-export { HomePanel };
+export { HomePanel as H, useStudioFeatures as u };