@mastra/playground-ui 22.1.2-alpha.3 → 22.1.2-alpha.4

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @mastra/playground-ui
 
+## 22.1.2-alpha.4
+
+### Patch Changes
+
+- Fix dataset detail tab badges to use total item and experiment counts instead of currently loaded rows. ([#14994](https://github.com/mastra-ai/mastra/pull/14994))
+
+- Added `EntityList.Pagination` sub-component for server-side pagination of `EntityList` views. Mirrors the existing `ItemList.Pagination` API. ([#15353](https://github.com/mastra-ai/mastra/pull/15353))
+
+- Updated dependencies [[`cbdf3e1`](https://github.com/mastra-ai/mastra/commit/cbdf3e12b3d0c30a6e5347be658e2009648c130a), [`8fe46d3`](https://github.com/mastra-ai/mastra/commit/8fe46d354027f3f0f0846e64219772348de106dd), [`18c67db`](https://github.com/mastra-ai/mastra/commit/18c67dbb9c9ebc26f26f65f7d3ff836e5691ef46), [`8dcc77e`](https://github.com/mastra-ai/mastra/commit/8dcc77e78a5340f5848f74b9e9f1b3da3513c1f5), [`aa67fc5`](https://github.com/mastra-ai/mastra/commit/aa67fc59ee8a5eeff1f23eb05970b8d7a536c8ff), [`fa8140b`](https://github.com/mastra-ai/mastra/commit/fa8140bcd4251d2e3ac85fdc5547dfc4f372b5be), [`190f452`](https://github.com/mastra-ai/mastra/commit/190f45258b0640e2adfc8219fa3258cdc5b8f071), [`7e7bf60`](https://github.com/mastra-ai/mastra/commit/7e7bf606886bf374a6f9d4ca9b09dd83d0533372), [`184907d`](https://github.com/mastra-ai/mastra/commit/184907d775d8609c03c26e78ccaf37315f3aa287), [`0c4cd13`](https://github.com/mastra-ai/mastra/commit/0c4cd131931c04ac5405373c932a242dbe88edd6), [`b16a753`](https://github.com/mastra-ai/mastra/commit/b16a753d5748440248d7df82e29bb987a9c8386c)]:
+  - @mastra/core@1.25.0-alpha.3
+  - @mastra/client-js@1.13.4-alpha.3
+  - @mastra/react@0.2.26-alpha.3
+
 ## 22.1.2-alpha.3
 
 ### Patch Changes

package/dist/index.cjs.js

@@ -11462,6 +11462,36 @@ function EntityListNoMatch({ message = "Nothing matches your search", className
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("col-span-full flex flex-col items-center justify-center gap-2 py-12 text-neutral3", className), children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-ui-md", children: message }) });
 }
 
+function EntityListPagination({ currentPage, hasMore, onNextPage, onPrevPage }) {
+  const showNavigation = typeof currentPage === "number" && currentPage > 0 || hasMore;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("col-span-full flex items-center justify-center gap-8 pt-6 pb-4 text-ui-md text-neutral3"), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+      "Page ",
+      /* @__PURE__ */ jsxRuntime.jsx("b", { children: currentPage ? currentPage + 1 : "1" })
+    ] }),
+    showNavigation && /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: cn(
+          "flex gap-4",
+          "[&>button]:flex [&>button]:items-center [&>button]:gap-2 [&>button]:text-neutral4 [&>button:hover]:text-neutral5 [&>button]:transition-colors [&>button]:border [&>button]:border-border1 [&>button]:p-1 [&>button]:px-2 [&>button]:rounded-md",
+          "[&_svg]:w-[1em] [&_svg]:h-[1em] [&_svg]:text-neutral3"
+        ),
+        children: [
+          typeof currentPage === "number" && currentPage > 0 && /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick: onPrevPage, children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowLeftIcon, {}),
+            "Previous"
+          ] }),
+          hasMore && /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", onClick: onNextPage, children: [
+            "Next",
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRightIcon, {})
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+
 function EntityListRoot({ children, columns, className }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -11601,7 +11631,8 @@ const EntityList = Object.assign(EntityListRoot, {
   TextCell: EntityListTextCell,
   NameCell: EntityListNameCell,
   DescriptionCell: EntityListDescriptionCell,
-  NoMatch: EntityListNoMatch
+  NoMatch: EntityListNoMatch,
+  Pagination: EntityListPagination
 });
 
 const widths = ["75%", "50%", "65%", "90%", "60%", "80%"];