@marimo-team/islands 0.22.1-dev2 → 0.22.1-dev21

package/dist/{ConnectedDataExplorerComponent-Dl1grr8z.js → ConnectedDataExplorerComponent-iT7t3FxV.js}

@@ -14,7 +14,7 @@ import { b as createStore, g as useAtomValue, m as Provider, n as useTheme, y as
 import { t as invariant } from "./invariant-D4hPsZFI.js";
 import { n as ErrorBanner } from "./error-banner-Bx9kIgrs.js";
 import "./vega-loader.browser-DqEcFOPD.js";
-import { a as getContainerWidth, n as vegaLoadData, s as tooltipHandler } from "./loader-3c9hT4kT.js";
+import { a as getContainerWidth, n as vegaLoadData, s as tooltipHandler } from "./loader-CMMa6QVT.js";
 import { t as useAsyncData } from "./useAsyncData-Cd4Urlww.js";
 import { n as q, r as contains } from "./react-vega-CzRAIHrv.js";
 import "./defaultLocale-qS7DaAmi.js";

package/dist/{chat-ui-CtqUthFR.js → chat-ui-C1HWLRKN.js}

@@ -5,7 +5,7 @@ import { s as __toESM, t as __commonJSMin } from "./chunk-BNovOVIE.js";
 import { t as require_react } from "./react-Bs6Z0kvn.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-B_OLMU9S.js";
 import { r as toast } from "./copy-CBo9JcJW.js";
-import { A as AccordionItem, Bn as CircleX, C as Boosts, D as AIContextRegistry, Dn as Wrench, E as AIContextProvider, Et as displayCellName, Fn as File$1, Gt as PluralWord, H as ChatBubbleIcon, I as MarimoIncomingMessageEvent, It as moveToEndOfEditor, Mn as LoaderCircle, Nt as createVariableInfoElement, O as Accordion, On as Trash2, Pn as Info, Qt as getTableType, T as contextToXml, Tn as atomWithStorage, Ut as jotaiJsonStorage, Wt as variablesAtom, X as base64ToDataURL, Xt as allTablesAtom, Y as deserializeBlob, Zt as dataSourceConnectionsAtom, a as toPng, ct as notebookAtom, d as Spinner, en as getRequestClient, f as Popover, g as PopoverAnchor, h as PopoverTrigger, in as singleFacet, it as cellErrorsAtom, j as AccordionTrigger, k as AccordionContent, ln as ZodLocalStorage, m as PopoverContent, mn as CellOutputId, n as blobToString, o as MarkdownRenderer, rt as renderHTML, t as processOutput, v as isOutputEmpty, w as Sections, x as DatasourceContextProvider } from "./process-output-KyzWazB-.js";
+import { A as AccordionItem, Bn as CircleX, C as Boosts, D as AIContextRegistry, Dn as Wrench, E as AIContextProvider, Et as displayCellName, Fn as File$1, Gt as PluralWord, H as ChatBubbleIcon, I as MarimoIncomingMessageEvent, It as moveToEndOfEditor, Mn as LoaderCircle, Nt as createVariableInfoElement, O as Accordion, On as Trash2, Pn as Info, Qt as getTableType, T as contextToXml, Tn as atomWithStorage, Ut as jotaiJsonStorage, Wt as variablesAtom, X as base64ToDataURL, Xt as allTablesAtom, Y as deserializeBlob, Zt as dataSourceConnectionsAtom, a as toPng, ct as notebookAtom, d as Spinner, en as getRequestClient, f as Popover, g as PopoverAnchor, h as PopoverTrigger, in as singleFacet, it as cellErrorsAtom, j as AccordionTrigger, k as AccordionContent, ln as ZodLocalStorage, m as PopoverContent, mn as CellOutputId, n as blobToString, o as MarkdownRenderer, rt as renderHTML, t as processOutput, v as isOutputEmpty, w as Sections, x as DatasourceContextProvider } from "./process-output-CzWMmQcQ.js";
 import "./chunk-5FQGJX7Z-C428iZBW.js";
 import { l as createLucideIcon } from "./dist-D2Rk1j4R.js";
 import { A as logNever, L as X, r as Strings, t as Label } from "./label-DTNqw9tv.js";

package/dist/{loader-3c9hT4kT.js → loader-CMMa6QVT.js}

@@ -166,7 +166,10 @@ var Handler = class {
 pkg.version;
 const tooltipHandler = new Handler();
 function getContainerWidth(m2) {
-  if (typeof m2 == "object" && m2 && "width" in m2) return m2.width;
+  if (typeof m2 == "object" && m2) {
+    if ("width" in m2) return m2.width;
+    if ("spec" in m2) return getContainerWidth(m2.spec);
+  }
 }
 function getVegaFieldTypes(m2) {
   return !m2 || Object.keys(m2).length === 0 ? "auto" : Objects.mapValues(m2, (m3) => m3 === "date" || m3 === "time" ? "string" : m3 === "datetime" ? "date" : m3);

package/dist/main.js

@@ -21,7 +21,7 @@ import { a as __toCommonJS, n as __esmMin, r as __export, s as __toESM, t as __c
 import { t as require_react } from "./react-Bs6Z0kvn.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-B_OLMU9S.js";
 import { n as Copy, r as toast, t as copyToClipboard } from "./copy-CBo9JcJW.js";
-import { $ as dataViewToBase64, $t as convertStatsName, A as AccordionItem, An as PaintRoller, At as Checkbox, B as createInputEvent, Bn as CircleX, Bt as useChromeActions, Cn as jsonToTSV, Ct as headingToIdentifier, Dn as Wrench, Dt as getValidName, En as selectAtom, Et as displayCellName, F as AccordionTrigger$1, Fn as File, Ft as Paths, G as ChevronRightIcon, Gt as PluralWord, Hn as Braces, Ht as adaptForLocalStorage, I as MarimoIncomingMessageEvent, In as FileText, J as PinRightIcon, Jt as getDataTypeColor, K as DotFilledIcon, Kt as PluralWords, L as MarimoValueInputEvent, Ln as Eye, Lt as goToCellLine, M as Accordion$1, Mn as LoaderCircle, Mt as MarkdownLanguageAdapter, N as AccordionContent$1, Nn as Layers, O as Accordion, On as Trash2, Ot as isInternalCellName, P as AccordionItem$1, Pn as Info, Pt as PathBuilder, Q as base64ToUint8Array, R as MarimoValueReadyEvent, Rn as Database, Rt as DeferredRequestRegistry, S as getDatasourceContext, Sn as jsonToMarkdown, St as isErrorMime, Tn as atomWithStorage, Tt as getCellDomProps, U as CheckIcon, Un as esm_default$1, Ut as jotaiJsonStorage, V as BorderAllIcon, Vn as CircleAlert, Vt as repl, W as ChevronDownIcon, Wn as import_lib, Y as deserializeBlob, Yt as require_client, Z as base64ToDataView, _ as PopoverClose, _n as UIElementId, _t as initialModeAtom, a as toPng, an as elementContainsMarimoCellFile, at as createActions, b as useExpandedOutput, bn as RANDOM_ID_ATTR, bt as outputIsLoading, c as useCellFocusActions, cn as NotebookScopedLocalStorage, ct as notebookAtom, d as Spinner, dn as parseAttrValue, dt as useCellActions, en as getRequestClient, et as extractBase64FromDataURL, f as Popover$1, fn as parseDataset, ft as useCellIds, gn as SCRATCH_CELL_ID, gt as getInitialAppMode, h as PopoverTrigger, hn as HTMLCellId, ht as AnsiUp, i as PythonIcon, j as AccordionTrigger, jn as NotebookPen, jt as customPythonLanguageSupport, k as AccordionContent, kn as Table2, kt as normalizeName, l as useLastFocusedCellId, lt as notebookOutline, m as PopoverContent, mn as CellOutputId, mt as createCell, n as blobToString, nn as useRequestClient, nt as safeExtractSetUIElementMessageBuffers, o as MarkdownRenderer, on as extractAllTracebackInfo, ot as getCellEditorView, p as PopoverClose$1, pn as parseInitialValue, pt as useCellNames, q as PinLeftIcon, qt as DATA_TYPE_ICON, r as filesToBase64, rn as isUninstantiated, rt as renderHTML, s as LazyAnyLanguageCodeMirror, sn as getTracebackInfo, st as getCellNames, t as processOutput, tn as requestClientAtom, tt as isDataURLString, u as maybeAddAltairImport, un as filenameAtom, ut as reducer, v as isOutputEmpty, vn as findCellId, vt as kioskModeAtom, wn as atomWithReducer, wt as DATA_CELL_ID, xn as jsonParseWithSpecialChar, xt as outputIsStale, y as useExpandedConsoleOutput, yn as OBJECT_ID_ATTR, yt as viewStateAtom, z as MarimoValueUpdateEvent, zn as Columns2, zt as generateUUID, __tla as __tla_0 } from "./process-output-KyzWazB-.js";
+import { $ as dataViewToBase64, $t as convertStatsName, A as AccordionItem, An as PaintRoller, At as Checkbox, B as createInputEvent, Bn as CircleX, Bt as useChromeActions, Cn as jsonToTSV, Ct as headingToIdentifier, Dn as Wrench, Dt as getValidName, En as selectAtom, Et as displayCellName, F as AccordionTrigger$1, Fn as File, Ft as Paths, G as ChevronRightIcon, Gt as PluralWord, Hn as Braces, Ht as adaptForLocalStorage, I as MarimoIncomingMessageEvent, In as FileText, J as PinRightIcon, Jt as getDataTypeColor, K as DotFilledIcon, Kt as PluralWords, L as MarimoValueInputEvent, Ln as Eye, Lt as goToCellLine, M as Accordion$1, Mn as LoaderCircle, Mt as MarkdownLanguageAdapter, N as AccordionContent$1, Nn as Layers, O as Accordion, On as Trash2, Ot as isInternalCellName, P as AccordionItem$1, Pn as Info, Pt as PathBuilder, Q as base64ToUint8Array, R as MarimoValueReadyEvent, Rn as Database, Rt as DeferredRequestRegistry, S as getDatasourceContext, Sn as jsonToMarkdown, St as isErrorMime, Tn as atomWithStorage, Tt as getCellDomProps, U as CheckIcon, Un as esm_default$1, Ut as jotaiJsonStorage, V as BorderAllIcon, Vn as CircleAlert, Vt as repl, W as ChevronDownIcon, Wn as import_lib, Y as deserializeBlob, Yt as require_client, Z as base64ToDataView, _ as PopoverClose, _n as UIElementId, _t as initialModeAtom, a as toPng, an as elementContainsMarimoCellFile, at as createActions, b as useExpandedOutput, bn as RANDOM_ID_ATTR, bt as outputIsLoading, c as useCellFocusActions, cn as NotebookScopedLocalStorage, ct as notebookAtom, d as Spinner, dn as parseAttrValue, dt as useCellActions, en as getRequestClient, et as extractBase64FromDataURL, f as Popover$1, fn as parseDataset, ft as useCellIds, gn as SCRATCH_CELL_ID, gt as getInitialAppMode, h as PopoverTrigger, hn as HTMLCellId, ht as AnsiUp, i as PythonIcon, j as AccordionTrigger, jn as NotebookPen, jt as customPythonLanguageSupport, k as AccordionContent, kn as Table2, kt as normalizeName, l as useLastFocusedCellId, lt as notebookOutline, m as PopoverContent, mn as CellOutputId, mt as createCell, n as blobToString, nn as useRequestClient, nt as safeExtractSetUIElementMessageBuffers, o as MarkdownRenderer, on as extractAllTracebackInfo, ot as getCellEditorView, p as PopoverClose$1, pn as parseInitialValue, pt as useCellNames, q as PinLeftIcon, qt as DATA_TYPE_ICON, r as filesToBase64, rn as isUninstantiated, rt as renderHTML, s as LazyAnyLanguageCodeMirror, sn as getTracebackInfo, st as getCellNames, t as processOutput, tn as requestClientAtom, tt as isDataURLString, u as maybeAddAltairImport, un as filenameAtom, ut as reducer, v as isOutputEmpty, vn as findCellId, vt as kioskModeAtom, wn as atomWithReducer, wt as DATA_CELL_ID, xn as jsonParseWithSpecialChar, xt as outputIsStale, y as useExpandedConsoleOutput, yn as OBJECT_ID_ATTR, yt as viewStateAtom, z as MarimoValueUpdateEvent, zn as Columns2, zt as generateUUID, __tla as __tla_0 } from "./process-output-CzWMmQcQ.js";
 import { __tla as __tla_1 } from "./chunk-5FQGJX7Z-C428iZBW.js";
 import { c as useSize, l as createLucideIcon, t as Root$4 } from "./dist-D2Rk1j4R.js";
 import { A as $896ba0a80a8f4d36$export$85fd5fdf27bacc79, C as DEFAULT_COLOR_SCHEME, D as SCALE_TYPE_DESCRIPTIONS, E as EMPTY_VALUE$1, F as ListFilter, I as ChartPie, L as ChartColumn, M as $5a387cc49350e6db$export$722debc0e56fea39, N as Table$1, O as TIME_UNIT_DESCRIPTIONS, P as SquareFunction, S as DEFAULT_AGGREGATION, T as DEFAULT_TIME_UNIT, _ as AGGREGATION_TYPE_DESCRIPTIONS, a as AGGREGATION_FNS$1, b as COLOR_SCHEMES, c as COLOR_BY_FIELDS, d as NONE_VALUE, f as SELECTABLE_DATA_TYPES, g as TIME_UNITS, h as STRING_AGGREGATION_FNS, i as convertDataTypeToSelectable, j as $fb18d541ea1ad717$export$ad991b66133851cf, k as escapeFieldName, l as COMBINED_TIME_UNITS, m as SORT_TYPES, n as createSpecWithoutData, o as BIN_AGGREGATION, p as SINGLE_TIME_UNITS, r as isFieldSet, s as CHART_TYPES, t as augmentSpecWithData, u as ChartType, v as AGGREGATION_TYPE_ICON, w as DEFAULT_MAX_BINS_FACET, x as COUNT_FIELD, y as CHART_TYPE_ICON } from "./spec-DYaR1rJh.js";
@@ -55,11 +55,11 @@ import "./dist-C0XYIHKJ.js";
 import "./dist-C9qF7MRB.js";
 import { a as parser, r as python } from "./dist-qoCY8giM.js";
 import "./purify.es-ukiMXY-F.js";
-import { a as AlertTitle, i as AlertDescription, n as arrow, o as isValid, r as Alert, t as useDeepCompareMemoize } from "./useDeepCompareMemoize-X7clcrcQ.js";
+import { a as AlertTitle, i as AlertDescription, n as arrow, o as isValid, r as Alert, t as useDeepCompareMemoize } from "./useDeepCompareMemoize-DOzKCTzc.js";
 import { a as Portal$1, c as prettyError, i as Overlay, n as ErrorBanner, o as Root$6, r as Content$2, s as CellNotInitializedError, t as Banner } from "./error-banner-Bx9kIgrs.js";
 import { n as memoize$1, t as isPropValid } from "./emotion-is-prop-valid.esm-CJVjyntJ.js";
 import { n as formats } from "./vega-loader.browser-DqEcFOPD.js";
-import { a as getContainerWidth, n as vegaLoadData, o as getVegaFieldTypes, r as createBatchedLoader, s as tooltipHandler, t as parseCsvData } from "./loader-3c9hT4kT.js";
+import { a as getContainerWidth, n as vegaLoadData, o as getVegaFieldTypes, r as createBatchedLoader, s as tooltipHandler, t as parseCsvData } from "./loader-CMMa6QVT.js";
 import { t as useIframeCapabilities } from "./useIframeCapabilities-BVQrlRBd.js";
 import { t as useAsyncData } from "./useAsyncData-Cd4Urlww.js";
 import "./defaultLocale-qS7DaAmi.js";
@@ -33407,7 +33407,7 @@ Database schema: ${c}`), (_a4 = r2.aiFix) == null ? void 0 : _a4.setAiCompletion
     let r = (0, import_compiler_runtime$98.c)(21), { table: c, className: d } = e, { locale: f } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7(), h = useAtomValue(selectedCellsAtom), _ = countDataCellsInSelection(h);
     if (_ < 2) {
       let e2;
-      r[0] === d ? e2 = r[1] : (e2 = cn("text-sm text-muted-foreground italic", d), r[0] = d, r[1] = e2);
+      r[0] === d ? e2 = r[1] : (e2 = cn("text-xs text-muted-foreground/80 italic", d), r[0] = d, r[1] = e2);
       let c2;
       return r[2] === e2 ? c2 = r[3] : (c2 = (0, import_jsx_runtime.jsx)(Tooltip, {
         content: "Select multiple cells to see stats",
@@ -33496,8 +33496,8 @@ Database schema: ${c}`), (_a4 = r2.aiFix) == null ? void 0 : _a4.setAiCompletion
   function _temp2$23(e, r) {
     return e + r;
   }
-  const TableBottomBar = ({ pagination: e, totalColumns: r, selection: c, onRowSelectionChange: d, table: f, getRowIds: h, showPageSizeSelector: _, tableLoading: v }) => {
-    let { locale: S } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7(), w = (e2) => {
+  const TableBottomBar = ({ pagination: e, totalColumns: r, selection: c, onRowSelectionChange: d, table: f, getRowIds: h, showPageSizeSelector: _, tableLoading: v, part: S, className: w }) => {
+    let { locale: E } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7(), O = (e2) => {
       if (!d) return;
       if (!e2) {
         d({});
@@ -33532,7 +33532,8 @@ Database schema: ${c}`), (_a4 = r2.aiFix) == null ? void 0 : _a4.setAiCompletion
       });
     };
     return (0, import_jsx_runtime.jsxs)("div", {
-      className: "flex lg:grid lg:grid-cols-[1fr_auto_1fr] items-center shrink-0 pt-1",
+      part: S,
+      className: cn("flex lg:grid lg:grid-cols-[1fr_auto_1fr] items-center shrink-0", w),
       children: [
         (0, import_jsx_runtime.jsxs)("div", {
           className: "flex flex-col text-sm text-muted-foreground px-2 shrink-0",
@@ -33540,12 +33541,12 @@ Database schema: ${c}`), (_a4 = r2.aiFix) == null ? void 0 : _a4.setAiCompletion
             (0, import_jsx_runtime.jsx)("div", {
               className: "flex items-center gap-1",
               children: (() => {
-                let { rowSelection: e2, cellSelection: d2 } = f.getState(), h2 = Object.keys(e2).length, _2 = f.getIsAllPageRowsSelected(), v2 = f.getRowCount(), y = h2 === v2, E = c === "single-cell" || c === "multi-cell";
-                return E && (h2 = d2.length, _2 = false, y = false), _2 && !y ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+                let { rowSelection: e2, cellSelection: d2 } = f.getState(), h2 = Object.keys(e2).length, _2 = f.getIsAllPageRowsSelected(), v2 = f.getRowCount(), y = h2 === v2, S2 = c === "single-cell" || c === "multi-cell";
+                return S2 && (h2 = d2.length, _2 = false, y = false), _2 && !y ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
                   children: [
                     (0, import_jsx_runtime.jsxs)("span", {
                       children: [
-                        prettyNumber(h2, S),
+                        prettyNumber(h2, E),
                         " selected"
                       ]
                     }),
@@ -33555,10 +33556,10 @@ Database schema: ${c}`), (_a4 = r2.aiFix) == null ? void 0 : _a4.setAiCompletion
                       variant: "link",
                       className: "h-4 print:hidden",
                       onMouseDown: Events.preventFocus,
-                      onClick: () => w(true),
+                      onClick: () => O(true),
                       children: [
                         "Select all ",
-                        prettyNumber(v2, S)
+                        prettyNumber(v2, E)
                       ]
                     })
                   ]
@@ -33566,7 +33567,7 @@ Database schema: ${c}`), (_a4 = r2.aiFix) == null ? void 0 : _a4.setAiCompletion
                   children: [
                     (0, import_jsx_runtime.jsxs)("span", {
                       children: [
-                        prettyNumber(h2, S),
+                        prettyNumber(h2, E),
                         " selected"
                       ]
                     }),
@@ -33577,13 +33578,13 @@ Database schema: ${c}`), (_a4 = r2.aiFix) == null ? void 0 : _a4.setAiCompletion
                       className: "h-4 print:hidden",
                       onMouseDown: Events.preventFocus,
                       onClick: () => {
-                        E ? f.resetCellSelection && f.resetCellSelection() : w(false);
+                        S2 ? f.resetCellSelection && f.resetCellSelection() : O(false);
                       },
                       children: "Clear selection"
                     })
                   ]
                 }) : (0, import_jsx_runtime.jsx)("span", {
-                  children: prettifyRowColumnCount(f.getRowCount(), r, S)
+                  children: prettifyRowColumnCount(f.getRowCount(), r, E)
                 });
               })()
             }),
@@ -34034,45 +34035,42 @@ Defaulting to \`null\`.`;
       M,
       I
     ]), e && c || f || v || w ? (0, import_jsx_runtime.jsxs)("div", {
-      className: "flex items-center h-10 px-2 border-b gap-3",
+      className: "flex items-center h-10 px-2 border-b gap-2",
       children: [
-        c && e && (0, import_jsx_runtime.jsx)("div", {
-          className: "flex items-center",
-          children: (0, import_jsx_runtime.jsxs)("div", {
-            className: "flex items-center gap-1 rounded-full border px-2 w-56",
-            children: [
-              (0, import_jsx_runtime.jsx)(Search, {
-                className: "w-4 h-4 text-muted-foreground shrink-0"
-              }),
-              (0, import_jsx_runtime.jsx)("input", {
-                ref: z,
-                type: "text",
-                className: "h-6 border-none bg-transparent focus:outline-hidden text-sm w-full min-w-0",
-                value: E,
-                onKeyDown: (e2) => {
-                  var _a3;
-                  e2.key === "Escape" && (O(""), (_a3 = z.current) == null ? void 0 : _a3.blur());
-                },
-                onChange: (e2) => O(e2.target.value),
-                placeholder: "Search..."
-              }),
-              d && (0, import_jsx_runtime.jsx)(Spinner, {
-                size: "small"
-              }),
-              E && (0, import_jsx_runtime.jsx)(Button, {
-                variant: "text",
-                size: "xs",
-                className: "h-5 w-5 p-0 shrink-0",
-                onClick: () => O(""),
-                children: (0, import_jsx_runtime.jsx)(X, {
-                  className: "w-3 h-3 text-muted-foreground"
-                })
+        c && e && (0, import_jsx_runtime.jsxs)("div", {
+          className: "flex flex-1 items-center gap-1 px-2 rounded-sm focus-within:ring-1 focus-within:ring-border transition-shadow",
+          children: [
+            (0, import_jsx_runtime.jsx)(Search, {
+              className: "w-4 h-4 text-muted-foreground shrink-0"
+            }),
+            (0, import_jsx_runtime.jsx)("input", {
+              ref: z,
+              type: "text",
+              className: "h-6 border-none bg-transparent focus:outline-hidden text-sm w-full min-w-0",
+              value: E,
+              onKeyDown: (e2) => {
+                var _a3;
+                e2.key === "Escape" && (O(""), (_a3 = z.current) == null ? void 0 : _a3.blur());
+              },
+              onChange: (e2) => O(e2.target.value),
+              placeholder: "Search..."
+            }),
+            d && (0, import_jsx_runtime.jsx)(Spinner, {
+              size: "small"
+            }),
+            E && (0, import_jsx_runtime.jsx)(Button, {
+              variant: "text",
+              size: "xs",
+              className: "h-5 w-5 p-0 shrink-0",
+              onClick: () => O(""),
+              children: (0, import_jsx_runtime.jsx)(X, {
+                className: "w-3 h-3 text-muted-foreground"
               })
-            ]
-          })
+            })
+          ]
         }),
         (0, import_jsx_runtime.jsxs)("div", {
-          className: "flex items-center gap-1 shrink-0",
+          className: "flex items-center shrink-0",
           children: [
             f && (0, import_jsx_runtime.jsxs)(Button, {
               variant: "text",
@@ -34083,7 +34081,7 @@ Defaulting to \`null\`.`;
                 (0, import_jsx_runtime.jsx)(ChartSpline, {
                   className: "w-3.5 h-3.5"
                 }),
-                "Chart Builder"
+                "Visualize"
               ]
             }),
             v && y && (0, import_jsx_runtime.jsxs)(Button, {
@@ -34095,7 +34093,7 @@ Defaulting to \`null\`.`;
                 (0, import_jsx_runtime.jsx)(PanelRight, {
                   className: "w-3.5 h-3.5"
                 }),
-                "Table Explorer"
+                "Explorer"
               ]
             }),
             w && (0, import_jsx_runtime.jsx)(ExportMenu, {
@@ -34202,6 +34200,7 @@ Defaulting to \`null\`.`;
         (0, import_jsx_runtime.jsxs)(CellSelectionProvider, {
           children: [
             (0, import_jsx_runtime.jsxs)("div", {
+              part: "table-wrapper",
               className: cn(r || "rounded-md border overflow-hidden"),
               children: [
                 (0, import_jsx_runtime.jsx)(TableTopBar, {
@@ -34238,6 +34237,8 @@ Defaulting to \`null\`.`;
               ]
             }),
             (0, import_jsx_runtime.jsx)(TableBottomBar, {
+              part: "table-footer",
+              className: "border-t border-border pt-1.5 pb-0.5",
               totalColumns: v,
               pagination: e9,
               selection: _,
@@ -35866,8 +35867,7 @@ ${E}`,
     ...e
   }));
   var AnyWidgetSlot = (e) => {
-    var _a3;
-    let r = (0, import_compiler_runtime$90.c)(16), { jsUrl: c, jsHash: d } = e.data, { model_id: f } = e.value, h = e.host, _;
+    let r = (0, import_compiler_runtime$90.c)(14), { jsUrl: c, jsHash: d } = e.data, { model_id: f } = e.value, h = e.host, _;
     r[0] !== d || r[1] !== c ? (_ = {
       jsUrl: c,
       jsHash: d
@@ -35888,14 +35888,12 @@ ${E}`,
         error: f2
       }), r[7] = f2, r[8] = h2), h2;
     }
-    let S;
-    r[9] === e.host ? S = r[10] : (S = (_a3 = e.host.closest(`[${RANDOM_ID_ATTR}]`)) == null ? void 0 : _a3.getAttribute(RANDOM_ID_ATTR), r[9] = e.host, r[10] = S);
-    let w = S ?? c, E;
-    return r[11] !== h || r[12] !== v.default || r[13] !== w || r[14] !== f ? (E = (0, import_jsx_runtime.jsx)(LoadedSlot, {
+    let S = `${d}:${f}`, w;
+    return r[9] !== h || r[10] !== v.default || r[11] !== f || r[12] !== S ? (w = (0, import_jsx_runtime.jsx)(LoadedSlot, {
       widget: v.default,
       modelId: f,
       host: h
-    }, w), r[11] = h, r[12] = v.default, r[13] = w, r[14] = f, r[15] = E) : E = r[15], E;
+    }, S), r[9] = h, r[10] = v.default, r[11] = f, r[12] = S, r[13] = w) : w = r[13], w;
   };
   async function runAnyWidgetModule(e, r, c, d, f) {
     d.innerHTML = "";
@@ -36345,7 +36343,7 @@ ${E}`,
       };
     }
   };
-  var LazyChatbot = import_react.lazy(() => import("./chat-ui-CtqUthFR.js").then((e) => ({
+  var LazyChatbot = import_react.lazy(() => import("./chat-ui-C1HWLRKN.js").then((e) => ({
     default: e.Chatbot
   }))), messageSchema = array(object({
     id: string(),
@@ -36436,6 +36434,7 @@ ${E}`,
     }), r[5] = h, r[6] = w);
     let E;
     r[7] !== y || r[8] !== w ? (E = (0, import_jsx_runtime.jsx)("div", {
+      part: "table-wrapper",
       className: y,
       children: w
     }), r[7] = y, r[8] = w, r[9] = E) : E = r[9];
@@ -43990,68 +43989,71 @@ ${c}
     return r ? r.length > 0 : false;
   }
   var import_compiler_runtime$69 = require_compiler_runtime(), NEW_CHART_TYPE = "bar", DEFAULT_TAB_NAME = "table", CHART_HEIGHT = 290, CHART_MAX_ROWS = 5e4, CHART_MAX_COLUMNS = 50;
-  const TablePanel = (e) => {
-    let r = (0, import_compiler_runtime$69.c)(7), { cellId: c, data: d, dataTable: f, totalRows: h, columns: _, getDataUrl: v, fieldTypes: y, displayHeader: S } = e, [w, E] = useAtom(tabsStorageAtom), O = c ? w.get(c) ?? [] : [], [M, I] = (0, import_react.useState)(0), [z, G] = (0, import_react.useState)(DEFAULT_TAB_NAME);
-    if (!S || O.length === 0 && !S) return f;
+  const TablePanel = ({ cellId: e, data: r, dataTable: c, totalRows: d, columns: f, getDataUrl: h, fieldTypes: _, displayHeader: v, onCloseChartBuilder: y }) => {
+    let [S, w] = useAtom(tabsStorageAtom), E = e ? S.get(e) ?? [] : [], [O, M] = (0, import_react.useState)(DEFAULT_TAB_NAME), [I, z] = (0, import_react.useState)(E.length), G = (0, import_react.useRef)(v);
+    if (v && !G.current && E.length === 0 && e) {
+      G.current = v;
+      let r2 = getChartTabName(0, NEW_CHART_TYPE), c2 = new Map(S);
+      c2.set(e, [
+        {
+          tabName: r2,
+          chartType: NEW_CHART_TYPE,
+          config: getChartDefaults()
+        }
+      ]), w(c2), z(1), M(r2);
+    }
+    if (G.current = v, !v || E.length === 0 && !v) return c;
     let q = () => {
-      if (!c) return;
-      let e2 = getChartTabName(M, NEW_CHART_TYPE), r2 = new Map(w);
-      r2.set(c, [
-        ...O,
+      if (!e) return;
+      let r2 = getChartTabName(I, NEW_CHART_TYPE), c2 = new Map(S);
+      c2.set(e, [
+        ...E,
         {
-          tabName: e2,
+          tabName: r2,
           chartType: NEW_CHART_TYPE,
           config: getChartDefaults()
         }
-      ]), E(r2), I(M + 1), G(e2);
-    }, Z7 = (e2) => {
-      if (!c) return;
-      let r2 = new Map(w);
-      r2.set(c, O.filter((r3) => r3.tabName !== e2)), E(r2), G(DEFAULT_TAB_NAME), I(M - 1);
-    }, Q7 = (e2) => {
-      let { tabName: r2, chartType: d2, chartConfig: f2 } = e2;
-      if (!c) return;
-      let h2 = new Map(w);
-      h2.set(c, O.map((e3) => e3.tabName === r2 ? {
-        ...e3,
-        chartType: d2,
-        config: f2
-      } : e3)), E(h2);
-    }, $7;
-    r[0] !== c || r[1] !== E || r[2] !== w ? ($7 = (e2, r2) => {
-      if (!c) return;
-      let d2 = w.get(c) ?? [], f2 = d2.findIndex((r3) => r3.tabName === e2);
+      ]), w(c2), z(I + 1), M(r2);
+    }, Z7 = (r2) => {
+      if (!e) return;
+      let c2 = E.findIndex((e2) => e2.tabName === r2), d2 = E.filter((e2) => e2.tabName !== r2), f2 = new Map(S);
+      f2.set(e, d2), w(f2), d2.length === 0 ? y == null ? void 0 : y() : r2 === O && (c2 < d2.length ? M(d2[c2].tabName) : M(d2[d2.length - 1].tabName));
+    }, Q7 = ({ tabName: r2, chartType: c2, chartConfig: d2 }) => {
+      if (!e) return;
+      let f2 = new Map(S);
+      f2.set(e, E.map((e2) => e2.tabName === r2 ? {
+        ...e2,
+        chartType: c2,
+        config: d2
+      } : e2)), w(f2);
+    }, $7 = (r2, c2) => {
+      if (!e) return;
+      let d2 = S.get(e) ?? [], f2 = d2.findIndex((e2) => e2.tabName === r2);
       if (f2 === -1) return;
-      let h2 = d2.map((c2) => c2.tabName === e2 ? {
-        ...c2,
-        chartType: r2,
-        tabName: getChartTabName(f2, r2)
-      } : c2);
-      E(new Map(w).set(c, h2)), G(h2[f2].tabName);
-    }, r[0] = c, r[1] = E, r[2] = w, r[3] = $7) : $7 = r[3];
-    let e9 = $7, t9 = h === "too_many" || h > CHART_MAX_ROWS || _ > CHART_MAX_COLUMNS, n9;
-    r[4] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (n9 = (0, import_jsx_runtime.jsx)(TabsTrigger, {
-      className: "text-xs",
-      value: DEFAULT_TAB_NAME,
-      onClick: () => G(DEFAULT_TAB_NAME),
-      children: "Table"
-    }), r[4] = n9) : n9 = r[4];
-    let r9;
-    return r[5] === f ? r9 = r[6] : (r9 = (0, import_jsx_runtime.jsx)(TabsContent, {
-      className: "mt-1 overflow-hidden",
-      value: DEFAULT_TAB_NAME,
-      children: f
-    }), r[5] = f, r[6] = r9), (0, import_jsx_runtime.jsxs)(Tabs, {
-      value: z,
+      let h2 = d2.map((e2) => e2.tabName === r2 ? {
+        ...e2,
+        chartType: c2,
+        tabName: getChartTabName(f2, c2)
+      } : e2);
+      w(new Map(S).set(e, h2)), M(h2[f2].tabName);
+    }, e9 = d === "too_many" || d > CHART_MAX_ROWS || f > CHART_MAX_COLUMNS;
+    return (0, import_jsx_runtime.jsxs)(Tabs, {
+      value: O,
       className: "-mt-1",
       children: [
         (0, import_jsx_runtime.jsxs)(TabsList, {
+          part: "table-tabs",
           children: [
-            n9,
-            O.map((e2, r2) => (0, import_jsx_runtime.jsxs)(TabsTrigger, {
+            (0, import_jsx_runtime.jsx)(TabsTrigger, {
+              className: "text-xs",
+              value: DEFAULT_TAB_NAME,
+              onClick: () => M(DEFAULT_TAB_NAME),
+              children: "Table"
+            }),
+            E.map((e2, r2) => (0, import_jsx_runtime.jsxs)(TabsTrigger, {
               className: "text-xs",
               value: e2.tabName,
-              onClick: () => G(e2.tabName),
+              onClick: () => M(e2.tabName),
               children: [
                 e2.tabName,
                 (0, import_jsx_runtime.jsx)(X, {
@@ -44071,29 +44073,33 @@ ${c}
             })
           ]
         }),
-        r9,
-        O.map((e2, r2) => (0, import_jsx_runtime.jsx)(TabsContent, {
+        (0, import_jsx_runtime.jsx)(TabsContent, {
+          className: "mt-1 overflow-hidden",
+          value: DEFAULT_TAB_NAME,
+          children: c
+        }),
+        E.map((e2, d2) => (0, import_jsx_runtime.jsx)(TabsContent, {
           value: e2.tabName,
           className: "h-[400px] mt-1",
           children: (0, import_jsx_runtime.jsx)(ChartPanel, {
-            tableData: d,
+            tableData: r,
             chartConfig: e2.config,
             chartType: e2.chartType,
-            saveChart: (r3) => {
+            saveChart: (r2) => {
               Q7({
                 tabName: e2.tabName,
                 chartType: e2.chartType,
-                chartConfig: r3
+                chartConfig: r2
               });
             },
-            saveChartType: (r3) => {
-              e9(e2.tabName, r3);
+            saveChartType: (r2) => {
+              $7(e2.tabName, r2);
             },
-            getDataUrl: v,
-            fieldTypes: y ?? inferFieldTypes(f.props.data),
-            isLargeDataset: t9
+            getDataUrl: h,
+            fieldTypes: _ ?? inferFieldTypes(c.props.data),
+            isLargeDataset: e9
           })
-        }, r2))
+        }, d2))
       ]
     });
   };
@@ -44591,7 +44597,7 @@ ${c}
         let [r2] = e3;
         return r2.toLowerCase().includes(v.toLowerCase());
       });
-      Z7 = "mt-5 mb-3";
+      Z7 = "mb-3";
       let e92;
       r[17] !== S || r[18] !== h || r[19] !== f ? (e92 = prettifyRowColumnCount(f, h, S), r[17] = S, r[18] = h, r[19] = f, r[20] = e92) : e92 = r[20], Q7 = (0, import_jsx_runtime.jsxs)("span", {
         className: "text-xs font-semibold ml-2 flex",
@@ -44919,7 +44925,7 @@ ${c}
       });
     };
     return (0, import_jsx_runtime.jsxs)("div", {
-      className: "flex flex-col gap-3 mt-4 focus:outline-hidden",
+      className: "flex flex-col gap-3 focus:outline-hidden",
       ref: w,
       tabIndex: -1,
       onKeyDown: Q7,
@@ -45033,7 +45039,7 @@ ${c}
         _
       ]
     }), r[4] = c, r[5] = h, r[6] = _, r[7] = v) : v = r[7], v;
-  }, import_compiler_runtime$62 = require_compiler_runtime(), tabTriggerClassName = "text-xs uppercase tracking-wide font-semibold cursor-pointer transition-colors", activeClassName = "text-primary", inactiveClassName = "hover:text-foreground";
+  }, import_compiler_runtime$62 = require_compiler_runtime(), tabTriggerClassName = "text-[13px] uppercase tracking-wide font-semibold cursor-pointer transition-colors", activeClassName = "text-primary", inactiveClassName = "hover:text-foreground";
   const TableExplorerPanel = (e) => {
     let r = (0, import_compiler_runtime$62.c)(45), { rowIdx: c, setRowIdx: d, totalRows: f, fieldTypes: h, getRow: _, isSelectable: v, isRowSelected: y, handleRowSelectionChange: S, previewColumn: w, totalColumns: E, tableId: O, showRowExplorer: M, showColumnExplorer: I, activeTab: z, onTabChange: G } = e, q = M && I, Z7;
     r[0] !== h || r[1] !== _ || r[2] !== S || r[3] !== y || r[4] !== v || r[5] !== c || r[6] !== d || r[7] !== f ? (Z7 = (0, import_jsx_runtime.jsx)(RowViewerPanel, {
@@ -45115,7 +45121,7 @@ ${c}
     return r[39] !== t9 || r[40] !== f9 || r[41] !== p9 || r[42] !== m9 || r[43] !== n9 ? (h9 = (0, import_jsx_runtime.jsxs)(Tabs, {
       value: t9,
       onValueChange: n9,
-      className: "h-full flex flex-col min-w-[350px]",
+      className: "flex flex-col min-w-[350px]",
       children: [
         f9,
         p9,
@@ -45918,6 +45924,7 @@ ${c}
     let j9 = A9, M9;
     r[91] !== d || r[92] !== j9 || r[93] !== (o9 == null ? void 0 : o9.rows) || r[94] !== Z7 || r[95] !== e.fieldTypes || r[96] !== e.get_data_url || r[97] !== e.showChartBuilder || r[98] !== e.totalColumns || r[99] !== e.totalRows ? (M9 = e.showChartBuilder ? (0, import_jsx_runtime.jsx)(TablePanel, {
       displayHeader: Z7,
+      onCloseChartBuilder: () => Q7(false),
       data: (o9 == null ? void 0 : o9.rows) || [],
       columns: e.totalColumns,
       totalRows: e.totalRows,
@@ -47037,7 +47044,7 @@ ${c}
       fullWidth: v,
       children: z
     }), r[19] = v, r[20] = y, r[21] = c, r[22] = z, r[23] = G) : G = r[23], G;
-  }, LazyDataExplorerComponent = import_react.lazy(() => import("./ConnectedDataExplorerComponent-Dl1grr8z.js"));
+  }, LazyDataExplorerComponent = import_react.lazy(() => import("./ConnectedDataExplorerComponent-iT7t3FxV.js"));
   const DataExplorerPlugin = createPlugin("marimo-data-explorer").withData(object({
     label: string().nullish(),
     data: string()
@@ -58391,7 +58398,7 @@ ${c}
         return true;
     }
   }
-  var LazyVegaComponent = import_react.lazy(() => import("./vega-component-A6unyUJS.js")), VegaPlugin = class {
+  var LazyVegaComponent = import_react.lazy(() => import("./vega-component-BaDgUvQP.js")), VegaPlugin = class {
     constructor() {
       __publicField(this, "tagName", "marimo-vega");
       __publicField(this, "validator", object({
@@ -65415,7 +65422,7 @@ ${c}
       return Logger.warn("Failed to get version from mount config"), null;
     }
   }
-  const marimoVersionAtom = atom(getVersionFromMountConfig() || "0.22.1-dev2"), showCodeInRunModeAtom = atom(true);
+  const marimoVersionAtom = atom(getVersionFromMountConfig() || "0.22.1-dev21"), showCodeInRunModeAtom = atom(true);
   atom(null);
   var VIRTUAL_FILE_REGEX = /\/@file\/([^\s"&'/]+)\.([\dA-Za-z]+)/g, VirtualFileTracker = class e {
     constructor() {

package/dist/{process-output-KyzWazB-.js → process-output-CzWMmQcQ.js}

@@ -25818,7 +25818,7 @@ ${n.sqlString}
     for (let r = 0; r < n; r++) t += String.fromCharCode(e[r]);
     return globalThis.btoa(t);
   }
-  const uint8ArrayToBase64 = Uint8Array.prototype.toBase64 ? (e) => e.toBase64() : uint8ArrayToBase64Fallback;
+  const uint8ArrayToBase64 = "toBase64" in Uint8Array.prototype ? (e) => e.toBase64() : uint8ArrayToBase64Fallback;
   dataViewToBase64 = function(e) {
     return uint8ArrayToBase64(new Uint8Array(e.buffer, e.byteOffset, e.byteLength));
   };