@arcadeai/design-system 2.1.1 → 2.3.0

package/dist/components/ui/organisms/toolkit-picker/toolkit-picker.js

@@ -1,71 +1,64 @@
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import { X as m, Package as B, Wrench as P, CheckSquare as V, FilterIcon as M, Search as Q } from "lucide-react";
-import { Badge as v } from "../../atoms/badge.js";
-import { Button as p } from "../../atoms/button.js";
-import { Dialog as W, DialogTrigger as $, DialogContent as E, DialogHeader as H, DialogTitle as L, DialogDescription as O, DialogClose as N, DialogFooter as X } from "../../atoms/dialog.js";
-import { Arcade as Y } from "../../atoms/icons/arcade.js";
-import { getToolkitIcon as G, getToolIconByToolkitName as J } from "../../atoms/icons/utils.js";
-import { MobileTooltipProvider as K } from "../../atoms/mobile-tooltip.js";
-import { Tabs as R, TabsList as U, TabsTrigger as y, TabsContent as w } from "../../atoms/tabs.js";
-import { EmptyState as _ } from "../../molecules/empty-state.js";
-import "../../../../toolkit-card-DgjPGtsJ.js";
-import { ToolCard as Z } from "../../molecules/tool-card.js";
-import { useToolkitPicker as ee } from "./hooks/use-toolkit-picker.js";
-import "../../atoms/chart.js";
-import "../../../../react-resizable-panels.browser-DggUboAp.js";
-import "../../atoms/sidebar.js";
-import "react";
-import "../../atoms/table.js";
-import { FooterSummary as te } from "./components/footer-summary.js";
-import { SearchInput as ae } from "./components/search-input.js";
-import { SelectButton as le } from "./components/select-button.js";
-import { ToolkitCardWithSelection as re } from "./components/toolkit-card-with-selection.js";
-const Se = (T) => {
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { X as T, Package as _, Wrench as C } from "lucide-react";
+import { useState as z } from "react";
+import { Button as n } from "../../atoms/button.js";
+import { Dialog as D, DialogTrigger as S, DialogContent as j, DialogHeader as A, DialogTitle as B, DialogDescription as M, DialogClose as d, DialogFooter as P } from "../../atoms/dialog.js";
+import { Arcade as F } from "../../atoms/icons/arcade.js";
+import { MobileTooltipProvider as L } from "../../atoms/mobile-tooltip.js";
+import { Tabs as E, TabsList as X, TabsTrigger as m, TabsContent as c } from "../../atoms/tabs.js";
+import { Tooltip as G, TooltipTrigger as H, TooltipContent as I } from "../../atoms/tooltip.js";
+import { ActionButtons as O } from "./components/action-buttons.js";
+import { FilterBadges as Q } from "./components/filter-badges.js";
+import { FooterSummary as R } from "./components/footer-summary.js";
+import { SearchInput as V } from "./components/search-input.js";
+import { SelectButton as W } from "./components/select-button.js";
+import { ToolkitList as Y } from "./components/toolkit-list.js";
+import { ToolsList as $ } from "./components/tools-list.js";
+import { useToolkitPicker as q } from "./hooks/use-toolkit-picker.js";
+const J = /Mac/i, xe = (p) => {
   const {
-    description: C = "Select toolkits and tools",
-    children: S,
-    selectionMode: r = "multi",
-    onSelectionChange: u
-  } = T, {
+    description: h = "Select toolkits and tools",
+    children: x,
+    selectionMode: a = "multi",
+    onSelectionChange: s
+  } = p, [g, r] = z(!1), {
     state: {
-      selectedToolkits: g,
+      selectedToolkits: u,
       selectedTools: i,
-      activeTab: x,
-      filteredToolkits: s,
-      filteredTools: n,
-      toolkitFilter: c,
-      searchQuery: f
+      activeTab: f,
+      filteredToolkits: b,
+      filteredTools: k
     },
-    setActiveTab: d,
-    toggleToolkit: z,
-    toggleTool: q,
-    clearSelections: A,
-    clearSearchQuery: k,
-    clearFilter: D,
-    selectAll: j,
-    commitSelections: F,
-    restoreCommittedState: I,
-    setToolkitFilter: b
-  } = ee();
-  return /* @__PURE__ */ e(K, { children: /* @__PURE__ */ a(
-    W,
+    setActiveTab: o,
+    clearSearchQuery: v,
+    commitSelections: N,
+    restoreCommittedState: w
+  } = q(), y = () => {
+    N(), s && s({
+      selectedToolkits: Array.from(u.keys()),
+      selectedTools: Array.from(i.keys())
+    }), r(!1);
+  };
+  return /* @__PURE__ */ e(L, { children: /* @__PURE__ */ t(
+    D,
     {
-      onOpenChange: (t) => {
-        t && (I(), k(), d("toolkits"));
+      onOpenChange: (l) => {
+        r(l), l && (w(), v(), o("toolkits"));
       },
+      open: g,
       children: [
-        /* @__PURE__ */ e($, { asChild: !0, children: S }),
-        /* @__PURE__ */ a(
-          E,
+        /* @__PURE__ */ e(S, { asChild: !0, children: x }),
+        /* @__PURE__ */ t(
+          j,
           {
             className: "flex max-h-[80vh] min-h-80 w-[95vw] max-w-xl flex-col gap-2 p-0 sm:max-w-2xl md:max-w-3xl lg:max-w-4xl xl:max-w-5xl 2xl:max-w-7xl",
             "data-testid": "toolkit-picker-dialog",
             showCloseButton: !1,
             children: [
-              /* @__PURE__ */ a(H, { className: "shrink-0 p-4 pb-0 sm:p-6 sm:pb-0", children: [
-                /* @__PURE__ */ a("div", { className: "flex items-center justify-between", children: [
-                  /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
-                    /* @__PURE__ */ a("div", { className: "relative flex size-10 items-center justify-center overflow-hidden rounded-xl shadow-lg ring-1 ring-black/5 sm:size-12", children: [
+              /* @__PURE__ */ t(A, { className: "shrink-0 p-4 pb-0 sm:p-6 sm:pb-0", children: [
+                /* @__PURE__ */ t("div", { className: "flex items-center justify-between", children: [
+                  /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
+                    /* @__PURE__ */ t("div", { className: "relative flex size-10 items-center justify-center overflow-hidden rounded-xl shadow-lg ring-1 ring-black/5 sm:size-12", children: [
                       /* @__PURE__ */ e(
                         "span",
                         {
@@ -80,283 +73,97 @@ const Se = (T) => {
                           className: "pointer-events-none absolute inset-0 z-10 bg-[repeating-conic-gradient(from_0deg_at_100%_0%,rgba(0,0,0,0.25)_0deg_1deg,transparent_1deg_12deg)] opacity-30"
                         }
                       ),
-                      /* @__PURE__ */ e("span", { className: "relative z-20", children: /* @__PURE__ */ e(Y, { className: "size-5 sm:size-7" }) })
+                      /* @__PURE__ */ e("span", { className: "relative z-20", children: /* @__PURE__ */ e(F, { className: "size-5 sm:size-7" }) })
                     ] }),
-                    /* @__PURE__ */ a("div", { className: "ml-1 text-left", children: [
-                      /* @__PURE__ */ e(L, { className: "font-bold text-lg sm:text-xl", children: "Choose Your Tools" }),
-                      /* @__PURE__ */ e(O, { className: "hidden sm:block", children: C })
+                    /* @__PURE__ */ t("div", { className: "ml-1 text-left", children: [
+                      /* @__PURE__ */ e(B, { className: "font-bold text-lg sm:text-xl", children: "Choose Your Tools" }),
+                      /* @__PURE__ */ e(M, { className: "hidden sm:block", children: h })
                     ] })
                   ] }),
-                  /* @__PURE__ */ e(N, { asChild: !0, children: /* @__PURE__ */ e(
-                    p,
+                  /* @__PURE__ */ e(d, { asChild: !0, children: /* @__PURE__ */ e(
+                    n,
                     {
                       className: "h-8 w-8 rounded-full p-0",
                       "data-testid": "toolkit-picker-close",
                       size: "sm",
                       variant: "ghost",
-                      children: /* @__PURE__ */ e(m, { className: "h-4 w-4" })
+                      children: /* @__PURE__ */ e(T, { className: "h-4 w-4" })
                     }
                   ) })
                 ] }),
-                /* @__PURE__ */ e("div", { className: "mb-2 space-y-2 pt-2 sm:space-y-4 sm:pt-4", children: /* @__PURE__ */ e(ae, {}) })
+                /* @__PURE__ */ e("div", { className: "mb-2 space-y-2 pt-2 sm:space-y-4 sm:pt-4", children: /* @__PURE__ */ e(V, {}) })
               ] }),
-              /* @__PURE__ */ a(
-                R,
+              /* @__PURE__ */ t(
+                E,
                 {
-                  className: "flex min-h-0 flex-1 flex-col",
-                  onValueChange: (t) => d(t),
-                  value: x,
+                  className: "flex min-h-0 flex-1 flex-col gap-0.5",
+                  onValueChange: (l) => o(l),
+                  value: f,
                   children: [
-                    /* @__PURE__ */ a("div", { className: "shrink-0 space-y-2 px-4 sm:space-y-3 sm:px-6", children: [
-                      /* @__PURE__ */ a("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
-                        /* @__PURE__ */ a(U, { className: "h-10 w-auto gap-1 rounded-md border border-neutral-200 bg-white/60 p-1 shadow-sm dark:border-neutral-800 dark:bg-neutral-900/60", children: [
-                          /* @__PURE__ */ a(
-                            y,
+                    /* @__PURE__ */ t("div", { className: "shrink-0 space-y-2 px-4 sm:space-y-3 sm:px-6", children: [
+                      /* @__PURE__ */ t("div", { className: "flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between", children: [
+                        /* @__PURE__ */ t(X, { className: "h-10 w-auto gap-1 rounded-md border border-neutral-200 bg-white/60 p-1 shadow-sm dark:border-neutral-800 dark:bg-neutral-900/60", children: [
+                          /* @__PURE__ */ t(
+                            m,
                             {
                               className: "h-8 rounded-md px-3 font-medium text-neutral-600 text-sm hover:bg-black/5 data-[state=active]:bg-white data-[state=active]:text-neutral-900 dark:text-neutral-300 dark:data-[state=active]:bg-neutral-800 dark:data-[state=active]:text-white dark:hover:bg-white/10",
                               "data-testid": "toolkits-tab",
                               value: "toolkits",
                               children: [
-                                /* @__PURE__ */ e(B, { className: "h-4 w-4" }),
+                                /* @__PURE__ */ e(_, { className: "h-4 w-4" }),
                                 /* @__PURE__ */ e("span", { children: "Toolkits" }),
-                                /* @__PURE__ */ e("span", { className: "ml-1 rounded-full bg-emerald-300 px-1.5 py-0.5 text-emerald-900 text-xs dark:bg-emerald-500/25 dark:text-emerald-200", children: s.size })
+                                /* @__PURE__ */ e("span", { className: "ml-1 rounded-full bg-emerald-300 px-1.5 py-0.5 text-emerald-900 text-xs dark:bg-emerald-500/25 dark:text-emerald-200", children: b.size })
                               ]
                             }
                           ),
-                          /* @__PURE__ */ a(
-                            y,
+                          /* @__PURE__ */ t(
+                            m,
                             {
                               className: "h-8 rounded-md px-3 font-medium text-neutral-600 text-sm hover:bg-black/5 data-[state=active]:bg-white data-[state=active]:text-neutral-900 dark:text-neutral-300 dark:data-[state=active]:bg-neutral-800 dark:data-[state=active]:text-white dark:hover:bg-white/10",
                               "data-testid": "tools-tab",
                               value: "tools",
                               children: [
-                                /* @__PURE__ */ e(P, { className: "h-4 w-4" }),
+                                /* @__PURE__ */ e(C, { className: "h-4 w-4" }),
                                 /* @__PURE__ */ e("span", { children: "Tools" }),
-                                /* @__PURE__ */ e("span", { className: "ml-1 rounded-full bg-emerald-300 px-1.5 py-0.5 text-emerald-900 text-xs dark:bg-emerald-500/25 dark:text-emerald-200", children: n.size })
+                                /* @__PURE__ */ e("span", { className: "ml-1 rounded-full bg-emerald-300 px-1.5 py-0.5 text-emerald-900 text-xs dark:bg-emerald-500/25 dark:text-emerald-200", children: k.size })
                               ]
                             }
                           )
                         ] }),
-                        /* @__PURE__ */ a("div", { className: "hidden items-center gap-2 sm:flex", children: [
-                          (g.size > 0 || i.size > 0) && /* @__PURE__ */ a(
-                            p,
-                            {
-                              className: "h-8 border-neutral-300 text-neutral-700 hover:bg-neutral-50 hover:text-neutral-900 dark:border-neutral-700 dark:text-neutral-300 dark:hover:bg-neutral-900/40 dark:hover:text-neutral-100",
-                              "data-testid": "clear-selections",
-                              onClick: A,
-                              size: "sm",
-                              variant: "outline",
-                              children: [
-                                /* @__PURE__ */ e(m, { className: "h-4 w-4 text-red-600 dark:text-red-400" }),
-                                "Clear All"
-                              ]
-                            }
-                          ),
-                          r === "multi" && (() => {
-                            const t = x === "toolkits" ? Array.from(s).flatMap(
-                              (l) => l.tools.map((h) => h.fully_qualified_name)
-                            ) : Array.from(n).map(
-                              (l) => l.fully_qualified_name
-                            );
-                            return t.length > 0 && t.every((l) => i.has(l)) ? null : /* @__PURE__ */ a(
-                              p,
-                              {
-                                className: "h-8",
-                                "data-testid": "select-all",
-                                onClick: () => {
-                                  j(t);
-                                },
-                                size: "sm",
-                                variant: "outline",
-                                children: [
-                                  /* @__PURE__ */ e(V, { className: "h-4 w-4" }),
-                                  "Select all"
-                                ]
-                              }
-                            );
-                          })()
-                        ] })
+                        /* @__PURE__ */ e(O, { selectionMode: a })
                       ] }),
-                      /* @__PURE__ */ a("div", { className: "flex flex-wrap items-center gap-2", children: [
-                        c && /* @__PURE__ */ a(
-                          v,
-                          {
-                            className: "h-8 border border-purple-200 bg-purple-50 pr-1.5 pl-2 text-purple-800 shadow-sm ring-1 ring-purple-200/50 dark:border-purple-800/60 dark:bg-purple-950/40 dark:text-purple-200 dark:ring-purple-800/30",
-                            variant: "secondary",
-                            children: [
-                              /* @__PURE__ */ a("span", { className: "mr-1.5 inline-flex items-center gap-1 rounded-full bg-purple-100 px-1.5 py-0.5 text-[10px] text-purple-700 dark:bg-purple-800/60 dark:text-purple-200", children: [
-                                /* @__PURE__ */ e(M, { className: "h-3 w-3" }),
-                                "Filter"
-                              ] }),
-                              /* @__PURE__ */ a(
-                                "button",
-                                {
-                                  className: "inline-flex h-full items-center gap-1.5",
-                                  "data-testid": "filter-badge",
-                                  onClick: () => d("toolkits"),
-                                  type: "button",
-                                  children: [
-                                    (() => {
-                                      const t = Array.from(
-                                        s
-                                      ).find((l) => l.name === c), o = G({
-                                        metadataIcon: t?.metadata?.icon,
-                                        toolkitName: c
-                                      });
-                                      return /* @__PURE__ */ e(o, { className: "h-3.5 w-3.5" });
-                                    })(),
-                                    /* @__PURE__ */ e("span", { className: "font-medium text-xs", children: c })
-                                  ]
-                                }
-                              ),
-                              /* @__PURE__ */ e(
-                                "button",
-                                {
-                                  "aria-label": "Clear toolkit filter",
-                                  className: "ml-1 inline-flex h-5 w-5 items-center justify-center rounded-full bg-purple-100 text-red-600 hover:bg-red-100 hover:text-red-700 focus-visible:ring-[3px] focus-visible:ring-red-200 dark:bg-purple-800/60 dark:text-red-400 dark:hover:bg-red-950/40 dark:hover:text-red-300",
-                                  "data-testid": "clear-filter",
-                                  onClick: D,
-                                  type: "button",
-                                  children: /* @__PURE__ */ e(m, { className: "h-3.5 w-3.5" })
-                                }
-                              )
-                            ]
-                          }
-                        ),
-                        f && /* @__PURE__ */ a(
-                          v,
-                          {
-                            className: "h-8 border border-teal-200 bg-teal-50 pr-1.5 pl-2 text-teal-800 shadow-sm ring-1 ring-teal-200/50 dark:border-teal-800/60 dark:bg-teal-950/40 dark:text-teal-200 dark:ring-teal-800/30",
-                            variant: "secondary",
-                            children: [
-                              /* @__PURE__ */ a("span", { className: "mr-1.5 inline-flex items-center gap-1 rounded-full bg-teal-100 px-1.5 py-0.5 text-[10px] text-teal-700 dark:bg-teal-800/60 dark:text-teal-200", children: [
-                                /* @__PURE__ */ e(Q, { className: "h-3 w-3" }),
-                                "Search"
-                              ] }),
-                              /* @__PURE__ */ a("span", { className: "font-medium text-xs", children: [
-                                '"',
-                                f,
-                                '"'
-                              ] }),
-                              /* @__PURE__ */ e(
-                                "button",
-                                {
-                                  "aria-label": "Clear search query",
-                                  className: "ml-1 inline-flex h-5 w-5 items-center justify-center rounded-full bg-teal-100 text-red-600 hover:bg-red-100 hover:text-red-700 focus-visible:ring-[3px] focus-visible:ring-red-200 dark:bg-teal-800/60 dark:text-red-400 dark:hover:bg-red-950/40 dark:hover:text-red-300",
-                                  "data-testid": "clear-search",
-                                  onClick: k,
-                                  type: "button",
-                                  children: /* @__PURE__ */ e(m, { className: "h-3.5 w-3.5" })
-                                }
-                              )
-                            ]
-                          }
-                        )
-                      ] })
+                      /* @__PURE__ */ e(Q, {})
                     ] }),
                     /* @__PURE__ */ e(
-                      w,
+                      c,
                       {
                         className: "min-h-0 flex-1 overflow-y-auto px-4 py-2 sm:px-6",
                         "data-testid": "content-area",
                         value: "toolkits",
-                        children: /* @__PURE__ */ a("div", { className: "space-y-3", children: [
-                          s.size === 0 && /* @__PURE__ */ e(
-                            _,
-                            {
-                              "data-testid": "empty-toolkits",
-                              description: "Try a different search term",
-                              title: "No toolkits found"
-                            }
-                          ),
-                          /* @__PURE__ */ e(
-                            "div",
-                            {
-                              className: "grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3",
-                              "data-testid": "toolkits-grid",
-                              children: Array.from(s).map((t) => /* @__PURE__ */ e(
-                                re,
-                                {
-                                  onSelect: () => {
-                                    if (r === "single") {
-                                      d("tools"), b(t.name);
-                                      return;
-                                    }
-                                    z(t);
-                                  },
-                                  onView: () => {
-                                    b(t.name), d("tools");
-                                  },
-                                  selectedTools: new Set(i.keys()),
-                                  selectionMode: r,
-                                  toolkit: t
-                                },
-                                t.name
-                              ))
-                            }
-                          )
-                        ] })
+                        children: /* @__PURE__ */ e("div", { className: "space-y-3", children: /* @__PURE__ */ e(Y, { selectionMode: a }) })
                       }
                     ),
                     /* @__PURE__ */ e(
-                      w,
+                      c,
                       {
                         className: "min-h-0 flex-1 overflow-y-auto px-4 py-2 sm:px-6",
                         "data-testid": "content-area",
                         value: "tools",
-                        children: /* @__PURE__ */ a("div", { className: "space-y-3", children: [
-                          n.size === 0 && /* @__PURE__ */ e(
-                            _,
-                            {
-                              "data-testid": "empty-tools",
-                              description: "Try a different search term",
-                              title: "No tools found"
-                            }
-                          ),
-                          /* @__PURE__ */ e(
-                            "div",
-                            {
-                              className: "grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3",
-                              "data-testid": "tools-grid",
-                              children: Array.from(n).map((t) => {
-                                const l = Array.from(s).find(
-                                  (h) => h.name === t.toolkit.name
-                                )?.metadata?.icon ?? J(t.toolkit.name);
-                                return /* @__PURE__ */ e(
-                                  Z,
-                                  {
-                                    "data-testid": `tool-card-${t.fully_qualified_name}`,
-                                    description: t.description,
-                                    fully_qualified_name: t.fully_qualified_name,
-                                    hideCheckbox: r === "single",
-                                    Icon: l,
-                                    isSelected: i.has(
-                                      t.fully_qualified_name
-                                    ),
-                                    name: t.name,
-                                    onSelect: () => q(t),
-                                    toolkitName: t.toolkit.name
-                                  },
-                                  t.fully_qualified_name
-                                );
-                              })
-                            }
-                          )
-                        ] })
+                        children: /* @__PURE__ */ e("div", { className: "space-y-3", children: /* @__PURE__ */ e($, { selectionMode: a }) })
                       }
                     )
                   ]
                 }
               ),
-              /* @__PURE__ */ e(X, { className: "shrink-0 border-t bg-white px-4 py-3 sm:px-6 sm:py-4 dark:bg-neutral-950", children: /* @__PURE__ */ a(
+              /* @__PURE__ */ e(P, { className: "shrink-0 border-t bg-white px-4 py-3 sm:px-6 sm:py-4 dark:bg-neutral-950", children: /* @__PURE__ */ t(
                 "div",
                 {
-                  className: `${r === "single" ? "sm:justify-end" : "sm:justify-between"} flex w-full flex-col gap-3 sm:flex-row sm:items-center`,
+                  className: `${a === "single" ? "sm:justify-end" : "sm:justify-between"} flex w-full flex-col gap-3 sm:flex-row sm:items-center`,
                   children: [
-                    r === "multi" && /* @__PURE__ */ e(te, {}),
-                    /* @__PURE__ */ a("div", { className: "mt-2 flex gap-2 sm:mt-0 sm:gap-2", children: [
-                      /* @__PURE__ */ e(N, { asChild: !0, children: /* @__PURE__ */ e(
-                        p,
+                    a === "multi" && /* @__PURE__ */ e(R, {}),
+                    /* @__PURE__ */ t("div", { className: "mt-2 flex gap-2 sm:mt-0 sm:gap-2", children: [
+                      /* @__PURE__ */ e(d, { asChild: !0, children: /* @__PURE__ */ e(
+                        n,
                         {
                           className: "flex-1 sm:flex-none",
                           "data-testid": "cancel-button",
@@ -365,29 +172,25 @@ const Se = (T) => {
                           children: "Cancel"
                         }
                       ) }),
-                      /* @__PURE__ */ e(
-                        le,
-                        {
-                          className: "flex-1 sm:flex-none",
-                          onCommit: () => {
-                            F(), u && u({
-                              selectedToolkits: Array.from(g.keys()),
-                              selectedTools: Array.from(i.keys())
-                            });
-                            const t = document.querySelector(
-                              '[data-testid="toolkit-picker-dialog"]'
-                            );
-                            if (t) {
-                              const o = t.querySelector(
-                                '[data-testid="toolkit-picker-close"]'
-                              );
-                              o && o.click();
-                            }
-                          },
-                          selectedCount: i.size,
-                          selectionMode: r
-                        }
-                      )
+                      /* @__PURE__ */ t(G, { delayDuration: 350, children: [
+                        /* @__PURE__ */ e(H, { asChild: !0, children: /* @__PURE__ */ e("span", { children: /* @__PURE__ */ e(
+                          W,
+                          {
+                            className: "flex-1 sm:flex-none",
+                            onCommit: y,
+                            selectedCount: i.size,
+                            selectionMode: a
+                          }
+                        ) }) }),
+                        /* @__PURE__ */ e(I, { children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+                          /* @__PURE__ */ e("span", { children: "Submit selection" }),
+                          /* @__PURE__ */ t("div", { className: "flex items-center gap-1", children: [
+                            /* @__PURE__ */ e("kbd", { className: "inline-flex h-4 items-center rounded border bg-muted px-1 font-mono text-[10px]", children: typeof window < "u" && J.test(navigator.userAgent) ? "⌘" : "Ctrl" }),
+                            /* @__PURE__ */ e("span", { className: "text-xs", children: "+" }),
+                            /* @__PURE__ */ e("kbd", { className: "inline-flex h-4 items-center rounded border bg-muted px-1 font-mono text-[10px]", children: "↵" })
+                          ] })
+                        ] }) })
+                      ] })
                     ] })
                   ]
                 }
@@ -400,5 +203,5 @@ const Se = (T) => {
   ) });
 };
 export {
-  Se as ToolkitPickerDialog
+  xe as ToolkitPickerDialog
 };