@marimo-team/islands 0.23.7-dev48 → 0.23.7-dev50

package/dist/main.js

@@ -26,7 +26,7 @@ import { $ as useCellActions, At as DeferredRequestRegistry, B as safeExtractSet
 import { __tla as __tla_1 } from "./chunk-5FQGJX7Z-BOg95xG5.js";
 import { o as useSize, s as Root$2, u as createLucideIcon } from "./dist-D3ZI9nhS.js";
 import { A as SquareFunction, C as DEFAULT_COLOR_SCHEME, D as SCALE_TYPE_DESCRIPTIONS, E as EMPTY_VALUE$1, O as TIME_UNIT_DESCRIPTIONS, 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 ChartColumn, 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-hVaaZsY5.js";
-import { $ as filtersToFilterGroup, A as contextAwarePanelOwner, At as Funnel, B as TableCell, Bt as ChevronLeft, C as prettifyRowCount, Ct as useOverflowDetection, D as ContextAwarePanelItem, Dt as EmotionCacheProvider, E as ComboboxItem, Et as HtmlOutput, F as Toggle, Ft as Code, G as generateColumns, H as TableHeader, I as Fill, It as ChevronsUpDown, J as ColumnChartContext, K as inferFieldTypes, L as Provider$1, Lt as ChevronsRight, M as isCellAwareAtom, N as SlotNames, Nt as Ellipsis, O as PANEL_TYPES, Ot as TextWrap, P as slotsController, Pt as Download, Q as usePrevious$1, R as Table, Rt as ChevronsLeft, S as prettifyRowColumnCount, St as LazyVegaEmbed, T as Combobox, Tt as Kbd, U as TableRow, V as TableHead, Vt as ArrowDownWideNarrow, W as NAMELESS_COLUMN_PREFIX, X as DelayMount, Y as ColumnChartSpecModel, Z as useIntersectionObserver, _ as downloadBlob, _t as TabsList, at as TOO_MANY_ROWS, b as Progress, bt as ChartInfoState, c as Slide, ct as Command, d as JsonOutput, dt as CommandItem, et as getPageIndexForRow, f as OutputArea, ft as CommandList, g as ADD_PRINTING_CLASS, gt as TabsContent, h as InstallPackageButton, ht as Tabs, it as SELECT_COLUMN_ID, j as contextAwarePanelType, jt as EyeOff, k as contextAwarePanelOpen, kt as GripHorizontal, l as RadioGroup, lt as CommandEmpty, m as DataTable, mt as Maps, n as marimoVersionAtom, nt as loadTableData, o as SLIDE_TYPE_OPTIONS_BY_VALUE, ot as toFieldTypes, p as OutputRenderer, pt as CommandSeparator, q as renderCellValue, r as showCodeInRunModeAtom, rt as INDEX_COLUMN_NAME, st as getMimeValues, t as useNotebookCodeAvailable, tt as loadTableAndRawData, u as RadioGroupItem, ut as CommandInput, v as downloadByURL, vt as TabsTrigger, w as useInternalStateWithSync, wt as RenderTextWithLinks, x as Filenames, xt as ChartLoadingState, y as downloadHTMLAsImage, yt as ChartErrorState, z as TableBody, zt as ChevronsDownUp, __tla as __tla_2 } from "./code-visibility-An0P9cL_.js";
+import { $ as filtersToFilterGroup, A as contextAwarePanelOwner, At as Funnel, B as TableCell, Bt as ChevronLeft, C as prettifyRowCount, Ct as useOverflowDetection, D as ContextAwarePanelItem, Dt as EmotionCacheProvider, E as ComboboxItem, Et as HtmlOutput, F as Toggle, Ft as Code, G as generateColumns, H as TableHeader, I as Fill, It as ChevronsUpDown, J as ColumnChartContext, K as inferFieldTypes, L as Provider$1, Lt as ChevronsRight, M as isCellAwareAtom, N as SlotNames, Nt as Ellipsis, O as PANEL_TYPES, Ot as TextWrap, P as slotsController, Pt as Download, Q as usePrevious$1, R as Table, Rt as ChevronsLeft, S as prettifyRowColumnCount, St as LazyVegaEmbed, T as Combobox, Tt as Kbd, U as TableRow, V as TableHead, Vt as ArrowDownWideNarrow, W as NAMELESS_COLUMN_PREFIX, X as DelayMount, Y as ColumnChartSpecModel, Z as useIntersectionObserver, _ as downloadBlob, _t as TabsList, at as TOO_MANY_ROWS, b as Progress, bt as ChartInfoState, c as Slide, ct as Command, d as JsonOutput, dt as CommandItem, et as getPageIndexForRow, f as OutputArea, ft as CommandList, g as ADD_PRINTING_CLASS, gt as TabsContent, h as InstallPackageButton, ht as Tabs, it as SELECT_COLUMN_ID, j as contextAwarePanelType, jt as EyeOff, k as contextAwarePanelOpen, kt as GripHorizontal, l as RadioGroup, lt as CommandEmpty, m as DataTable, mt as Maps, n as marimoVersionAtom, nt as loadTableData, o as SLIDE_TYPE_OPTIONS_BY_VALUE, ot as toFieldTypes, p as OutputRenderer, pt as CommandSeparator, q as renderCellValue, r as showCodeInRunModeAtom, rt as INDEX_COLUMN_NAME, st as getMimeValues, t as useNotebookCodeAvailable, tt as loadTableAndRawData, u as RadioGroupItem, ut as CommandInput, v as downloadByURL, vt as TabsTrigger, w as useInternalStateWithSync, wt as RenderTextWithLinks, x as Filenames, xt as ChartLoadingState, y as downloadHTMLAsImage, yt as ChartErrorState, z as TableBody, zt as ChevronsDownUp, __tla as __tla_2 } from "./code-visibility-DjsEQuRb.js";
 import { c as Calendar, i as createReducerAndAtoms, n as useOnUnmount, o as ToggleLeft, t as useOnMount } from "./useLifecycle-BF6-z62y.js";
 import { n as $fb18d541ea1ad717$export$ad991b66133851cf, r as $5a387cc49350e6db$export$722debc0e56fea39, t as $896ba0a80a8f4d36$export$85fd5fdf27bacc79 } from "./useDateFormatter-B_9k85Ex.js";
 import { t as Check } from "./check-BcUIXnUT.js";
@@ -18651,7 +18651,8 @@ ${c}
         label: string().nullable(),
         options: array(string()),
         fullWidth: boolean().default(false),
-        maxSelections: number().optional()
+        maxSelections: number().optional(),
+        disabled: boolean().default(false)
       }));
     }
     render(e) {
@@ -18663,21 +18664,21 @@ ${c}
     }
   }, SELECT_ALL_KEY = "__select_all__", DESELECT_ALL_KEY = "__deselect_all__";
   const Multiselect = (e) => {
-    let r = (0, import_compiler_runtime$81.c)(45), { options: c, label: l, value: u, setValue: d, fullWidth: f, maxSelections: m } = e, h = (0, import_react.useId)(), [g, _] = (0, import_react.useState)(""), v;
+    let r = (0, import_compiler_runtime$81.c)(46), { options: c, label: l, value: u, setValue: d, fullWidth: f, maxSelections: m, disabled: h } = e, g = (0, import_react.useId)(), [_, v] = (0, import_react.useState)(""), y;
     bb0: {
-      if (!g) {
-        v = c;
+      if (!_) {
+        y = c;
         break bb0;
       }
       let e2;
-      if (r[0] !== c || r[1] !== g) {
+      if (r[0] !== c || r[1] !== _) {
         let l2;
-        r[3] === g ? l2 = r[4] : (l2 = (e3) => multiselectFilterFn(e3, g) === 1, r[3] = g, r[4] = l2), e2 = c.filter(l2), r[0] = c, r[1] = g, r[2] = e2;
+        r[3] === _ ? l2 = r[4] : (l2 = (e3) => multiselectFilterFn(e3, _) === 1, r[3] = _, r[4] = l2), e2 = c.filter(l2), r[0] = c, r[1] = _, r[2] = e2;
       } else e2 = r[2];
-      v = e2;
+      y = e2;
     }
-    let y = v, b;
-    r[5] !== m || r[6] !== d ? (b = (e2) => {
+    let b = y, S;
+    r[5] !== m || r[6] !== d ? (S = (e2) => {
       if (!e2 || e2.length === 0) {
         d([]);
         return;
@@ -18689,96 +18690,97 @@ ${c}
         return;
       }
       m != null && e2.length > m && (e2 = e2.slice(-m)), d(e2);
-    }, r[5] = m, r[6] = d, r[7] = b) : b = r[7];
-    let S = b, w;
-    r[8] !== c || r[9] !== d ? (w = () => {
+    }, r[5] = m, r[6] = d, r[7] = S) : S = r[7];
+    let w = S, T;
+    r[8] !== c || r[9] !== d ? (T = () => {
       d(c);
-    }, r[8] = c, r[9] = d, r[10] = w) : w = r[10];
-    let T = w, E;
-    r[11] === d ? E = r[12] : (E = () => {
+    }, r[8] = c, r[9] = d, r[10] = T) : T = r[10];
+    let E = T, O;
+    r[11] === d ? O = r[12] : (O = () => {
       d([]);
-    }, r[11] = d, r[12] = E);
-    let O = E, j;
-    if (r[13] !== O || r[14] !== T || r[15] !== m || r[16] !== c.length || r[17] !== u) {
-      j = [];
+    }, r[11] = d, r[12] = O);
+    let j = O, M;
+    if (r[13] !== j || r[14] !== E || r[15] !== m || r[16] !== c.length || r[17] !== u) {
+      M = [];
       let e2 = c.length > 0 && u.length < c.length, l2 = c.length > 0 && u.length > 0;
       if (c.length > 2 && m == null) {
         let c2 = !e2, l3;
-        r[19] !== T || r[20] !== c2 ? (l3 = (0, import_jsx_runtime.jsx)(ComboboxItem, {
+        r[19] !== E || r[20] !== c2 ? (l3 = (0, import_jsx_runtime.jsx)(ComboboxItem, {
           value: SELECT_ALL_KEY,
-          onSelect: T,
+          onSelect: E,
           disabled: c2,
           children: "Select all"
-        }, SELECT_ALL_KEY), r[19] = T, r[20] = c2, r[21] = l3) : l3 = r[21], j.push(l3);
+        }, SELECT_ALL_KEY), r[19] = E, r[20] = c2, r[21] = l3) : l3 = r[21], M.push(l3);
       }
       if (c.length > 2) {
         let e3 = !l2, c2 = m === 1 ? "Deselect" : "Deselect all", u2;
-        r[22] !== O || r[23] !== e3 || r[24] !== c2 ? (u2 = (0, import_jsx_runtime.jsx)(ComboboxItem, {
+        r[22] !== j || r[23] !== e3 || r[24] !== c2 ? (u2 = (0, import_jsx_runtime.jsx)(ComboboxItem, {
           value: DESELECT_ALL_KEY,
-          onSelect: O,
+          onSelect: j,
           disabled: e3,
           children: c2
-        }, DESELECT_ALL_KEY), r[22] = O, r[23] = e3, r[24] = c2, r[25] = u2) : u2 = r[25];
+        }, DESELECT_ALL_KEY), r[22] = j, r[23] = e3, r[24] = c2, r[25] = u2) : u2 = r[25];
         let d2;
-        r[26] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (d2 = (0, import_jsx_runtime.jsx)(CommandSeparator, {}, "_separator"), r[26] = d2) : d2 = r[26], j.push(u2, d2);
+        r[26] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (d2 = (0, import_jsx_runtime.jsx)(CommandSeparator, {}, "_separator"), r[26] = d2) : d2 = r[26], M.push(u2, d2);
       }
-      r[13] = O, r[14] = T, r[15] = m, r[16] = c.length, r[17] = u, r[18] = j;
-    } else j = r[18];
-    let M;
-    r[27] !== j || r[28] !== y ? (M = () => {
-      if (y.length > 200) return (0, import_jsx_runtime.jsx)(Yr, {
+      r[13] = j, r[14] = E, r[15] = m, r[16] = c.length, r[17] = u, r[18] = M;
+    } else M = r[18];
+    let I;
+    r[27] !== M || r[28] !== b ? (I = () => {
+      if (b.length > 200) return (0, import_jsx_runtime.jsx)(Yr, {
         style: {
           height: "200px"
         },
-        totalCount: y.length,
+        totalCount: b.length,
         overscan: 50,
         itemContent: (e3) => {
           let r2 = (0, import_jsx_runtime.jsx)(ComboboxItem, {
-            value: y[e3],
-            children: y[e3]
-          }, y[e3]);
+            value: b[e3],
+            children: b[e3]
+          }, b[e3]);
           return e3 === 0 ? (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
             children: [
-              j,
+              M,
               r2
             ]
           }) : r2;
         }
       });
-      let e2 = y.map(_temp2$19);
+      let e2 = b.map(_temp2$19);
       return (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
         children: [
-          j,
+          M,
           e2
         ]
       });
-    }, r[27] = j, r[28] = y, r[29] = M) : M = r[29];
-    let I = M, L;
-    r[30] === f ? L = r[31] : (L = cn({
+    }, r[27] = M, r[28] = b, r[29] = I) : I = r[29];
+    let L = I, R;
+    r[30] === f ? R = r[31] : (R = cn({
       "w-full": f
-    }), r[30] = f, r[31] = L);
-    let R;
-    r[32] === I ? R = r[33] : (R = I(), r[32] = I, r[33] = R);
+    }), r[30] = f, r[31] = R);
     let z;
-    r[34] !== S || r[35] !== g || r[36] !== L || r[37] !== R || r[38] !== u ? (z = (0, import_jsx_runtime.jsx)(Combobox, {
+    r[32] === L ? z = r[33] : (z = L(), r[32] = L, r[33] = z);
+    let B;
+    r[34] !== h || r[35] !== w || r[36] !== _ || r[37] !== R || r[38] !== z || r[39] !== u ? (B = (0, import_jsx_runtime.jsx)(Combobox, {
       displayValue: _temp3$14,
       placeholder: "Select...",
       multiple: true,
-      className: L,
+      className: R,
       value: u,
-      onValueChange: S,
+      onValueChange: w,
       shouldFilter: false,
-      search: g,
-      onSearchChange: _,
-      children: R
-    }), r[34] = S, r[35] = g, r[36] = L, r[37] = R, r[38] = u, r[39] = z) : z = r[39];
-    let B;
-    return r[40] !== f || r[41] !== h || r[42] !== l || r[43] !== z ? (B = (0, import_jsx_runtime.jsx)(Labeled, {
+      search: _,
+      onSearchChange: v,
+      disabled: h,
+      children: z
+    }), r[34] = h, r[35] = w, r[36] = _, r[37] = R, r[38] = z, r[39] = u, r[40] = B) : B = r[40];
+    let H;
+    return r[41] !== f || r[42] !== g || r[43] !== l || r[44] !== B ? (H = (0, import_jsx_runtime.jsx)(Labeled, {
       label: l,
-      id: h,
+      id: g,
       fullWidth: f,
-      children: z
-    }), r[40] = f, r[41] = h, r[42] = l, r[43] = z, r[44] = B) : B = r[44], B;
+      children: B
+    }), r[41] = f, r[42] = g, r[43] = l, r[44] = B, r[45] = H) : H = r[45], H;
   };
   function _temp$26(e) {
     return e !== SELECT_ALL_KEY && e !== DESELECT_ALL_KEY;
@@ -19570,6 +19572,7 @@ ${c}
         children: (0, import_jsx_runtime.jsx)(FormControl, {
           children: (0, import_jsx_runtime.jsx)(Multiselect, {
             options: (d == null ? void 0 : d.map(_temp0)) ?? [],
+            disabled: false,
             value: c2,
             setValue: (e3) => {
               let c3 = (typeof e3 == "function" ? e3([]) : e3).map((e4) => f(e4, d));
@@ -23516,37 +23519,37 @@ ${c}
     ], r[0] = c, r[1] = l, r[2] = d, r[3] = f) : (d = r[2], f = r[3]), (0, import_react.useEffect)(d, f), u;
   }, import_compiler_runtime$53 = require_compiler_runtime(), NONE_KEY = "__none__";
   const SearchableSelect = (e) => {
-    let r = (0, import_compiler_runtime$53.c)(25), { options: c, value: l, setValue: u, label: d, allowSelectNone: f, fullWidth: m } = e, h = (0, import_react.useId)(), [g, _] = (0, import_react.useState)(""), v;
+    let r = (0, import_compiler_runtime$53.c)(26), { options: c, value: l, setValue: u, label: d, allowSelectNone: f, fullWidth: m, disabled: h } = e, g = (0, import_react.useId)(), [_, v] = (0, import_react.useState)(""), y;
     bb0: {
-      if (!g) {
-        v = c;
+      if (!_) {
+        y = c;
         break bb0;
       }
       let e2;
-      if (r[0] !== c || r[1] !== g) {
+      if (r[0] !== c || r[1] !== _) {
         let l2;
-        r[3] === g ? l2 = r[4] : (l2 = (e3) => multiselectFilterFn(e3, g) === 1, r[3] = g, r[4] = l2), e2 = c.filter(l2), r[0] = c, r[1] = g, r[2] = e2;
+        r[3] === _ ? l2 = r[4] : (l2 = (e3) => multiselectFilterFn(e3, _) === 1, r[3] = _, r[4] = l2), e2 = c.filter(l2), r[0] = c, r[1] = _, r[2] = e2;
       } else e2 = r[2];
-      v = e2;
+      y = e2;
     }
-    let y = v, b;
-    r[5] === u ? b = r[6] : (b = (e2) => {
+    let b = y, S;
+    r[5] === u ? S = r[6] : (S = (e2) => {
       e2 != null && u(e2 === NONE_KEY ? null : e2);
-    }, r[5] = u, r[6] = b);
-    let S = b, w;
-    r[7] !== f || r[8] !== y ? (w = () => {
+    }, r[5] = u, r[6] = S);
+    let w = S, T;
+    r[7] !== f || r[8] !== b ? (T = () => {
       let e2 = f ? (0, import_jsx_runtime.jsx)(ComboboxItem, {
         value: NONE_KEY,
         children: "--"
       }, NONE_KEY) : null;
-      return y.length > 200 ? (0, import_jsx_runtime.jsx)(Yr, {
+      return b.length > 200 ? (0, import_jsx_runtime.jsx)(Yr, {
         style: {
           height: "200px"
         },
-        totalCount: y.length,
+        totalCount: b.length,
         overscan: 50,
         itemContent: (r2) => {
-          let c2 = y[r2], l2 = (0, import_jsx_runtime.jsx)(ComboboxItem, {
+          let c2 = b[r2], l2 = (0, import_jsx_runtime.jsx)(ComboboxItem, {
             value: c2,
             children: c2
           }, c2);
@@ -23560,37 +23563,38 @@ ${c}
       }) : (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
         children: [
           e2,
-          y.map(_temp$16)
+          b.map(_temp$16)
         ]
       });
-    }, r[7] = f, r[8] = y, r[9] = w) : w = r[9];
-    let T = w, E;
-    r[10] === m ? E = r[11] : (E = cn({
+    }, r[7] = f, r[8] = b, r[9] = T) : T = r[9];
+    let E = T, O;
+    r[10] === m ? O = r[11] : (O = cn({
       "w-full": m
-    }), r[10] = m, r[11] = E);
-    let O = l ?? NONE_KEY, j;
-    r[12] === T ? j = r[13] : (j = T(), r[12] = T, r[13] = j);
-    let M;
-    r[14] !== S || r[15] !== g || r[16] !== E || r[17] !== O || r[18] !== j ? (M = (0, import_jsx_runtime.jsx)(Combobox, {
+    }), r[10] = m, r[11] = O);
+    let j = l ?? NONE_KEY, M;
+    r[12] === E ? M = r[13] : (M = E(), r[12] = E, r[13] = M);
+    let I;
+    r[14] !== h || r[15] !== w || r[16] !== _ || r[17] !== O || r[18] !== j || r[19] !== M ? (I = (0, import_jsx_runtime.jsx)(Combobox, {
       displayValue: _temp2$10,
       placeholder: "Select...",
       multiple: false,
-      className: E,
-      value: O,
-      onValueChange: S,
+      className: O,
+      value: j,
+      onValueChange: w,
       shouldFilter: false,
-      search: g,
-      onSearchChange: _,
+      search: _,
+      onSearchChange: v,
+      disabled: h,
       "data-testid": "marimo-plugin-searchable-dropdown",
-      children: j
-    }), r[14] = S, r[15] = g, r[16] = E, r[17] = O, r[18] = j, r[19] = M) : M = r[19];
-    let I;
-    return r[20] !== m || r[21] !== h || r[22] !== d || r[23] !== M ? (I = (0, import_jsx_runtime.jsx)(Labeled, {
+      children: M
+    }), r[14] = h, r[15] = w, r[16] = _, r[17] = O, r[18] = j, r[19] = M, r[20] = I) : I = r[20];
+    let L;
+    return r[21] !== m || r[22] !== g || r[23] !== d || r[24] !== I ? (L = (0, import_jsx_runtime.jsx)(Labeled, {
       label: d,
-      id: h,
+      id: g,
       fullWidth: m,
-      children: M
-    }), r[20] = m, r[21] = h, r[22] = d, r[23] = M, r[24] = I) : I = r[24], I;
+      children: I
+    }), r[21] = m, r[22] = g, r[23] = d, r[24] = I, r[25] = L) : L = r[25], L;
   };
   function _temp$16(e) {
     return (0, import_jsx_runtime.jsx)(ComboboxItem, {
@@ -23610,7 +23614,8 @@ ${c}
         options: array(string()),
         allowSelectNone: boolean(),
         fullWidth: boolean().default(false),
-        searchable: boolean().default(false)
+        searchable: boolean().default(false),
+        disabled: boolean().default(false)
       }));
     }
     render(e) {
@@ -23631,51 +23636,52 @@ ${c}
       });
     }
   }, EMPTY_VALUE = "--", Dropdown = (e) => {
-    let r = (0, import_compiler_runtime$52.c)(24), { label: c, options: l, value: u, setValue: d, allowSelectNone: f, fullWidth: m } = e, h = (0, import_react.useId)(), g = f ? EMPTY_VALUE : l[0], _ = u.length === 0 ? g : u[0], v;
-    r[0] === d ? v = r[1] : (v = (e2) => {
+    let r = (0, import_compiler_runtime$52.c)(25), { label: c, options: l, value: u, setValue: d, allowSelectNone: f, fullWidth: m, disabled: h } = e, g = (0, import_react.useId)(), _ = f ? EMPTY_VALUE : l[0], v = u.length === 0 ? _ : u[0], y;
+    r[0] === d ? y = r[1] : (y = (e2) => {
       let r2 = e2.target.value;
       d(r2 === EMPTY_VALUE ? [] : [
         r2
       ]);
-    }, r[0] = d, r[1] = v);
-    let y;
-    r[2] === m ? y = r[3] : (y = cn({
-      "w-full": m
-    }), r[2] = m, r[3] = y);
+    }, r[0] = d, r[1] = y);
     let b;
-    r[4] !== f || r[5] !== u.length ? (b = f ? (0, import_jsx_runtime.jsx)("option", {
+    r[2] === m ? b = r[3] : (b = cn({
+      "w-full": m
+    }), r[2] = m, r[3] = b);
+    let S;
+    r[4] !== f || r[5] !== u.length ? (S = f ? (0, import_jsx_runtime.jsx)("option", {
       value: EMPTY_VALUE,
       selected: u.length === 0,
       children: "--"
-    }) : null, r[4] = f, r[5] = u.length, r[6] = b) : b = r[6];
-    let S;
+    }) : null, r[4] = f, r[5] = u.length, r[6] = S) : S = r[6];
+    let w;
     if (r[7] !== l || r[8] !== u) {
       let e2;
       r[10] === u ? e2 = r[11] : (e2 = (e3) => (0, import_jsx_runtime.jsx)("option", {
         value: e3,
         selected: u.includes(e3),
         children: e3
-      }, e3), r[10] = u, r[11] = e2), S = l.map(e2), r[7] = l, r[8] = u, r[9] = S;
-    } else S = r[9];
-    let w;
-    r[12] !== h || r[13] !== _ || r[14] !== v || r[15] !== y || r[16] !== b || r[17] !== S ? (w = (0, import_jsx_runtime.jsxs)(NativeSelect, {
+      }, e3), r[10] = u, r[11] = e2), w = l.map(e2), r[7] = l, r[8] = u, r[9] = w;
+    } else w = r[9];
+    let T;
+    r[12] !== h || r[13] !== g || r[14] !== v || r[15] !== y || r[16] !== b || r[17] !== S || r[18] !== w ? (T = (0, import_jsx_runtime.jsxs)(NativeSelect, {
       "data-testid": "marimo-plugin-dropdown",
-      onChange: v,
-      className: y,
-      value: _,
-      id: h,
+      onChange: y,
+      className: b,
+      value: v,
+      id: g,
+      disabled: h,
       children: [
-        b,
-        S
+        S,
+        w
       ]
-    }), r[12] = h, r[13] = _, r[14] = v, r[15] = y, r[16] = b, r[17] = S, r[18] = w) : w = r[18];
-    let T;
-    return r[19] !== m || r[20] !== h || r[21] !== c || r[22] !== w ? (T = (0, import_jsx_runtime.jsx)(Labeled, {
+    }), r[12] = h, r[13] = g, r[14] = v, r[15] = y, r[16] = b, r[17] = S, r[18] = w, r[19] = T) : T = r[19];
+    let E;
+    return r[20] !== m || r[21] !== g || r[22] !== c || r[23] !== T ? (E = (0, import_jsx_runtime.jsx)(Labeled, {
       label: c,
-      id: h,
+      id: g,
       fullWidth: m,
-      children: w
-    }), r[19] = m, r[20] = h, r[21] = c, r[22] = w, r[23] = T) : T = r[23], T;
+      children: T
+    }), r[20] = m, r[21] = g, r[22] = c, r[23] = T, r[24] = E) : E = r[24], E;
   }, LazyDataExplorerComponent = import_react.lazy(() => import("./ConnectedDataExplorerComponent-2lBNiUv6.js"));
   const DataExplorerPlugin = createPlugin("marimo-data-explorer").withData(object({
     label: string().nullish(),
@@ -44600,7 +44606,7 @@ ${c}
     if (l && l !== "slide") return l;
     if (c == null ? void 0 : c.has(e)) return "skip";
   }
-  var LazySlidesComponent = import_react.lazy(() => import("./reveal-component-B23qYh6r.js"));
+  var LazySlidesComponent = import_react.lazy(() => import("./reveal-component-pQBz0vEK.js"));
   const SlidesLayoutPlugin = {
     type: "slides",
     name: "Slides",

package/dist/{reveal-component-B23qYh6r.js → reveal-component-pQBz0vEK.js}

@@ -8,7 +8,7 @@ import { t as require_react } from "./react-DA-nE2FX.js";
 import { t as require_compiler_runtime } from "./compiler-runtime-CEbnTgxf.js";
 import "./html-to-image-DaPPaVDP.js";
 import "./chunk-5FQGJX7Z-BOg95xG5.js";
-import { Ft as Code, Mt as Expand, a as DEFAULT_SLIDE_TYPE, c as Slide, i as DEFAULT_DECK_TRANSITION, jt as EyeOff, s as SlideSidebar, t as useNotebookCodeAvailable } from "./code-visibility-An0P9cL_.js";
+import { Ft as Code, Mt as Expand, a as DEFAULT_SLIDE_TYPE, c as Slide, i as DEFAULT_DECK_TRANSITION, jt as EyeOff, s as SlideSidebar, t as useNotebookCodeAvailable } from "./code-visibility-DjsEQuRb.js";
 import "./input-D4kjoQUB.js";
 import "./toDate-CJWlVNGD.js";
 import "./react-dom-BWRJ_g_k.js";

package/package.json

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

package/src/components/data-table/charts/components/form-fields.tsx

@@ -789,6 +789,7 @@ export const TooltipSelect = ({
             <FormControl>
               <Multiselect
                 options={fields?.map((field) => field.name) ?? []}
+                disabled={false}
                 value={values}
                 setValue={(values) => {
                   const selectedValues =

package/src/components/ui/combobox.tsx

@@ -39,6 +39,7 @@ interface ComboboxCommonProps<TValue> {
   className?: string;
   id?: string;
   keepPopoverOpenOnSelect?: boolean;
+  disabled?: boolean;
 }
 
 type ComboboxFilterProps =
@@ -95,6 +96,7 @@ export const Combobox = <TValue,>({
   chipsClassName,
   keepPopoverOpenOnSelect,
   id,
+  disabled = false,
   ...rest
 }: ComboboxProps<TValue>) => {
   const [open = false, setOpen] = useControllableState({
@@ -168,16 +170,26 @@ export const Combobox = <TValue,>({
 
   return (
     <div className={cn("relative")} {...rest}>
-      <Popover open={open} onOpenChange={setOpen}>
+      <Popover
+        open={open}
+        onOpenChange={(v) => {
+          if (disabled && v) {
+            return;
+          }
+          setOpen(v);
+        }}
+      >
         <PopoverTrigger asChild={true}>
           <button
             id={id}
             type="button"
             className={cn(
-              "flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid disabled:cursor-not-allowed disabled:opacity-50",
+              "flex h-6 w-fit mb-1 shadow-xs-solid items-center justify-between rounded-sm border border-input bg-transparent px-2 text-sm font-prose ring-offset-background placeholder:text-muted-foreground hover:shadow-sm-solid focus:outline-hidden focus:ring-1 focus:ring-ring focus:border-primary focus:shadow-md-solid",
+              disabled && "cursor-not-allowed opacity-50",
               className,
             )}
             aria-expanded={open}
+            aria-disabled={disabled}
           >
             <span className="truncate flex-1 min-w-0">{renderValue()}</span>
             <ChevronDownIcon className="ml-3 w-4 h-4 opacity-50 shrink-0" />
@@ -216,9 +228,15 @@ export const Combobox = <TValue,>({
                   {displayValue?.(val) ?? String(val)}
                   <XCircle
                     onClick={() => {
+                      if (disabled) {
+                        return;
+                      }
                       handleSelect(val);
                     }}
-                    className="w-3 h-3 opacity-50 hover:opacity-100 ml-1 cursor-pointer"
+                    className={cn(
+                      "w-3 h-3 opacity-50 hover:opacity-100 ml-1 cursor-pointer",
+                      disabled && "pointer-events-none",
+                    )}
                   />
                 </Badge>
               );

package/src/plugins/core/__test__/sanitize.test.ts

@@ -557,4 +557,34 @@ describe("sanitizeHtml", () => {
     const html = "<some-custom-element>Content</some-custom-element>";
     expect(sanitizeHtml(html)).toMatchInlineSnapshot(`"Content"`);
   });
+
+  // DOMPurify SAFE_FOR_XML strips attribute values containing `]>`, `-->`,
+  // `--!>`, or `</(style|script|...)`. `_build_attr` JSON-escapes `<`/`>`
+  // (`<`/`>`) before HTML-escaping so the parsed attribute value
+  // never matches. These tests pin that contract.
+  test("preserves data-* attribute with JSON-escaped ]> payload", () => {
+    const html =
+      "<marimo-table data-data='[{&quot;x&quot;:&quot;]&#92;u003e&quot;}]'></marimo-table>";
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<marimo-table data-data="[{&quot;x&quot;:&quot;]\\u003e&quot;}]"></marimo-table>"`,
+    );
+  });
+
+  test("preserves data-* attribute with JSON-escaped </script> payload", () => {
+    const html =
+      "<marimo-table data-data='[{&quot;x&quot;:&quot;&#92;u003c/script&#92;u003e&quot;}]'></marimo-table>";
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<marimo-table data-data="[{&quot;x&quot;:&quot;\\u003c/script\\u003e&quot;}]"></marimo-table>"`,
+    );
+  });
+
+  // Regression sentinel: confirms DOMPurify still strips an UN-escaped `]>`,
+  // which is precisely the condition `_build_attr` exists to prevent.
+  test("strips data-* attribute when raw ]> leaks through", () => {
+    const html =
+      "<marimo-table data-data='[{&quot;x&quot;:&quot;]&gt;&quot;}]'></marimo-table>";
+    expect(sanitizeHtml(html)).toMatchInlineSnapshot(
+      `"<marimo-table></marimo-table>"`,
+    );
+  });
 });

package/src/plugins/impl/DropdownPlugin.tsx

@@ -13,6 +13,7 @@ interface Data {
   allowSelectNone: boolean;
   fullWidth: boolean;
   searchable: boolean;
+  disabled: boolean;
 }
 
 export class DropdownPlugin implements IPlugin<string[], Data> {
@@ -25,6 +26,7 @@ export class DropdownPlugin implements IPlugin<string[], Data> {
     allowSelectNone: z.boolean(),
     fullWidth: z.boolean().default(false),
     searchable: z.boolean().default(false),
+    disabled: z.boolean().default(false),
   });
 
   render(props: IPluginProps<string[], Data>): JSX.Element {
@@ -61,7 +63,15 @@ interface DropdownProps extends Data {
 const EMPTY_VALUE = "--";
 
 const Dropdown = (props: DropdownProps): JSX.Element => {
-  const { label, options, value, setValue, allowSelectNone, fullWidth } = props;
+  const {
+    label,
+    options,
+    value,
+    setValue,
+    allowSelectNone,
+    fullWidth,
+    disabled,
+  } = props;
 
   const id = useId();
 
@@ -85,6 +95,7 @@ const Dropdown = (props: DropdownProps): JSX.Element => {
         })}
         value={singleValue}
         id={id}
+        disabled={disabled}
       >
         {allowSelectNone ? (
           <option value={EMPTY_VALUE} selected={value.length === 0}>

package/src/plugins/impl/MultiselectPlugin.tsx

@@ -14,6 +14,7 @@ interface Data {
   options: string[];
   fullWidth: boolean;
   maxSelections?: number | undefined;
+  disabled: boolean;
 }
 
 type T = string[];
@@ -27,6 +28,7 @@ export class MultiselectPlugin implements IPlugin<T, Data> {
     options: z.array(z.string()),
     fullWidth: z.boolean().default(false),
     maxSelections: z.number().optional(),
+    disabled: z.boolean().default(false),
   });
 
   render(props: IPluginProps<string[], Data>): JSX.Element {
@@ -63,6 +65,7 @@ export const Multiselect = ({
   setValue,
   fullWidth,
   maxSelections,
+  disabled,
 }: MultiselectProps): JSX.Element => {
   const id = useId();
   const [searchQuery, setSearchQuery] = useState<string>("");
@@ -199,6 +202,7 @@ export const Multiselect = ({
         shouldFilter={false}
         search={searchQuery}
         onSearchChange={setSearchQuery}
+        disabled={disabled}
       >
         {renderList()}
       </Combobox>

package/src/plugins/impl/SearchableSelect.tsx

@@ -13,12 +13,21 @@ interface SearchableSelectProps {
   label: string | null;
   allowSelectNone: boolean;
   fullWidth: boolean;
+  disabled: boolean;
 }
 
 const NONE_KEY = "__none__";
 
 export const SearchableSelect = (props: SearchableSelectProps): JSX.Element => {
-  const { options, value, setValue, label, allowSelectNone, fullWidth } = props;
+  const {
+    options,
+    value,
+    setValue,
+    label,
+    allowSelectNone,
+    fullWidth,
+    disabled,
+  } = props;
   const id = useId();
   const [searchQuery, setSearchQuery] = useState<string>("");
 
@@ -113,6 +122,7 @@ export const SearchableSelect = (props: SearchableSelectProps): JSX.Element => {
         shouldFilter={false}
         search={searchQuery}
         onSearchChange={setSearchQuery}
+        disabled={disabled}
         data-testid="marimo-plugin-searchable-dropdown"
       >
         {renderList()}