@malloydata/malloy-explorer 0.0.257-dev250410160631 → 0.0.257-dev250412010850

package/dist/cjs/index.cjs

@@ -3611,6 +3611,15 @@ const tooltipStyles = {
   }
 };
 const fontStyles = {
+  largeBody: {
+    fontFamily: "x1rj5sg5",
+    color: "x1dhlylr",
+    fontWeight: "xo1l8bm",
+    fontSize: "x1j61zf2",
+    lineHeight: "x1fc57z9",
+    letterSpacing: "x12oo3zp",
+    $$css: true
+  },
   emphasized: {
     fontFamily: "x1rj5sg5",
     color: "x1dhlylr",
@@ -8160,16 +8169,17 @@ const styles$o = {
 function CollapsibleListItem({
   label,
   sublabel,
-  children
+  children,
+  isInitiallyExpanded = false
 }) {
-  const [isExpanded, setIsExpanded] = React__namespace.useState(false);
+  const [isExpanded, setIsExpanded] = React__namespace.useState(isInitiallyExpanded);
   const handleToggle = () => {
     setIsExpanded((prev) => !prev);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
       ...{
-        className: "x78zum5 x6s0dn4 xl56j7k xe8ttls x167g77z xur7f20 x1ypdohk x1haqvef"
+        className: "xrvj5dj x1mt1orb x6s0dn4 xlqzeqv xe8ttls x167g77z xur7f20 x1ypdohk x1haqvef"
       },
       onClick: handleToggle,
       children: [isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(Icon, {
@@ -8180,7 +8190,7 @@ function CollapsibleListItem({
         color: "secondary"
       }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
         ...{
-          className: "x78zum5 xdt5ytf x1iyjqo2"
+          className: "x78zum5 xdt5ytf x1iyjqo2 xb3r6kr"
         },
         children: [/* @__PURE__ */ jsxRuntime.jsx("span", {
           ..._stylex.props(fontStyles.body, styles$n.label),
@@ -8202,11 +8212,19 @@ const styles$n = {
   label: {
     flexGrow: "x1iyjqo2",
     fontWeight: "x1xlr1w8",
+    overflow: "xb3r6kr",
+    overflowX: null,
+    overflowY: null,
+    textOverflow: "xlyipyv",
     $$css: true
   },
   sublabel: {
     flexGrow: "x1iyjqo2",
     color: "x12ohj93",
+    overflow: "xb3r6kr",
+    overflowX: null,
+    overflowY: null,
+    textOverflow: "xlyipyv",
     $$css: true
   }
 };
@@ -25898,6 +25916,46 @@ function ClearButton({
     onClick
   });
 }
+function sortFieldInfoOrder(field) {
+  if (field.kind === "join") {
+    return 3;
+  } else if (field.kind === "view") {
+    return 2;
+  } else if (field.kind === "dimension") {
+    return 1;
+  } else {
+    return 0;
+  }
+}
+function sortFieldInfos(fields) {
+  return fields.sort((a, b2) => {
+    const orderA = sortFieldInfoOrder(a);
+    const orderB = sortFieldInfoOrder(b2);
+    return orderA === orderB ? a.name.localeCompare(b2.name) : orderB - orderA;
+  });
+}
+const INDEX_FIELDS = ["fieldName", "fieldPath", "fieldValue", "fieldType", "fieldRange", "weight"];
+function isIndexView(field) {
+  const allFields = /* @__PURE__ */ new Set([...INDEX_FIELDS, ...field.schema.fields.map((field2) => field2.name)]);
+  return allFields.size === INDEX_FIELDS.length;
+}
+function getViewDefinition(parent) {
+  return parent instanceof QB.ASTArrowQueryDefinition ? parent.view : parent.definition;
+}
+function getInputSchemaFromViewParent(parent) {
+  const definition = getViewDefinition(parent);
+  return definition.getInputSchema();
+}
+function viewParentHasField(parent, field, path) {
+  const definition = getViewDefinition(parent);
+  if (definition instanceof QB.ASTSegmentViewDefinition) {
+    return definition.hasField(field.name, path);
+  }
+  return false;
+}
+function viewParentDoesNotHaveField(parent, field, path) {
+  return !viewParentHasField(parent, field, path);
+}
 function segmentHasLimit(segment) {
   return segment.operations.items.find((operation) => operation instanceof QB.ASTLimitViewOperation) !== void 0;
 }
@@ -25923,11 +25981,21 @@ function segmentNestNo(segment, name) {
 function addGroupBy(rootQuery, segment, field, path, setQuery) {
   segment.addGroupBy(field.name, path);
   if (!segmentHasLimit(segment)) {
-    segment.setLimit(10);
+    segment.setLimit(1e3);
   }
-  segment.addOrderBy(field.name);
   setQuery == null ? void 0 : setQuery(rootQuery.build());
 }
+function getSegmentIfPresent(parent) {
+  const definition = getViewDefinition(parent);
+  if (definition instanceof QB.ASTSegmentViewDefinition) {
+    return definition;
+  } else if (definition instanceof QB.ASTRefinementViewDefinition) {
+    if (definition.refinement instanceof QB.ASTSegmentViewDefinition) {
+      return definition.refinement;
+    }
+  }
+  return void 0;
+}
 const addMenuStyles = {
   content: {
     background: "x82tljd",
@@ -26018,29 +26086,6 @@ const addMenuStyles = {
     $$css: true
   }
 };
-function sortFieldInfoOrder(field) {
-  if (field.kind === "join") {
-    return 3;
-  } else if (field.kind === "view") {
-    return 2;
-  } else if (field.kind === "dimension") {
-    return 1;
-  } else {
-    return 0;
-  }
-}
-function sortFieldInfos(fields) {
-  return fields.sort((a, b2) => {
-    const orderA = sortFieldInfoOrder(a);
-    const orderB = sortFieldInfoOrder(b2);
-    return orderA === orderB ? a.name.localeCompare(b2.name) : orderB - orderA;
-  });
-}
-const INDEX_FIELDS = ["fieldName", "fieldPath", "fieldValue", "fieldType", "fieldRange", "weight"];
-function isIndexView(field) {
-  const allFields = /* @__PURE__ */ new Set([...INDEX_FIELDS, ...field.schema.fields.map((field2) => field2.name)]);
-  return allFields.size === INDEX_FIELDS.length;
-}
 function atomicTypeToIcon(type) {
   return atomicTypeMap[type];
 }
@@ -26482,7 +26527,7 @@ const styles$d = {
   }
 };
 function FieldList({
-  segment,
+  view,
   fields,
   onClick,
   search,
@@ -26492,7 +26537,7 @@ function FieldList({
   const groups = React.useMemo(() => {
     const groups2 = [];
     const buildGroups = (types22, path, name, fields2) => {
-      const filteredFields = sortFieldInfos(fields2).filter((field) => field.kind !== "join").filter((field) => field.name.includes(search) && types22.includes(field.kind)).filter((field) => filter ? filter(segment, field, path) : true);
+      const filteredFields = sortFieldInfos(fields2).filter((field) => field.kind !== "join").filter((field) => field.name.includes(search) && types22.includes(field.kind)).filter((field) => filter ? filter(view, field, path) : true);
       const joins = fields2.filter((field) => field.kind === "join");
       if (filteredFields.length) {
         groups2.push({
@@ -26513,7 +26558,7 @@ function FieldList({
     };
     buildGroups(types2, [], "Source", fields);
     return groups2;
-  }, [fields, filter, search, segment, types2]);
+  }, [fields, filter, search, view, types2]);
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
     children: groups.length ? groups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
       children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -26536,7 +26581,8 @@ function FieldList({
           tooltipProps: {
             side: "right",
             align: "start",
-            sideOffset: 4
+            sideOffset: 4,
+            alignOffset: 24
           }
         })
       }, group.name + ":" + field.name))]
@@ -26556,7 +26602,7 @@ const styles$c = {
   }
 };
 function FieldMenu({
-  segment,
+  view,
   fields,
   types: types2,
   filter,
@@ -26581,7 +26627,7 @@ function FieldMenu({
         flex: 1
       },
       children: /* @__PURE__ */ jsxRuntime.jsx(FieldList, {
-        segment,
+        view,
         fields,
         search,
         types: types2,
@@ -26593,7 +26639,7 @@ function FieldMenu({
 }
 function OperationActionTitle({
   actionTitle,
-  segment,
+  view,
   fields,
   title,
   types: types2,
@@ -26620,10 +26666,10 @@ function OperationActionTitle({
             align: "start",
             alignOffset: -16,
             children: /* @__PURE__ */ jsxRuntime.jsx(FieldMenu, {
-              segment,
+              view,
               fields,
               types: types2,
-              filter: (segment2, field, path) => !segment2.hasField(field.name, path),
+              filter: viewParentDoesNotHaveField,
               onClick
             })
           })
@@ -26657,7 +26703,7 @@ function FieldHover({
 }
 function GroupByOperations({
   rootQuery,
-  segment,
+  view,
   groupBys
 }) {
   const {
@@ -26668,16 +26714,17 @@ function GroupByOperations({
   }
   const {
     fields
-  } = segment.getInputSchema();
+  } = getInputSchemaFromViewParent(view);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [/* @__PURE__ */ jsxRuntime.jsx(OperationActionTitle, {
       title: "group by",
       actionTitle: "Add group by",
       rootQuery,
-      segment,
+      view,
       fields,
       types: ["dimension"],
       onClick: (field, path) => {
+        const segment = view.getOrAddDefaultSegment();
         addGroupBy(rootQuery, segment, field, path, setQuery);
       }
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -27854,6 +27901,28 @@ function dateTimeFilterChangeType(filter, type) {
       return filter;
   }
 }
+class ErrorElement extends React__namespace.Component {
+  constructor(props2) {
+    super(props2);
+    this.state = {
+      hasError: false
+    };
+  }
+  static getDerivedStateFromError(_error) {
+    return {
+      hasError: true
+    };
+  }
+  componentDidCatch(error, info) {
+    console.error(error, info);
+  }
+  render() {
+    if (this.state.hasError) {
+      return this.props.fallback;
+    }
+    return this.props.children;
+  }
+}
 function WhereOperations({
   rootQuery,
   wheres
@@ -27871,117 +27940,139 @@ function WhereOperations({
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
       ..._stylex.props(styles$h.tokenContainer),
       children: wheres.map((where, key2) => {
-        const {
-          fieldReference,
-          filterString
-        } = where.filter;
-        const fieldInfo = fieldReference.getFieldInfo();
-        if (fieldInfo.kind !== "dimension" && fieldInfo.kind !== "measure") {
-          return null;
-        }
-        const icon = atomicTypeToIcon(fieldInfo.type.kind);
-        const color = fieldKindToColor(fieldInfo.kind);
-        const filter = where.filter.getFilter();
-        let rhsToken = null;
-        if (filter.kind === "string") {
-          rhsToken = /* @__PURE__ */ jsxRuntime.jsx(StringFilterToken, {
-            fieldInfo,
-            path: where.filter.fieldReference.path ?? [],
-            filter: filter.parsed,
-            setFilter: (filter2) => {
-              where.filter.setFilter({
-                kind: "string",
-                parsed: filter2
-              });
-              setQuery == null ? void 0 : setQuery(rootQuery.build());
-            }
-          }, key2);
-        }
-        if (filter.kind === "boolean" && filter.parsed) {
-          rhsToken = /* @__PURE__ */ jsxRuntime.jsx(BooleanFilterToken, {
-            fieldInfo,
-            filter: filter.parsed,
-            setFilter: (filter2) => {
-              where.filter.setFilter({
-                kind: "boolean",
-                parsed: filter2
-              });
-              setQuery == null ? void 0 : setQuery(rootQuery.build());
-            }
-          }, key2);
-        }
-        if (filter.kind === "number" && filter.parsed) {
-          rhsToken = /* @__PURE__ */ jsxRuntime.jsx(NumberFilterToken, {
-            fieldInfo,
-            filter: filter.parsed,
-            setFilter: (filter2) => {
-              where.filter.setFilter({
-                kind: "number",
-                parsed: filter2
-              });
-              setQuery == null ? void 0 : setQuery(rootQuery.build());
-            }
-          }, key2);
-        }
-        if (filter.kind === "date" && filter.parsed) {
-          rhsToken = /* @__PURE__ */ jsxRuntime.jsx(DateTimeFilterToken, {
-            fieldInfo,
-            filter: filter.parsed,
-            setFilter: (filter2) => {
-              where.filter.setFilter({
-                kind: "date",
-                parsed: filter2
-              });
-              setQuery == null ? void 0 : setQuery(rootQuery.build());
-            }
-          }, key2);
-        }
-        if (filter.kind === "timestamp" && filter.parsed) {
-          rhsToken = /* @__PURE__ */ jsxRuntime.jsx(DateTimeFilterToken, {
-            fieldInfo,
-            filter: filter.parsed,
-            setFilter: (filter2) => {
-              where.filter.setFilter({
-                kind: "timestamp",
-                parsed: filter2
-              });
-              setQuery == null ? void 0 : setQuery(rootQuery.build());
-            }
-          }, key2);
-        }
-        const {
-          op,
-          value
-        } = parsedToLabels(filter, filterString);
-        if (!rhsToken) {
-          rhsToken = /* @__PURE__ */ jsxRuntime.jsxs(TokenGroup, {
-            color,
-            children: [/* @__PURE__ */ jsxRuntime.jsx(Token, {
-              icon,
-              label: fieldInfo.name
-            }), /* @__PURE__ */ jsxRuntime.jsx(Token, {
-              label: op
-            }), /* @__PURE__ */ jsxRuntime.jsx(Token, {
-              label: value
-            })]
-          });
-        }
-        return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-          ..._stylex.props(hoverStyles.main),
-          children: [rhsToken, /* @__PURE__ */ jsxRuntime.jsx("div", {
-            ..._stylex.props(hoverStyles.hoverActions),
-            children: /* @__PURE__ */ jsxRuntime.jsx(ClearButton, {
+        return /* @__PURE__ */ jsxRuntime.jsx(ErrorElement, {
+          fallback: /* @__PURE__ */ jsxRuntime.jsxs("div", {
+            children: ["Invalid filter", /* @__PURE__ */ jsxRuntime.jsx(ClearButton, {
               onClick: () => {
                 where.delete();
                 setQuery == null ? void 0 : setQuery(rootQuery.build());
               }
-            })
-          })]
+            })]
+          }),
+          children: /* @__PURE__ */ jsxRuntime.jsx(SingleWhereOperation, {
+            where,
+            rootQuery
+          })
         }, key2);
       })
     })]
   });
 }
+function SingleWhereOperation({
+  rootQuery,
+  where
+}) {
+  const {
+    fieldReference,
+    filterString
+  } = where.filter;
+  const fieldInfo = fieldReference.getFieldInfo();
+  const {
+    setQuery
+  } = React.useContext(QueryEditorContext);
+  if (fieldInfo.kind !== "dimension" && fieldInfo.kind !== "measure") {
+    return null;
+  }
+  const icon = atomicTypeToIcon(fieldInfo.type.kind);
+  const color = fieldKindToColor(fieldInfo.kind);
+  const filter = where.filter.getFilter();
+  let rhsToken = null;
+  if (filter.kind === "string") {
+    rhsToken = /* @__PURE__ */ jsxRuntime.jsx(StringFilterToken, {
+      fieldInfo,
+      path: where.filter.fieldReference.path ?? [],
+      filter: filter.parsed,
+      setFilter: (filter2) => {
+        where.filter.setFilter({
+          kind: "string",
+          parsed: filter2
+        });
+        setQuery == null ? void 0 : setQuery(rootQuery.build());
+      }
+    });
+  }
+  if (filter.kind === "boolean" && filter.parsed) {
+    rhsToken = /* @__PURE__ */ jsxRuntime.jsx(BooleanFilterToken, {
+      fieldInfo,
+      filter: filter.parsed,
+      setFilter: (filter2) => {
+        where.filter.setFilter({
+          kind: "boolean",
+          parsed: filter2
+        });
+        setQuery == null ? void 0 : setQuery(rootQuery.build());
+      }
+    });
+  }
+  if (filter.kind === "number" && filter.parsed) {
+    rhsToken = /* @__PURE__ */ jsxRuntime.jsx(NumberFilterToken, {
+      fieldInfo,
+      filter: filter.parsed,
+      setFilter: (filter2) => {
+        where.filter.setFilter({
+          kind: "number",
+          parsed: filter2
+        });
+        setQuery == null ? void 0 : setQuery(rootQuery.build());
+      }
+    });
+  }
+  if (filter.kind === "date" && filter.parsed) {
+    rhsToken = /* @__PURE__ */ jsxRuntime.jsx(DateTimeFilterToken, {
+      fieldInfo,
+      filter: filter.parsed,
+      setFilter: (filter2) => {
+        where.filter.setFilter({
+          kind: "date",
+          parsed: filter2
+        });
+        setQuery == null ? void 0 : setQuery(rootQuery.build());
+      }
+    });
+  }
+  if (filter.kind === "timestamp" && filter.parsed) {
+    rhsToken = /* @__PURE__ */ jsxRuntime.jsx(DateTimeFilterToken, {
+      fieldInfo,
+      filter: filter.parsed,
+      setFilter: (filter2) => {
+        where.filter.setFilter({
+          kind: "timestamp",
+          parsed: filter2
+        });
+        setQuery == null ? void 0 : setQuery(rootQuery.build());
+      }
+    });
+  }
+  const {
+    op,
+    value
+  } = parsedToLabels(filter, filterString);
+  if (!rhsToken) {
+    rhsToken = /* @__PURE__ */ jsxRuntime.jsxs(TokenGroup, {
+      color,
+      children: [/* @__PURE__ */ jsxRuntime.jsx(Token, {
+        icon,
+        label: fieldInfo.name
+      }), /* @__PURE__ */ jsxRuntime.jsx(Token, {
+        label: op
+      }), /* @__PURE__ */ jsxRuntime.jsx(Token, {
+        label: value
+      })]
+    });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    ..._stylex.props(hoverStyles.main),
+    children: [rhsToken, /* @__PURE__ */ jsxRuntime.jsx("div", {
+      ..._stylex.props(hoverStyles.hoverActions),
+      children: /* @__PURE__ */ jsxRuntime.jsx(ClearButton, {
+        onClick: () => {
+          where.delete();
+          setQuery == null ? void 0 : setQuery(rootQuery.build());
+        }
+      })
+    })]
+  });
+}
 const parsedToLabels = (parsed, filterString) => {
   if (parsed.parsed === null) {
     return {
@@ -28188,7 +28279,7 @@ function LimitOperation({
 }
 function AggregateOperations({
   rootQuery,
-  segment,
+  view,
   aggregates
 }) {
   const {
@@ -28199,16 +28290,17 @@ function AggregateOperations({
   }
   const {
     fields
-  } = segment.getInputSchema();
+  } = getInputSchemaFromViewParent(view);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [/* @__PURE__ */ jsxRuntime.jsx(OperationActionTitle, {
       title: "aggregate",
       actionTitle: "Add aggregate",
       rootQuery,
-      segment,
+      view,
       fields,
       types: ["measure"],
       onClick: (field, path) => {
+        const segment = view.getOrAddDefaultSegment();
         segment.addAggregate(field.name, path);
         setQuery == null ? void 0 : setQuery(rootQuery.build());
       }
@@ -28319,6 +28411,7 @@ function View({
       view
     }), /* @__PURE__ */ jsxRuntime.jsx(ViewDefinition, {
       rootQuery,
+      view,
       viewDef: view.definition
     })]
   });
@@ -28423,12 +28516,13 @@ function AddItem({
 }
 function AddLimit({
   rootQuery,
-  segment
+  view
 }) {
   const {
     setQuery
   } = React.useContext(QueryEditorContext);
-  const hasLimit = React.useMemo(() => segmentHasLimit(segment), [segment]);
+  const segment = getSegmentIfPresent(view);
+  const hasLimit = segment ? segmentHasLimit(segment) : false;
   return /* @__PURE__ */ jsxRuntime.jsx(AddItem, {
     icon: /* @__PURE__ */ jsxRuntime.jsx(Icon, {
       name: "limit"
@@ -28436,32 +28530,34 @@ function AddLimit({
     label: "Limit",
     disable: () => hasLimit,
     onClick: () => {
-      segment.setLimit(10);
+      const segment2 = view.getOrAddDefaultSegment();
+      segment2.setLimit(10);
       setQuery == null ? void 0 : setQuery(rootQuery.build());
     }
   });
 }
 function AddEmptyNest({
   rootQuery,
-  segment
+  view
 }) {
   const {
     setQuery
   } = React.useContext(QueryEditorContext);
-  const nestNo = segmentNestNo(segment, `Nest`);
   return /* @__PURE__ */ jsxRuntime.jsx(AddItem, {
     icon: /* @__PURE__ */ jsxRuntime.jsx(Icon, {
       name: "nest"
     }),
     label: "Add blank nested query",
     onClick: () => {
+      const segment = view.getOrAddDefaultSegment();
+      const nestNo = segmentNestNo(segment, `Nest`);
       segment.addEmptyNest(nestNo > 1 ? `Nest ${nestNo}` : `Nest`);
       setQuery == null ? void 0 : setQuery(rootQuery.build());
     }
   });
 }
 function AddFieldItem({
-  segment,
+  view,
   fields,
   icon,
   label,
@@ -28523,7 +28619,7 @@ function AddFieldItem({
         }), /* @__PURE__ */ jsxRuntime.jsx(FieldMenu, {
           types: types2,
           filter,
-          segment,
+          view,
           fields,
           onClick
         })]
@@ -28533,21 +28629,23 @@ function AddFieldItem({
 }
 function AddOrderBy({
   rootQuery,
-  segment
+  view
 }) {
   const {
     setQuery
   } = React.useContext(QueryEditorContext);
-  const outputSchemaFields = segment.getOutputSchema().fields;
-  const fields = React.useMemo(() => outputSchemaFields.filter((field) => field.kind === "dimension").filter((field) => ORDERABLE_TYPES$1.includes(field.type.kind)).filter((field) => !segmentHasOrderBy(segment, field.name)), [outputSchemaFields, segment]);
+  const outputSchemaFields = view.getOutputSchema().fields;
+  const segment = getSegmentIfPresent(view);
+  const fields = React.useMemo(() => outputSchemaFields.filter((field) => field.kind === "dimension").filter((field) => ORDERABLE_TYPES$1.includes(field.type.kind)).filter((field) => segment ? !segmentHasOrderBy(segment, field.name) : true), [outputSchemaFields, segment]);
   return /* @__PURE__ */ jsxRuntime.jsx(AddFieldItem, {
     label: "Add order by",
     icon: "orderBy",
-    segment,
+    view,
     fields,
     types: ["dimension"],
     onClick: (field) => {
-      segment.addOrderBy(field.name, "asc");
+      const segment2 = view.getOrAddDefaultSegment();
+      segment2.addOrderBy(field.name, "asc");
       setQuery == null ? void 0 : setQuery(rootQuery.build());
     },
     disabledMessage: "There must be at least one field in the output to order by."
@@ -28556,44 +28654,46 @@ function AddOrderBy({
 const ORDERABLE_TYPES$1 = ["string_type", "number_type", "boolean_type", "date_type", "timestamp_type"];
 function AddGroupBy({
   rootQuery,
-  segment
+  view
 }) {
   const {
     setQuery
   } = React.useContext(QueryEditorContext);
   const {
     fields
-  } = segment.getInputSchema();
+  } = getInputSchemaFromViewParent(view);
   return /* @__PURE__ */ jsxRuntime.jsx(AddFieldItem, {
     label: "Add group by",
     icon: "groupBy",
-    segment,
+    view,
     fields,
     types: ["dimension"],
-    filter: (segment2, field, path) => !segment2.hasField(field.name, path),
+    filter: viewParentDoesNotHaveField,
     onClick: (field, path) => {
+      const segment = view.getOrAddDefaultSegment();
       addGroupBy(rootQuery, segment, field, path, setQuery);
     }
   });
 }
 function AddAggregate({
   rootQuery,
-  segment
+  view
 }) {
   const {
     setQuery
   } = React.useContext(QueryEditorContext);
   const {
     fields
-  } = segment.getInputSchema();
+  } = getInputSchemaFromViewParent(view);
   return /* @__PURE__ */ jsxRuntime.jsx(AddFieldItem, {
     label: "Add aggregate",
     icon: "aggregate",
-    segment,
+    view,
     fields,
     types: ["measure"],
-    filter: (segment2, field, path) => !segment2.hasField(field.name, path),
+    filter: viewParentDoesNotHaveField,
     onClick: (field, path) => {
+      const segment = view.getOrAddDefaultSegment();
       segment.addAggregate(field.name, path);
       setQuery == null ? void 0 : setQuery(rootQuery.build());
     }
@@ -28601,22 +28701,23 @@ function AddAggregate({
 }
 function AddWhere({
   rootQuery,
-  segment
+  view
 }) {
   const {
     setQuery
   } = React.useContext(QueryEditorContext);
   const {
     fields
-  } = segment.getInputSchema();
+  } = getInputSchemaFromViewParent(view);
   return /* @__PURE__ */ jsxRuntime.jsx(AddFieldItem, {
     label: "Add filter",
     icon: "filter",
-    segment,
+    view,
     fields,
     types: ["measure", "dimension"],
     filter: (_segment, field) => (field.kind === "dimension" || field.kind === "measure") && FILTERABLE_TYPES$1.has(field.type.kind),
     onClick: (field, path) => {
+      const segment = view.getOrAddDefaultSegment();
       if (field.kind === "dimension" || field.kind === "measure") {
         if (field.type.kind === "string_type") {
           segment.addWhere(field.name, path, "-null");
@@ -28637,24 +28738,24 @@ function AddWhere({
 const FILTERABLE_TYPES$1 = /* @__PURE__ */ new Set(["string_type", "boolean_type", "number_type", "date_type", "timestamp_type"]);
 function AddView({
   rootQuery,
-  view,
-  segment
+  view
 }) {
   const {
     setQuery
   } = React.useContext(QueryEditorContext);
-  const allFields = segment.getInputSchema().fields;
+  const allFields = getInputSchemaFromViewParent(view).fields;
   const fields = React.useMemo(() => allFields.filter((field) => field.kind === "view" && !isIndexView(field)), [allFields]);
   return /* @__PURE__ */ jsxRuntime.jsx(AddFieldItem, {
     label: "Add view",
     icon: "view",
-    segment,
+    view,
     fields,
     types: ["view"],
     onClick: (field) => {
-      if (view === rootQuery && rootQuery.isEmpty()) {
+      if (rootQuery.isEmpty()) {
         rootQuery.setView(field.name);
       } else {
+        const segment = view.getOrAddDefaultSegment();
         const nestNo = segmentNestNo(segment, field.name);
         segment.addNest(field.name, nestNo > 1 ? `${field.name} ${nestNo}` : void 0);
       }
@@ -28749,7 +28850,6 @@ function AddMenu({
     setQuery
   } = React.useContext(QueryEditorContext);
   const [search, setSearch] = React.useState("");
-  const segment = view.getOrAddDefaultSegment();
   return /* @__PURE__ */ jsxRuntime.jsxs(Root2$2, {
     open,
     onOpenChange: (open2) => {
@@ -28789,16 +28889,16 @@ function AddMenu({
             flex: 1
           },
           children: [/* @__PURE__ */ jsxRuntime.jsx(FieldList, {
-            segment,
-            fields: segment.getInputSchema().fields,
+            view,
+            fields: getInputSchemaFromViewParent(view).fields,
             types: ["dimension", "measure", "view"],
             onClick: function(field, path) {
+              const segment = view.getOrAddDefaultSegment();
               if (field.kind === "dimension") {
                 segment.addGroupBy(field.name, path);
                 if (!segmentHasLimit(segment)) {
-                  segment.setLimit(10);
+                  segment.setLimit(1e3);
                 }
-                segment.addOrderBy(field.name);
               } else if (field.kind === "measure") {
                 segment.addAggregate(field.name, path);
               } else {
@@ -28813,6 +28913,7 @@ function AddMenu({
             onClick: (value) => {
               const path = value.fieldName.split(".");
               const name = path.pop();
+              const segment = view.getOrAddDefaultSegment();
               segment.addWhere(name, path, {
                 kind: "string",
                 parsed: {
@@ -28826,26 +28927,25 @@ function AddMenu({
         }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
           children: [/* @__PURE__ */ jsxRuntime.jsx(AddGroupBy, {
             rootQuery,
-            segment
+            view
           }), /* @__PURE__ */ jsxRuntime.jsx(AddAggregate, {
             rootQuery,
-            segment
+            view
           }), /* @__PURE__ */ jsxRuntime.jsx(AddWhere, {
             rootQuery,
-            segment
+            view
           }), /* @__PURE__ */ jsxRuntime.jsx(AddView, {
             rootQuery,
-            view,
-            segment
+            view
           }), /* @__PURE__ */ jsxRuntime.jsx(Divider, {}), /* @__PURE__ */ jsxRuntime.jsx(AddLimit, {
             rootQuery,
-            segment
+            view
           }), /* @__PURE__ */ jsxRuntime.jsx(AddOrderBy, {
             rootQuery,
-            segment
+            view
           }), /* @__PURE__ */ jsxRuntime.jsx(AddEmptyNest, {
             rootQuery,
-            segment
+            view
           })]
         })]
       })
@@ -28917,6 +29017,7 @@ function NestOperations({
 }
 function Operations({
   rootQuery,
+  view,
   viewDef
 }) {
   const groupBys = [];
@@ -28925,7 +29026,10 @@ function Operations({
   const orderBys = [];
   const nests = [];
   let limit;
-  const segment = viewDef.getOrAddDefaultSegment();
+  if (!(viewDef instanceof QB.ASTSegmentViewDefinition)) {
+    return null;
+  }
+  const segment = viewDef;
   segment.operations.items.forEach((operation) => {
     if (operation instanceof QB.ASTGroupByViewOperation) {
       groupBys.push(operation);
@@ -28947,53 +29051,54 @@ function Operations({
     },
     children: [/* @__PURE__ */ jsxRuntime.jsx(GroupByOperations, {
       rootQuery,
-      segment,
+      view,
       groupBys
     }), /* @__PURE__ */ jsxRuntime.jsx(AggregateOperations, {
       rootQuery,
-      segment,
+      view,
       aggregates
     }), /* @__PURE__ */ jsxRuntime.jsx(WhereOperations, {
       rootQuery,
-      segment,
       wheres
     }), /* @__PURE__ */ jsxRuntime.jsx(OrderByOperations, {
       rootQuery,
-      segment,
       orderBys
     }), /* @__PURE__ */ jsxRuntime.jsx(NestOperations, {
       rootQuery,
-      segment,
       nests
     }), /* @__PURE__ */ jsxRuntime.jsx(LimitOperation, {
       rootQuery,
-      segment,
       limit
     })]
   });
 }
 function ViewDefinition({
   rootQuery,
+  view,
   viewDef
 }) {
   if (viewDef instanceof QB.ASTArrowViewDefinition) {
     return /* @__PURE__ */ jsxRuntime.jsx(ViewDefinition, {
       rootQuery,
+      view,
       viewDef: viewDef.view
     });
   } else if (viewDef instanceof QB.ASTRefinementViewDefinition) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", {
       children: [/* @__PURE__ */ jsxRuntime.jsx(ViewDefinition, {
         rootQuery,
+        view,
         viewDef: viewDef.base
       }), /* @__PURE__ */ jsxRuntime.jsx(ViewDefinition, {
         rootQuery,
+        view,
         viewDef: viewDef.refinement
       })]
     });
   } else if (viewDef instanceof QB.ASTSegmentViewDefinition) {
     return /* @__PURE__ */ jsxRuntime.jsx(Operations, {
       rootQuery,
+      view,
       viewDef
     });
   } else {
@@ -29106,10 +29211,10 @@ function Query({
           },
           disabled: rootQuery.isEmpty()
         }) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {})
-      }), /* @__PURE__ */ jsxRuntime.jsx(AddMenu, {
+      }), query.definition instanceof QB.ASTArrowQueryDefinition ? /* @__PURE__ */ jsxRuntime.jsx(AddMenu, {
         rootQuery,
-        view: query
-      })]
+        view: query.definition
+      }) : null]
     }),
     collapsedControls: /* @__PURE__ */ jsxRuntime.jsx(VisualizationIcon, {
       view: query
@@ -29125,6 +29230,7 @@ function Query({
         view: query
       }), /* @__PURE__ */ jsxRuntime.jsx(ViewDefinition, {
         rootQuery,
+        view: query.definition,
         viewDef: query.definition.view
       })]
     }) : null, query.isEmpty() ? /* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -29256,7 +29362,7 @@ function Parameters({
       title: "Source parameters",
       children: /* @__PURE__ */ jsxRuntime.jsx("div", {
         ...{
-          className: "x78zum5 xf18ygs"
+          className: "x78zum5 xdt5ytf x1jnr06f xnm25rq"
         },
         children: sourceParameters.map((parameter) => {
           var _a2;
@@ -29656,11 +29762,6 @@ function ResponseDisplay({
       title: "Empty Response",
       variant: "critical"
     };
-  } else if (!response.result) {
-    bannerProps = {
-      title: "Empty Result",
-      variant: "critical"
-    };
   } else if (response.error && !response.error.customRenderer) {
     const e = response.error;
     let variant;
@@ -29685,6 +29786,11 @@ function ResponseDisplay({
       children: e.content,
       variant
     };
+  } else if (!response.result) {
+    bannerProps = {
+      title: "Empty Result",
+      variant: "critical"
+    };
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [bannerProps && /* @__PURE__ */ jsxRuntime.jsx(Banner, {
@@ -29775,6 +29881,38 @@ const styles$4 = {
     $$css: true
   }
 };
+function DebugPane({
+  query,
+  debug
+}) {
+  const [selectedDebugger, setSelectedDebugger] = React.useState();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    children: [debug && /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      ...{
+        className: "x78zum5 x167g77z x6s0dn4"
+      },
+      children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
+        ..._stylex.props(fontStyles.largeBody),
+        children: "Debug with:"
+      }), /* @__PURE__ */ jsxRuntime.jsx(SelectDropdown, {
+        options: debug.debuggers.map((d) => ({
+          label: d,
+          value: d
+        })),
+        value: selectedDebugger,
+        onChange: (v2) => setSelectedDebugger(v2)
+      }), /* @__PURE__ */ jsxRuntime.jsx(Button, {
+        variant: "default",
+        label: "Run",
+        isDisabled: !selectedDebugger,
+        onClick: () => selectedDebugger && debug.onDebugQuery(query, selectedDebugger)
+      })]
+    }), /* @__PURE__ */ jsxRuntime.jsx(CodeBlock, {
+      code: JSON.stringify(query, null, 2),
+      language: "json"
+    })]
+  });
+}
 function ResultPanel({
   source,
   draftQuery,
@@ -29917,9 +30055,12 @@ function ResultPanel({
         ...{
           className: "xwp4ipm xh8yej3 x5yr21d x9f619"
         },
-        children: /* @__PURE__ */ jsxRuntime.jsx(CodeBlock, {
-          code: JSON.stringify(draftQuery, null, 2),
-          language: "json"
+        children: /* @__PURE__ */ jsxRuntime.jsx(DebugPane, {
+          query: draftQuery,
+          debug: options.debugOptions ? {
+            debuggers: options.debugOptions.debuggers,
+            onDebugQuery: options.debugOptions.onDebugQuery
+          } : void 0
         })
       })]
     })]
@@ -30539,9 +30680,10 @@ function FieldGroupList({
       ..._stylex.props(fontStyles.body, styles$1.title),
       children: title
     }), /* @__PURE__ */ jsxRuntime.jsx(List$1, {
-      children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(CollapsibleListItem, {
+      children: items.map((item, index2) => /* @__PURE__ */ jsxRuntime.jsx(CollapsibleListItem, {
         label: getLabelFromPath(source, item.groupPath),
         sublabel: getSublabelFromPath(source, item.groupPath),
+        isInitiallyExpanded: index2 === 0,
         children: item.items.map(({
           field,
           path
@@ -30617,12 +30759,17 @@ function SourcePanel({
         },
         children: [subpanelType == null ? /* @__PURE__ */ jsxRuntime.jsxs("div", {
           ...{
-            className: "x78zum5 x6s0dn4 x167g77z xdqdrvq"
+            className: "x78zum5 x6s0dn4 x167g77z xdqdrvq xb3r6kr"
           },
           children: [/* @__PURE__ */ jsxRuntime.jsx(Icon, {
             name: "database",
             color: "gray"
-          }), source.name]
+          }), /* @__PURE__ */ jsxRuntime.jsx("div", {
+            ...{
+              className: "xb3r6kr xlyipyv"
+            },
+            children: source.name
+          })]
         }) : /* @__PURE__ */ jsxRuntime.jsx(Button, {
           icon: "chevronLeft",
           label: "Back",
@@ -30633,7 +30780,8 @@ function SourcePanel({
           children: /* @__PURE__ */ jsxRuntime.jsx(Button, {
             icon: "chevronLeft",
             tooltip: "Close the source panel",
-            onClick: () => setIsSourcePanelOpen(false)
+            onClick: () => setIsSourcePanelOpen(false),
+            size: "compact"
           })
         })]
       }), /* @__PURE__ */ jsxRuntime.jsx(TextInput, {