@arcadeai/design-system 3.3.1 → 3.5.0

package/dist/components/index.js

@@ -148,7 +148,7 @@ import { Textarea as Qm } from "./ui/atoms/textarea.js";
 import { Toggle as Ym, toggleVariants as jm } from "./ui/atoms/toggle.js";
 import { Tooltip as _m, TooltipContent as $m, TooltipProvider as oi, TooltipTrigger as ri } from "./ui/atoms/tooltip.js";
 import { EmptyState as ti } from "./ui/molecules/empty-state.js";
-import { R as ai, T as mi } from "../toolkit-card-nuE_5OvN.js";
+import { R as ai, T as mi } from "../toolkit-card-BzIa8ZXI.js";
 import { ToolCard as li } from "./ui/molecules/tool-card.js";
 import { ToolkitPickerTrigger as xi } from "./ui/molecules/toolkit-picker-trigger.js";
 import { ToolkitSelectionSummary as di } from "./ui/molecules/toolkit-selection-summary.js";

package/dist/components/ui/atoms/table.d.ts

@@ -1,5 +1,7 @@
-import * as React from 'react';
-declare const Table: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableElement> & React.RefAttributes<HTMLTableElement>>;
+import type * as React from 'react';
+declare function Table({ className, ref, ...props }: React.HTMLAttributes<HTMLTableElement> & {
+    ref?: React.Ref<HTMLTableElement>;
+}): import("react/jsx-runtime").JSX.Element;
 declare function TableHeader({ className, ...props }: React.ComponentProps<'thead'>): import("react/jsx-runtime").JSX.Element;
 declare function TableBody({ className, ...props }: React.ComponentProps<'tbody'>): import("react/jsx-runtime").JSX.Element;
 declare function TableFooter({ className, ...props }: React.ComponentProps<'tfoot'>): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/atoms/table.js

@@ -1,20 +1,24 @@
 import { jsxs as l, jsx as a } from "react/jsx-runtime";
-import * as s from "react";
 import { c as o } from "../../../utils-Db4QWi-E.js";
