npm - @malloydata/malloy-explorer - Versions diffs - 0.0.299-dev250804170242 → 0.0.299-dev250808170326 - Mend

@malloydata/malloy-explorer 0.0.299-dev250804170242 → 0.0.299-dev250808170326

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (23) hide show

package/dist/cjs/index.cjs +727 -300
package/dist/cjs/index.cjs.map +1 -1
package/dist/esm/index.js +728 -301
package/dist/esm/index.js.map +1 -1
package/dist/malloy-explorer.css +1 -2
package/dist/types/components/ResultPanel/DownloadButton.d.ts +6 -0
package/dist/types/components/primitives/utils/icon.d.ts +6 -0
package/dist/types/components/utils/download.d.ts +44 -0
package/dist/types/components/utils/download.spec.d.ts +1 -0
package/package.json +1 -1
package/.editorconfig +0 -8
package/.github/workflows/prerelease.yaml +0 -28
package/.github/workflows/test.yaml +0 -26
package/.gitmodules +0 -3
package/.node-version +0 -1
package/.prettierrc.js +0 -8
package/.vscode/extensions.json +0 -6
package/babel.config.cjs +0 -49
package/eslint.config.mjs +0 -150
package/index.html +0 -19
package/jest.config.ts +0 -27
package/postcss.config.mjs +0 -20
package/vite.config.mts +0 -69

package/dist/cjs/index.cjs CHANGED Viewed

