@tightknitai/block-kitchen 0.10.5 → 0.10.6

package/dist/index.d.cts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ReactNode } from 'react';
-import { B as BlockKitchenProps, S as SupportedBlock, C as ChannelOption, a as SendAsUserStatus, b as SendPayload, c as SendExtrasContext, T as Template, P as PreviewSurface, d as PreviewTheme } from './palette-Sz27861i.cjs';
-export { A as AlertBlock, e as AlertLevel, f as BlockKitchenBaseProps, g as BlockKitchenComposeOnlyProps, h as BlockKitchenSendProps, i as BrandPreset, j as BrandTheme, k as BrandTokens, l as BuilderBlock, m as CardBlock, n as CarouselBlock, o as CartesianChart, p as Chart, q as ChartAxisConfig, r as ChartDataPoint, s as ChartSeries, t as ChartType, u as ContainerBlock, v as ContainerChildBlock, w as ContextActionsBlock, x as ContextActionsElement, y as CustomEmoji, D as DataVisualizationBlock, E as EditableVia, F as FeedbackButtonSubobject, z as FeedbackButtonsElement, H as HeaderLevel, I as IconButtonElement, G as IconButtonIcon, J as InputBlock, L as LoadMessageInput, K as LoadResult, M as LoadedMessage, N as LoadingConfig, O as MarkdownBlock, Q as PaletteSection, R as PaletteVariant, U as PieChart, V as PieChartSegment, W as PlanBlock, X as PreviewHooks, Y as PrimaryActionConfig, Z as PrimaryActionContext, _ as RecentMessage, $ as SendResult, a0 as SupportedBlockType, a1 as SupportedHeaderBlock, a2 as TableBlock, a3 as TableCell, a4 as TableColumnSetting, a5 as TaskCardBlock, a6 as TaskCardStatus, a7 as UpdatePayload, a8 as UpdateResult, a9 as UrlSourceElement, aa as ValidationSummary, ab as VideoBlock, ac as defaultPalette, ad as extraAlertVariant, ae as legacyInputVariants } from './palette-Sz27861i.cjs';
+import { B as BlockKitchenProps, S as SupportedBlock, C as ChannelOption, a as SendAsUserStatus, b as SendPayload, c as SendExtrasContext, T as Template, P as PreviewSurface, d as PreviewTheme } from './palette-QbOx7kAa.cjs';
+export { A as AlertBlock, e as AlertLevel, f as BlockKitchenBaseProps, g as BlockKitchenComposeOnlyProps, h as BlockKitchenSendProps, i as BrandPreset, j as BrandTheme, k as BrandTokens, l as BuilderBlock, m as CardBlock, n as CarouselBlock, o as CartesianChart, p as Chart, q as ChartAxisConfig, r as ChartDataPoint, s as ChartSeries, t as ChartType, u as ContainerBlock, v as ContainerChildBlock, w as ContextActionsBlock, x as ContextActionsElement, y as CustomEmoji, D as DataVisualizationBlock, E as EditableVia, F as FeedbackButtonSubobject, z as FeedbackButtonsElement, H as HeaderLevel, I as IconButtonElement, G as IconButtonIcon, J as InputBlock, L as LoadMessageInput, K as LoadResult, M as LoadedMessage, N as LoadingConfig, O as MarkdownBlock, Q as PaletteMode, R as PaletteSection, U as PaletteVariant, V as PieChart, W as PieChartSegment, X as PlanBlock, Y as PreviewHooks, Z as PrimaryActionConfig, _ as PrimaryActionContext, $ as RecentMessage, a0 as SendResult, a1 as SupportedBlockType, a2 as SupportedHeaderBlock, a3 as TableBlock, a4 as TableCell, a5 as TableColumnSetting, a6 as TaskCardBlock, a7 as TaskCardStatus, a8 as UpdatePayload, a9 as UpdateResult, aa as UrlSourceElement, ab as ValidationSummary, ac as VideoBlock, ad as defaultPalette, ae as extraAlertVariant, af as legacyInputVariants } from './palette-QbOx7kAa.cjs';
 export { decodeBlocksFromString, encodeBlocksToString, toSlackBlocks } from './helpers.cjs';
 import 'slack-web-api-client';
 

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ReactNode } from 'react';
-import { B as BlockKitchenProps, S as SupportedBlock, C as ChannelOption, a as SendAsUserStatus, b as SendPayload, c as SendExtrasContext, T as Template, P as PreviewSurface, d as PreviewTheme } from './palette-Sz27861i.js';
-export { A as AlertBlock, e as AlertLevel, f as BlockKitchenBaseProps, g as BlockKitchenComposeOnlyProps, h as BlockKitchenSendProps, i as BrandPreset, j as BrandTheme, k as BrandTokens, l as BuilderBlock, m as CardBlock, n as CarouselBlock, o as CartesianChart, p as Chart, q as ChartAxisConfig, r as ChartDataPoint, s as ChartSeries, t as ChartType, u as ContainerBlock, v as ContainerChildBlock, w as ContextActionsBlock, x as ContextActionsElement, y as CustomEmoji, D as DataVisualizationBlock, E as EditableVia, F as FeedbackButtonSubobject, z as FeedbackButtonsElement, H as HeaderLevel, I as IconButtonElement, G as IconButtonIcon, J as InputBlock, L as LoadMessageInput, K as LoadResult, M as LoadedMessage, N as LoadingConfig, O as MarkdownBlock, Q as PaletteSection, R as PaletteVariant, U as PieChart, V as PieChartSegment, W as PlanBlock, X as PreviewHooks, Y as PrimaryActionConfig, Z as PrimaryActionContext, _ as RecentMessage, $ as SendResult, a0 as SupportedBlockType, a1 as SupportedHeaderBlock, a2 as TableBlock, a3 as TableCell, a4 as TableColumnSetting, a5 as TaskCardBlock, a6 as TaskCardStatus, a7 as UpdatePayload, a8 as UpdateResult, a9 as UrlSourceElement, aa as ValidationSummary, ab as VideoBlock, ac as defaultPalette, ad as extraAlertVariant, ae as legacyInputVariants } from './palette-Sz27861i.js';
+import { B as BlockKitchenProps, S as SupportedBlock, C as ChannelOption, a as SendAsUserStatus, b as SendPayload, c as SendExtrasContext, T as Template, P as PreviewSurface, d as PreviewTheme } from './palette-QbOx7kAa.js';
+export { A as AlertBlock, e as AlertLevel, f as BlockKitchenBaseProps, g as BlockKitchenComposeOnlyProps, h as BlockKitchenSendProps, i as BrandPreset, j as BrandTheme, k as BrandTokens, l as BuilderBlock, m as CardBlock, n as CarouselBlock, o as CartesianChart, p as Chart, q as ChartAxisConfig, r as ChartDataPoint, s as ChartSeries, t as ChartType, u as ContainerBlock, v as ContainerChildBlock, w as ContextActionsBlock, x as ContextActionsElement, y as CustomEmoji, D as DataVisualizationBlock, E as EditableVia, F as FeedbackButtonSubobject, z as FeedbackButtonsElement, H as HeaderLevel, I as IconButtonElement, G as IconButtonIcon, J as InputBlock, L as LoadMessageInput, K as LoadResult, M as LoadedMessage, N as LoadingConfig, O as MarkdownBlock, Q as PaletteMode, R as PaletteSection, U as PaletteVariant, V as PieChart, W as PieChartSegment, X as PlanBlock, Y as PreviewHooks, Z as PrimaryActionConfig, _ as PrimaryActionContext, $ as RecentMessage, a0 as SendResult, a1 as SupportedBlockType, a2 as SupportedHeaderBlock, a3 as TableBlock, a4 as TableCell, a5 as TableColumnSetting, a6 as TaskCardBlock, a7 as TaskCardStatus, a8 as UpdatePayload, a9 as UpdateResult, aa as UrlSourceElement, ab as ValidationSummary, ac as VideoBlock, ad as defaultPalette, ae as extraAlertVariant, af as legacyInputVariants } from './palette-QbOx7kAa.js';
 export { decodeBlocksFromString, encodeBlocksToString, toSlackBlocks } from './helpers.js';
 import 'slack-web-api-client';
 