-import { ScrollArea as n, ScrollBar as c } from "./scroll-area.js";
-const d = s.forwardRef(({ className: t, ...e }, r) => /* @__PURE__ */ l(n, { className: "relative w-full", viewPortClassName: "px-0", children: [
-  /* @__PURE__ */ a(
-    "table",
-    {
-      className: o("w-full caption-bottom text-sm", t),
-      ref: r,
-      ...e
-    }
-  ),
-  /* @__PURE__ */ a(c, { orientation: "horizontal" })
-] }));
-d.displayName = "Table";
-function u({ className: t, ...e }) {
+import { ScrollArea as n, ScrollBar as s } from "./scroll-area.js";
+function i({
+  className: t,
+  ref: e,
+  ...r
+}) {
+  return /* @__PURE__ */ l(n, { className: "relative w-full", viewPortClassName: "px-0", children: [
+    /* @__PURE__ */ a(
+      "table",
+      {
+        className: o("w-full caption-bottom text-sm", t),
+        ref: e,
+        ...r
+      }
+    ),
+    /* @__PURE__ */ a(s, { orientation: "horizontal" })
+  ] });
+}
+function m({ className: t, ...e }) {
   return /* @__PURE__ */ a(
     "thead",
     {
@@ -24,7 +28,7 @@ function u({ className: t, ...e }) {
     }
   );
 }
-function f({ className: t, ...e }) {
+function u({ className: t, ...e }) {
   return /* @__PURE__ */ a(
     "tbody",
     {
@@ -34,7 +38,7 @@ function f({ className: t, ...e }) {
     }
   );
 }
-function p({ className: t, ...e }) {
+function f({ className: t, ...e }) {
   return /* @__PURE__ */ a(
     "tfoot",
     {
@@ -47,7 +51,7 @@ function p({ className: t, ...e }) {
     }
   );
 }
-function h({ className: t, ...e }) {
+function p({ className: t, ...e }) {
   return /* @__PURE__ */ a(
     "tr",
     {
@@ -60,7 +64,7 @@ function h({ className: t, ...e }) {
     }
   );
 }
-function x({ className: t, ...e }) {
+function h({ className: t, ...e }) {
   return /* @__PURE__ */ a(
     "th",
     {
@@ -73,7 +77,7 @@ function x({ className: t, ...e }) {
     }
   );
 }
-function N({ className: t, ...e }) {
+function x({ className: t, ...e }) {
   return /* @__PURE__ */ a(
     "td",
     {
@@ -86,7 +90,7 @@ function N({ className: t, ...e }) {
     }
   );
 }
-function w({
+function N({
   className: t,
   ...e
 }) {
@@ -100,12 +104,12 @@ function w({
   );
 }
 export {
-  d as Table,
-  f as TableBody,
-  w as TableCaption,
-  N as TableCell,
-  p as TableFooter,
-  x as TableHead,
-  u as TableHeader,
-  h as TableRow
+  i as Table,
+  u as TableBody,
+  N as TableCaption,
+  x as TableCell,
+  f as TableFooter,
+  h as TableHead,
+  m as TableHeader,
+  p as TableRow
 };

package/dist/components/ui/index.js

@@ -148,7 +148,7 @@ import { Textarea as Qm } from "./atoms/textarea.js";
 import { Toggle as Ym, toggleVariants as jm } from "./atoms/toggle.js";
 import { Tooltip as _m, TooltipContent as $m, TooltipProvider as oi, TooltipTrigger as ri } from "./atoms/tooltip.js";
 import { EmptyState as ti } from "./molecules/empty-state.js";
-import { R as ai, T as mi } from "../../toolkit-card-nuE_5OvN.js";
+import { R as ai, T as mi } from "../../toolkit-card-BzIa8ZXI.js";
 import { ToolCard as li } from "./molecules/tool-card.js";
 import { ToolkitPickerTrigger as xi } from "./molecules/toolkit-picker-trigger.js";
 import { ToolkitSelectionSummary as di } from "./molecules/toolkit-selection-summary.js";

package/dist/components/ui/molecules/index.js

@@ -1,5 +1,5 @@
 import { EmptyState as e } from "./empty-state.js";
-import { R as m, T as a } from "../../../toolkit-card-nuE_5OvN.js";
+import { R as m, T as a } from "../../../toolkit-card-BzIa8ZXI.js";
 import { ToolCard as p } from "./tool-card.js";
 import { ToolkitPickerTrigger as f } from "./toolkit-picker-trigger.js";
 import { ToolkitSelectionSummary as x } from "./toolkit-selection-summary.js";

package/dist/components/ui/molecules/requirement-badges.js

@@ -9,16 +9,15 @@ import "../atoms/mobile-tooltip.js";
 import "../atoms/pro-badge.js";
 import "../../../react-resizable-panels.browser-31wAXhAV.js";
 import "../atoms/sidebar.js";
-import "../atoms/table.js";
 import "../atoms/tooltip.js";
-import { O as q, R as x, S as A } from "../../../toolkit-card-nuE_5OvN.js";
+import { O as n, R as q, S as x } from "../../../toolkit-card-BzIa8ZXI.js";
 import "./tool-card.js";
 import "../../../metadata/oauth-providers.js";
 import "../../../metadata/toolkits.js";
 import "../organisms/toolkit-picker/hooks/use-toolkit-picker.js";
 import "../utils/memo.js";
 export {
-  q as OAuthBadge,
-  x as RequirementBadges,
-  A as SecretsBadge
+  n as OAuthBadge,
+  q as RequirementBadges,
+  x as SecretsBadge
 };

package/dist/components/ui/molecules/toolkit-card.js

@@ -6,7 +6,7 @@ import "../atoms/card.js";
 import "../atoms/checkbox.js";
 import "../atoms/view-tools-control.js";
 import "../../../utils-Db4QWi-E.js";
-import { T as k } from "../../../toolkit-card-nuE_5OvN.js";
+import { T as k } from "../../../toolkit-card-BzIa8ZXI.js";
 import "../utils/memo.js";
 export {
   k as ToolkitCard

package/dist/components/ui/molecules/toolkit-selection-summary.js

@@ -6,13 +6,12 @@ import "../atoms/chart.js";
 import "../../../react-resizable-panels.browser-31wAXhAV.js";
 import "../atoms/sidebar.js";
 import "react";
-import "../atoms/table.js";
-import "../../../toolkit-card-nuE_5OvN.js";
+import "../../../toolkit-card-BzIa8ZXI.js";
 import "./tool-card.js";
 import { getToolkitIcon as z } from "../../../metadata/toolkit-icons.js";
 import "../organisms/toolkit-picker/hooks/use-toolkit-picker.js";
 const j = 3;
-function D({
+function _({
   selectedToolkits: s,
   selectedTools: n,
   onClear: N,
@@ -112,5 +111,5 @@ function D({
   );
 }
 export {
-  D as ToolkitSelectionSummary
+  _ as ToolkitSelectionSummary
 };

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

@@ -6,13 +6,12 @@ import "../../../atoms/chart.js";
 import { Input as k } from "../../../atoms/input.js";
 import "../../../../../react-resizable-panels.browser-31wAXhAV.js";
 import "../../../atoms/sidebar.js";
-import "../../../atoms/table.js";
-import "../../../../../toolkit-card-nuE_5OvN.js";
+import "../../../../../toolkit-card-BzIa8ZXI.js";
 import "../../../molecules/tool-card.js";
 import "../../../../../metadata/oauth-providers.js";
 import "../../../../../metadata/toolkits.js";
 import { useToolkitPicker as g } from "../hooks/use-toolkit-picker.js";
-function C() {
+function z() {
   const r = T(null), {
     state: {
       searchQuery: o,
@@ -23,21 +22,21 @@ function C() {
     },
     setSearchQuery: n,
     toggleToolkit: c,
-    toggleTool: m,
-    setActiveTab: u,
-    setToolkitFilter: p
-  } = g(), f = () => {
+    toggleTool: u,
+    setActiveTab: m,
+    setToolkitFilter: f
+  } = g(), p = () => {
     const t = Array.from(s)[0];
     if (t) {
       if (a === "single") {
-        p(t.name), u("tools");
+        f(t.name), m("tools");
         return;
       }
       c(t);
     }
   }, h = () => {
     const t = Array.from(l)[0];
-    t && m(t);
+    t && u(t);
   };
   return /* @__PURE__ */ d("div", { className: "relative flex-1", children: [
     /* @__PURE__ */ e(y, { className: "-translate-y-1/2 absolute top-1/2 left-3.5 size-4 text-gray-400" }),
@@ -52,7 +51,7 @@ function C() {
         onKeyDown: (t) => {
           if (!(t.key !== "Enter" || !(o.trim().length > 0))) {
             if (t.preventDefault(), t.stopPropagation(), i === "toolkits") {
-              f();
+              p();
               return;
             }
             h();
@@ -66,5 +65,5 @@ function C() {
   ] });
 }
 export {
-  C as SearchInput
+  z as SearchInput
 };

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

@@ -6,13 +6,12 @@ import "../../../atoms/chart.js";
 import "../../../../../react-resizable-panels.browser-31wAXhAV.js";
 import "../../../atoms/sidebar.js";
 import "react";
-import "../../../atoms/table.js";
-import "../../../../../toolkit-card-nuE_5OvN.js";
+import "../../../../../toolkit-card-BzIa8ZXI.js";
 import "../../../molecules/tool-card.js";
 import "../../../../../metadata/oauth-providers.js";
 import "../../../../../metadata/toolkits.js";
 import "../hooks/use-toolkit-picker.js";
-function $({
+function L({
   selectionMode: t,
   selectedCount: o,
   onCommit: r,
@@ -31,5 +30,5 @@ function $({
   );
 }
 export {
-  $ as SelectButton
+  L as SelectButton
 };

package/dist/components/ui/organisms/toolkit-picker/components/toolkit-card-with-selection.js

@@ -1,5 +1,5 @@
 import { jsx as m } from "react/jsx-runtime";
-import { T as c } from "../../../../../toolkit-card-nuE_5OvN.js";
+import { T as c } from "../../../../../toolkit-card-BzIa8ZXI.js";
 import { getToolkitIcon as d } from "../../../../../metadata/toolkit-icons.js";
 function g({
   toolkit: e,

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

@@ -1,6 +1,6 @@
 import { jsx as t, jsxs as l } from "react/jsx-runtime";
 import { EmptyState as k } from "../../../molecules/empty-state.js";
-import "../../../../../toolkit-card-nuE_5OvN.js";
+import "../../../../../toolkit-card-BzIa8ZXI.js";
 import "../../../molecules/tool-card.js";
 import "lucide-react";
 import "../../../../../metadata/oauth-providers.js";
@@ -11,9 +11,8 @@ import "../../../atoms/chart.js";
 import "../../../../../react-resizable-panels.browser-31wAXhAV.js";
 import "../../../atoms/sidebar.js";
 import "react";
-import "../../../atoms/table.js";
 import { ToolkitCardWithSelection as h } from "./toolkit-card-with-selection.js";
-function L({ selectionMode: s }) {
+function F({ selectionMode: s }) {
   const {
     state: { filteredToolkits: i, selectedToolkits: r, selectedTools: a },
     toggleToolkit: x,
@@ -87,5 +86,5 @@ function L({ selectionMode: s }) {
   ] });
 }
 export {
-  L as ToolkitList
+  F as ToolkitList
 };

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

@@ -1,6 +1,6 @@
 import { jsx as t, jsxs as a } from "react/jsx-runtime";
 import { EmptyState as h } from "../../../molecules/empty-state.js";
-import "../../../../../toolkit-card-nuE_5OvN.js";
+import "../../../../../toolkit-card-BzIa8ZXI.js";
 import { ToolCard as p } from "../../../molecules/tool-card.js";
 import "lucide-react";
 import { getToolkitIcon as g } from "../../../../../metadata/toolkit-icons.js";
@@ -10,8 +10,7 @@ import "../../../atoms/chart.js";
 import "../../../../../react-resizable-panels.browser-31wAXhAV.js";
 import "../../../atoms/sidebar.js";
 import "react";
-import "../../../atoms/table.js";
-function $({ selectionMode: n }) {
+function j({ selectionMode: n }) {
   const {
     state: { filteredTools: m, filteredToolkits: o, selectedTools: l },
     toggleTool: c
@@ -93,5 +92,5 @@ function $({ selectionMode: n }) {
   ] });
 }
 export {
-  $ as ToolsList
+  j as ToolsList
 };

package/dist/main.js

@@ -148,7 +148,7 @@ import { Textarea as Jm } from "./components/ui/atoms/textarea.js";
 import { Toggle as Zm, toggleVariants as Qm } from "./components/ui/atoms/toggle.js";
 import { Tooltip as jm, TooltipContent as $m, TooltipProvider as oi, TooltipTrigger as ri } from "./components/ui/atoms/tooltip.js";
 import { EmptyState as ti } from "./components/ui/molecules/empty-state.js";
-import { R as ai, T as mi } from "./toolkit-card-nuE_5OvN.js";
+import { R as ai, T as mi } from "./toolkit-card-BzIa8ZXI.js";
 import { ToolCard as li } from "./components/ui/molecules/tool-card.js";
 import { ToolkitPickerTrigger as ni } from "./components/ui/molecules/toolkit-picker-trigger.js";
 import { ToolkitSelectionSummary as di } from "./components/ui/molecules/toolkit-selection-summary.js";

package/dist/metadata/toolkits.js

@@ -1234,16 +1234,16 @@ const a = [
     isHidden: !1
   },
   {
-    id: "Trello",
-    label: "Trello",
+    id: "TrelloAPI",
+    label: "Trello API",
     isBYOC: !1,
     isPro: !1,
     publicIconUrl: `${e}/trello.svg`,
-    docsLink: "https://docs.arcade.dev/en/mcp-servers/productivity/trello",
-    relativeDocsLink: "/en/mcp-servers/productivity/trello",
+    docsLink: "https://docs.arcade.dev/en/mcp-servers/productivity/trello-api",
+    relativeDocsLink: "/en/mcp-servers/productivity/trello-api",
     category: "productivity",
-    type: "arcade",
-    isComingSoon: !0,
+    type: "arcade_starter",
+    isComingSoon: !1,
     isHidden: !1
   },
   {

package/dist/{toolkit-card-nuE_5OvN.js → toolkit-card-BzIa8ZXI.js}

@@ -13,7 +13,6 @@ import "./components/ui/atoms/mobile-tooltip.js";
 import { ProBadge as U } from "./components/ui/atoms/pro-badge.js";
 import "./react-resizable-panels.browser-31wAXhAV.js";
 import "./components/ui/atoms/sidebar.js";
-import "./components/ui/atoms/table.js";
 import { Tooltip as y, TooltipTrigger as w, TooltipContent as C } from "./components/ui/atoms/tooltip.js";
 import "./components/ui/molecules/tool-card.js";
 import { areStringArraysEqual as x, createPropsComparator as B } from "./components/ui/utils/memo.js";
@@ -292,7 +291,7 @@ const Y = B([
   "isByoc",
   "isPro",
   "hideCheckbox"
-]), ke = f.memo(
+]), be = f.memo(
   X,
   Y
 );
@@ -300,5 +299,5 @@ export {
   H as O,
   J as R,
   G as S,
-  ke as T
+  be as T
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arcadeai/design-system",
   "private": false,
-  "version": "3.3.1",
+  "version": "3.5.0",
   "type": "module",
   "main": "dist/main.js",
   "types": "dist/main.d.ts",
@@ -107,9 +107,9 @@
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
-    "@types/node": "24.6.2",
-    "@types/react": "19.2.0",
-    "@types/react-dom": "19.2.0",
+    "@types/node": "24.7.0",
+    "@types/react": "19.2.2",
+    "@types/react-dom": "19.2.1",
     "@vitejs/plugin-react-swc": "4.1.0",
     "@vitest/browser": "3.2.4",
     "@vitest/coverage-v8": "3.2.4",
@@ -119,11 +119,11 @@
     "happy-dom": "^19.0.2",
     "husky": "9.1.7",
     "lint-staged": "16.2.3",
-    "lucide-react": "0.544.0",
-    "playwright": "1.55.1",
+    "lucide-react": "0.545.0",
+    "playwright": "1.56.0",
     "react": "19.2.0",
     "react-dom": "19.2.0",
-    "react-hook-form": "7.63.0",
+    "react-hook-form": "7.64.0",
     "recharts": "3.2.1",
     "semantic-release": "24.2.9",
     "storybook": "9.1.10",
@@ -131,11 +131,11 @@
     "tailwindcss": "4.1.14",
     "tw-animate-css": "1.4.0",
     "typescript": "~5.9.3",
-    "ultracite": "5.5.0",
-    "vite": "7.1.8",
+    "ultracite": "5.6.1",
+    "vite": "7.1.9",
     "vite-plugin-dts": "4.5.4",
     "vitest": "3.2.4",
-    "zod": "4.1.11"
+    "zod": "4.1.12"
   },
   "dependencies": {
     "@arcadeai/arcadejs": "^1.10.0",