@marimo-team/islands 0.23.9-dev3 → 0.23.9-dev5

package/dist/{swiper-component-DlD2GU2g.js → swiper-component-B2t5sN1q.js}

@@ -1,9 +1,9 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
-import { g as cn, l as useEventListener, t as Button } from "./button-Dj4BTre0.js";
+import { g as cn, l as useEventListener, t as Button } from "./button-C5K9fIPF.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { t as require_jsx_runtime } from "./jsx-runtime-COBk7ree.js";
-import { t as useIframeCapabilities } from "./useIframeCapabilities-BkYHTrss.js";
+import { t as require_jsx_runtime } from "./jsx-runtime-DebpN0FN.js";
+import { t as useIframeCapabilities } from "./useIframeCapabilities-C4JTXTIh.js";
 var import_compiler_runtime = require_compiler_runtime(), import_react = /* @__PURE__ */ __toESM(require_react(), 1);
 function isObject$2(t2) {
   return typeof t2 == "object" && !!t2 && "constructor" in t2 && t2.constructor === Object;

package/dist/{time-C1SGcFMH.js → time-CsmIF9YZ.js}

@@ -1,6 +1,6 @@
-import { a as tickStep, s as bisector } from "./precisionRound-CnHPY_5v.js";
-import { a as copy, i as continuous } from "./linear-2NnK4cxi.js";
-import { A as durationSecond, C as timeMinute, D as durationHour, E as durationDay, M as durationYear, N as millisecond, O as durationMinute, S as utcHour, T as second, _ as utcSunday, c as timeMonth, j as durationWeek, k as durationMonth, l as utcMonth, o as timeYear, p as timeSunday, s as utcYear, t as timeFormat, v as timeDay, w as utcMinute, x as timeHour, y as unixDay } from "./defaultLocale-DoeErsX2.js";
+import { a as tickStep, s as bisector } from "./precisionRound-Tqb4mg-H.js";
+import { a as copy, i as continuous } from "./linear-B5-AFRiR.js";
+import { A as durationSecond, C as timeMinute, D as durationHour, E as durationDay, M as durationYear, N as millisecond, O as durationMinute, S as utcHour, T as second, _ as utcSunday, c as timeMonth, j as durationWeek, k as durationMonth, l as utcMonth, o as timeYear, p as timeSunday, s as utcYear, t as timeFormat, v as timeDay, w as utcMinute, x as timeHour, y as unixDay } from "./defaultLocale-BoHTsDG6.js";
 import { n as initRange } from "./init-uv0kkh4g.js";
 function max(e, g) {
   let _;

package/dist/{timeline-definition-IT6M3QCI-DJnh1ks5.js → timeline-definition-IT6M3QCI-NfSKRvH0.js}

@@ -1,7 +1,7 @@
-import "./purify.es-DT70lfR0.js";
+import "./purify.es-H92eMd9-.js";
 import { t as arc_default } from "./arc-DfkSnvZm.js";
 import { i as log, n as __export, r as __name, t as select_default } from "./src-Bf2iLOlr.js";
-import { G as setupGraphViewbox, Q as is_dark_default, X as darken_default, Z as lighten_default, a as clear, b as getConfig2, o as commonDb_exports } from "./chunk-ABZYJK2D-D0cLy8Bb.js";
+import { G as setupGraphViewbox, Q as is_dark_default, X as darken_default, Z as lighten_default, a as clear, b as getConfig2, o as commonDb_exports } from "./chunk-ABZYJK2D-Dz0-H2B5.js";
 var parser = (function() {
   var t = /* @__PURE__ */ __name(function(t2, S2, C2, w) {
     for (C2 || (C2 = {}), w = t2.length; w--; C2[t2[w]] = S2) ;

package/dist/{toDate-CIpC_34u.js → toDate-ZVVIBmdk.js}

@@ -2,12 +2,12 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import { t as __commonJSMin } from "./chunk-BNovOVIE.js";
-import { _ as Logger } from "./button-Dj4BTre0.js";
+import { _ as Logger } from "./button-C5K9fIPF.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { u as createLucideIcon } from "./dist-D3ZI9nhS.js";
-import { r as KnownQueryParams } from "./constants-D0gkYoE2.js";
-import { f as waitFor, p as isIslands, u as store, y as atom } from "./useTheme-DykuNHR2.js";
-import { t as invariant } from "./invariant-UcGKQEhF.js";
+import { u as createLucideIcon } from "./dist-C1BYNeCR.js";
+import { r as KnownQueryParams } from "./constants-T20xxyNf.js";
+import { f as waitFor, p as isIslands, u as store, y as atom } from "./useTheme-7O0YWlE5.js";
+import { t as invariant } from "./invariant-wRzNXIsJ.js";
 var CircleQuestionMark = createLucideIcon("circle-question-mark", [
   ["circle", {
     cx: "12",

package/dist/{tooltip-DRaMBu06.js → tooltip-C5FYOpQc.js}

@@ -1,10 +1,10 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
-import { f as createSlottable, g as cn, m as useComposedRefs } from "./button-Dj4BTre0.js";
+import { f as createSlottable, g as cn, m as useComposedRefs } from "./button-C5K9fIPF.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { a as createPopperScope, i as Root2, n as Arrow, r as Content, s as Root, t as Anchor } from "./dist-D3ZI9nhS.js";
-import { t as require_jsx_runtime } from "./jsx-runtime-COBk7ree.js";
-import { $ as StyleNamespace, X as withFullScreenAsRoot, Z as withSmartCollisionBoundary, _t as Primitive, dt as Presence, ft as useControllableState, gt as createContextScope, it as Portal, mt as composeEventHandlers, st as DismissableLayer, ut as useId } from "./zod-BWkcDORu.js";
+import { a as createPopperScope, i as Root2, n as Arrow, r as Content, s as Root, t as Anchor } from "./dist-C1BYNeCR.js";
+import { t as require_jsx_runtime } from "./jsx-runtime-DebpN0FN.js";
+import { $ as StyleNamespace, X as withFullScreenAsRoot, Z as withSmartCollisionBoundary, _t as Primitive, dt as Presence, ft as useControllableState, gt as createContextScope, it as Portal, mt as composeEventHandlers, st as DismissableLayer, ut as useId } from "./zod-CoBiJ5v4.js";
 var import_react = /* @__PURE__ */ __toESM(require_react(), 1), import_jsx_runtime = /* @__PURE__ */ __toESM(require_jsx_runtime(), 1), [createTooltipContext, createTooltipScope] = createContextScope("Tooltip", [createPopperScope]), usePopperScope = createPopperScope(), PROVIDER_NAME = "TooltipProvider", DEFAULT_DELAY_DURATION = 700, TOOLTIP_OPEN = "tooltip.open", [TooltipProviderContextProvider, useTooltipProviderContext] = createTooltipContext(PROVIDER_NAME), TooltipProvider$1 = (n) => {
   let { __scopeTooltip: j, delayDuration: M = DEFAULT_DELAY_DURATION, skipDelayDuration: N = 300, disableHoverableContent: P = false, children: F } = n, I = import_react.useRef(true), L = import_react.useRef(false), R = import_react.useRef(0);
   return import_react.useEffect(() => {

package/dist/{treemap-GDKQZRPO-Du95DV6u.js → treemap-GDKQZRPO-Cl6OQh8D.js}

@@ -1,6 +1,6 @@
-import "./chunk-TCCFYFTB-d3HOqL2I.js";
-import "./main-CThhXnXU.js";
-import { n as createTreemapServices, t as TreemapModule } from "./chunk-B2363JML-D9-XOau1.js";
+import "./chunk-TCCFYFTB-D58KeXnC.js";
+import "./main-Tj_-QTyF.js";
+import { n as createTreemapServices, t as TreemapModule } from "./chunk-B2363JML-KEJpLGGP.js";
 export {
   createTreemapServices
 };

package/dist/{types-Dzuoc3LN.js → types-CVvp1fKr.js}

@@ -1,16 +1,10 @@
-import { u as createLucideIcon } from "./dist-D3ZI9nhS.js";
+import { u as createLucideIcon } from "./dist-C1BYNeCR.js";
 var Pencil = createLucideIcon("pencil", [["path", {
   d: "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z",
   key: "1a8usu"
 }], ["path", {
   d: "m15 5 4 4",
   key: "1mk7zo"
-}]]), Plus = createLucideIcon("plus", [["path", {
-  d: "M5 12h14",
-  key: "1ays0h"
-}], ["path", {
-  d: "M12 5v14",
-  key: "s699le"
 }]]), Trash = createLucideIcon("trash", [
   ["path", {
     d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6",
@@ -31,8 +25,7 @@ const BulkEdit = {
   Rename: "rename"
 };
 export {
-  Pencil as i,
   Trash as n,
-  Plus as r,
+  Pencil as r,
   BulkEdit as t
 };

package/dist/{useAsyncData-C56Khv_R.js → useAsyncData-C008zUPi.js}

@@ -1,8 +1,8 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { w as useEvent_default } from "./useTheme-DykuNHR2.js";
-import { t as invariant } from "./invariant-UcGKQEhF.js";
+import { w as useEvent_default } from "./useTheme-7O0YWlE5.js";
+import { t as invariant } from "./invariant-wRzNXIsJ.js";
 var import_compiler_runtime = require_compiler_runtime(), import_react = /* @__PURE__ */ __toESM(require_react(), 1), Result = {
   error(e, s) {
     return {

package/dist/{useDateFormatter-B_9k85Ex.js → useDateFormatter-BA4FCquG.js}

@@ -1,7 +1,7 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
-import { u as createLucideIcon } from "./dist-D3ZI9nhS.js";
-import { T as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./strings-BiIhGaI8.js";
+import { u as createLucideIcon } from "./dist-C1BYNeCR.js";
+import { T as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "./strings-Bu3vlb6W.js";
 var ChartPie = createLucideIcon("chart-pie", [["path", {
   d: "M21 12c.552 0 1.005-.449.95-.998a10 10 0 0 0-8.953-8.951c-.55-.055-.998.398-.998.95v8a1 1 0 0 0 1 1z",
   key: "pzmjnu"

package/dist/{useDeepCompareMemoize-Dt98v2ua.js → useDeepCompareMemoize-BrA3_n61.js}

@@ -1,6 +1,6 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
-import { C as dequal } from "./useTheme-DykuNHR2.js";
+import { C as dequal } from "./useTheme-7O0YWlE5.js";
 var import_react = /* @__PURE__ */ __toESM(require_react(), 1);
 function useDeepCompareMemoize(e) {
   let i = import_react.useRef(e);

package/dist/{useIframeCapabilities-BkYHTrss.js → useIframeCapabilities-C4JTXTIh.js}

@@ -1,7 +1,7 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { t as getIframeCapabilities } from "./capabilities-C9rrYCzf.js";
+import { t as getIframeCapabilities } from "./capabilities-BceAxrAW.js";
 var import_compiler_runtime = require_compiler_runtime();
 require_react();
 function useIframeCapabilities() {

package/dist/{useLifecycle-BF6-z62y.js → useLifecycle-BNaoJ5a4.js}

@@ -1,10 +1,10 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
-import { _ as Logger, g as cn, r as cva } from "./button-Dj4BTre0.js";
+import { _ as Logger, g as cn, r as cva } from "./button-C5K9fIPF.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { u as createLucideIcon } from "./dist-D3ZI9nhS.js";
-import { t as require_jsx_runtime } from "./jsx-runtime-COBk7ree.js";
-import { _ as useSetAtom, y as atom } from "./useTheme-DykuNHR2.js";
+import { u as createLucideIcon } from "./dist-C1BYNeCR.js";
+import { t as require_jsx_runtime } from "./jsx-runtime-DebpN0FN.js";
+import { _ as useSetAtom, y as atom } from "./useTheme-7O0YWlE5.js";
 var Calendar = createLucideIcon("calendar", [
   ["path", {
     d: "M8 2v4",

package/dist/{useTheme-DykuNHR2.js → useTheme-7O0YWlE5.js}

@@ -1,9 +1,9 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
-import { _ as Logger, a as OverridingHotkeyProvider, s as resolvePlatform } from "./button-Dj4BTre0.js";
+import { _ as Logger, a as OverridingHotkeyProvider, s as resolvePlatform } from "./button-C5K9fIPF.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { A as looseObject, B as union, I as record, N as number, P as object, R as string, T as boolean, b as _enum, w as array } from "./zod-BWkcDORu.js";
-import { t as merge_default } from "./merge-CHn7Yx0N.js";
+import { A as looseObject, B as union, I as record, N as number, P as object, R as string, T as boolean, b as _enum, w as array } from "./zod-CoBiJ5v4.js";
+import { t as merge_default } from "./merge-Be1CqGnU.js";
 var import_react = /* @__PURE__ */ __toESM(require_react()), useInsertionEffect = typeof window < "u" ? import_react.useInsertionEffect || import_react.useLayoutEffect : () => {
 };
 function useEvent(e) {

package/dist/{vega-component-cSdqoAxe.js → vega-component-DJNmOdUj.js}

@@ -1,24 +1,24 @@
 import { s as __toESM } from "./chunk-BNovOVIE.js";
-import { _ as Logger, c as Objects, g as cn, h as Events } from "./button-Dj4BTre0.js";
+import { _ as Logger, c as Objects, g as cn, h as Events } from "./button-C5K9fIPF.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { c as asRemoteURL, v as CircleQuestionMark } from "./toDate-CIpC_34u.js";
-import "./react-dom-BWRJ_g_k.js";
-import { t as require_jsx_runtime } from "./jsx-runtime-COBk7ree.js";
-import "./zod-BWkcDORu.js";
-import { n as ErrorBanner } from "./error-banner-CVkfBUT3.js";
-import { t as Tooltip } from "./tooltip-DRaMBu06.js";
-import { i as debounce_default } from "./constants-D0gkYoE2.js";
-import { n as useTheme, w as useEvent_default } from "./useTheme-DykuNHR2.js";
-import { s as uniq } from "./arrays-CldYf7p7.js";
-import { a as isValid, i as AlertTitle, n as Alert, t as arrow } from "./formats-Dsy9kkZu.js";
-import { n as formats } from "./vega-loader.browser-3_z8GoFC.js";
-import { a as getContainerWidth, n as vegaLoadData, s as tooltipHandler } from "./loader-Dr8Qem8p.js";
-import { t as useAsyncData } from "./useAsyncData-C56Khv_R.js";
-import { t as j } from "./react-vega-Dh6-UKKe.js";
-import "./defaultLocale-BpsHxBd7.js";
-import "./defaultLocale-DoeErsX2.js";
-import { t as useDeepCompareMemoize } from "./useDeepCompareMemoize-Dt98v2ua.js";
+import { c as asRemoteURL, v as CircleQuestionMark } from "./toDate-ZVVIBmdk.js";
+import "./react-dom-BTJzcVJ9.js";
+import { t as require_jsx_runtime } from "./jsx-runtime-DebpN0FN.js";
+import "./zod-CoBiJ5v4.js";
+import { n as ErrorBanner } from "./error-banner-5bz0L9hS.js";
+import { t as Tooltip } from "./tooltip-C5FYOpQc.js";
+import { i as debounce_default } from "./constants-T20xxyNf.js";
+import { n as useTheme, w as useEvent_default } from "./useTheme-7O0YWlE5.js";
+import { s as uniq } from "./arrays-sEtDRoG4.js";
+import { a as isValid, i as AlertTitle, n as Alert, t as arrow } from "./formats-DQ5qjo_Q.js";
+import { n as formats } from "./vega-loader.browser-CZ-J8Py3.js";
+import { a as getContainerWidth, n as vegaLoadData, s as tooltipHandler } from "./loader-BWLPpjKK.js";
+import { t as j } from "./react-vega-B0sAlDTL.js";
+import "./defaultLocale-u-3osm0P.js";
+import "./defaultLocale-BoHTsDG6.js";
+import { t as useAsyncData } from "./useAsyncData-C008zUPi.js";
+import { t as useDeepCompareMemoize } from "./useDeepCompareMemoize-BrA3_n61.js";
 import { t as Semaphore } from "./semaphore-CNDGTzkX.js";
 var import_compiler_runtime = require_compiler_runtime(), import_react = /* @__PURE__ */ __toESM(require_react(), 1);
 function fixRelativeUrl(e) {

package/dist/{vega-loader.browser-3_z8GoFC.js → vega-loader.browser-CZ-J8Py3.js}

@@ -1,6 +1,6 @@
-import { a as tickStep, n as precisionPrefix_default, r as precisionFixed_default, s as bisector, t as precisionRound_default } from "./precisionRound-CnHPY_5v.js";
-import { i as formatSpecifier, n as formatPrefix, r as locale_default, t as format$1 } from "./defaultLocale-BpsHxBd7.js";
-import { C as timeMinute, N as millisecond, S as utcHour, T as second, _ as utcSunday, a as formatLocale, b as utcDay, c as timeMonth, i as utcParse, l as utcMonth, n as timeParse, o as timeYear, p as timeSunday, r as utcFormat, s as utcYear, t as timeFormat, v as timeDay, w as utcMinute, x as timeHour } from "./defaultLocale-DoeErsX2.js";
+import { a as tickStep, n as precisionPrefix_default, r as precisionFixed_default, s as bisector, t as precisionRound_default } from "./precisionRound-Tqb4mg-H.js";
+import { i as formatSpecifier, n as formatPrefix, r as locale_default, t as format$1 } from "./defaultLocale-u-3osm0P.js";
+import { C as timeMinute, N as millisecond, S as utcHour, T as second, _ as utcSunday, a as formatLocale, b as utcDay, c as timeMonth, i as utcParse, l as utcMonth, n as timeParse, o as timeYear, p as timeSunday, r as utcFormat, s as utcYear, t as timeFormat, v as timeDay, w as utcMinute, x as timeHour } from "./defaultLocale-BoHTsDG6.js";
 function accessor(o, P, F) {
   return o.fields = P || [], o.fname = F, o;
 }

package/dist/{xychartDiagram-PRI3JC2R-Dk2d_bX0.js → xychartDiagram-PRI3JC2R-BvwftqMA.js}

@@ -1,17 +1,17 @@
 var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
-import "./purify.es-DT70lfR0.js";
-import { t as linear } from "./linear-2NnK4cxi.js";
-import { n as ordinal } from "./ordinal-B43ZeR68.js";
-import { t as range } from "./range-BOiA8qqU.js";
-import "./defaultLocale-BpsHxBd7.js";
+import "./purify.es-H92eMd9-.js";
+import { t as linear } from "./linear-B5-AFRiR.js";
+import { n as ordinal } from "./ordinal-ArJavP1Q.js";
+import { t as range } from "./range-C-rmrM1O.js";
+import "./defaultLocale-u-3osm0P.js";
 import { t as line_default } from "./line-C5s_12ee.js";
-import { i as cleanAndMerge } from "./chunk-S3R3BYOJ-mQeCz5CE.js";
+import { i as cleanAndMerge } from "./chunk-S3R3BYOJ-oAe3dEbO.js";
 import { n as initRange } from "./init-uv0kkh4g.js";
 import { i as log, r as __name } from "./src-Bf2iLOlr.js";
-import { B as setAccTitle, C as getDiagramTitle, I as sanitizeText, T as getThemeVariables3, U as setDiagramTitle, _ as getAccDescription, a as clear, c as configureSvgSize, d as defaultConfig_default, v as getAccTitle, y as getConfig, z as setAccDescription } from "./chunk-ABZYJK2D-D0cLy8Bb.js";
-import { t as selectSvgElement } from "./chunk-EXTU4WIE-BKNXdLmD.js";
+import { B as setAccTitle, C as getDiagramTitle, I as sanitizeText, T as getThemeVariables3, U as setDiagramTitle, _ as getAccDescription, a as clear, c as configureSvgSize, d as defaultConfig_default, v as getAccTitle, y as getConfig, z as setAccDescription } from "./chunk-ABZYJK2D-Dz0-H2B5.js";
+import { t as selectSvgElement } from "./chunk-EXTU4WIE-9sNjmQrB.js";
 import "./dist-BGdYVvOu.js";
-import { t as computeDimensionOfText } from "./chunk-JA3XYJ7Z-D6c6cOBG.js";
+import { t as computeDimensionOfText } from "./chunk-JA3XYJ7Z-C32Y7Epf.js";
 function band() {
   var e = ordinal().unknown(void 0), w = e.domain, T = e.range, D = 0, O = 1, k, A, j = false, M = 0, N = 0, P = 0.5;
   delete e.unknown;

package/dist/{zod-BWkcDORu.js → zod-CoBiJ5v4.js}

@@ -1,9 +1,9 @@
 import { r as __export, s as __toESM } from "./chunk-BNovOVIE.js";
-import { d as createSlot, l as useEventListener, m as useComposedRefs } from "./button-Dj4BTre0.js";
+import { d as createSlot, l as useEventListener, m as useComposedRefs } from "./button-C5K9fIPF.js";
 import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
-import { t as require_react_dom } from "./react-dom-BWRJ_g_k.js";
-import { t as require_jsx_runtime } from "./jsx-runtime-COBk7ree.js";
+import { t as require_react_dom } from "./react-dom-BTJzcVJ9.js";
+import { t as require_jsx_runtime } from "./jsx-runtime-DebpN0FN.js";
 var import_react = /* @__PURE__ */ __toESM(require_react(), 1), import_react_dom$1 = /* @__PURE__ */ __toESM(require_react_dom(), 1), import_jsx_runtime = /* @__PURE__ */ __toESM(require_jsx_runtime(), 1), Primitive = [
   "a",
   "button",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marimo-team/islands",
-  "version": "0.23.9-dev3",
+  "version": "0.23.9-dev5",
   "main": "dist/main.js",
   "types": "dist/index.d.ts",
   "type": "module",

package/src/components/data-table/TableBottomBar.tsx

@@ -7,8 +7,13 @@ import type { GetRowIds } from "@/plugins/impl/DataTablePlugin";
 import { cn } from "@/utils/cn";
 import { Events } from "@/utils/events";
 import { prettyNumber } from "@/utils/numbers";
+import {
+  PANEL_TYPES,
+  type PanelType,
+} from "../editor/chrome/panels/context-aware-panel/context-aware-panel";
 import { Button } from "../ui/button";
 import { toast } from "../ui/use-toast";
+import { getUserColumnVisibilityCounts } from "./hooks/use-column-visibility";
 import { DataTablePagination, prettifyRowColumnCount } from "./pagination";
 import { CellSelectionStats } from "./range-focus/cell-selection-stats";
 import type { DataTableSelection } from "./types";
@@ -22,6 +27,7 @@ interface TableBottomBarProps<TData> {
   getRowIds?: GetRowIds;
   showPageSizeSelector?: boolean;
   tableLoading?: boolean;
+  togglePanel?: (panelType: PanelType) => void;
   part?: string;
   className?: string;
 }
@@ -35,6 +41,7 @@ export const TableBottomBar = <TData,>({
   getRowIds,
   showPageSizeSelector,
   tableLoading,
+  togglePanel,
   part,
   className,
 }: TableBottomBarProps<TData>) => {
@@ -140,13 +147,30 @@ export const TableBottomBar = <TData,>({
       );
     }
 
+    const counts = getUserColumnVisibilityCounts(table);
+    // When columns are clipped, the table instance only has the rendered
+    // subset, so the visible/hidden math must use that subset's total. The
+    // dataset-wide `totalColumns` prop is only correct for the no-hidden
+    // "N columns" label.
+    const { rowsAndColumns, hiddenSuffix } = prettifyRowColumnCount({
+      numRows: table.getRowCount(),
+      totalColumns: counts.hidden > 0 ? counts.total : totalColumns,
+      hiddenColumns: counts.hidden,
+      locale,
+    });
+
     return (
-      <span>
-        {prettifyRowColumnCount({
-          numRows: table.getRowCount(),
-          totalColumns,
-          locale,
-        })}
+      <span className="flex items-center gap-1">
+        <span>{rowsAndColumns}</span>
+        {hiddenSuffix && (
+          <button
+            type="button"
+            className="text-xs underline-offset-2 hover:underline cursor-pointer"
+            onClick={() => togglePanel?.(PANEL_TYPES.COLUMN_EXPLORER)}
+          >
+            {hiddenSuffix}
+          </button>
+        )}
       </span>
     );
   };

package/src/components/data-table/__tests__/TableBottomBar.test.tsx

@@ -0,0 +1,73 @@
+/* Copyright 2026 Marimo. All rights reserved. */
+"use no memo";
+
+import { getCoreRowModel, useReactTable } from "@tanstack/react-table";
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { TooltipProvider } from "@/components/ui/tooltip";
+import { CellSelectionProvider } from "../range-focus/provider";
+import { TableBottomBar } from "../TableBottomBar";
+
+function renderWithTable(opts: {
+  totalColumns: number;
+  hiddenColumns?: string[];
+  togglePanel?: (panelType: string) => void;
+}) {
+  const Wrapper = () => {
+    const table = useReactTable({
+      data: [] as Array<Record<string, unknown>>,
+      columns: Array.from({ length: opts.totalColumns }, (_, i) => ({
+        id: `col${i}`,
+        enableHiding: true,
+      })),
+      getCoreRowModel: getCoreRowModel(),
+      locale: "en-US",
+      state: {
+        columnVisibility: Object.fromEntries(
+          (opts.hiddenColumns ?? []).map((c) => [c, false]),
+        ),
+      },
+    });
+
+    return (
+      <TableBottomBar
+        pagination={false}
+        totalColumns={opts.totalColumns}
+        table={table}
+        togglePanel={opts.togglePanel}
+      />
+    );
+  };
+
+  return render(
+    <TooltipProvider>
+      <CellSelectionProvider>
+        <Wrapper />
+      </CellSelectionProvider>
+    </TooltipProvider>,
+  );
+}
+
+describe("TableBottomBar — hidden column count", () => {
+  it("does not render '(n hidden)' when no columns are hidden", () => {
+    renderWithTable({ totalColumns: 3 });
+    expect(screen.queryByText(/hidden/)).toBeNull();
+  });
+
+  it("renders 'X visible (n hidden)' when columns are hidden", () => {
+    renderWithTable({ totalColumns: 3, hiddenColumns: ["col1"] });
+    expect(screen.getByText(/2 visible/)).toBeInTheDocument();
+    expect(screen.getByText(/\(1 hidden\)/)).toBeInTheDocument();
+  });
+
+  it("invokes togglePanel('column-explorer') when '(n hidden)' is clicked", () => {
+    const togglePanel = vi.fn();
+    renderWithTable({
+      totalColumns: 3,
+      hiddenColumns: ["col1"],
+      togglePanel,
+    });
+    screen.getByText(/\(1 hidden\)/).click();
+    expect(togglePanel).toHaveBeenCalledWith("column-explorer");
+  });
+});