package/dist/index.js

@@ -1,6 +1,6 @@
 import { useSensors, useSensor, PointerSensor, TouchSensor, KeyboardSensor, pointerWithin, closestCenter, DndContext, DragOverlay, useDroppable, useDraggable } from '@dnd-kit/core';
 import { sortableKeyboardCoordinates, SortableContext, verticalListSortingStrategy, useSortable } from '@dnd-kit/sortable';
-import { X, Circle, Sparkles, FileText, AlignLeft, MousePointerClick, TextCursorInput, LayoutTemplate, Bell, Pilcrow, Image, Video, GalleryHorizontal, Table, ChartColumnBig, Container, Loader2, ExternalLink, AlertTriangle, GripVertical, Sun, Moon, MessageSquare, AppWindow, Home, MailSearch, Plus, ChevronDown, BookOpen, Undo2, Redo2, Trash2, Code2, Pencil, Send, Search, Check, Copy, Info, CheckCircle2, ChevronRight, LayoutGrid, ArrowUp, ArrowDown, Type, Bold, Italic, Strikethrough, Underline, Code, List, ListOrdered, Quote, Smile, Link as Link$1 } from 'lucide-react';
+import { X, Circle, Sparkles, FileText, AlignLeft, MousePointerClick, TextCursorInput, LayoutTemplate, Bell, Pilcrow, Image, Video, GalleryHorizontal, Table, ChartColumnBig, Container, Loader2, ExternalLink, AlertTriangle, GripVertical, Sun, Moon, MessageSquare, AppWindow, Home, Plus, ChevronDown, BookOpen, Undo2, Redo2, Trash2, Code2, Pencil, Send, Search, Check, Copy, Info, CheckCircle2, ChevronRight, LayoutGrid, ArrowUp, ArrowDown, Type, Bold, Italic, Strikethrough, Underline, Code, List, ListOrdered, Quote, Smile, Link as Link$1 } from 'lucide-react';
 import * as React from 'react';
 import { createContext, useState, useRef, useEffect, useCallback, useMemo, useId, useContext } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -818,7 +818,10 @@ var defaultPalette = [
     variants: [
       {
         id: "rich_text_section",
-        label: "Section",
+        label: "Rich Text Section",
+        // The one variant simple mode offers, where it's listed without its
+        // section heading — hence the self-describing label.
+        basic: true,
         factory: () => ({
           type: "rich_text",
           elements: [
@@ -3470,7 +3473,8 @@ function LoadMessageDialog({
     }, POLL_INTERVAL_MS2);
   };
   const preview = activeTab === "recent" ? selectedRecent ? { kind: "ready", target: { ...selectedRecent, editableVia: selectedRecent.editableVia ?? "bot" } } : { kind: "empty" } : linkStatus.kind === "idle" ? { kind: "empty" } : linkStatus.kind === "ready" ? { kind: "ready", target: linkStatus.result } : linkStatus;
-  const canLoad = activeTab === "recent" ? !!selectedRecent : !!link.trim();
+  const verdictOwnsAction = linkStatus.kind === "not-editable" && (isSafeHref(linkStatus.oauthUrl) || (linkStatus.blocks?.length ?? 0) > 0);
+  const canLoad = activeTab === "recent" ? !!selectedRecent : !!link.trim() && !verdictOwnsAction;
   const panelProps = (id) => hasRecent ? { role: "tabpanel", id: panelDomId(id), "aria-labelledby": tabDomId(id) } : {};
   return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
     DialogContent,
@@ -3715,6 +3719,24 @@ function PreviewPane({
         editableLabel(target.editableVia)
       ] }) : null
     ] }),
+    state.kind === "not-editable" && /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-col gap-2 rounded-md border border-amber-200! bg-amber-50 p-3 text-xs text-amber-800", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
+        /* @__PURE__ */ jsx(AlertTriangle, { className: "mt-0.5 h-3.5 w-3.5 shrink-0" }),
+        /* @__PURE__ */ jsx("span", { className: "flex-1", children: state.reason })
+      ] }),
+      signInUrl && /* @__PURE__ */ jsx(SlackSignInButton, { onClick: () => onSignIn(signInUrl), polling: signInPolling }),
+      verdictBlocks && verdictBlocks.length > 0 && /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "outline",
+          size: "sm",
+          className: "self-start",
+          onClick: () => onOpenAsNew(verdictBlocks),
+          children: "Open as a new message instead"
+        }
+      )
+    ] }),
     /* @__PURE__ */ jsxs(
       "div",
       {
@@ -3723,30 +3745,13 @@ function PreviewPane({
         tabIndex: 0,
         className: "flex flex-1 flex-col gap-3 overflow-y-auto rounded-md border bg-muted/40 p-3 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring max-lg:max-h-72 max-lg:min-h-32 lg:min-h-0",
         children: [
-          state.kind === "not-editable" && /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 flex-col gap-2 rounded-md border border-amber-200! bg-amber-50 p-3 text-xs text-amber-800", children: [
-            /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2", children: [
-              /* @__PURE__ */ jsx(AlertTriangle, { className: "mt-0.5 h-3.5 w-3.5 shrink-0" }),
-              /* @__PURE__ */ jsx("span", { className: "flex-1", children: state.reason })
-            ] }),
-            signInUrl && /* @__PURE__ */ jsx(SlackSignInButton, { onClick: () => onSignIn(signInUrl), polling: signInPolling }),
-            verdictBlocks && verdictBlocks.length > 0 && /* @__PURE__ */ jsx(
-              Button,
-              {
-                type: "button",
-                variant: "outline",
-                size: "sm",
-                className: "self-start",
-                onClick: () => onOpenAsNew(verdictBlocks),
-                children: "Open as a new message instead"
-              }
-            )
-          ] }),
           state.kind === "error" && /* @__PURE__ */ jsx("p", { className: "shrink-0 rounded-md border border-destructive/30 bg-destructive/5 p-2 text-xs text-destructive", children: state.error }),
           state.kind === "loading" && /* @__PURE__ */ jsxs("p", { className: "m-auto flex items-center gap-2 text-sm text-muted-foreground", children: [
             /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }),
             "Looking up that message\u2026"
           ] }),
           state.kind === "empty" && /* @__PURE__ */ jsx("p", { className: "m-auto px-4 text-center text-sm text-muted-foreground", children: emptyHint }),
