@elaraai/e3-ui-components 1.0.18 → 1.0.20

package/dist/index.cjs

@@ -30,6 +30,7 @@ const React = require("react");
 const react = require("@chakra-ui/react");
 const eastUiComponents = require("@elaraai/east-ui-components");
 const reactDom = require("react-dom");
+require("@elaraai/e3-ui");
 const internal$2 = require("@elaraai/east-ui/internal");
 const reactQuery = require("@tanstack/react-query");
 const reactVirtual = require("@tanstack/react-virtual");
@@ -8344,7 +8345,7 @@ function parseManualDraft(leafType, draft) {
   }
 }
 const diffValueEqual = east.equalFor(internal.Diff.Component.schema);
-function getOpt$2(opt) {
+function getOpt$1(opt) {
   return opt.type === "some" ? opt.value : void 0;
 }
 const DENSITY_METRICS = {
@@ -8988,9 +8989,9 @@ const EastChakraDiff = React.memo(function EastChakraDiff2({ value }) {
     () => value.bindings ?? [],
     [value.bindings]
   );
-  const interactive = !(getOpt$2(value.readonly) ?? false);
-  const onCommittedFn = getOpt$2(value.onCommitted);
-  const onDiscardedFn = getOpt$2(value.onDiscarded);
+  const interactive = !(getOpt$1(value.readonly) ?? false);
+  const onCommittedFn = getOpt$1(value.onCommitted);
+  const onDiscardedFn = getOpt$1(value.onDiscarded);
   const density = resolveDensity(value.density);
   const metrics = DENSITY_METRICS[density];
   const eyebrow = react.useSlotRecipe({ key: "eyebrowRow" });
@@ -56736,7 +56737,7 @@ function freshNodeId() {
 }
 const NODE_TYPES = { ontology: OntologyNode };
 const EDGE_TYPES = { ontology: OntologyEdge };
-function getOpt$1(opt) {
+function getOpt(opt) {
   return opt.type === "some" ? opt.value : void 0;
 }
 function nextLinkId(existing) {
@@ -57051,10 +57052,10 @@ const EastChakraOntology = React.memo(function EastChakraOntology2({ value }) {
   var _a2;
   const binding = value.binding;
   const { ontology, pending, mutate } = useBindingOntology(binding);
-  const readonly = getOpt$1(value.readonly) ?? false;
-  const hideMiniMap = getOpt$1(value.hideMiniMap) ?? false;
-  const hideSearch = getOpt$1(value.hideSearch) ?? false;
-  const defaultView2 = ((_a2 = getOpt$1(value.defaultView)) == null ? void 0 : _a2.type) ?? "graph";
+  const readonly = getOpt(value.readonly) ?? false;
+  const hideMiniMap = getOpt(value.hideMiniMap) ?? false;
+  const hideSearch = getOpt(value.hideSearch) ?? false;
+  const defaultView2 = ((_a2 = getOpt(value.defaultView)) == null ? void 0 : _a2.type) ?? "graph";
   const [view, setView] = React.useState(defaultView2);
   const [tableSelectedId, setTableSelectedId] = React.useState(null);
   const handlers = React.useMemo(() => {
@@ -57267,12 +57268,13 @@ function useBindingValue(binding) {
     if (!types) return null;
     return defaultBindRuntime.buildBindHandle(types.sourceType, sourcePath, patchPath, mode);
   }, [binding, workspace, sourcePath, patchPath, mode]);
-  const { value, pending } = React.useMemo(() => {
-    if (!handle || !handle.has()) return { value: null, pending: false };
+  const { value, pending, error: error3 } = React.useMemo(() => {
+    if (!handle || !handle.has()) return { value: null, pending: false, error: void 0 };
     try {
-      return { value: handle.read(), pending: handle.pending() };
-    } catch {
-      return { value: null, pending: false };
+      return { value: handle.read(), pending: handle.pending(), error: void 0 };
+    } catch (e3) {
+      console.error(`[Experiment] failed to read binding "${String(sourcePath)}":`, e3);
+      return { value: null, pending: false, error: e3 };
     }
   }, [handle, version2]);
   const mutate = React.useCallback((next2) => {
@@ -57285,7 +57287,7 @@ function useBindingValue(binding) {
   const discard = React.useCallback(() => {
     handle == null ? void 0 : handle.discard();
   }, [handle]);
-  return { value, mode, pending, mutate, commit, discard };
+  return { value, mode, pending, error: error3, mutate, commit, discard };
 }
 const IDLE = { call: () => {
 }, result: null, status: "idle", pending: false, error: null };
@@ -60130,7 +60132,6 @@ function OverlapHistogram({ treated, control, domain = [0, 1], supportLabel, pos
 }
 const arr = (v3) => v3 ? Array.from(v3, Number) : [];
 const arrI = (v3) => v3 ? Array.from(v3, Number) : [];
-const getOpt = (o2) => o2 && o2.type === "some" ? o2.value : void 0;
 const fmt$1 = (x2) => {
   const r2 = Number.isInteger(x2) ? String(x2) : x2.toFixed(1);
   return r2 === "-0.0" ? "0.0" : r2;
@@ -60148,7 +60149,7 @@ function band(absStd) {
 const colMeta = (meta3, col) => meta3 == null ? void 0 : meta3.get(col);
 const unitOf = (meta3, col) => {
   var _a2;
-  return getOpt((_a2 = colMeta(meta3, col)) == null ? void 0 : _a2.unit) ?? "";
+  return eastUiComponents.getSomeorUndefined((_a2 = colMeta(meta3, col)) == null ? void 0 : _a2.unit) ?? "";
 };
 const kindOf = (cols, name) => {
   var _a2;
@@ -60204,9 +60205,9 @@ function deriveSpec(config2, cols, result, meta3, dataLen) {
   const inPlay = /* @__PURE__ */ new Set([config2.treatment, config2.outcome, ...config2.common_causes]);
   const suggest = cols.find((c2) => !inPlay.has(c2.name));
   const suggestion = suggest ? `add ${suggest.name}` : "";
-  const methodV = getOpt(config2.method);
+  const methodV = eastUiComponents.getSomeorUndefined(config2.method);
   const method = (methodV == null ? void 0 : methodV.type) === "propensity_score_weighting" ? "reweighting" : "regression";
-  const targetV = getOpt(config2.estimand);
+  const targetV = eastUiComponents.getSomeorUndefined(config2.estimand);
   const target = targetV && (targetV.type === "att" || targetV.type === "atc") ? "treated" : "all";
   return {
     treatment: config2.treatment,
@@ -60226,9 +60227,9 @@ function balanceDisplay(b2, categorical) {
   return isProp ? `${Math.round(b2.treated_mean * 100)}% vs ${Math.round(b2.control_mean * 100)}%` : `${b2.treated_mean.toFixed(1)} vs ${b2.control_mean.toFixed(1)}`;
 }
 function deriveAnswer(config2, result, adj, meta3) {
-  const ci = getOpt(adj.ci);
-  const nci = getOpt(result.naive_ci);
-  const categorical = new Set(getOpt(config2.categorical) ?? []);
+  const ci = eastUiComponents.getSomeorUndefined(adj.ci);
+  const nci = eastUiComponents.getSomeorUndefined(result.naive_ci);
+  const categorical = new Set(eastUiComponents.getSomeorUndefined(config2.categorical) ?? []);
   const balance = [...result.balance].sort((a2, b2) => Math.abs(b2.std_diff) - Math.abs(a2.std_diff)).map((b2) => ({
     col: b2.column,
     treated: b2.treated_mean,
@@ -60326,43 +60327,43 @@ function zeroCrossing(xs, ys) {
 function deriveRefute(r2, adj) {
   const checks = [];
   const est = (adj == null ? void 0 : adj.effect) ?? 0;
-  const placeboEffect = getOpt(r2.placebo_effect);
-  const placeboPasses = getOpt(r2.placebo_passes);
+  const placeboEffect = eastUiComponents.getSomeorUndefined(r2.placebo_effect);
+  const placeboPasses = eastUiComponents.getSomeorUndefined(r2.placebo_passes);
   if (placeboEffect !== void 0 || placeboPasses !== void 0) {
     checks.push({
       name: "Shuffle test",
       desc: "Shuffle which rows were treated; a real effect should collapse to zero.",
       value: placeboEffect !== void 0 ? `→ ${signed(placeboEffect)}` : placeboPasses ? "passed" : "failed",
       passed: placeboPasses ?? (placeboEffect !== void 0 && Math.abs(placeboEffect) < Math.max(0.5, Math.abs(est) * 0.15)),
-      tip: { type: "some", value: "Randomly re-label which rows were treated. A genuine effect should vanish." },
+      tip: east.some("Randomly re-label which rows were treated. A genuine effect should vanish."),
       help: "check_shuffle"
     });
   }
-  const ds = getOpt(r2.data_subset_effect);
+  const ds = eastUiComponents.getSomeorUndefined(r2.data_subset_effect);
   if (ds !== void 0) {
-    const dstd = getOpt(r2.data_subset_std) ?? 0;
+    const dstd = eastUiComponents.getSomeorUndefined(r2.data_subset_std) ?? 0;
     checks.push({
       name: "Drop-some test",
       desc: "Re-estimate on random subsamples; a trustworthy effect stays put.",
       value: `${fmt$1(ds)} ± ${fmt$1(dstd)}`,
       passed: Math.abs(ds - est) < Math.max(0.5, Math.abs(est) * 0.2),
-      tip: { type: "none", value: null },
+      tip: east.none,
       help: "check_dropsome"
     });
   }
-  const rcc = getOpt(r2.random_cc_within_ci);
+  const rcc = eastUiComponents.getSomeorUndefined(r2.random_cc_within_ci);
   if (rcc !== void 0) {
     checks.push({
       name: "Decoy cause",
       desc: "Add an irrelevant random factor; the answer should not move.",
       value: rcc ? "within range" : "moved",
       passed: rcc,
-      tip: { type: "none", value: null },
+      tip: east.none,
       help: "check_decoy"
     });
   }
-  const sens = getOpt(r2.sensitivity);
-  const evalue = getOpt(r2.robustness_value);
+  const sens = eastUiComponents.getSomeorUndefined(r2.sensitivity);
+  const evalue = eastUiComponents.getSomeorUndefined(r2.robustness_value);
   if (sens !== void 0 || evalue !== void 0) {
     const strengths = sens ? arr(sens.strengths) : [];
     const effects = sens ? arr(sens.effects) : [];
@@ -60373,7 +60374,7 @@ function deriveRefute(r2, adj) {
       desc: "How strong an unrecorded common cause would need to be to overturn the result.",
       value,
       passed: tip === null,
-      tip: { type: "some", value: "Something unrecorded could drive both the treatment choice and the outcome." },
+      tip: east.some("Something unrecorded could drive both the treatment choice and the outcome."),
       help: "check_hidden"
     });
   }
@@ -60381,7 +60382,7 @@ function deriveRefute(r2, adj) {
   if (sens !== void 0) {
     const mid = arr(sens.effects);
     if (mid.length) {
-      const ci = getOpt(adj == null ? void 0 : adj.ci);
+      const ci = eastUiComponents.getSomeorUndefined(adj == null ? void 0 : adj.ci);
       const half = ci ? Math.abs(ci.upper - ci.lower) / 2 : 0;
       const lo2 = mid.map((m2) => m2 - half);
       const hi = mid.map((m2) => m2 + half);
@@ -60394,8 +60395,8 @@ function deriveRefute(r2, adj) {
 function deriveDose(dose, config2, meta3) {
   const grid = arr(dose.grid);
   const mid = arr(dose.effect);
-  const lo2 = getOpt(dose.lower) ? arr(getOpt(dose.lower)) : mid.slice();
-  const hi = getOpt(dose.upper) ? arr(getOpt(dose.upper)) : mid.slice();
+  const lo2 = eastUiComponents.getSomeorUndefined(dose.lower) ? arr(eastUiComponents.getSomeorUndefined(dose.lower)) : mid.slice();
+  const hi = eastUiComponents.getSomeorUndefined(dose.upper) ? arr(eastUiComponents.getSomeorUndefined(dose.upper)) : mid.slice();
   const sizes = arrI(dose.size);
   const featureUnit = unitOf(meta3, dose.feature);
   const here = sizes.length ? sizes.indexOf(Math.max(...sizes)) : 0;
@@ -60455,7 +60456,7 @@ const VERDICT_WORD = {
   not_estimable: "n/a"
 };
 function deriveJournalRow(row, now2) {
-  const adj = getOpt(row.adjusted);
+  const adj = eastUiComponents.getSomeorUndefined(row.adjusted);
   return {
     treatment: row.config.treatment,
     outcome: row.config.outcome,
@@ -60464,13 +60465,16 @@ function deriveJournalRow(row, now2) {
     verdict: VERDICT_WORD[row.verdict.type],
     verdictTone: VERDICT_TONE[row.verdict.type],
     who: row.committed_by,
-    when: relTime(row.committed_at, now2)
+    when: relTime(row.committed_at, now2),
+    // The originating preset id (resolved to a label by the surface); `none` for a
+    // free-form / pre-presets row.
+    preset: row.preset
   };
 }
 function deriveView(config2, ranConfig, cols, result, journal, meta3, dataLen, now2) {
-  const adj = result ? getOpt(result.adjusted) : void 0;
-  const refutation = result ? getOpt(result.refutation) : void 0;
-  const doseR = result ? getOpt(result.dose_response) : void 0;
+  const adj = result ? eastUiComponents.getSomeorUndefined(result.adjusted) : void 0;
+  const refutation = result ? eastUiComponents.getSomeorUndefined(result.refutation) : void 0;
+  const doseR = result ? eastUiComponents.getSomeorUndefined(result.dose_response) : void 0;
   return {
     // The set-up rail reflects the LIVE config (the editor); the result deck
     // reflects RANCONFIG — the config that produced `result` — so the result
@@ -60517,7 +60521,7 @@ function deriveDesign(d2, result, ranConfig, meta3) {
     const b2 = balByCol.get(col);
     const absStd = b2 ? Math.abs(b2.std_diff) : 0;
     const { tone } = band(absStd);
-    return { col, frac: clamp01(absStd), tone, display: getOpt((_a2 = colMeta(meta3, col)) == null ? void 0 : _a2.label) ?? col };
+    return { col, frac: clamp01(absStd), tone, display: eastUiComponents.getSomeorUndefined((_a2 = colMeta(meta3, col)) == null ? void 0 : _a2.label) ?? col };
   });
   const ns = arrI(d2.power_curve.n);
   const powers = arr(d2.power_curve.power);
@@ -60536,7 +60540,7 @@ function deriveDesign(d2, result, ranConfig, meta3) {
   const xTicks = len ? [String(ns[0]), String(ns[Math.floor((len - 1) / 2)]), String(ns[len - 1])] : [];
   const marks = [];
   if (len) marks.push({ at: nearest(primary.nTotal), label: `target ${(d2.target_power * 100).toFixed(0)}%`, tone: "pos", help: "validate_power" });
-  const cp = getOpt(d2.current_power);
+  const cp = eastUiComponents.getSomeorUndefined(d2.current_power);
   if (cp !== void 0 && len) {
     const curN = result ? Number(result.n_total) : 0;
     if (curN > 0) {
@@ -60738,8 +60742,20 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
   const configBind = useBindingValue(v3.config);
   const journalBind = useBindingValue(v3.journal.type === "some" ? v3.journal.value : null);
   const populationBind = useBindingValue(v3.population.type === "some" ? v3.population.value : null);
-  const meta3 = getOpt(v3.columnMeta);
-  const readonly = getOpt(v3.readonly) ?? false;
+  const meta3 = eastUiComponents.getSomeorUndefined(v3.columnMeta);
+  const readonly = eastUiComponents.getSomeorUndefined(v3.readonly) ?? false;
+  const presets = React.useMemo(() => eastUiComponents.getSomeorUndefined(v3.presets) ?? [], [v3.presets]);
+  const [currentPreset, setCurrentPreset] = React.useState(void 0);
+  const presetGroups = React.useMemo(() => {
+    const buckets = /* @__PURE__ */ new Map();
+    for (const p2 of presets) {
+      const label = eastUiComponents.getSomeorUndefined(p2.group) ?? "Saved questions";
+      const bucket = buckets.get(label);
+      if (bucket) bucket.push(p2);
+      else buckets.set(label, [p2]);
+    }
+    return [...buckets].map(([label, items]) => ({ label, items }));
+  }, [presets]);
   const { columns, rowArrayType } = useColumns(workspace, v3.data.source);
   const config2 = configBind.value;
   const [localPop, setLocalPop] = React.useState([]);
@@ -60753,7 +60769,7 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
       var _a3;
       return {
         fieldId: c2.name,
-        label: getOpt((_a3 = meta3 == null ? void 0 : meta3.get(c2.name)) == null ? void 0 : _a3.label) ?? c2.name,
+        label: eastUiComponents.getSomeorUndefined((_a3 = meta3 == null ? void 0 : meta3.get(c2.name)) == null ? void 0 : _a3.label) ?? c2.name,
         kind: c2.kind
       };
     }),
@@ -60791,17 +60807,24 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
     if (experiment.result !== null) setRanConfig(pendingConfigRef.current);
   }, [experiment.result]);
   const [stale, setStale] = React.useState(false);
-  const editConfig = React.useCallback((next2) => {
+  const editConfig = React.useCallback((next2, fromPreset) => {
     if (readonly) return;
     setStale(true);
+    setCurrentPreset(fromPreset);
     queueMicrotask(() => configBind.mutate(next2));
   }, [readonly, configBind]);
-  const editPopulation = React.useCallback((next2) => {
+  const editPopulation = React.useCallback((next2, fromPreset) => {
     if (readonly) return;
     setStale(true);
+    setCurrentPreset(fromPreset);
     if (v3.population.type === "some") queueMicrotask(() => populationBind.mutate(next2));
     else setLocalPop(next2);
   }, [readonly, v3.population.type, populationBind]);
+  const selectPreset = React.useCallback((p2) => {
+    if (readonly) return;
+    editConfig(p2.config, p2.id);
+    editPopulation(eastUiComponents.getSomeorUndefined(p2.population) ?? [], p2.id);
+  }, [readonly, editConfig, editPopulation]);
   const onRun = React.useCallback(() => {
     runAll();
     setStale(false);
@@ -60815,7 +60838,9 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
       naive: r2.naive,
       adjusted: r2.adjusted.type === "some" ? east.some(r2.adjusted.value.effect) : east.none,
       committed_at: /* @__PURE__ */ new Date(),
-      committed_by: "you"
+      committed_by: "you",
+      // Record which preset framed this experiment (none for a free-form run).
+      preset: currentPreset !== void 0 ? east.some(currentPreset) : east.none
     };
     journalBind.mutate([row, ...journalBind.value ?? []]);
     try {
@@ -60825,8 +60850,8 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
       setStale(false);
     } catch {
     }
-  }, [config2, experiment.result, journalBind, configBind, populationBind, v3.population.type]);
-  const [tab, setTab] = React.useState(((_a2 = getOpt(v3.defaultTab)) == null ? void 0 : _a2.type) ?? "answer");
+  }, [config2, experiment.result, journalBind, configBind, populationBind, v3.population.type, currentPreset]);
+  const [tab, setTab] = React.useState(((_a2 = eastUiComponents.getSomeorUndefined(v3.defaultTab)) == null ? void 0 : _a2.type) ?? "answer");
   const [guidance, setGuidance] = React.useState(true);
   const now2 = React.useMemo(() => /* @__PURE__ */ new Date(), []);
   const nRows = (filteredRows == null ? void 0 : filteredRows.length) ?? 0;
@@ -60834,7 +60859,7 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
     const rc = ranConfig ?? config2;
     const labelOf = (col) => {
       var _a3;
-      return col ? getOpt((_a3 = meta3 == null ? void 0 : meta3.get(col)) == null ? void 0 : _a3.label) ?? col : "";
+      return col ? eastUiComponents.getSomeorUndefined((_a3 = meta3 == null ? void 0 : meta3.get(col)) == null ? void 0 : _a3.label) ?? col : "";
     };
     return { treatment: labelOf(rc == null ? void 0 : rc.treatment), outcome: labelOf(rc == null ? void 0 : rc.outcome), subject: SUBJECT_ONE, subjects: SUBJECT_MANY };
   }, [ranConfig, config2, meta3]);
@@ -60864,10 +60889,18 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
   const designFresh = design.result !== null && ((_b2 = designSnapRef.current) == null ? void 0 : _b2.result) === experiment.result && !design.pending;
   if (!config2 || !view) {
     const failed2 = experiment.status === "failed";
-    return /* @__PURE__ */ jsxRuntime.jsx(react.Box, { layerStyle: "frame", p: "6", children: failed2 && experiment.error ? /* @__PURE__ */ jsxRuntime.jsx(RunError, { error: experiment.error }) : /* @__PURE__ */ jsxRuntime.jsx(react.Text, { className: failed2 ? void 0 : "elara-skeleton", textStyle: "body.sm", color: "fg.muted", children: failed2 ? "Could not run the experiment." : "Loading experiment…" }) });
+    const which = data4.error ? "dataset" : configBind.error ? "config" : journalBind.error ? "journal" : populationBind.error ? "population filter" : null;
+    const bindError = data4.error ?? configBind.error ?? journalBind.error ?? populationBind.error;
+    const bindMsg = bindError instanceof Error ? bindError.message : bindError != null ? String(bindError) : null;
+    return /* @__PURE__ */ jsxRuntime.jsx(react.Box, { layerStyle: "frame", p: "6", children: bindMsg ? /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { textStyle: "body.sm", color: "fg.danger", children: [
+      "Couldn’t load the experiment ",
+      which,
+      ": ",
+      bindMsg
+    ] }) : failed2 && experiment.error ? /* @__PURE__ */ jsxRuntime.jsx(RunError, { error: experiment.error }) : /* @__PURE__ */ jsxRuntime.jsx(react.Text, { className: failed2 ? void 0 : "elara-skeleton", textStyle: "body.sm", color: "fg.muted", children: failed2 ? "Could not run the experiment." : "Loading experiment…" }) });
   }
   const { spec: vs, answer: a2, refusal: ref, overlap: ov, refute: vr, dose: vd, journal, verdict } = view;
-  const higherBetter = getOpt((_c2 = meta3 == null ? void 0 : meta3.get(vs.outcome)) == null ? void 0 : _c2.higherIsBetter);
+  const higherBetter = eastUiComponents.getSomeorUndefined((_c2 = meta3 == null ? void 0 : meta3.get(vs.outcome)) == null ? void 0 : _c2.higherIsBetter);
   const dataStatus = statusR({ status: "success", size: "sm" });
   const barList = (rows) => /* @__PURE__ */ jsxRuntime.jsx(react.Box, { css: bs.root, children: rows.map((r2, i) => /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { css: bs.row, children: [
     /* @__PURE__ */ jsxRuntime.jsx(react.Text, { css: bs.label, textStyle: "mono.sm", color: "fg.default", truncate: true, children: r2.label }),
@@ -60885,7 +60918,25 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
   const tabKeys = [...["answer", "trust", "dose"], ...hasDesign ? ["validate"] : []];
   return /* @__PURE__ */ jsxRuntime.jsx(GuidanceProvider, { on: guidance, vars: helpVars, children: /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { layerStyle: "frame", overflow: "visible", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { layerStyle: "header.bar", display: "flex", alignItems: "center", gap: "3.5", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(react.Text, { textStyle: "title.card", color: "fg.muted", children: /* @__PURE__ */ jsxRuntime.jsxs(Help, { id: "header", children: [
+      presets.length > 0 && !readonly ? /* @__PURE__ */ jsxRuntime.jsxs(react.Menu.Root, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(react.Menu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { as: "button", bg: "transparent", border: "0", p: "0", cursor: "pointer", display: "inline-flex", alignItems: "center", gap: "2", textAlign: "start", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { textStyle: "title.card", color: "fg.muted", children: [
+            "Does ",
+            /* @__PURE__ */ jsxRuntime.jsx(react.Text, { as: "span", color: "brand.solid", fontWeight: "bold", children: vs.treatment }),
+            " change ",
+            /* @__PURE__ */ jsxRuntime.jsx(react.Text, { as: "span", color: "brand.solid", fontWeight: "bold", children: vs.outcome }),
+            "?"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(react.Box, { as: "span", color: "fg.subtle", fontSize: "11px", lineHeight: "1", children: /* @__PURE__ */ jsxRuntime.jsx(FontAwesomeIcon, { icon: faChevronDown }) })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(react.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(react.Menu.Positioner, { children: /* @__PURE__ */ jsxRuntime.jsx(react.Menu.Content, { minW: "280px", children: presetGroups.map((g2) => /* @__PURE__ */ jsxRuntime.jsxs(react.Menu.ItemGroup, { children: [
+          g2.label !== "Saved questions" && /* @__PURE__ */ jsxRuntime.jsx(react.Menu.ItemGroupLabel, { textStyle: "caption.eyebrow", fontSize: "9px", children: g2.label }),
+          g2.items.map((p2) => /* @__PURE__ */ jsxRuntime.jsxs(react.Menu.Item, { value: p2.id, onClick: () => selectPreset(p2), gap: "2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(react.Box, { as: "span", width: "14px", flexShrink: "0", color: "brand.fg", children: p2.id === currentPreset && /* @__PURE__ */ jsxRuntime.jsx(FontAwesomeIcon, { icon: faCheck, style: { fontSize: "10px" } }) }),
+            p2.label
+          ] }, p2.id))
+        ] }, g2.label)) }) }) })
+      ] }) : /* @__PURE__ */ jsxRuntime.jsx(react.Text, { textStyle: "title.card", color: "fg.muted", children: /* @__PURE__ */ jsxRuntime.jsxs(Help, { id: "header", children: [
         "Does ",
         /* @__PURE__ */ jsxRuntime.jsx(react.Text, { as: "span", color: "brand.solid", fontWeight: "bold", children: vs.treatment }),
         " change ",
@@ -61133,7 +61184,20 @@ const EastChakraExperiment = React.memo(function EastChakraExperiment2({ value }
           /* @__PURE__ */ jsxRuntime.jsxs(react.Text, { as: "span", color: "fg.muted", children: [
             "· vs ",
             r2.confounders
-          ] })
+          ] }),
+          (() => {
+            var _a3;
+            const id3 = eastUiComponents.getSomeorUndefined(r2.preset);
+            if (id3 === void 0) return null;
+            const label = ((_a3 = presets.find((p2) => p2.id === id3)) == null ? void 0 : _a3.label) ?? id3;
+            return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+              " ",
+              /* @__PURE__ */ jsxRuntime.jsxs(react.Box, { as: "span", css: chip({ tone: "brand", size: "sm" }), children: [
+                "from ",
+                label
+              ] })
+            ] });
+          })()
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(react.Text, { textStyle: "mono.sm", fontWeight: "semibold", textAlign: "right", fontVariantNumeric: "tabular-nums", color: r2.verdictTone === "pos" ? "fg.success" : "fg.default", children: r2.effect }),
         /* @__PURE__ */ jsxRuntime.jsx(react.Text, { textStyle: "caption.eyebrow", textAlign: "right", color: toneToken(r2.verdictTone), children: r2.verdict }),