@@ -3846,6 +3846,7 @@ const SvgInfo = (props2) => /* @__PURE__ */ React__namespace.createElement("svg"
 const SvgError = (props2) => /* @__PURE__ */ React__namespace.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 -960 960 960", width: "24px", fill: "currentColor", ...props2 }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M480-280q17 0 28.5-11.5T520-320q0-17-11.5-28.5T480-360q-17 0-28.5 11.5T440-320q0 17 11.5 28.5T480-280Zm-40-160h80v-240h-80v240ZM330-120 120-330v-300l210-210h300l210 210v300L630-120H330Zm34-80h232l164-164v-232L596-760H364L200-596v232l164 164Zm116-280Z" }));
 const SvgRefresh = (props2) => /* @__PURE__ */ React__namespace.createElement("svg", { height: 20, viewBox: "0 0 20 20", width: 20, xmlns: "http://www.w3.org/2000/svg", ...props2 }, /* @__PURE__ */ React__namespace.createElement("g", { fill: "none", stroke: "currentColor" }, /* @__PURE__ */ React__namespace.createElement("path", { d: "m17.08 11.15c.01.16.02.32.02.49 0 3.89-3.16 7.05-7.05 7.05-3.89-.01-7.05-3.16-7.05-7.06 0-3.89 3.16-7.05 7.05-7.05.85 0 1.66.15 2.41.42", strokeWidth: 1.1 }), /* @__PURE__ */ React__namespace.createElement("path", { d: "m9.9 2 2.89 2.89-3 3.01" })));
 const SvgSidebarCollapse = (props2) => /* @__PURE__ */ React__namespace.createElement("svg", { height: 24, viewBox: "0 0 24 24", width: 24, xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", stroke: "none", ...props2 }, /* @__PURE__ */ React__namespace.createElement("path", { fill: "currentColor", stroke: "none", d: "m20 24h-16c-2.2 0-4-1.8-4-4v-16c0-2.2 1.8-4 4-4h16c2.2 0 4 1.8 4 4v16c0 2.2-1.8 4-4 4zm-16-22c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2v-16c0-1.1-.9-2-2-2z" }), /* @__PURE__ */ React__namespace.createElement("path", { fill: "currentColor", d: "m8 24c-.6 0-1-.4-1-1v-22c0-.6.4-1 1-1s1 .4 1 1v22c0 .6-.4 1-1 1z" }), /* @__PURE__ */ React__namespace.createElement("path", { fill: "currentColor", d: "m14 13c-.3 0-.5-.1-.7-.3-.4-.4-.4-1 0-1.4l3-3c.4-.4 1-.4 1.4 0s.4 1 0 1.4l-3 3c-.2.2-.4.3-.7.3z" }), /* @__PURE__ */ React__namespace.createElement("path", { fill: "currentColor", d: "m17 16c-.3 0-.5-.1-.7-.3l-3-3c-.4-.4-.4-1 0-1.4s1-.4 1.4 0l3 3c.4.4.4 1 0 1.4-.2.2-.4.3-.7.3z" }));
+const SvgDownload = (props2) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "24px", height: "24px", viewBox: "0 0 80 80", fill: "currentColor", ...props2 }, /* @__PURE__ */ React__namespace.createElement("g", null, /* @__PURE__ */ React__namespace.createElement("path", { d: "M19.5833333,78.3333333 L74.4166667,78.3333333 L74.4166667,70.5 L19.5833333,70.5 L19.5833333,78.3333333 Z M74.4166667,35.25 L58.75,35.25 L58.75,11.75 L35.25,11.75 L35.25,35.25 L19.5833333,35.25 L47,62.6666667 L74.4166667,35.25 Z", fillRule: "nonzero", fill: "var(--vscode-icon-foreground)" })));
 const SvgFilterSliders = (props2) => /* @__PURE__ */ React__namespace.createElement("svg", { fill: "none", height: 24, viewBox: "0 0 24 24", width: 24, xmlns: "http://www.w3.org/2000/svg", ...props2 }, /* @__PURE__ */ React__namespace.createElement("path", { d: "m11 8h10m-10 0c0 1.65685-1.34315 3-3 3s-3-1.34315-3-3m6 0c0-1.65685-1.34315-3-3-3s-3 1.34315-3 3m0 0h-2m10 8h-10m10 0c0-1.6569 1.3431-3 3-3s3 1.3431 3 3m-6 0c0 1.6569 1.3431 3 3 3s3-1.3431 3-3m0 0h2", stroke: "currentColor", strokeWidth: 1.5 }));
 const SvgVizBarChart = (props2) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "110px", height: "110px", viewBox: "15 15 80 80", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", ...props2 }, /* @__PURE__ */ React__namespace.createElement("g", { id: "viz_bar_chart", stroke: "none", strokeWidth: 1, fill: "none", fillRule: "evenodd" }, /* @__PURE__ */ React__namespace.createElement("g", { id: "Group-3", transform: "translate(20.000000, 24.000000)", fill: "currentColor" }, /* @__PURE__ */ React__namespace.createElement("g", { id: "Group-2", transform: "translate(34.500000, 31.000000) rotate(-270.000000) translate(-34.500000, -31.000000) translate(3.500000, -3.500000)" }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M-26.056314,30.056314 L34.943686,30.056314 C37.152825,30.056314 38.943686,31.847175 38.943686,34.056314 L38.943686,34.943686 C38.943686,37.152825 37.152825,38.943686 34.943686,38.943686 L-26.056314,38.943686 C-28.265453,38.943686 -30.056314,37.152825 -30.056314,34.943686 L-30.056314,34.056314 C-30.056314,31.847175 -28.265453,30.056314 -26.056314,30.056314 Z", id: "Rectangle-Copy-59", transform: "translate(4.443686, 34.500000) rotate(-90.000000) translate(-4.443686, -34.500000) " }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M-0.491247385,37.8466366 L44.9281075,37.8466366 C47.1372465,37.8466366 48.9281075,39.6374976 48.9281075,41.8466366 L48.9281075,42.7340086 C48.9281075,44.9431476 47.1372465,46.7340086 44.9281075,46.7340086 L-0.491247385,46.7340086 C-2.70038638,46.7340086 -4.49124739,44.9431476 -4.49124739,42.7340086 L-4.49124739,41.8466366 C-4.49124739,39.6374976 -2.70038638,37.8466366 -0.491247385,37.8466366 Z", id: "Rectangle-Copy-62", transform: "translate(22.218430, 42.290323) rotate(-90.000000) translate(-22.218430, -42.290323) " }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M23.3837854,43.9469253 L56.6025627,43.9469253 C58.8117017,43.9469253 60.6025627,45.7377863 60.6025627,47.9469253 L60.6025627,48.8342973 C60.6025627,51.0434363 58.8117017,52.8342973 56.6025627,52.8342973 L23.3837854,52.8342973 C21.1746464,52.8342973 19.3837854,51.0434363 19.3837854,48.8342973 L19.3837854,47.9469253 C19.3837854,45.7377863 21.1746464,43.9469253 23.3837854,43.9469253 Z", id: "Rectangle-Copy-66", transform: "translate(39.993174, 48.390611) rotate(-90.000000) translate(-39.993174, -48.390611) " }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M46.7286345,49.7286345 L68.8072017,49.7286345 C71.0163407,49.7286345 72.8072017,51.5194955 72.8072017,53.7286345 L72.8072017,54.1927983 C72.8072017,56.4019373 71.0163407,58.1927983 68.8072017,58.1927983 L46.7286345,58.1927983 C44.5194955,58.1927983 42.7286345,56.4019373 42.7286345,54.1927983 L42.7286345,53.7286345 C42.7286345,51.5194955 44.5194955,49.7286345 46.7286345,49.7286345 Z", id: "Rectangle-Copy-67", transform: "translate(57.767918, 53.960716) rotate(-90.000000) translate(-57.767918, -53.960716) " })))));
 const SvgVizBoolean = (props2) => /* @__PURE__ */ React__namespace.createElement("svg", { width: "110px", height: "110px", viewBox: "15 15 80 80", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink", ...props2 }, /* @__PURE__ */ React__namespace.createElement("g", { id: "viz_boolean", stroke: "none", strokeWidth: 1, fill: "none", fillRule: "evenodd" }, /* @__PURE__ */ React__namespace.createElement("g", { id: "noun_switch_3350414-2", transform: "translate(20.000000, 22.000000)", fill: "currentColor", fillRule: "nonzero" }, /* @__PURE__ */ React__namespace.createElement("g", { id: "noun_switch_3350414" }, /* @__PURE__ */ React__namespace.createElement("path", { d: "M15.2972028,30.8 L54.7027972,30.8 C63.151209,30.8 70,23.9051851 70,15.4 C70,6.89481485 63.151209,0 54.7027972,0 L15.2972028,0 C6.84879098,0 0,6.89481485 0,15.4 C0,23.9051851 6.84879098,30.8 15.2972028,30.8 Z M15.2972028,6.16 L54.7027972,6.16 C59.7718443,6.16 63.8811189,10.2968889 63.8811189,15.4 C63.8811189,20.5031111 59.7718443,24.64 54.7027972,24.64 L15.2972028,24.64 C10.2281557,24.64 6.11888112,20.5031111 6.11888112,15.4 C6.11888112,10.2968889 10.2281557,6.16 15.2972028,6.16 Z", id: "Shape" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M19.6340542,21.9997804 C22.2930484,22.0215224 24.7022661,20.4273668 25.7348338,17.9629544 C26.7674016,15.4985421 26.2191958,12.6510518 24.3466309,10.7523518 C22.474066,8.85365189 19.6473211,8.27908795 17.1885612,9.29740315 C14.7298014,10.3157183 13.125,12.7256064 13.125,15.3998806 C13.125,19.0240523 16.0305897,21.9703156 19.6340542,21.9997804 L19.6340542,21.9997804 Z", id: "Path" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M54.7027971,35.2 L15.2972025,35.2 C6.84879081,35.2 0,42.094815 0,50.6 C0,59.105185 6.84879081,66 15.2972025,66 L54.7027971,66 C63.151209,66 70,59.1051851 70,50.6 C70,42.0948149 63.151209,35.2 54.7027971,35.2 L54.7027971,35.2 Z M54.7027971,59.84 L15.2972025,59.84 C10.2281554,59.84 6.11888082,55.7031111 6.11888082,50.6 C6.11888082,45.4968889 10.2281554,41.36 15.2972025,41.36 L54.7027971,41.36 C59.7718442,41.36 63.8811189,45.4968889 63.8811189,50.6 C63.8811189,55.7031111 59.7718442,59.84 54.7027971,59.84 L54.7027971,59.84 Z", id: "Shape" }), /* @__PURE__ */ React__namespace.createElement("path", { d: "M50.3659458,44.0002196 C47.7069516,43.9784776 45.2977339,45.5726332 44.2651662,48.0370456 C43.2325984,50.5014579 43.7808042,53.3489482 45.6533691,55.2476482 C47.525934,57.1463481 50.3526789,57.720912 52.8114388,56.7025969 C55.2701986,55.6842817 56.875,53.2743936 56.875,50.6001194 C56.875,46.9759477 53.9694103,44.0296844 50.3659458,44.0002196 Z", id: "Path" })))));
@@ -3888,6 +3889,7 @@ const ICON_MAP = {
   refresh: SvgRefresh,
   sidebarCollapse: SvgSidebarCollapse,
   filterSliders: SvgFilterSliders,
+  download: SvgDownload,
   // Operations
   aggregate: SvgInsertMeasure,
   dimension: SvgTypeIconString,
@@ -3955,11 +3957,11 @@ function Icon({
     return null;
   }
   return /* @__PURE__ */ jsxRuntime.jsx(IconComponent, {
-    ..._stylex.props(styles$Q.main, colorVariants$3[color], customStyle),
+    ..._stylex.props(styles$R.main, colorVariants$3[color], customStyle),
     "data-testid": `icon-${color}-${name}`
   });
 }
-const styles$Q = {
+const styles$R = {
   main: {
     display: "mly1rg5ohu",
     width: "mly1kky2od",
@@ -4028,18 +4030,18 @@ function Badge({
   customStyle
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(styles$P.main, colorVariants$2[color], customStyle),
+    ..._stylex.props(styles$Q.main, colorVariants$2[color], customStyle),
     children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
       color,
       name: icon
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
       "data-testid": "badge-label",
-      ..._stylex.props(fontStyles.badge, styles$P.label),
+      ..._stylex.props(fontStyles.badge, styles$Q.label),
       children: label
     })]
   });
 }
-const styles$P = {
+const styles$Q = {
   main: {
     display: "mly3nfvp2",
     height: "mly1qx5ct2",
@@ -4121,10 +4123,10 @@ function Divider({
   customStyle
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ..._stylex.props(styles$O.main, orientationVariants[orientation], customStyle)
+    ..._stylex.props(styles$P.main, orientationVariants[orientation], customStyle)
   });
 }
-const styles$O = {
+const styles$P = {
   main: {
     background: "mly1xnbgy5",
     backgroundAttachment: null,
@@ -4930,7 +4932,7 @@ function Button({
   ...props2
 }) {
   const button = /* @__PURE__ */ jsxRuntime.jsxs("button", {
-    ..._stylex.props(styles$N.main, colorVariants$1[variant], sizeVariants$1[size2], customStyle),
+    ..._stylex.props(styles$O.main, colorVariants$1[variant], sizeVariants$1[size2], customStyle),
     type: "button",
     disabled: isDisabled,
     ...props2,
@@ -4940,9 +4942,9 @@ function Button({
       },
       children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
         name: icon,
-        customStyle: styles$N.icon
+        customStyle: styles$O.icon
       }), label && /* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(variant === "primary" ? fontStyles.emphasized : fontStyles.body, styles$N.label),
+        ..._stylex.props(variant === "primary" ? fontStyles.emphasized : fontStyles.body, styles$O.label),
         children: label
       })]
     }), isDisabled && /* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -4969,7 +4971,7 @@ function Button({
     return button;
   }
 }
-const styles$N = {
+const styles$O = {
   main: {
     display: "mly3nfvp2",
     flexDirection: "mlydt5ytf",
@@ -5220,7 +5222,7 @@ function Token({
 }) {
   const isInteractive = onClick !== void 0 || asButtonTrigger;
   const token2 = /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(tokenStyles.main, tokenColorVariants[color], tokenSizeVariants[size2], !isInteractive && styles$M.nonInteractive, customStyle),
+    ..._stylex.props(tokenStyles.main, tokenColorVariants[color], tokenSizeVariants[size2], !isInteractive && styles$N.nonInteractive, customStyle),
     ...dragProps == null ? void 0 : dragProps.attributes,
     ...dragProps == null ? void 0 : dragProps.listeners,
     children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
@@ -5257,7 +5259,7 @@ function Token({
     })]
   }) : token2;
 }
-const styles$M = {
+const styles$N = {
   nonInteractive: {
     cursor: "mlyt0e3qv",
     background: "mly1np9qvj",
@@ -5281,7 +5283,7 @@ function TokenGroup({
 }) {
   const count2 = React__namespace.Children.count(children);
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ..._stylex.props(styles$L.main, customStyle),
+    ..._stylex.props(styles$M.main, customStyle),
     children: React__namespace.Children.map(children, (child, index2) => /* @__PURE__ */ React__namespace.cloneElement(child, {
       customStyle: {
         ...child.props.customStyle,
@@ -5292,16 +5294,16 @@ function TokenGroup({
   });
 }
 const getChildStyle = (index2, count2) => {
-  if (count2 === 1) return styles$L.onlyChild;
-  if (index2 === 0) return styles$L.firstChild;
-  if (index2 === count2 - 1) return styles$L.lastChild;
-  return styles$L.innerChild;
+  if (count2 === 1) return styles$M.onlyChild;
+  if (index2 === 0) return styles$M.firstChild;
+  if (index2 === count2 - 1) return styles$M.lastChild;
+  return styles$M.innerChild;
 };
 const getTokenColor = (child, groupColor) => {
   const childColor = child.props.color;
   return childColor === void 0 ? groupColor : childColor;
 };
-const styles$L = {
+const styles$M = {
   main: {
     display: "mlyrvj5dj",
     gridAutoFlow: "mly1mt1orb",
@@ -5373,7 +5375,7 @@ function ErrorIcon({
         },
         children: /* @__PURE__ */ jsxRuntime.jsx(Icon, {
           name: "warning",
-          customStyle: styles$K.errorIcon
+          customStyle: styles$L.errorIcon
         })
       })
     }), /* @__PURE__ */ jsxRuntime.jsx(TooltipPortal, {
@@ -5386,7 +5388,7 @@ function ErrorIcon({
     })]
   });
 }
-const styles$K = {
+const styles$L = {
   errorIcon: {
     color: "mly1e2nbdu",
     $$css: true
@@ -5431,22 +5433,22 @@ function EditableToken({
       className: "mly78zum5 mly6s0dn4"
     },
     children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
-      ..._stylex.props(tokenStyles.main, tokenColorVariants[color], tokenSizeVariants[size2], isFocused && styles$J.focused, !!errorMessage && styles$J.hasError, customStyle),
+      ..._stylex.props(tokenStyles.main, tokenColorVariants[color], tokenSizeVariants[size2], isFocused && styles$K.focused, !!errorMessage && styles$K.hasError, customStyle),
       children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
         name: icon,
-        customStyle: styles$J.icon
+        customStyle: styles$K.icon
       }), /* @__PURE__ */ jsxRuntime.jsxs("span", {
         ...{
           className: "mlywz0xwf"
         },
         children: [/* @__PURE__ */ jsxRuntime.jsx("span", {
-          ..._stylex.props(fontStyles.body, styles$J.placeholder),
+          ..._stylex.props(fontStyles.body, styles$K.placeholder),
           style: {
             whiteSpaceCollapse: "preserve"
           },
           children: value
         }), /* @__PURE__ */ jsxRuntime.jsx("input", {
-          ..._stylex.props(styles$J.input, fontStyles.body),
+          ..._stylex.props(styles$K.input, fontStyles.body),
           ref: inputRef,
           pattern: type === "number" ? "^-?[0-9.]*$" : void 0,
           value,
@@ -5471,7 +5473,7 @@ function EditableToken({
     })]
   });
 }
-const styles$J = {
+const styles$K = {
   focused: {
     background: "mlyotlr4g",
     backgroundAttachment: null,
@@ -7813,12 +7815,12 @@ function TextInput({
     }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(styles$I.main, isFocused && styles$I.focused, sizeVariants[size2], customStyle),
+    ..._stylex.props(styles$J.main, isFocused && styles$J.focused, sizeVariants[size2], customStyle),
     children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
       name: icon,
       color: "secondary"
     }), /* @__PURE__ */ jsxRuntime.jsx("input", {
-      ..._stylex.props(fontStyles.body, styles$I.input),
+      ..._stylex.props(fontStyles.body, styles$J.input),
       value,
       placeholder,
       onChange: handleChange,
@@ -7826,7 +7828,7 @@ function TextInput({
       onBlur: handleBlur,
       onKeyDown
     }), hasClear && /* @__PURE__ */ jsxRuntime.jsx("button", {
-      ..._stylex.props(fontStyles.supporting, styles$I.actionButton, value === "" && styles$I.hidden),
+      ..._stylex.props(fontStyles.supporting, styles$J.actionButton, value === "" && styles$J.hidden),
       ref: buttonRef,
       onClick: () => onChange(""),
       tabIndex: 0,
@@ -7834,7 +7836,7 @@ function TextInput({
     })]
   });
 }
-const styles$I = {
+const styles$J = {
   main: {
     display: "mly78zum5",
     alignItems: "mly6s0dn4",
@@ -8043,7 +8045,7 @@ function SelectorToken({
     onValueChange: handleValueChange,
     required: true,
     children: [/* @__PURE__ */ jsxRuntime.jsxs(Trigger$3, {
-      ..._stylex.props(tokenStyles.main, styles$H.selectTrigger, tokenColorVariants[color], tokenSizeVariants[size2], customStyle),
+      ..._stylex.props(tokenStyles.main, styles$I.selectTrigger, tokenColorVariants[color], tokenSizeVariants[size2], customStyle),
       children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
         name: icon,
         customStyle: tokenStyles.icon
@@ -8070,7 +8072,7 @@ function SelectorToken({
             size: "compact",
             icon: "search",
             hasClear: true,
-            customStyle: styles$H.searchInput,
+            customStyle: styles$I.searchInput,
             onKeyDown: (event) => {
               const excludedKeys = ["ArrowUp", "ArrowDown"];
               if (!excludedKeys.includes(event.key)) {
@@ -8101,21 +8103,21 @@ function SelectItem({
   ...props2
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(Item$1, {
-    ..._stylex.props(fontStyles.body, styles$H.selectItem),
+    ..._stylex.props(fontStyles.body, styles$I.selectItem),
     value,
     ...props2,
     children: [value === selectedValue ? /* @__PURE__ */ jsxRuntime.jsx(Icon, {
       name: "radioChecked",
-      customStyle: styles$H.radioChecked
+      customStyle: styles$I.radioChecked
     }) : /* @__PURE__ */ jsxRuntime.jsx(Icon, {
       name: "radioUnchecked",
-      customStyle: styles$H.radioUnchecked
+      customStyle: styles$I.radioUnchecked
     }), /* @__PURE__ */ jsxRuntime.jsx(ItemText, {
       children
     })]
   });
 }
-const styles$H = {
+const styles$I = {
   selectTrigger: {
     whiteSpace: "mlyuxw1ft",
     overflow: "mlyb3r6kr",
@@ -8205,7 +8207,7 @@ function Card({
   customStyle
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(styles$G.container, customStyle),
+    ..._stylex.props(styles$H.container, customStyle),
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
       ...{
         className: "mly1717udv"
@@ -8219,7 +8221,7 @@ function Card({
     })]
   });
 }
-const styles$G = {
+const styles$H = {
   container: {
     display: "mly78zum5",
     flexDirection: "mlydt5ytf",
@@ -8312,7 +8314,7 @@ function CollapsiblePanel({
         },
         children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
           name: icon,
-          customStyle: styles$F.icon
+          customStyle: styles$G.icon
         }), /* @__PURE__ */ jsxRuntime.jsx("div", {
           ...{
             className: "mlyuxw1ft mlyb3r6kr mlylyipyv mlyehqz9p mly1ghz6dp mly117nqv4"
@@ -8354,7 +8356,7 @@ function CollapsiblePanel({
     })]
   });
 }
-const styles$F = {
+const styles$G = {
   icon: {
     $$css: true
   }
@@ -8386,10 +8388,10 @@ function CollapsibleListItem({
           className: "mly78zum5 mlydt5ytf mly1iyjqo2 mlyb3r6kr"
         },
         children: [/* @__PURE__ */ jsxRuntime.jsx("span", {
-          ..._stylex.props(fontStyles.body, styles$E.label),
+          ..._stylex.props(fontStyles.body, styles$F.label),
           children: label
         }), sublabel && /* @__PURE__ */ jsxRuntime.jsx("span", {
-          ..._stylex.props(fontStyles.supporting, styles$E.sublabel),
+          ..._stylex.props(fontStyles.supporting, styles$F.sublabel),
           children: sublabel
         })]
       })]
@@ -8401,7 +8403,7 @@ function CollapsibleListItem({
     })]
   });
 }
-const styles$E = {
+const styles$F = {
   label: {
     flexGrow: "mly1iyjqo2",
     fontWeight: "mly1xlr1w8",
@@ -19215,7 +19217,7 @@ function Spinner({
   } = SIZES[size2];
   const frameSize = diameter + border * 2;
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ..._stylex.props(styles$D.root, customStyle),
+    ..._stylex.props(styles$E.root, customStyle),
     children: /* @__PURE__ */ jsxRuntime.jsx("span", {
       "aria-valuetext": "Loading",
       ...{
@@ -19235,7 +19237,7 @@ function Spinner({
     })
   });
 }
-const styles$D = {
+const styles$E = {
   root: {
     alignItems: "mly6s0dn4",
     display: "mly3nfvp2",
@@ -22304,7 +22306,7 @@ function toArray() {
     m.millisecond()
   ];
 }
-function toObject() {
+function toObject$1() {
   var m = this;
   return {
     years: m.year(),
@@ -22742,7 +22744,7 @@ proto.set = stringSet;
 proto.startOf = startOf;
 proto.subtract = subtract$1;
 proto.toArray = toArray;
-proto.toObject = toObject;
+proto.toObject = toObject$1;
 proto.toDate = toDate;
 proto.toISOString = toISOString;
 proto.inspect = inspect;
@@ -23633,7 +23635,7 @@ const Popover = ({
     })
   });
 };
-const styles$C = {
+const styles$D = {
   wrapper: {
     position: "mly1n2onr6",
     $$css: true
@@ -23685,7 +23687,7 @@ const SelectDropdown = ({
     setOpen(false);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(styles$C.wrapper, customStyle),
+    ..._stylex.props(styles$D.wrapper, customStyle),
     children: [/* @__PURE__ */ jsxRuntime.jsxs("button", {
       type: "button",
       autoFocus,
@@ -23753,7 +23755,7 @@ function SelectList({
   const [hoveredIndex, setHoveredIndex] = React.useState(null);
   return /* @__PURE__ */ jsxRuntime.jsx(ScrollableArea, {
     children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$C.selectListDiv, customStyle),
+      ..._stylex.props(styles$D.selectListDiv, customStyle),
       children: options.reduce((result, option2, index2) => {
         const isSelected = value !== void 0 && valueEqual(value, option2.value);
         if (option2.divider) {
@@ -23785,8 +23787,8 @@ function SelectList({
           }), /* @__PURE__ */ jsxRuntime.jsx(Icon, {
             name: "checkmark",
             customStyle: {
-              ...styles$C.checkIcon,
-              ...isSelected ? styles$C.checkIconSelected : void 0
+              ...styles$D.checkIcon,
+              ...isSelected ? styles$D.checkIconSelected : void 0
             }
           }), /* @__PURE__ */ jsxRuntime.jsx("span", {
             ...{
@@ -23838,7 +23840,7 @@ const DateInput = ({
     setTempValue(hooks.utc(value).format(format2));
   }, [value, format2]);
   return /* @__PURE__ */ jsxRuntime.jsx("input", {
-    ..._stylex.props(customStyle, isActive ? styles$B.active : null),
+    ..._stylex.props(customStyle, isActive ? styles$C.active : null),
     type: "text",
     placeholder: placeholder || format2,
     value: tempValue,
@@ -23873,7 +23875,7 @@ function guessUnits(moment2, isDateTime) {
   }
   return isDateTime ? "second" : "day";
 }
-const styles$B = {
+const styles$C = {
   active: {
     backgroundColor: "mly1vzefiq",
     $$css: true
@@ -23985,7 +23987,7 @@ function DatePicker({
     });
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(styles$A.outer, customStyle),
+    ..._stylex.props(styles$B.outer, customStyle),
     ref: forwardRef,
     children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
       ...{
@@ -24301,7 +24303,7 @@ function DatePicker({
     })]
   });
 }
-const styles$A = {
+const styles$B = {
   outer: {
     userSelect: "mly87ps6o",
     fontSize: "mlymhiqyu",
@@ -24387,7 +24389,7 @@ function Banner({
       className: "mly1q4ynmn mlyh8yej3 mly5yr21d mly78zum5 mlydt5ytf mly1kmqopl mly16zck5j"
     },
     children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
-      ..._stylex.props(styles$z.header, variantColors[variant], children ? styles$z.headerWithContent : null),
+      ..._stylex.props(styles$A.header, variantColors[variant], children ? styles$A.headerWithContent : null),
       children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
         ...{
           className: "mly1qx5ct2 mly78zum5 mlyl56j7k mly6s0dn4"
@@ -24400,22 +24402,22 @@ function Banner({
           className: "mly78zum5 mlydt5ytf mlyb3r6kr"
         },
         children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-          ..._stylex.props(styles$z.title, fontStyles.emphasized),
+          ..._stylex.props(styles$A.title, fontStyles.emphasized),
           children: title
         }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-          ..._stylex.props(styles$z.description, fontStyles.supporting),
+          ..._stylex.props(styles$A.description, fontStyles.supporting),
           children: description
         })]
       })]
     }), children && /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$z.content, fontStyles.body),
+      ..._stylex.props(styles$A.content, fontStyles.body),
       children: /* @__PURE__ */ jsxRuntime.jsx(ScrollableArea, {
         children
       })
     })]
   });
 }
-const styles$z = {
+const styles$A = {
   header: {
     borderRadius: "mly1q4ynmn",
     borderStartStartRadius: null,
@@ -24557,14 +24559,14 @@ function AccordionList({
       onExpandedItemChange: handleExpandedItemChange
     },
     children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$y.main, customStyle),
+      ..._stylex.props(styles$z.main, customStyle),
       children: React__namespace.Children.map(children, (child) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [child, /* @__PURE__ */ jsxRuntime.jsx(Divider, {})]
       }))
     })
   });
 }
-const styles$y = {
+const styles$z = {
   main: {
     display: "mly78zum5",
     flexDirection: "mlydt5ytf",
@@ -24601,10 +24603,10 @@ function AccordionListItem({
           className: "mly78zum5 mlydt5ytf mlyb3r6kr mly1iyjqo2"
         },
         children: [/* @__PURE__ */ jsxRuntime.jsx("span", {
-          ..._stylex.props(fontStyles.body, styles$x.label),
+          ..._stylex.props(fontStyles.body, styles$y.label),
           children: label
         }), sublabel && /* @__PURE__ */ jsxRuntime.jsx("span", {
-          ..._stylex.props(fontStyles.supporting, styles$x.sublabel),
+          ..._stylex.props(fontStyles.supporting, styles$y.sublabel),
           children: sublabel
         })]
       }), badge && badge, endIcon && endIcon]
@@ -24616,7 +24618,7 @@ function AccordionListItem({
     })]
   });
 }
-const styles$x = {
+const styles$y = {
   label: {
     flexGrow: "mly1iyjqo2",
     fontWeight: "mly1xlr1w8",
@@ -25901,7 +25903,7 @@ function DropdownMenu({
       children: trigger
     }), /* @__PURE__ */ jsxRuntime.jsx(Portal2, {
       children: /* @__PURE__ */ jsxRuntime.jsx(Content2, {
-        ..._stylex.props(fontStyles.body, styles$w.content),
+        ..._stylex.props(fontStyles.body, styles$x.content),
         side: "bottom",
         align: "start",
         sideOffset: 4,
@@ -25928,22 +25930,22 @@ function DropdownMenuItem({
     disabled,
     children: [icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, {
       name: icon,
-      customStyle: styles$w.icon
+      customStyle: styles$x.icon
     }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
       ...{
         className: "mly78zum5 mlydt5ytf mly1iyjqo2"
       },
       children: [/* @__PURE__ */ jsxRuntime.jsx("span", {
-        ..._stylex.props(fontStyles.body, styles$w.label),
+        ..._stylex.props(fontStyles.body, styles$x.label),
         children: label
       }), sublabel && /* @__PURE__ */ jsxRuntime.jsx("span", {
-        ..._stylex.props(fontStyles.supporting, styles$w.sublabel),
+        ..._stylex.props(fontStyles.supporting, styles$x.sublabel),
         children: sublabel
       })]
     })]
   });
 }
-const styles$w = {
+const styles$x = {
   content: {
     display: "mly78zum5",
     flexDirection: "mlydt5ytf",
@@ -26027,7 +26029,7 @@ function QueryActionBar({
       children: [/* @__PURE__ */ jsxRuntime.jsx(Icon, {
         name: "filterSliders"
       }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(fontStyles.largeBody, styles$v.title),
+        ..._stylex.props(fontStyles.largeBody, styles$w.title),
         children: "Query"
       })]
     }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
@@ -26072,13 +26074,13 @@ function QueryActionBar({
     })]
   });
 }
-const styles$v = {
+const styles$w = {
   title: {
     fontWeight: "mly1xlr1w8",
     $$css: true
   }
 };
-const styles$u = {
+const styles$v = {
   labelWithIcon: {
     display: "mly78zum5",
     alignItems: "mly6s0dn4",
@@ -26296,27 +26298,31 @@ function FieldToken({
   hoverActionsVisible,
   ...props2
 }) {
+  const [isHovered, setIsHovered] = React__namespace.useState(false);
   let label = field.name;
   if (field.kind === "dimension" && (field.type.kind === "timestamp_type" || field.type.kind === "date_type")) {
     if (field.type.timeframe) {
       label += `.${field.type.timeframe}`;
     }
   }
+  const showHover = (isHovered || hoverActionsVisible) && !!hoverActions;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    onMouseEnter: () => setIsHovered(true),
+    onMouseLeave: () => setIsHovered(false),
     ...{
       0: {
-        className: "mly78zum5 mly6s0dn4 mly1nhvcw1 mly1jnr06f mly28fmrt mly1x0xcia"
+        className: "mly78zum5 mly6s0dn4 mly1nhvcw1 mly1jnr06f"
       },
       1: {
         className: "mly78zum5 mly6s0dn4 mly1nhvcw1 mly1jnr06f mlym9y5t7"
       }
-    }[!!hoverActionsVisible << 0],
+    }[!!showHover << 0],
     children: [/* @__PURE__ */ jsxRuntime.jsx(Token, {
       label,
       color: fieldKindToColor(field.kind),
       icon: fieldToIcon(field),
       ...props2
-    }), additionalSiblings, hoverActions && /* @__PURE__ */ jsxRuntime.jsx("div", {
+    }), additionalSiblings, showHover && /* @__PURE__ */ jsxRuntime.jsx("div", {
       ...{
         className: "mly1vsucm1 mly2lah0s"
       },
@@ -26332,7 +26338,7 @@ function DrillOperations({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.title),
+      ..._stylex.props(styles$v.title),
       children: "drills"
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
       ...{
@@ -30307,32 +30313,32 @@ function BadgeForField({
       label: "view",
       icon: "view_filled",
       color: "purple",
-      customStyle: styles$t.noBackground
+      customStyle: styles$u.noBackground
     });
   } else if (field.kind === "dimension") {
     return /* @__PURE__ */ jsxRuntime.jsx(Badge, {
       label: "dimension",
       icon: fieldToIcon(field),
       color: "cyan",
-      customStyle: styles$t.noBackground
+      customStyle: styles$u.noBackground
     });
   } else if (field.kind === "measure") {
     return /* @__PURE__ */ jsxRuntime.jsx(Badge, {
       label: "measure",
       icon: fieldToIcon(field),
       color: "green",
-      customStyle: styles$t.noBackground
+      customStyle: styles$u.noBackground
     });
   } else if (field.kind === "join") {
     return /* @__PURE__ */ jsxRuntime.jsx(Badge, {
       label: "join",
       icon: fieldToIcon(field),
       color: "gray",
-      customStyle: styles$t.noBackground
+      customStyle: styles$u.noBackground
     });
   }
 }
-const styles$t = {
+const styles$u = {
   noBackground: {
     backgroundColor: "mlyjbqb8w",
     $$css: true
@@ -30641,7 +30647,7 @@ var Content$1 = DialogContent;
 var Title = DialogTitle;
 var Description = DialogDescription;
 var Close = DialogClose;
-const styles$s = {
+const styles$t = {
   left: {
     display: "mly78zum5",
     justifyContent: "mly1lvf691",
@@ -30781,11 +30787,11 @@ function HoverCard({
   customStyle
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ..._stylex.props(styles$r.container, fontStyles.body, customStyle),
+    ..._stylex.props(styles$s.container, fontStyles.body, customStyle),
     children
   });
 }
-const styles$r = {
+const styles$s = {
   container: {
     boxShadow: "mly5n1uv4",
     backgroundColor: "mly12peec7",
@@ -30822,7 +30828,7 @@ function InfoHover({
     children: [/* @__PURE__ */ jsxRuntime.jsx(Trigger$4, {
       asChild: true,
       children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(styles$s.infoTrigger, fontStyles.body),
+        ..._stylex.props(styles$t.infoTrigger, fontStyles.body),
         children: /* @__PURE__ */ jsxRuntime.jsx(Icon, {
           name: "info",
           color: "disabled"
@@ -30833,7 +30839,7 @@ function InfoHover({
         side: "right",
         align: "start",
         children: /* @__PURE__ */ jsxRuntime.jsx(HoverCard, {
-          customStyle: styles$s.card,
+          customStyle: styles$t.card,
           children: info
         })
       })
@@ -30955,9 +30961,9 @@ const PillInput = ({
     commitValue();
   });
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ..._stylex.props(fontStyles.body, styles$q.main),
+    ..._stylex.props(fontStyles.body, styles$r.main),
     children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
-      ..._stylex.props(styles$q.content, customStyle),
+      ..._stylex.props(styles$r.content, customStyle),
       onKeyUp,
       onClick: () => {
         var _a2;
@@ -31023,7 +31029,7 @@ const Pill = ({
     onClick,
     tabIndex: 0,
     ref: forwardRef,
-    ..._stylex.props(styles$q.pill, colorVariants[color]),
+    ..._stylex.props(styles$r.pill, colorVariants[color]),
     children: [children, /* @__PURE__ */ jsxRuntime.jsx("div", {
       title: "Remove",
       ...{
@@ -31038,7 +31044,7 @@ const Pill = ({
     })]
   });
 };
-const styles$q = {
+const styles$r = {
   main: {
     borderRadius: "mly12oqio5",
     borderStartStartRadius: null,
@@ -31194,7 +31200,7 @@ function OneOfEditor({
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.label, styles$s.left),
+      ..._stylex.props(styles$t.label, styles$t.left),
       children: /* @__PURE__ */ jsxRuntime.jsxs("label", {
         children: [option2.title ?? name, ":"]
       })
@@ -31254,7 +31260,7 @@ function OneOfStringEditor({
   if (option2.enum) {
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(styles$s.left),
+        ..._stylex.props(styles$t.left),
         children: /* @__PURE__ */ jsxRuntime.jsx("input", {
           type: "radio",
           checked: isString2 && option2.enum.includes(current),
@@ -31285,7 +31291,7 @@ function OneOfStringEditor({
   } else {
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(styles$s.left),
+        ..._stylex.props(styles$t.left),
         children: /* @__PURE__ */ jsxRuntime.jsx("input", {
           type: "radio",
           checked: isString2,
@@ -31323,7 +31329,7 @@ function OneOfNumberEditor({
   const [value, setValue] = React.useState(isNumber2 ? current : option2.minimum ?? 0);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.left),
+      ..._stylex.props(styles$t.left),
       children: /* @__PURE__ */ jsxRuntime.jsx("input", {
         type: "radio",
         checked: isNumber2,
@@ -31350,7 +31356,7 @@ function OneOfNumberEditor({
         setValue(valueAsNumber);
         updateCurrent(path, valueAsNumber);
       },
-      ..._stylex.props(styles$s.input)
+      ..._stylex.props(styles$t.input)
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {})]
   });
 }
@@ -31363,7 +31369,7 @@ function OneOfArrayEditor({
   const [value, setValue] = React.useState(isArray2 ? current : []);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.left),
+      ..._stylex.props(styles$t.left),
       children: /* @__PURE__ */ jsxRuntime.jsx("input", {
         type: "radio",
         checked: isArray2,
@@ -31397,7 +31403,7 @@ function OneOfObjectEditor({
   const [objectValue, setObjectValue] = React.useState(isObject2 ? current : {});
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.left),
+      ..._stylex.props(styles$t.left),
       children: /* @__PURE__ */ jsxRuntime.jsx("input", {
         type: "radio",
         checked: isObject2,
@@ -31412,7 +31418,7 @@ function OneOfObjectEditor({
         }
       })
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.nest, styles$s.editorGrid),
+      ..._stylex.props(styles$t.nest, styles$t.editorGrid),
       children: /* @__PURE__ */ jsxRuntime.jsx(ObjectEditor, {
         current: objectValue,
         updateCurrent: (path2, value) => {
@@ -31437,7 +31443,7 @@ function ArrayEditor({
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.left, styles$s.label),
+      ..._stylex.props(styles$t.left, styles$t.label),
       children: /* @__PURE__ */ jsxRuntime.jsxs("label", {
         children: [option2.title ?? name, ":"]
       })
@@ -31461,7 +31467,7 @@ function NumberEditor$1({
   const [value, setValue] = React__namespace.useState(current ?? option2.minimum);
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.left, styles$s.label),
+      ..._stylex.props(styles$t.left, styles$t.label),
       children: /* @__PURE__ */ jsxRuntime.jsxs("label", {
         children: [option2.title ?? name, ":"]
       })
@@ -31478,7 +31484,7 @@ function NumberEditor$1({
         setValue(valueAsNumber);
         updateCurrent(path, valueAsNumber);
       },
-      ..._stylex.props(styles$s.input)
+      ..._stylex.props(styles$t.input)
     }, name), option2.description ? /* @__PURE__ */ jsxRuntime.jsx(InfoHover, {
       info: option2.description
     }) : /* @__PURE__ */ jsxRuntime.jsx("div", {})]
@@ -31494,7 +31500,7 @@ function StringEditor$1({
   if (option2.enum) {
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/* @__PURE__ */ React.createElement("div", {
-        ..._stylex.props(styles$s.left, styles$s.label),
+        ..._stylex.props(styles$t.left, styles$t.label),
         key: `${name}-label`
       }, /* @__PURE__ */ jsxRuntime.jsxs("label", {
         children: [option2.title ?? name, ":"]
@@ -31514,7 +31520,7 @@ function StringEditor$1({
   } else {
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/* @__PURE__ */ React.createElement("div", {
-        ..._stylex.props(styles$s.left, styles$s.label),
+        ..._stylex.props(styles$t.left, styles$t.label),
         key: `${name}-label`
       }, /* @__PURE__ */ jsxRuntime.jsxs("label", {
         children: [option2.title ?? name, ":"]
@@ -31542,14 +31548,14 @@ function BooleanEditor({
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.left),
+      ..._stylex.props(styles$t.left),
       children: /* @__PURE__ */ jsxRuntime.jsxs("label", {
-        ..._stylex.props(styles$s.label),
+        ..._stylex.props(styles$t.label),
         htmlFor: `${name}-checkbox`,
         children: [option2.title ?? name, ":"]
       }, `${name}-label`)
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.right),
+      ..._stylex.props(styles$t.right),
       children: /* @__PURE__ */ jsxRuntime.jsx("input", {
         type: "checkbox",
         checked: current,
@@ -31598,7 +31604,7 @@ function FieldEditor({
   });
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.left, styles$s.label),
+      ..._stylex.props(styles$t.left, styles$t.label),
       children: /* @__PURE__ */ jsxRuntime.jsxs("label", {
         children: [option2.title ?? name, ":"]
       })
@@ -31678,7 +31684,7 @@ function ObjectEditor({
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [name ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
       children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
-        ..._stylex.props(styles$s.label, styles$s.heading),
+        ..._stylex.props(styles$t.label, styles$t.heading),
         onClick: () => setIsExpanded(!isExpanded),
         children: [/* @__PURE__ */ jsxRuntime.jsx("label", {
           children: option2.title ?? name
@@ -31766,7 +31772,7 @@ function ObjectEditor({
       }
       return null;
     }) : null, /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.divider)
+      ..._stylex.props(styles$t.divider)
     })]
   });
 }
@@ -31786,9 +31792,9 @@ function VizEditor({
     console.info("RendererEditor current settings:", current);
   }, [current]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(styles$s.editor),
+    ..._stylex.props(styles$t.editor),
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$s.editorGrid),
+      ..._stylex.props(styles$t.editorGrid),
       children: /* @__PURE__ */ jsxRuntime.jsx(ObjectEditor, {
         view,
         name: "",
@@ -31798,13 +31804,13 @@ function VizEditor({
         updateCurrent
       })
     }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
-      ..._stylex.props(styles$s.editorRow),
+      ..._stylex.props(styles$t.editorRow),
       children: [/* @__PURE__ */ jsxRuntime.jsx(Button, {
         label: "Cancel",
         onClick: () => {
           setOpen(false);
         },
-        customStyle: styles$s.editorCell
+        customStyle: styles$t.editorCell
       }), /* @__PURE__ */ jsxRuntime.jsx(Button, {
         variant: "primary",
         label: "Apply",
@@ -31822,7 +31828,7 @@ function VizEditor({
           updateQuery();
           setOpen(false);
         },
-        customStyle: styles$s.editorCell
+        customStyle: styles$t.editorCell
       })]
     })]
   });
@@ -32048,7 +32054,7 @@ function VizEditorDialog({
       children: /* @__PURE__ */ jsxRuntime.jsx(Overlay, {
         ..._stylex.props(dialogStyles.overlay),
         children: /* @__PURE__ */ jsxRuntime.jsxs(Content$1, {
-          ..._stylex.props(fontStyles.body, dialogStyles.content, styles$p.content, customStyle),
+          ..._stylex.props(fontStyles.body, dialogStyles.content, styles$q.content, customStyle),
           children: [/* @__PURE__ */ jsxRuntime.jsxs(Title, {
             ..._stylex.props(dialogStyles.title),
             children: ["Visualization Settings", /* @__PURE__ */ jsxRuntime.jsx(Close, {
@@ -32070,7 +32076,7 @@ function VizEditorDialog({
     })
   });
 }
-const styles$p = {
+const styles$q = {
   content: {
     maxWidth: "mly14zcgw3",
     width: "mly14rvwrp",
@@ -32137,7 +32143,7 @@ function Visualization$1({
     onClick: () => updateViz(viz)
   }));
   const tokens2 = [/* @__PURE__ */ jsxRuntime.jsx(SelectorToken, {
-    customStyle: styles$o.first,
+    customStyle: styles$p.first,
     icon: `viz_${currentRenderer}`,
     value: currentRenderer,
     items,
@@ -32147,7 +32153,7 @@ function Visualization$1({
     tokens2.push(/* @__PURE__ */ jsxRuntime.jsx(Token, {
       icon: "gear",
       onClick: () => setOpen(true),
-      customStyle: styles$o.trigger,
+      customStyle: styles$p.trigger,
       tooltip: "Edit Settings..."
     }, "gear"));
   }
@@ -32155,12 +32161,12 @@ function Visualization$1({
     tokens2.push(/* @__PURE__ */ jsxRuntime.jsx(Token, {
       icon: "warning",
       tooltip: error,
-      customStyle: styles$o.trigger
+      customStyle: styles$p.trigger
     }));
   }
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/* @__PURE__ */ jsxRuntime.jsx(TokenGroup, {
-      customStyle: styles$o.group,
+      customStyle: styles$p.group,
       children: tokens2
     }), /* @__PURE__ */ jsxRuntime.jsx(VizEditorDialog, {
       open,
@@ -32170,7 +32176,7 @@ function Visualization$1({
     })]
   });
 }
-const styles$o = {
+const styles$p = {
   trigger: {
     height: "mly1ktj5wk",
     $$css: true
@@ -32207,7 +32213,7 @@ function ViewAttributeTable({
 }) {
   const dimensions = viewInfo.schema.fields.filter((f2) => f2.kind === "dimension");
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ..._stylex.props(styles$n.attributeTableContainer, style),
+    ..._stylex.props(styles$o.attributeTableContainer, style),
     children: /* @__PURE__ */ jsxRuntime.jsx("table", {
       ...{
         className: "mly1mwwwfo mly9f619 mlyh8yej3 mly5yr21d"
@@ -32245,9 +32251,9 @@ function ViewAttributeTableRow({
       className: "mlydpxx8g"
     },
     children: [/* @__PURE__ */ jsxRuntime.jsx("td", {
-      ..._stylex.props(styles$n.attributeTableKeyCell, fontStyles.supporting),
+      ..._stylex.props(styles$o.attributeTableKeyCell, fontStyles.supporting),
       children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(styles$n.attributeTableKeyCellContent, fontStyles.supporting),
+        ..._stylex.props(styles$o.attributeTableKeyCellContent, fontStyles.supporting),
         children: attribute
       })
     }), /* @__PURE__ */ jsxRuntime.jsx("td", {
@@ -32258,7 +32264,7 @@ function ViewAttributeTableRow({
     })]
   });
 }
-const styles$n = {
+const styles$o = {
   attributeTableContainer: {
     padding: "mlye8ttls",
     paddingInline: null,
@@ -32388,12 +32394,12 @@ function RichText({
   });
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
     ref,
-    ..._stylex.props(multiLine && styles$m.preWrap, multiLine && styles$m.breakWord, customStyle),
+    ..._stylex.props(multiLine && styles$n.preWrap, multiLine && styles$n.breakWord, customStyle),
     ...props2,
     children: formatted
   });
 }
-const styles$m = {
+const styles$n = {
   preWrap: {
     whiteSpace: "mly126k92a",
     $$css: true
@@ -32422,7 +32428,7 @@ function HoverText({
         onMouseEnter: () => setIsTriggerHovered(true),
         onMouseLeave: () => setIsTriggerHovered(false),
         onPointerMove: (e) => e.preventDefault(),
-        customStyle: [fontStyles.supporting, styles$l.text],
+        customStyle: [fontStyles.supporting, styles$m.text],
         children: text2
       })
     }), /* @__PURE__ */ jsxRuntime.jsx(Portal$4, {
@@ -32441,7 +32447,7 @@ function HoverText({
     })]
   });
 }
-const styles$l = {
+const styles$m = {
   text: {
     overflow: "mlyb3r6kr",
     overflowX: null,
@@ -32468,7 +32474,7 @@ function FieldHoverCard({
     details = /* @__PURE__ */ jsxRuntime.jsx(ViewAttributeTable, {
       viewInfo: field,
       isCompact: true,
-      style: styles$k.viewAttributeTable
+      style: styles$l.viewAttributeTable
     });
   } else if (field.kind === "dimension") {
     details = /* @__PURE__ */ jsxRuntime.jsx(TopValuesTable, {
@@ -32477,7 +32483,7 @@ function FieldHoverCard({
     });
   }
   return /* @__PURE__ */ jsxRuntime.jsxs(HoverCard, {
-    customStyle: styles$k.container,
+    customStyle: styles$l.container,
     children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
       ref,
       children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -32488,10 +32494,10 @@ function FieldHoverCard({
           field
         })
       }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(fontStyles.supporting, styles$k.path),
+        ..._stylex.props(fontStyles.supporting, styles$l.path),
         children: pathString
       }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(fontStyles.emphasized, styles$k.title),
+        ..._stylex.props(fontStyles.emphasized, styles$l.title),
         children: field.name
       }), description && /* @__PURE__ */ jsxRuntime.jsx(HoverText, {
         text: description,
@@ -32502,7 +32508,7 @@ function FieldHoverCard({
     })]
   });
 }
-const styles$k = {
+const styles$l = {
   container: {
     width: "mlybl57os",
     maxHeight: "mlyq3t0pi",
@@ -32735,7 +32741,7 @@ function ValueList({
     children: (stringSearchResults == null ? void 0 : stringSearchResults.length) ? stringSearchResults.map((value) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
       role: "menuitem",
       tabIndex: -1,
-      ..._stylex.props(addMenuStyles.item, styles$j.valueItem),
+      ..._stylex.props(addMenuStyles.item, styles$k.valueItem),
       onClick: () => onClick(value),
       children: [/* @__PURE__ */ jsxRuntime.jsx(Value, {
         value
@@ -32759,10 +32765,10 @@ function Value({
     label: value.fieldValue ?? "∅",
     icon: "filter",
     color: "purple",
-    customStyle: styles$j.token
+    customStyle: styles$k.token
   });
 }
-const styles$j = {
+const styles$k = {
   valueItem: {
     height: "mly1qx5ct2",
     paddingTop: "mly1y1aw1k",
@@ -32938,7 +32944,7 @@ const StringFilterCore = ({
               setSearchValue("");
             }
           },
-          customStyle: styles$i.valueList,
+          customStyle: styles$j.valueList,
           showPath: false,
           filter: (value) => !currentFilter.values.includes(value),
           hideNoMatchMessage: true
@@ -33009,7 +33015,7 @@ function stringFilterChangeType(filter, type) {
       };
   }
 }
-const styles$i = {
+const styles$j = {
   valueList: {
     maxHeight: "mly3d5gib",
     width: "mly1hfn5x7",
@@ -33961,7 +33967,7 @@ function FieldList({
     ..._stylex.props(customStyle),
     children: groups.length ? groups.map((group) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
       children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(addMenuStyles.item, styles$h.fieldItem, styles$h.sticky),
+        ..._stylex.props(addMenuStyles.item, styles$i.fieldItem, styles$i.sticky),
         "data-disabled": "true",
         children: group.name
       }), group.fields.map((field) => isFilterOperation && (field.kind === "dimension" || field.kind === "measure") ? /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
@@ -33971,7 +33977,7 @@ function FieldList({
         anchor: /* @__PURE__ */ jsxRuntime.jsx("div", {
           role: "menuitem",
           tabIndex: -1,
-          ..._stylex.props(addMenuStyles.item, styles$h.fieldItem),
+          ..._stylex.props(addMenuStyles.item, styles$i.fieldItem),
           children: /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, {
             asChild: true,
             children: /* @__PURE__ */ jsxRuntime.jsx(FieldToken, {
@@ -33998,7 +34004,7 @@ function FieldList({
       }, group.name + ":" + field.name) : /* @__PURE__ */ jsxRuntime.jsx("div", {
         role: "menuitem",
         tabIndex: -1,
-        ..._stylex.props(addMenuStyles.item, styles$h.fieldItem),
+        ..._stylex.props(addMenuStyles.item, styles$i.fieldItem),
         children: /* @__PURE__ */ jsxRuntime.jsx(FieldToken, {
           field,
           onClick: () => onAddOperation(field, group.path),
@@ -34021,7 +34027,7 @@ function FieldList({
     })
   });
 }
-const styles$h = {
+const styles$i = {
   fieldItem: {
     height: "mly1qx5ct2",
     paddingTop: "mly1y1aw1k",
@@ -34050,7 +34056,7 @@ function FieldMenu({
 }) {
   const [search, setSearch] = React.useState("");
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(addMenuStyles.content, styles$g.content),
+    ..._stylex.props(addMenuStyles.content, styles$h.content),
     role: "menu",
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
       ..._stylex.props(addMenuStyles.item),
@@ -34076,7 +34082,7 @@ function FieldMenu({
     })]
   });
 }
-const styles$g = {
+const styles$h = {
   content: {
     maxHeight: "mly3d5gib",
     $$css: true
@@ -34301,7 +34307,7 @@ function OperationActionTitle({
     return !(segment == null ? void 0 : segment.hasField(field.name, path)) && isNotAnnotatedFilteredField(field);
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(styles$u.title, hoverStyles.main),
+    ..._stylex.props(styles$v.title, hoverStyles.main),
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
       children: title
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -34472,7 +34478,7 @@ function SortableOperations({
       fields,
       ...props2
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.tokenContainer),
+      ..._stylex.props(styles$v.tokenContainer),
       children: /* @__PURE__ */ jsxRuntime.jsx(DndContext, {
         sensors,
         collisionDetection: closestCenter,
@@ -34990,10 +34996,10 @@ function FilterOperations({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.title),
+      ..._stylex.props(styles$v.title),
       children: "filter by"
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.tokenContainer),
+      ..._stylex.props(styles$v.tokenContainer),
       children: filters.map((filterOperation, key2) => {
         return /* @__PURE__ */ jsxRuntime.jsx(ErrorElement, {
           fallback: /* @__PURE__ */ jsxRuntime.jsxs("div", {
@@ -35080,7 +35086,7 @@ function LimitOperation({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.title),
+      ..._stylex.props(styles$v.title),
       children: "limit"
     }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
       ..._stylex.props(hoverStyles.main),
@@ -35125,10 +35131,10 @@ function OrderByOperations({
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
     children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.title),
+      ..._stylex.props(styles$v.title),
       children: "order by"
     }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.tokenContainer),
+      ..._stylex.props(styles$v.tokenContainer),
       children: orderBys.map((orderBy) => {
         const {
           fieldReference
@@ -35211,7 +35217,7 @@ function AddItem({
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
         role: "menuitem",
         tabIndex: -1,
-        ..._stylex.props(addMenuStyles.item, addMenuStyles.clickable, open ? styles$f.open : null),
+        ..._stylex.props(addMenuStyles.item, addMenuStyles.clickable, open ? styles$g.open : null),
         onClick: doOnClick,
         "data-disabled": disabled ? "true" : void 0,
         children: [/* @__PURE__ */ jsxRuntime.jsxs("div", {
@@ -35235,7 +35241,7 @@ function AddItem({
     }) : null]
   });
 }
-const styles$f = {
+const styles$g = {
   open: {
     background: "mly16o7sp0",
     backgroundAttachment: null,
@@ -35304,10 +35310,10 @@ function AddFieldItem({
     onAddOperation,
     isFilterOperation,
     search,
-    customStyle: styles$e.list
+    customStyle: styles$f.list
   });
 }
-const styles$e = {
+const styles$f = {
   list: {
     minWidth: "mly2ixbly",
     maxWidth: "mly1j9u4d2",
@@ -35492,7 +35498,7 @@ function AddMenu({
             value: search,
             onChange: setSearch,
             placeholder: "Search...",
-            customStyle: styles$d.search
+            customStyle: styles$e.search
           })
         }), /* @__PURE__ */ jsxRuntime.jsx(Divider, {}), /* @__PURE__ */ jsxRuntime.jsxs("div", {
           ...{
@@ -35606,7 +35612,7 @@ function AddMenu({
     })]
   });
 }
-const styles$d = {
+const styles$e = {
   search: {
     width: "mlyh8yej3",
     $$css: true
@@ -35649,7 +35655,7 @@ function NestOperations({
     return null;
   }
   return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    ..._stylex.props(styles$u.tokenContainer),
+    ..._stylex.props(styles$v.tokenContainer),
     children: nests.map((nest) => /* @__PURE__ */ jsxRuntime.jsx(NestOperation, {
       view,
       nest
@@ -35840,11 +35846,11 @@ function CollapsingView({
       })]
     }), !collapsed && /* @__PURE__ */ jsxRuntime.jsx(ViewAttributeTable, {
       viewInfo: viewDef.getViewInfo(),
-      style: styles$c.preview
+      style: styles$d.preview
     })]
   });
 }
-const styles$c = {
+const styles$d = {
   preview: {
     height: "mlyt7dq6l",
     maxHeight: "mly1hkcv85",
@@ -35965,9 +35971,9 @@ function Source({
 }) {
   if (definition instanceof malloyQueryBuilder.ASTArrowQueryDefinition) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", {
-      ..._stylex.props(styles$u.queryCard, styles$b.content),
+      ..._stylex.props(styles$v.queryCard, styles$c.content),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
-        ..._stylex.props(styles$u.labelWithIcon),
+        ..._stylex.props(styles$v.labelWithIcon),
         children: [/* @__PURE__ */ jsxRuntime.jsx(Icon, {
           name: "database"
         }), /* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -35981,7 +35987,7 @@ function Source({
   }
   return null;
 }
-const styles$b = {
+const styles$c = {
   content: {
     display: "mlyrvj5dj",
     gridAutoFlow: "mly1mt1orb",
@@ -36032,15 +36038,15 @@ function DateLiteralEditor({
     children: [/* @__PURE__ */ jsxRuntime.jsx(Trigger$2, {
       asChild: true,
       children: /* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(tokenStyles.main, styles$a.wrapper, customStyle),
+        ..._stylex.props(tokenStyles.main, styles$b.wrapper, customStyle),
         children: /* @__PURE__ */ jsxRuntime.jsx(DateInput, {
           value: hooks.utc(date).toDate(),
           setValue: onSetValue,
           units,
           onFocus: () => setOpen(true),
           customStyle: {
-            ...styles$a.input,
-            ...isDate2 ? styles$a.dateInput : styles$a.timestampInput
+            ...styles$b.input,
+            ...isDate2 ? styles$b.dateInput : styles$b.timestampInput
           },
           forwardRef: input
         })
@@ -36056,14 +36062,14 @@ function DateLiteralEditor({
           setValue: onSetValue,
           units,
           maxLevel: units,
-          customStyle: styles$a.datePicker,
+          customStyle: styles$b.datePicker,
           forwardRef: picker
         })
       })
     })]
   });
 }
-const styles$a = {
+const styles$b = {
   input: {
     border: "mly1gs6z28",
     borderWidth: null,
@@ -36331,7 +36337,7 @@ function Parameters({
         children: sourceParameters.map((parameter) => {
           var _a2;
           return /* @__PURE__ */ jsxRuntime.jsxs(TokenGroup, {
-            customStyle: styles$9.tokenGroup,
+            customStyle: styles$a.tokenGroup,
             children: [/* @__PURE__ */ jsxRuntime.jsx(Token, {
               icon: atomicTypeToIcon(parameter.type.kind),
               label: parameter.name
@@ -36350,7 +36356,7 @@ function Parameters({
   }
   return null;
 }
-const styles$9 = {
+const styles$a = {
   tokenGroup: {
     display: "mly78zum5",
     $$css: true
@@ -36368,7 +36374,7 @@ function QueryEditor() {
     definition
   } = rootQuery;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    ..._stylex.props(fontStyles.body, styles$8.main),
+    ..._stylex.props(fontStyles.body, styles$9.main),
     children: [/* @__PURE__ */ jsxRuntime.jsx(Source, {
       definition
     }), /* @__PURE__ */ jsxRuntime.jsx(Parameters, {
@@ -36378,7 +36384,7 @@ function QueryEditor() {
     })]
   });
 }
-const styles$8 = {
+const styles$9 = {
   main: {
     display: "mly78zum5",
     flexDirection: "mlydt5ytf",
@@ -36428,7 +36434,7 @@ function BookmarkedView({
             label: "view",
             icon: "view_filled",
             color: "purple",
-            customStyle: styles$7.viewBadge
+            customStyle: styles$8.viewBadge
           }), /* @__PURE__ */ jsxRuntime.jsx(Button, {
             variant: "default",
             size: "compact",
@@ -36444,14 +36450,14 @@ function BookmarkedView({
           })]
         })]
       }),
-      customStyle: styles$7.card,
+      customStyle: styles$8.card,
       children: /* @__PURE__ */ jsxRuntime.jsx(ViewAttributeTable, {
         viewInfo
       })
     })
   });
 }
-const styles$7 = {
+const styles$8 = {
   viewBadge: {
     backgroundColor: "mlyjbqb8w",
     $$css: true
@@ -36474,7 +36480,7 @@ function EmptyQueryDisplay({
         className: "mly1bpp3o7 mly78zum5 mlydt5ytf mlyl56j7k mly6s0dn4"
       },
       children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-        ..._stylex.props(styles$6.header, fontStyles.emphasized),
+        ..._stylex.props(styles$7.header, fontStyles.emphasized),
         children: "Start with a Bookmarked View"
       }), /* @__PURE__ */ jsxRuntime.jsx("div", {
         ...{
@@ -36490,7 +36496,7 @@ function EmptyQueryDisplay({
     })
   });
 }
-const styles$6 = {
+const styles$7 = {
   header: {
     paddingBottom: "mly1l90r2v",
     $$css: true
@@ -36684,7 +36690,7 @@ function RunInfoHover({
     children: [/* @__PURE__ */ jsxRuntime.jsx(Trigger$4, {
       asChild: true,
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
-        ..._stylex.props(styles$5.triggerContentContainer, fontStyles.body),
+        ..._stylex.props(styles$6.triggerContentContainer, fontStyles.body),
         children: [/* @__PURE__ */ jsxRuntime.jsx(Icon, {
           name: "info",
           color: "disabled"
@@ -36695,7 +36701,7 @@ function RunInfoHover({
         side: HOVER_SIDE,
         align: HOVER_ALIGN,
         children: /* @__PURE__ */ jsxRuntime.jsx(HoverCard, {
-          customStyle: styles$5.card,
+          customStyle: styles$6.card,
           children: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
             children: [runInfo.customContent, (runInfo == null ? void 0 : runInfo.performanceAspects) && Object.entries(runInfo.performanceAspects).map(([aspect, properties2]) => {
               return /* @__PURE__ */ jsxRuntime.jsx("div", {
@@ -36713,7 +36719,7 @@ function RunInfoHover({
               href: runInfo.queryLink.href,
               target: "_blank",
               rel: "noreferrer",
-              ..._stylex.props(styles$5.link, fontStyles.link),
+              ..._stylex.props(styles$6.link, fontStyles.link),
               children: runInfo.queryLink.linkText
             })]
           })
@@ -36722,7 +36728,7 @@ function RunInfoHover({
     })]
   });
 }
-const styles$5 = {
+const styles$6 = {
   card: {
     maxWidth: "mly1dc814f",
     $$css: true
@@ -36973,7 +36979,7 @@ function LoadingDisplay({
       },
       children: [/* @__PURE__ */ jsxRuntime.jsx(Spinner, {
         size: "large",
-        customStyle: styles$4.spinner
+        customStyle: styles$5.spinner
       }), /* @__PURE__ */ jsxRuntime.jsx("div", {
         ..._stylex.props(fontStyles.emphasized),
         children: `${EXECUTION_STATES[executionState]} query...`
@@ -36997,7 +37003,7 @@ function useTimeElapsedMillis(queryResolutionStartMillis) {
   }, [queryResolutionStartMillis]);
   return time;
 }
-const styles$4 = {
+const styles$5 = {
   spinner: {
     marginBottom: "mly1e56ztr",
     $$css: true
@@ -37066,6 +37072,383 @@ function CopyToClipboard({
     }
   });
 }
+class DataWriter {
+  constructor(stream, result) {
+    this.stream = stream;
+    this.result = result;
+  }
+}
+class JSONWriter extends DataWriter {
+  async process(data) {
+    this.stream.write("[\n");
+    let first = true;
+    for await (const row of data) {
+      if (first) {
+        first = false;
+      } else {
+        this.stream.write(",\n");
+      }
+      const json2 = JSON.stringify(toObject(this.result.schema.fields.filter((field) => field.kind === "dimension"), row.record_value), null, 2);
+      const jsonLines = json2.split("\n");
+      for (let i2 = 0; i2 < jsonLines.length; i2++) {
+        const line = jsonLines[i2];
+        this.stream.write(`  ${line}`);
+        if (i2 < jsonLines.length - 1) {
+          this.stream.write("\n");
+        }
+      }
+    }
+    this.stream.write("\n]\n");
+    this.stream.close();
+  }
+}
+class CSVWriter extends DataWriter {
+  constructor() {
+    super(...arguments);
+    this.columnSeparator = ",";
+    this.rowSeparator = "\n";
+    this.quoteCharacter = '"';
+    this.includeHeader = true;
+    this.emptyCell = "";
+  }
+  escape(value) {
+    const hasInnerQuote = value.includes(this.quoteCharacter);
+    const hasInnerCommas = value.includes(this.columnSeparator);
+    const hasNewline = value.includes(this.rowSeparator);
+    const needsQuoting = hasInnerCommas || hasInnerQuote || hasNewline;
+    if (hasInnerQuote) {
+      value = value.replace(new RegExp(this.quoteCharacter, "g"), this.quoteCharacter + this.quoteCharacter);
+    }
+    if (needsQuoting) {
+      value = this.quoteCharacter + value + this.quoteCharacter;
+    }
+    return value;
+  }
+  // Re-using the old stringify method for sanity.
+  stringify(value) {
+    switch (value.kind) {
+      case "string_cell":
+        return this.escape(value.string_value);
+      case "boolean_cell":
+        return JSON.stringify(value.boolean_value);
+      case "number_cell":
+        return JSON.stringify(value.number_value);
+      case "date_cell":
+        return value.date_value;
+      case "timestamp_cell":
+        return value.timestamp_value;
+      case "json_cell":
+        return this.escape(value.json_value);
+      case "null_cell":
+        return this.emptyCell;
+      case "sql_native_cell":
+        return this.escape(value.sql_native_value);
+    }
+    return "";
+  }
+  // Extra weight to be added because of nested tables inside the cells.
+  getColWeight(fields) {
+    let numKeys = 0;
+    for (const field of fields) {
+      numKeys = numKeys + 1;
+      if (field.type.kind === "array_type" && field.type.element_type.kind === "record_type") {
+        const weight = this.getColWeight(field.type.element_type.fields) - 1;
+        numKeys = numKeys + weight;
+      }
+    }
+    return numKeys;
+  }
+  // Get header row along with extra empty spaces for nested children.
+  getHeaderRow(fields) {
+    const csv = [];
+    let width = 0;
+    for (const field of fields) {
+      csv.push(this.escape(field.name));
+      width++;
+      if (field.type.kind === "array_type" && field.type.element_type.kind === "record_type") {
+        const numKeys = this.getColWeight(field.type.element_type.fields) - 1;
+        width = width + numKeys;
+        for (let i2 = 0; i2 < numKeys; i2++) {
+          csv.push(this.emptyCell);
+        }
+      }
+    }
+    return {
+      rows: [csv.join(this.columnSeparator)],
+      length: 1,
+      width
+    };
+  }
+  // Merge the child matrices i.e. merge the columns into one bigger matrix i.e. CSV.
+  mergeMatrices(matrices) {
+    const maxLength = Math.max(...matrices.map((matrix) => matrix.length));
+    const matrixWidth = matrices.reduce((sum, matrix) => sum + matrix.width, 0);
+    const csvMatrix = [];
+    for (let i2 = 0; i2 < maxLength; i2++) {
+      const csvRow = [];
+      for (const matrix of matrices) {
+        if (i2 < matrix.length) {
+          csvRow.push(matrix.rows[i2]);
+        } else {
+          const emptyCells = Array(matrix.width).fill(this.emptyCell);
+          csvRow.push(...emptyCells);
+        }
+      }
+      csvMatrix.push(csvRow.join(this.columnSeparator));
+    }
+    return {
+      rows: csvMatrix,
+      length: maxLength,
+      width: matrixWidth
+    };
+  }
+  // Gets CSV for a data cell that has nested data.
+  getChildMatrix(fields, value) {
+    if (value.kind !== "array_cell") {
+      return {
+        rows: ["Invalid data found, value is not an array"],
+        length: 1,
+        width: 1
+      };
+    } else if (value.array_value.length === 0) {
+      return {
+        rows: [""],
+        length: 1,
+        width: 1
+      };
+    }
+    const csvMatrix = [];
+    const header = this.getHeaderRow(fields);
+    csvMatrix.push(...header.rows);
+    const width = header.width;
+    let rowCount = 1;
+    for (const row of value.array_value) {
+      if (row.kind === "record_cell") {
+        const rowMatrix = this.getRowMatrix(fields, row.record_value);
+        rowCount = rowCount + rowMatrix.length;
+        csvMatrix.push(...rowMatrix.rows);
+      }
+    }
+    return {
+      rows: csvMatrix,
+      length: rowCount,
+      width
+    };
+  }
+  // Creates CSV content for one row of data.
+  getRowMatrix(fields, row) {
+    const matrices = [];
+    for (let idx = 0; idx < fields.length; idx++) {
+      const field = fields[idx];
+      const val = row[idx];
+      if (field.type.kind === "array_type" && field.type.element_type.kind === "record_type") {
+        const cell = this.getChildMatrix(field.type.element_type.fields, val);
+        matrices.push(cell);
+      } else {
+        const cell = {
+          rows: [this.stringify(val)],
+          length: 1,
+          width: 1
+        };
+        matrices.push(cell);
+      }
+    }
+    return this.mergeMatrices(matrices);
+  }
+  async process(data) {
+    let headerDefined = false;
+    for await (const row of data) {
+      const fields = this.result.schema.fields.filter((field) => field.kind === "dimension");
+      if (!headerDefined && this.includeHeader) {
+        const header = this.getHeaderRow(fields);
+        this.stream.write(header.rows[0]);
+        this.stream.write(this.rowSeparator);
+        headerDefined = true;
+      }
+      const rowCsv = this.getRowMatrix(fields, row.record_value);
+      for (const line of rowCsv.rows) {
+        this.stream.write(line);
+        this.stream.write(this.rowSeparator);
+      }
+    }
+    this.stream.close();
+  }
+}
+function toObject(fields, data) {
+  const result = {};
+  for (let idx = 0; idx < fields.length; idx++) {
+    const field = fields[idx];
+    const value = data[idx];
+    switch (value.kind) {
+      case "string_cell":
+        result[field.name] = value.string_value;
+        break;
+      case "boolean_cell":
+        result[field.name] = value.boolean_value;
+        break;
+      case "date_cell":
+        result[field.name] = value.date_value;
+        break;
+      case "timestamp_cell":
+        result[field.name] = value.timestamp_value;
+        break;
+      case "number_cell":
+        result[field.name] = value.number_value;
+        break;
+      case "json_cell":
+        result[field.name] = value.json_value;
+        break;
+      case "record_cell":
+        result[field.name] = toObject(fields, value.record_value);
+        break;
+      case "array_cell":
+        if (field.type.kind === "array_type" && field.type.element_type.kind === "record_type") {
+          const ary = [];
+          for (const cell of value.array_value) {
+            if (cell.kind === "record_cell") {
+              ary.push(toObject(field.type.element_type.fields, cell.record_value));
+            }
+          }
+          result[field.name] = ary;
+        }
+        break;
+      case "null_cell":
+        result[field.name] = null;
+        break;
+      case "sql_native_cell":
+        result[field.name] = value.sql_native_value;
+        break;
+    }
+  }
+  return result;
+}
+async function* dataIterator(result) {
+  var _a2;
+  if (((_a2 = result.data) == null ? void 0 : _a2.kind) === "array_cell") {
+    for (const row of result.data.array_value) {
+      if (row.kind === "record_cell") {
+        yield row;
+      }
+    }
+  }
+}
+function DownloadButton({
+  name = "malloy",
+  result
+}) {
+  const [href, setHref] = React.useState("");
+  const [fileName, setFileName] = React.useState("");
+  const [format2, _setFormat] = React.useState("csv");
+  React.useEffect(() => {
+    const createBlob = async () => {
+      if (!result) {
+        setHref("");
+        return;
+      }
+      const writeStream = new MemoryWriteStream();
+      let writer;
+      let type;
+      let fileName2;
+      if (format2 === "json") {
+        writer = new JSONWriter(writeStream, result);
+        type = "text/json";
+        fileName2 = `${name}.json`;
+      } else {
+        writer = new CSVWriter(writeStream, result);
+        type = "text/csv";
+        fileName2 = `${name}.csv`;
+      }
+      const rowStream = dataIterator(result);
+      await writer.process(rowStream);
+      writeStream.close();
+      const data = writeStream.data;
+      const blob = new Blob([data], {
+        type
+      });
+      setHref(window.URL.createObjectURL(blob));
+      setFileName(fileName2);
+    };
+    void createBlob();
+  }, [name, format2, result]);
+  React.useEffect(() => {
+    return () => {
+      if (href) {
+        window.URL.revokeObjectURL(href);
+      }
+    };
+  }, [href]);
+  if (href) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("a", {
+      href,
+      download: fileName,
+      ...props(styles$4.link, fontStyles.body),
+      children: [/* @__PURE__ */ jsxRuntime.jsx(Icon, {
+        name: "download"
+      }), /* @__PURE__ */ jsxRuntime.jsx("div", {
+        children: "Download CSV"
+      })]
+    });
+  } else {
+    return null;
+  }
+}
+class MemoryWriteStream {
+  constructor() {
+    this._data = [];
+  }
+  write(data) {
+    this._data.push(data);
+  }
+  close() {
+  }
+  get data() {
+    return this._data.join("");
+  }
+}
+const styles$4 = {
+  link: {
+    display: "mly78zum5",
+    alignContent: "mlyc26acl",
+    gap: "mly167g77z",
+    rowGap: null,
+    columnGap: null,
+    textDecoration: "mly1hl2dhg",
+    textDecorationColor: null,
+    textDecorationLine: null,
+    textDecorationStyle: null,
+    textDecorationThickness: null,
+    background: "mly1md70p1 mly14hn1a8 mlywghvya",
+    backgroundAttachment: null,
+    backgroundClip: null,
+    backgroundColor: null,
+    backgroundImage: null,
+    backgroundOrigin: null,
+    backgroundPosition: null,
+    backgroundPositionX: null,
+    backgroundPositionY: null,
+    backgroundRepeat: null,
+    backgroundSize: null,
+    borderRadius: "mlyur7f20",
+    borderStartStartRadius: null,
+    borderStartEndRadius: null,
+    borderEndStartRadius: null,
+    borderEndEndRadius: null,
+    borderTopLeftRadius: null,
+    borderTopRightRadius: null,
+    borderBottomLeftRadius: null,
+    borderBottomRightRadius: null,
+    padding: "mlyfawy5m",
+    paddingInline: null,
+    paddingStart: null,
+    paddingLeft: null,
+    paddingEnd: null,
+    paddingRight: null,
+    paddingBlock: null,
+    paddingTop: null,
+    paddingBottom: null,
+    $$css: true
+  }
+};
 var Tab = /* @__PURE__ */ function(Tab2) {
   Tab2["RESULTS"] = "Results";
   Tab2["MALLOY"] = "Malloy";
@@ -37080,7 +37463,7 @@ function ResultPanel({
   submittedQuery,
   options
 }) {
-  var _a2, _b2, _c2;
+  var _a2, _b2, _c2, _d;
   const [tab, setTab] = React.useState(Tab.MALLOY);
   const malloyText = (_a2 = useQueryBuilder(source, draftQuery)) == null ? void 0 : _a2.toMalloy();
   const views = source.schema.fields.filter((f2) => f2.kind === "view");
@@ -37138,6 +37521,8 @@ function ResultPanel({
       }), tab !== Tab.RESULTS && clipboardText && /* @__PURE__ */ jsxRuntime.jsx(CopyToClipboard, {
         text: clipboardText,
         label: "Copy Code"
+      }), tab === Tab.RESULTS && /* @__PURE__ */ jsxRuntime.jsx(DownloadButton, {
+        result: (_b2 = submittedQuery == null ? void 0 : submittedQuery.response) == null ? void 0 : _b2.result
       })]
     }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
       ...{
@@ -37187,7 +37572,7 @@ function ResultPanel({
         ...{
           className: "mlywp4ipm mlyh8yej3 mly5yr21d mly9f619"
         },
-        children: ((_c2 = (_b2 = submittedQuery == null ? void 0 : submittedQuery.response) == null ? void 0 : _b2.result) == null ? void 0 : _c2.sql) && /* @__PURE__ */ jsxRuntime.jsx(CodeBlock, {
+        children: ((_d = (_c2 = submittedQuery == null ? void 0 : submittedQuery.response) == null ? void 0 : _c2.result) == null ? void 0 : _d.sql) && /* @__PURE__ */ jsxRuntime.jsx(CodeBlock, {
           code: submittedQuery.response.result.sql,
           language: "sql"
         })
@@ -37443,7 +37828,7 @@ function useOperations(view, field, path) {
   const groupByDisabledReason = React.useMemo(() => {
     const segment = getSegmentIfPresent(view);
     if ((matchingFieldItem == null ? void 0 : matchingFieldItem.field.kind) !== "dimension") {
-      return "Grouping is only available on a dimenion.";
+      return "Grouping is only available on a dimension.";
     }
     if (segment == null ? void 0 : segment.hasField(field.name, path)) {
       return "Cannot group by a field already in the view.";
@@ -37512,125 +37897,30 @@ function FieldTokenWithActions({
   path,
   viewDef
 }) {
-  const updateQuery = useUpdateQuery();
   const {
     focusedNestView
   } = useQueryFocus();
+  const updateQuery = useUpdateQuery();
   const view = focusedNestView ?? viewDef;
-  const {
-    groupByDisabledReason,
-    aggregateDisabledReason,
-    filterDisabledReason,
-    orderByDisabledReason
-  } = useOperations(view, field, path);
-  const [isFilterPopoverOpen, setIsFilterPopoverOpen] = React.useState();
+  const [isFilterPopoverOpen, setIsFilterPopoverOpen] = React.useState(false);
   const [isTooltipOpen, setIsTooltipOpen] = React.useState(false);
-  const handleAddOperationAction = (operation, filter) => {
-    if (field.kind === "dimension" || field.kind === "measure") {
-      if (operation === "groupBy" && !groupByDisabledReason) {
-        addGroupBy(view, field, path);
-      } else if (operation === "aggregate" && !aggregateDisabledReason) {
-        addAggregate(view, field, path);
-      } else if (operation === "orderBy" && !orderByDisabledReason) {
-        addOrderByFromSource(view, path, field.name);
-      } else if (operation === "filter" && !filterDisabledReason && filter) {
-        addFilter(view, field, path, filter);
-      }
-      updateQuery();
-    }
-  };
-  const handleSetView = () => {
-    if (field.kind === "view" && rootQuery.isEmpty()) {
-      rootQuery.setView(field.name);
-      updateQuery();
-    }
-  };
-  const handleAddView = () => {
-    if (field.kind === "view") {
-      addNest(view, field);
-      updateQuery();
-    }
-  };
+  const showHover = isFilterPopoverOpen || isTooltipOpen;
   return /* @__PURE__ */ jsxRuntime.jsx(FieldToken, {
     field,
-    hoverActions: field.kind === "view" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-        icon: "insert",
-        disabled: !rootQuery.isEmpty(),
-        onClick: handleSetView,
-        tooltip: !rootQuery.isEmpty() ? "Can only add a view to an empty query." : "Add view",
-        onTooltipOpenChange: setIsTooltipOpen
-      }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-        icon: "nest",
-        onClick: handleAddView,
-        tooltip: "Add as new nested query",
-        onTooltipOpenChange: setIsTooltipOpen
-      })]
-    }) : field.kind === "measure" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-        icon: "aggregate",
-        tooltip: aggregateDisabledReason || "Add as aggregate",
-        disabled: !!aggregateDisabledReason,
-        onClick: () => handleAddOperationAction("aggregate"),
-        onTooltipOpenChange: setIsTooltipOpen
-      }), /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
-        fieldInfo: field,
-        path,
-        setFilter: (filter) => handleAddOperationAction("filter", filter),
-        trigger: /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-          icon: "filter",
-          tooltip: filterDisabledReason || "Add as filter",
-          disabled: !!filterDisabledReason,
-          onTooltipOpenChange: setIsTooltipOpen
-        }),
-        onOpenChange: setIsFilterPopoverOpen,
-        layoutProps: {
-          align: "start"
-        }
-      }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-        icon: "orderBy",
-        tooltip: orderByDisabledReason || "Add as order by",
-        disabled: !!orderByDisabledReason,
-        onClick: () => handleAddOperationAction("orderBy"),
-        onTooltipOpenChange: setIsTooltipOpen
-      })]
-    }) : field.kind === "dimension" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-        icon: "groupBy",
-        tooltip: groupByDisabledReason || "Add as group by",
-        disabled: !!groupByDisabledReason,
-        onClick: () => handleAddOperationAction("groupBy"),
-        onTooltipOpenChange: setIsTooltipOpen
-      }), /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
-        fieldInfo: field,
-        path,
-        setFilter: (filter) => handleAddOperationAction("filter", filter),
-        trigger: /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-          icon: "filter",
-          tooltip: filterDisabledReason || "Add as filter",
-          disabled: !!filterDisabledReason,
-          onTooltipOpenChange: setIsTooltipOpen
-        }),
-        onOpenChange: setIsFilterPopoverOpen,
-        layoutProps: {
-          align: "start"
-        }
-      }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
-        icon: "orderBy",
-        tooltip: orderByDisabledReason || "Add as order by",
-        disabled: !!orderByDisabledReason,
-        onClick: () => handleAddOperationAction("orderBy"),
-        onTooltipOpenChange: setIsTooltipOpen
-      })]
-    }) : null,
-    onClick: field.kind === "dimension" && !groupByDisabledReason ? () => handleAddOperationAction("groupBy") : field.kind === "measure" && !aggregateDisabledReason ? () => handleAddOperationAction("aggregate") : field.kind === "view" ? () => {
-      if (rootQuery.isEmpty()) {
-        handleSetView();
-      } else {
-        handleAddView();
+    hoverActions: /* @__PURE__ */ jsxRuntime.jsx(QueryEditorActions, {
+      rootQuery,
+      field,
+      view,
+      path,
+      setIsFilterPopoverOpen,
+      setIsTooltipOpen
+    }),
+    onClick: () => {
+      if (queryEditorClick(rootQuery, view, field, path)) {
+        updateQuery();
       }
-    } : void 0,
-    hoverActionsVisible: isFilterPopoverOpen || isTooltipOpen,
+    },
+    hoverActionsVisible: showHover,
     tooltip: /* @__PURE__ */ jsxRuntime.jsx(FieldHoverCard, {
       field,
       path
@@ -37666,6 +37956,143 @@ function ActionButton({
     })]
   });
 }
+function QueryEditorActions({
+  rootQuery,
+  view,
+  field,
+  path,
+  setIsTooltipOpen,
+  setIsFilterPopoverOpen
+}) {
+  const updateQuery = useUpdateQuery();
+  const {
+    groupByDisabledReason,
+    aggregateDisabledReason,
+    filterDisabledReason,
+    orderByDisabledReason
+  } = useOperations(view, field, path);
+  const handleAddOperationAction = (operation, filter) => {
+    if (field.kind === "dimension" || field.kind === "measure") {
+      if (operation === "groupBy" && !groupByDisabledReason) {
+        addGroupBy(view, field, path);
+      } else if (operation === "aggregate" && !aggregateDisabledReason) {
+        addAggregate(view, field, path);
+      } else if (operation === "orderBy" && !orderByDisabledReason) {
+        addOrderByFromSource(view, path, field.name);
+      } else if (operation === "filter" && !filterDisabledReason && filter) {
+        addFilter(view, field, path, filter);
+      }
+      updateQuery();
+    }
+  };
+  const handleSetView = () => {
+    if (field.kind === "view" && rootQuery.isEmpty()) {
+      rootQuery.setView(field.name);
+      updateQuery();
+    }
+  };
+  const handleAddView = () => {
+    if (field.kind === "view") {
+      addNest(view, field);
+      updateQuery();
+    }
+  };
+  return field.kind === "view" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+      icon: "insert",
+      disabled: !rootQuery.isEmpty(),
+      onClick: handleSetView,
+      tooltip: !rootQuery.isEmpty() ? "Can only add a view to an empty query." : "Add view",
+      onTooltipOpenChange: setIsTooltipOpen
+    }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+      icon: "nest",
+      onClick: handleAddView,
+      tooltip: "Add as new nested query",
+      onTooltipOpenChange: setIsTooltipOpen
+    })]
+  }) : field.kind === "measure" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+      icon: "aggregate",
+      tooltip: aggregateDisabledReason || "Add as aggregate",
+      disabled: !!aggregateDisabledReason,
+      onClick: () => handleAddOperationAction("aggregate"),
+      onTooltipOpenChange: setIsTooltipOpen
+    }), /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
+      fieldInfo: field,
+      path,
+      setFilter: (filter) => handleAddOperationAction("filter", filter),
+      trigger: /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+        icon: "filter",
+        tooltip: filterDisabledReason || "Add as filter",
+        disabled: !!filterDisabledReason,
+        onTooltipOpenChange: setIsTooltipOpen
+      }),
+      onOpenChange: setIsFilterPopoverOpen,
+      layoutProps: {
+        align: "start"
+      }
+    }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+      icon: "orderBy",
+      tooltip: orderByDisabledReason || "Add as order by",
+      disabled: !!orderByDisabledReason,
+      onClick: () => handleAddOperationAction("orderBy"),
+      onTooltipOpenChange: setIsTooltipOpen
+    })]
+  }) : field.kind === "dimension" ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+      icon: "groupBy",
+      tooltip: groupByDisabledReason || "Add as group by",
+      disabled: !!groupByDisabledReason,
+      onClick: () => handleAddOperationAction("groupBy"),
+      onTooltipOpenChange: setIsTooltipOpen
+    }), /* @__PURE__ */ jsxRuntime.jsx(FilterPopover, {
+      fieldInfo: field,
+      path,
+      setFilter: (filter) => handleAddOperationAction("filter", filter),
+      trigger: /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+        icon: "filter",
+        tooltip: filterDisabledReason || "Add as filter",
+        disabled: !!filterDisabledReason,
+        onTooltipOpenChange: setIsTooltipOpen
+      }),
+      onOpenChange: setIsFilterPopoverOpen,
+      layoutProps: {
+        align: "start"
+      }
+    }), /* @__PURE__ */ jsxRuntime.jsx(ActionButton, {
+      icon: "orderBy",
+      tooltip: orderByDisabledReason || "Add as order by",
+      disabled: !!orderByDisabledReason,
+      onClick: () => handleAddOperationAction("orderBy"),
+      onTooltipOpenChange: setIsTooltipOpen
+    })]
+  }) : null;
+}
+function queryEditorClick(rootQuery, view, field, path) {
+  const segment = getSegmentIfPresent(view);
+  if (field.kind === "dimension") {
+    if (!(segment == null ? void 0 : segment.hasField(field.name, path))) {
+      addGroupBy(view, field, path);
+    } else {
+      return false;
+    }
+  } else if (field.kind === "measure") {
+    if (!(segment == null ? void 0 : segment.hasField(field.name, path))) {
+      addAggregate(view, field, path);
+    } else {
+      return false;
+    }
+  } else if (field.kind === "view") {
+    if (rootQuery.isEmpty()) {
+      rootQuery.setView(field.name);
+    } else {
+      addNest(view, field);
+    }
+  } else {
+    return false;
+  }
+  return true;
+}
 const FIELD_KIND_ORDER = ["dimension", "measure", "view"];
 function SearchResultList({
   rootQuery,