+          state.kind === "not-editable" && !(verdictBlocks && verdictBlocks.length > 0) && /* @__PURE__ */ jsx("p", { className: "m-auto px-4 text-center text-sm text-muted-foreground", children: "Nothing to preview." }),
           target && /* @__PURE__ */ jsx("div", { className: "shrink-0", children: /* @__PURE__ */ jsx(
             SlackMessagePreview,
             {
@@ -3776,6 +3781,20 @@ function isDefaultOpen(sectionName, config) {
   if (typeof config === "boolean") return config;
   return config.includes(sectionName);
 }
+var PALETTE_TITLE = "Message Elements";
+var ADVANCED_HELP = "Browse every Slack block type \u2014 sections, images, buttons, inputs, tables and more \u2014 plus a search box.";
+var BASIC_HELP = "Go back to the short list: just the rich text block for writing a message.";
+function basicVariants(sections) {
+  const out = [];
+  for (const section of sections) {
+    for (const variant of section.variants) {
+      if (variant.basic) {
+        out.push(variant);
+      }
+    }
+  }
+  return out;
+}
 function filterSections(sections, query) {
   const q = query.trim().toLowerCase();
   if (q.length === 0) return sections;
@@ -3798,14 +3817,26 @@ function Palette({
   defaultOpenSections = true,
   showSearch = true,
   searchPlaceholder = "Search blocks\u2026",
+  mode = "advanced",
   variant = "aside"
 }) {
   const [query, setQuery] = useState("");
+  const [advancedOpen, setAdvancedOpen] = useState(false);
+  const [prevMode, setPrevMode] = useState(mode);
+  if (prevMode !== mode) {
+    setPrevMode(mode);
+    setAdvancedOpen(false);
+    setQuery("");
+  }
+  const basics = useMemo(() => mode === "simple" ? basicVariants(sections) : [], [mode, sections]);
+  const offersSimple = mode === "simple" && basics.length > 0;
+  const advanced = !offersSimple || advancedOpen;
+  const searchVisible = showSearch && advanced;
   const visibleSections = useMemo(
-    () => showSearch ? filterSections(sections, query) : sections,
-    [sections, query, showSearch]
+    () => searchVisible ? filterSections(sections, query) : sections,
+    [sections, query, searchVisible]
   );
-  const queryActive = showSearch && query.trim().length > 0;
+  const queryActive = searchVisible && query.trim().length > 0;
   const isSheet = variant === "sheet";
   return /* @__PURE__ */ jsxs(
     "aside",
@@ -3815,38 +3846,72 @@ function Palette({
         isSheet ? "w-full flex-1 bg-background" : "w-72 shrink-0 border-r bg-muted/20"
       ),
       children: [
-        showSearch ? /* @__PURE__ */ jsx(
+        offersSimple || searchVisible ? /* @__PURE__ */ jsxs(
           "div",
           {
             className: cn(
-              "sticky top-0 z-10 border-b px-3 pt-3 pb-2 backdrop-blur",
+              "sticky top-0 z-10 flex flex-col gap-2 border-b px-3 pt-3 pb-2 backdrop-blur",
               isSheet ? "bg-background" : "bg-muted/20"
             ),
-            children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-              /* @__PURE__ */ jsx(
-                Search,
-                {
-                  className: cn(
-                    "pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 text-muted-foreground",
-                    isSheet ? "h-4 w-4" : "h-3.5 w-3.5"
+            children: [
+              offersSimple ? (
+                // Titled row: with the sections gone, simple mode's header would
+                // otherwise be a lone right-aligned link over empty space, and
+                // nothing would name what the rail below it holds.
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "min-w-0 truncate font-medium uppercase tracking-wide text-muted-foreground",
+                        isSheet ? "text-xs" : "text-[11px]"
+                      ),
+                      children: PALETTE_TITLE
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    ModeLink,
+                    {
+                      advanced,
+                      isSheet,
+                      onToggle: () => {
+                        setQuery("");
+                        setAdvancedOpen((v) => !v);
+                      }
+                    }
                   )
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Input,
-                {
-                  type: "search",
-                  value: query,
-                  onChange: (e) => setQuery(e.target.value),
-                  placeholder: searchPlaceholder,
-                  "aria-label": searchPlaceholder,
-                  className: cn(isSheet ? "h-10 pl-8 text-base" : "h-8 pl-7 text-sm")
-                }
-              )
-            ] })
+                ] })
+              ) : null,
+              searchVisible ? /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                /* @__PURE__ */ jsx(
+                  Search,
+                  {
+                    className: cn(
+                      "pointer-events-none absolute left-2 top-1/2 -translate-y-1/2 text-muted-foreground",
+                      isSheet ? "h-4 w-4" : "h-3.5 w-3.5"
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  Input,
+                  {
+                    type: "search",
+                    value: query,
+                    onChange: (e) => setQuery(e.target.value),
+                    placeholder: searchPlaceholder,
+                    "aria-label": searchPlaceholder,
+                    className: cn(isSheet ? "h-10 pl-8 text-base" : "h-8 pl-7 text-sm")
+                  }
+                )
+              ] }) : null
+            ]
           }
         ) : null,
-        /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", isSheet ? "px-2 pb-6" : "p-3"), children: visibleSections.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-1 py-2 text-xs text-muted-foreground", children: "No blocks match." }) : visibleSections.map((section) => /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", isSheet ? "px-2 pb-6" : "p-3"), children: !advanced ? (
+          // Simple mode: a flat list, no section headings — with this few
+          // rows the headings would outnumber the blocks under them.
+          basics.map((v) => /* @__PURE__ */ jsx(PaletteItem, { variant: v, onAdd: () => onAddBlock(v.factory()), mode: variant }, v.id))
+        ) : visibleSections.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-1 py-2 text-xs text-muted-foreground", children: "No blocks match." }) : visibleSections.map((section) => /* @__PURE__ */ jsx(
           PaletteSection,
           {
             section,
@@ -3861,6 +3926,24 @@ function Palette({
     }
   );
 }
+function ModeLink({ advanced, isSheet, onToggle }) {
+  return /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onToggle,
+        "aria-label": advanced ? "Basic block palette" : "Advanced block palette",
+        className: cn(
+          "shrink-0 cursor-pointer appearance-none rounded border-0 bg-transparent p-0 font-medium text-primary underline underline-offset-2 transition-colors hover:text-primary/80 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+          isSheet ? "min-h-8 text-sm" : "text-xs"
+        ),
+        children: advanced ? "Basic" : "Advanced"
+      }
+    ) }),
+    /* @__PURE__ */ jsx(TooltipContent, { side: "bottom", align: "end", children: advanced ? BASIC_HELP : ADVANCED_HELP })
+  ] }) });
+}
 function PaletteSection({
   section,
   defaultOpen,
@@ -9802,6 +9885,48 @@ function EmptyState({
 function DropIndicator2() {
   return /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "pointer-events-none relative my-1 h-0.5 w-full rounded-full bg-primary", children: /* @__PURE__ */ jsx("span", { className: "-left-1 -top-[3px] absolute h-2 w-2 rounded-full bg-primary shadow-[0_0_0_2px_var(--color-background)]" }) });
 }
+function SlackMark({ className }) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      className,
+      viewBox: "0 0 122.8 122.8",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: [
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "#e01e5a",
+            d: "M25.8 77.6c0 7.1-5.8 12.9-12.9 12.9S0 84.7 0 77.6s5.8-12.9 12.9-12.9h12.9v12.9zm6.5 0c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9v32.3c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V77.6z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "#36c5f0",
+            d: "M45.2 25.8c-7.1 0-12.9-5.8-12.9-12.9S38.1 0 45.2 0s12.9 5.8 12.9 12.9v12.9H45.2zm0 6.5c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H12.9C5.8 58.1 0 52.3 0 45.2s5.8-12.9 12.9-12.9h32.3z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "#2eb67d",
+            d: "M97 45.2c0-7.1 5.8-12.9 12.9-12.9s12.9 5.8 12.9 12.9-5.8 12.9-12.9 12.9H97V45.2zm-6.5 0c0 7.1-5.8 12.9-12.9 12.9s-12.9-5.8-12.9-12.9V12.9C64.7 5.8 70.5 0 77.6 0s12.9 5.8 12.9 12.9v32.3z"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            fill: "#ecb22e",
+            d: "M77.6 97c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9-12.9-5.8-12.9-12.9V97h12.9zm0-6.5c-7.1 0-12.9-5.8-12.9-12.9s5.8-12.9 12.9-12.9h32.3c7.1 0 12.9 5.8 12.9 12.9s-5.8 12.9-12.9 12.9H77.6z"
+          }
+        )
+      ]
+    }
+  );
+}
 var THEME_OPTIONS = [
   { value: "light", label: "Light", Icon: Sun },
   { value: "dark", label: "Dark", Icon: Moon }
@@ -9866,7 +9991,7 @@ function Toolbar2({
     /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-x-2 gap-y-1 border-b bg-background px-2 py-1.5 sm:px-3 sm:py-2", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-1 sm:gap-2", children: [
         loadEnabled ? /* @__PURE__ */ jsxs(Button, { type: "button", size: "sm", onClick: onOpenLoad, "aria-label": loadButtonLabel, children: [
-          /* @__PURE__ */ jsx(MailSearch, { className: "h-3.5 w-3.5" }),
+          /* @__PURE__ */ jsx(SlackMark, { className: "h-3.5 w-3.5" }),
           /* @__PURE__ */ jsx("span", { className: "hidden md:inline", children: loadButtonLabel })
         ] }) : null,
         onOpenPalette ? /* @__PURE__ */ jsxs(
@@ -10299,6 +10424,7 @@ function BlockKitchen(props) {
     confirmUpdateLabel,
     palette,
     disabledBlockTypes,
+    paletteMode,
     showPaletteSearch,
     paletteSearchPlaceholder,
     defaultOpenSections,
@@ -10601,6 +10727,7 @@ function BlockKitchen(props) {
                   {
                     onAddBlock: (block) => addBlock(block),
                     sections: paletteSections,
+                    mode: paletteMode,
                     showSearch: showPaletteSearch,
                     searchPlaceholder: paletteSearchPlaceholder,
                     defaultOpenSections
@@ -10653,6 +10780,7 @@ function BlockKitchen(props) {
                     setPaletteOpen(false);
                   },
                   sections: paletteSections,
+                  mode: paletteMode,
                   showSearch: showPaletteSearch,
                   searchPlaceholder: paletteSearchPlaceholder,
                   defaultOpenSections,