@inf-monkeys-tech/monkeys-design 1.0.108 → 1.0.109

package/dist/index.mjs

@@ -25452,8 +25452,10 @@ function DataExplorerRecordPicker({
   searchPlaceholder = "Search records",
   emptyState = "No records found",
   loadingState,
+  loadingMoreState,
   errorState,
   loading = false,
+  loadingMore = false,
   disabled = false,
   open,
   defaultOpen = false,
@@ -25565,34 +25567,50 @@ function DataExplorerRecordPicker({
                 children: loading ? /* @__PURE__ */ jsxs("div", { ...dataAttributes?.loading, className: cn3("flex min-h-16 items-center justify-center gap-2 px-3 py-4 text-sm text-muted-foreground", classNames?.status), children: [
                   /* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin", "aria-hidden": "true" }),
                   loadingState ?? "Loading records..."
-                ] }) : errorState ? /* @__PURE__ */ jsx("div", { ...dataAttributes?.error, className: cn3("px-3 py-4 text-sm text-destructive-text", classNames?.status), children: errorState }) : visibleOptions.length === 0 ? /* @__PURE__ */ jsx("div", { ...dataAttributes?.empty, className: cn3("px-3 py-4 text-sm text-muted-foreground", classNames?.status), children: emptyState }) : visibleOptions.map((option) => {
-                  const selected = selectedSet.has(option.value);
-                  return /* @__PURE__ */ jsxs(
-                    "button",
+                ] }) : errorState ? /* @__PURE__ */ jsx("div", { ...dataAttributes?.error, className: cn3("px-3 py-4 text-sm text-destructive-text", classNames?.status), children: errorState }) : visibleOptions.length === 0 ? /* @__PURE__ */ jsx("div", { ...dataAttributes?.empty, className: cn3("px-3 py-4 text-sm text-muted-foreground", classNames?.status), children: emptyState }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  visibleOptions.map((option) => {
+                    const selected = selectedSet.has(option.value);
+                    return /* @__PURE__ */ jsxs(
+                      "button",
+                      {
+                        ...dataAttributes?.option,
+                        type: "button",
+                        role: "option",
+                        "aria-selected": selected,
+                        "aria-current": activeValue !== void 0 && option.value === activeValue ? "true" : void 0,
+                        disabled: option.disabled,
+                        onClick: () => handleOptionClick(option),
+                        className: cn3(
+                          "flex w-full items-start gap-2 rounded-sm px-2.5 py-2 text-left text-sm transition-colors hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50",
+                          selected && "bg-accent/60",
+                          classNames?.option
+                        ),
+                        children: [
+                          /* @__PURE__ */ jsx("span", { className: cn3("mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center", classNames?.optionIndicator), children: selected ? /* @__PURE__ */ jsx(Check, { className: "h-4 w-4", "aria-hidden": "true" }) : null }),
+                          /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
+                            /* @__PURE__ */ jsx("span", { className: cn3("block truncate", classNames?.optionLabel), children: option.label }),
+                            option.description ? /* @__PURE__ */ jsx("span", { className: cn3("mt-0.5 block truncate text-xs text-muted-foreground", classNames?.optionDescription), children: option.description }) : null
+                          ] })
+                        ]
+                      },
+                      option.value
+                    );
+                  }),
+                  loadingMore ? /* @__PURE__ */ jsxs(
+                    "div",
                     {
-                      ...dataAttributes?.option,
-                      type: "button",
-                      role: "option",
-                      "aria-selected": selected,
-                      "aria-current": activeValue !== void 0 && option.value === activeValue ? "true" : void 0,
-                      disabled: option.disabled,
-                      onClick: () => handleOptionClick(option),
+                      ...dataAttributes?.loadingMore,
                       className: cn3(
-                        "flex w-full items-start gap-2 rounded-sm px-2.5 py-2 text-left text-sm transition-colors hover:bg-accent hover:text-accent-foreground disabled:pointer-events-none disabled:opacity-50",
-                        selected && "bg-accent/60",
-                        classNames?.option
+                        "flex items-center justify-center gap-2 px-3 py-2 text-xs text-muted-foreground",
+                        classNames?.status
                       ),
                       children: [
-                        /* @__PURE__ */ jsx("span", { className: cn3("mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center", classNames?.optionIndicator), children: selected ? /* @__PURE__ */ jsx(Check, { className: "h-4 w-4", "aria-hidden": "true" }) : null }),
-                        /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
-                          /* @__PURE__ */ jsx("span", { className: cn3("block truncate", classNames?.optionLabel), children: option.label }),
-                          option.description ? /* @__PURE__ */ jsx("span", { className: cn3("mt-0.5 block truncate text-xs text-muted-foreground", classNames?.optionDescription), children: option.description }) : null
-                        ] })
+                        /* @__PURE__ */ jsx(Loader2, { className: "h-3.5 w-3.5 animate-spin", "aria-hidden": "true" }),
+                        loadingMoreState ?? "Loading more records..."
                       ]
-                    },
-                    option.value
-                  );
-                })
+                    }
+                  ) : null
+                ] })
               }
             )
           ]