@neuronection/assistant-ui 0.11.0 → 0.12.1

package/dist/chunk-QIXRJMCL.js

@@ -0,0 +1,574 @@
+import { CapabilityChips } from './chunk-G3DWN2DJ.js';
+import { ModelPicker } from './chunk-WHOJXXGI.js';
+import { Modal, ModalContent, ModalHeader, ModalTitle, ModalFooter } from './chunk-Y7BKBG57.js';
+import { Button } from './chunk-GTXGTQ6F.js';
+import { Spinner } from './chunk-INTST5VG.js';
+import { cn } from './chunk-BLJWR4ZV.js';
+import * as React from 'react';
+import { ChevronDown, ChevronRight, Pencil, X, Plus, Check, ChevronUp } from 'lucide-react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var CUSTOM = "__custom__";
+var ACRONYMS = ["gpt", "nlp", "ocr", "llm", "stt", "tts", "vl", "ai"];
+function beautifyModelId(externalId) {
+  return externalId.replace(/[-:]/g, " ").replace(/(?<!\d)\.|\.(?!\d)/g, " ").split(" ").filter(Boolean).map((word) => {
+    if (ACRONYMS.includes(word.toLowerCase())) return word.toUpperCase();
+    return word.charAt(0).toUpperCase() + word.slice(1);
+  }).join(" ");
+}
+function NumberField({
+  label,
+  value,
+  onChange,
+  onClear,
+  step = "1",
+  min,
+  max
+}) {
+  const bump = (delta) => {
+    const current = value.trim() === "" ? 0 : Number(value);
+    if (!Number.isFinite(current)) return;
+    const next = current + delta;
+    onChange(String(min != null && next < Number(min) ? Number(min) : next));
+  };
+  return /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--as-fg)]", children: label }),
+    /* @__PURE__ */ jsxs("span", { className: "relative block", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "number",
+          step,
+          min,
+          max,
+          value,
+          onChange: (event) => onChange(event.target.value),
+          className: "w-full rounded-[var(--as-radius)] border border-[var(--as-border)] bg-[var(--as-surface)] px-3 py-2 pr-16 text-sm text-[var(--as-fg)] [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none"
+        }
+      ),
+      /* @__PURE__ */ jsxs("span", { className: "absolute inset-y-0 right-1.5 flex items-center gap-1", children: [
+        value !== "" ? /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            "aria-label": `${label} clear`,
+            onClick: onClear,
+            className: "cursor-pointer text-[var(--as-muted-fg)] hover:text-[var(--as-fg)]",
+            children: /* @__PURE__ */ jsx(X, { className: "size-4", "aria-hidden": true })
+          }
+        ) : null,
+        /* @__PURE__ */ jsxs("span", { className: "flex flex-col", children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": `${label} increment`,
+              onClick: () => bump(Number(step)),
+              className: "cursor-pointer leading-none text-[var(--as-muted-fg)] hover:text-[var(--as-fg)]",
+              children: /* @__PURE__ */ jsx(ChevronUp, { className: "size-3.5", "aria-hidden": true })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              "aria-label": `${label} decrement`,
+              onClick: () => bump(-Number(step)),
+              className: "cursor-pointer leading-none text-[var(--as-muted-fg)] hover:text-[var(--as-fg)]",
+              children: /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5", "aria-hidden": true })
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] });
+}
+var ModelRegistry = React.forwardRef(
+  function ModelRegistry2({
+    providers,
+    models,
+    caps,
+    expandedProviderId,
+    onExpandedProviderChange,
+    remoteModels,
+    remoteState = "ready",
+    remoteError,
+    onRetryRemote,
+    onAddModel,
+    onAddAll,
+    onUpdateModel,
+    onDeleteModel,
+    reasoningEffortOptions,
+    addLabel = "Add model",
+    addAllLabel = "Add all",
+    addTitle = "Add model",
+    editTitle = "Edit model",
+    selectModelLabel = "Model",
+    manualIdToggleLabel = "Enter the model id manually",
+    editLabel = "Edit",
+    removeLabel = "Remove",
+    missingLabel = "Missing",
+    capsLabel = "Capabilities",
+    searchPlaceholder = "Search models\u2026",
+    searchLabel = "Search models",
+    emptyProviderLabel = "No models yet \u2014 use Add model to pick from the live catalog.",
+    externalIdRequiredLabel = "The model id is required.",
+    remoteEmptyLabel = "The provider listed no models.",
+    remoteLoadingLabel = "Loading models\u2026",
+    retryLabel = "Retry",
+    customOptionLabel = "Custom\u2026",
+    temperatureLabel = "Temperature",
+    maxTokensLabel = "Max tokens",
+    labelLabel = "Display label",
+    reasoningEffortLabel = "Reasoning effort",
+    saveLabel = "Save",
+    cancelLabel = "Cancel",
+    addDraftLabel = "Add model",
+    providersEmptyLabel = "No providers yet.",
+    emptyAction,
+    className
+  }, ref) {
+    const [modal, setModal] = React.useState(null);
+    const [draftError, setDraftError] = React.useState(null);
+    const descriptorFor = React.useCallback(
+      (value) => caps.find((cap) => cap.value === value) ?? { value, label: value },
+      [caps]
+    );
+    const resetModal = React.useCallback(() => {
+      setModal(null);
+      setDraftError(null);
+    }, []);
+    const toggleProvider = (providerId) => {
+      onExpandedProviderChange(expandedProviderId === providerId ? null : providerId);
+    };
+    const openAddModal = (providerId) => {
+      setModal({
+        mode: "add",
+        providerId,
+        externalId: "",
+        label: "",
+        caps: caps[0] ? [caps[0].value] : [],
+        reasoningEffort: "",
+        reasoningCustom: false,
+        temperature: "",
+        maxTokens: "",
+        labelTouched: false,
+        manual: false
+      });
+      setDraftError(null);
+    };
+    const openEditModal = (model) => {
+      setModal({
+        mode: "edit",
+        providerId: model.providerId,
+        externalId: model.externalId,
+        label: model.label ?? "",
+        caps: [...model.caps],
+        labelTouched: true,
+        reasoningEffort: model.reasoningEffort ?? "",
+        reasoningCustom: model.reasoningEffort != null && model.reasoningEffort !== "" && !(reasoningEffortOptions ?? []).includes(model.reasoningEffort),
+        temperature: model.temperature != null ? String(model.temperature) : "",
+        maxTokens: model.maxTokens != null ? String(model.maxTokens) : "",
+        model,
+        manual: false
+      });
+      setDraftError(null);
+    };
+    const selectRemote = (remoteId) => {
+      const remote = (remoteModels ?? []).find((entry) => entry.id === remoteId);
+      setModal(
+        (current) => current ? {
+          ...current,
+          externalId: remoteId,
+          caps: remote ? [...remote.caps] : current.caps,
+          label: current.labelTouched ? current.label : beautifyModelId(remoteId)
+        } : current
+      );
+    };
+    const toggleDraftCap = (value) => {
+      setModal(
+        (current) => current ? {
+          ...current,
+          caps: current.caps.includes(value) ? current.caps.filter((entry) => entry !== value) : [...current.caps, value]
+        } : current
+      );
+    };
+    const patchField = (field, value) => {
+      setModal((current) => current ? { ...current, [field]: value } : current);
+    };
+    const numberOr = (raw) => {
+      const trimmed = raw.trim();
+      if (!trimmed) return null;
+      const parsed = Number(trimmed);
+      return Number.isFinite(parsed) ? parsed : null;
+    };
+    const submitModal = () => {
+      if (!modal) return;
+      const externalId = modal.externalId.trim();
+      if (!externalId) {
+        setDraftError(externalIdRequiredLabel);
+        return;
+      }
+      const payload = {
+        externalId,
+        label: modal.label.trim() || void 0,
+        caps: modal.caps,
+        reasoningEffort: modal.reasoningEffort.trim(),
+        temperature: numberOr(modal.temperature),
+        maxTokens: numberOr(modal.maxTokens)
+      };
+      if (modal.mode === "add") {
+        onAddModel(modal.providerId, payload);
+      } else if (modal.model) {
+        onUpdateModel(modal.model, payload);
+      }
+      resetModal();
+    };
+    const remoteForProvider = (provider) => {
+      const items = remoteModels ?? [];
+      if (items.length === 0) return [];
+      return [
+        {
+          id: provider.id,
+          name: provider.name,
+          models: items.map((entry) => ({
+            id: entry.id,
+            name: entry.id,
+            capabilities: entry.caps
+          }))
+        }
+      ];
+    };
+    const renderModal = () => {
+      if (!modal) return null;
+      const provider = providers.find((entry) => entry.id === modal.providerId);
+      const catalog = provider ? remoteForProvider(provider) : [];
+      const pendingCount = (remoteModels ?? []).filter(
+        (remote) => !models.some(
+          (model) => model.providerId === modal.providerId && model.externalId === remote.id
+        )
+      ).length;
+      return /* @__PURE__ */ jsx(Modal, { open: true, onOpenChange: (open) => !open ? resetModal() : void 0, children: /* @__PURE__ */ jsxs(ModalContent, { className: "max-h-[85vh] w-full max-w-lg overflow-y-auto", children: [
+        /* @__PURE__ */ jsx(ModalHeader, { children: /* @__PURE__ */ jsx(ModalTitle, { className: "text-base", children: modal.mode === "add" ? addTitle : `${editTitle} \u2014 ${modal.externalId}` }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 p-4", children: [
+          modal.mode === "add" ? remoteState === "loading" ? /* @__PURE__ */ jsxs("p", { className: "flex items-center justify-center gap-2 py-4 text-xs text-[var(--as-muted-fg)]", children: [
+            /* @__PURE__ */ jsx(Spinner, { size: "sm" }),
+            remoteLoadingLabel
+          ] }) : remoteState === "error" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+              /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-[var(--as-danger)]", children: remoteError }),
+              onRetryRemote ? /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onClick: onRetryRemote, children: retryLabel }) : null
+            ] }),
+            modal.manual ? /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--as-fg)]", children: selectModelLabel }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "text",
+                  value: modal.externalId,
+                  onChange: (event) => patchField("externalId", event.target.value),
+                  className: "w-full rounded-[var(--as-radius)] border border-[var(--as-border)] bg-[var(--as-surface)] px-3 py-2 font-mono text-sm text-[var(--as-fg)]"
+                }
+              )
+            ] }) : /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "cursor-pointer self-start text-xs text-[var(--as-muted-fg)] underline-offset-2 hover:text-[var(--as-fg)] hover:underline",
+                onClick: () => setModal((c) => c ? { ...c, manual: true } : c),
+                children: manualIdToggleLabel
+              }
+            )
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            modal.manual ? /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--as-fg)]", children: selectModelLabel }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "text",
+                  value: modal.externalId,
+                  onChange: (event) => patchField("externalId", event.target.value),
+                  className: "w-full rounded-[var(--as-radius)] border border-[var(--as-border)] bg-[var(--as-surface)] px-3 py-2 font-mono text-sm text-[var(--as-fg)]"
+                }
+              )
+            ] }) : /* @__PURE__ */ jsx(
+              ModelPicker,
+              {
+                providers: catalog,
+                value: modal.externalId,
+                onChange: (modelId) => modelId ? selectRemote(modelId) : void 0,
+                label: selectModelLabel,
+                searchPlaceholder,
+                searchLabel,
+                emptyLabel: remoteEmptyLabel
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "cursor-pointer self-start text-xs text-[var(--as-muted-fg)] underline-offset-2 hover:text-[var(--as-fg)] hover:underline",
+                onClick: () => setModal((c) => c ? { ...c, manual: !c.manual } : c),
+                children: manualIdToggleLabel
+              }
+            )
+          ] }) : /* @__PURE__ */ jsx("p", { className: "font-mono text-sm text-[var(--as-fg)]", children: modal.externalId }),
+          /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--as-fg)]", children: labelLabel }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                value: modal.label,
+                onChange: (event) => setModal(
+                  (current) => current ? { ...current, label: event.target.value, labelTouched: true } : current
+                ),
+                className: "w-full rounded-[var(--as-radius)] border border-[var(--as-border)] bg-[var(--as-surface)] px-3 py-2 text-sm text-[var(--as-fg)]"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--as-fg)]", children: capsLabel }),
+            /* @__PURE__ */ jsx(
+              CapabilityChips,
+              {
+                caps,
+                selected: modal.caps,
+                onToggle: toggleDraftCap,
+                ariaLabel: capsLabel
+              }
+            )
+          ] }),
+          reasoningEffortOptions ? /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-[var(--as-fg)]", children: reasoningEffortLabel }),
+            /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2 sm:flex-row", children: modal.reasoningCustom ? /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "text",
+                value: modal.reasoningEffort,
+                placeholder: customOptionLabel,
+                onChange: (event) => patchField("reasoningEffort", event.target.value),
+                className: "w-full rounded-[var(--as-radius)] border border-[var(--as-border)] bg-[var(--as-surface)] px-3 py-2 font-mono text-sm text-[var(--as-fg)] sm:flex-1"
+              }
+            ) : /* @__PURE__ */ jsxs(
+              "select",
+              {
+                value: modal.reasoningCustom ? CUSTOM : modal.reasoningEffort,
+                onChange: (event) => setModal(
+                  (current) => current ? {
+                    ...current,
+                    reasoningCustom: event.target.value === CUSTOM,
+                    reasoningEffort: event.target.value === CUSTOM ? current.reasoningEffort : event.target.value
+                  } : current
+                ),
+                className: "w-full rounded-[var(--as-radius)] border border-[var(--as-border)] bg-[var(--as-surface)] px-3 py-2 text-sm text-[var(--as-fg)] sm:w-40",
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "", children: "\u2014" }),
+                  reasoningEffortOptions.map((option) => /* @__PURE__ */ jsx("option", { value: option, children: option }, option)),
+                  /* @__PURE__ */ jsx("option", { value: CUSTOM, children: customOptionLabel })
+                ]
+              }
+            ) })
+          ] }) : null,
+          /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2", children: [
+            /* @__PURE__ */ jsx(
+              NumberField,
+              {
+                label: temperatureLabel,
+                value: modal.temperature,
+                onChange: (value) => patchField("temperature", value),
+                onClear: () => patchField("temperature", ""),
+                step: "0.1",
+                min: "0",
+                max: "2"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              NumberField,
+              {
+                label: maxTokensLabel,
+                value: modal.maxTokens,
+                onChange: (value) => patchField("maxTokens", value),
+                onClear: () => patchField("maxTokens", ""),
+                step: "256",
+                min: "1"
+              }
+            )
+          ] }),
+          draftError ? /* @__PURE__ */ jsx("p", { role: "alert", className: "text-xs text-[var(--as-danger)]", children: draftError }) : null
+        ] }),
+        /* @__PURE__ */ jsxs(ModalFooter, { children: [
+          modal.mode === "add" && onAddAll ? /* @__PURE__ */ jsxs(
+            Button,
+            {
+              variant: "outline",
+              size: "sm",
+              disabled: remoteState !== "ready" || pendingCount === 0,
+              onClick: () => {
+                onAddAll(
+                  modal.providerId,
+                  (remoteModels ?? []).filter(
+                    (remote) => !models.some(
+                      (model) => model.providerId === modal.providerId && model.externalId === remote.id
+                    )
+                  ).map((remote) => ({
+                    externalId: remote.id,
+                    caps: remote.caps,
+                    reasoningEffort: "",
+                    temperature: null,
+                    maxTokens: null
+                  }))
+                );
+                resetModal();
+              },
+              children: [
+                /* @__PURE__ */ jsx(Plus, { "aria-hidden": true }),
+                addAllLabel,
+                " (",
+                pendingCount,
+                ")"
+              ]
+            }
+          ) : null,
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: resetModal, children: cancelLabel }),
+          /* @__PURE__ */ jsxs(Button, { size: "sm", onClick: submitModal, children: [
+            /* @__PURE__ */ jsx(Check, { "aria-hidden": true }),
+            modal.mode === "add" ? addDraftLabel : saveLabel
+          ] })
+        ] })
+      ] }) });
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        "data-as": "model-registry",
+        className: cn("flex w-full flex-col gap-4", className),
+        children: [
+          providers.map((provider) => {
+            const expanded = expandedProviderId === provider.id;
+            const providerModels = models.filter((model) => model.providerId === provider.id);
+            return /* @__PURE__ */ jsxs(
+              "div",
+              {
+                "data-as": "model-registry-provider",
+                className: cn(
+                  "rounded-[var(--as-radius-lg)] border bg-[var(--as-surface)] transition-all",
+                  expanded ? "border-[var(--as-primary)] shadow-[var(--as-shadow-1)]" : "border-[var(--as-border)]"
+                ),
+                children: [
+                  /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      type: "button",
+                      "aria-expanded": expanded,
+                      onClick: () => toggleProvider(provider.id),
+                      className: "group flex w-full cursor-pointer items-center gap-4 p-4 text-left focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-[var(--as-focus-ring)]",
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            className: cn(
+                              "flex size-9 shrink-0 items-center justify-center rounded-[var(--as-radius)] transition-colors",
+                              expanded ? "bg-[var(--as-primary)] text-[var(--as-primary-fg)]" : "bg-[var(--as-muted)] text-[var(--as-muted-fg)] group-hover:bg-[var(--as-primary)]/10 group-hover:text-[var(--as-primary)]"
+                            ),
+                            children: expanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-5", "aria-hidden": true }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-5", "aria-hidden": true })
+                          }
+                        ),
+                        /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
+                          /* @__PURE__ */ jsxs("span", { className: "flex flex-wrap items-center gap-2 text-sm font-semibold text-[var(--as-fg)]", children: [
+                            provider.name,
+                            provider.type ? /* @__PURE__ */ jsx("span", { className: "rounded-full border border-[var(--as-border)] px-2 py-0.5 text-[10px] font-medium uppercase tracking-wide text-[var(--as-muted-fg)]", children: provider.type }) : null,
+                            providerModels.length ? /* @__PURE__ */ jsxs("span", { className: "rounded-full bg-[var(--as-muted)] px-2.5 py-0.5 text-[10px] font-semibold uppercase tracking-widest text-[var(--as-muted-fg)]", children: [
+                              providerModels.filter((model) => model.enabled).length,
+                              "/",
+                              providerModels.length
+                            ] }) : null
+                          ] }),
+                          provider.baseUrl ? /* @__PURE__ */ jsx("span", { className: "block truncate font-mono text-xs text-[var(--as-muted-fg)]", children: provider.baseUrl }) : null
+                        ] })
+                      ]
+                    }
+                  ),
+                  expanded ? /* @__PURE__ */ jsxs("div", { className: "as-anim-fade flex flex-col gap-2 border-t border-[var(--as-border)] p-4", children: [
+                    providerModels.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--as-muted-fg)]", children: emptyProviderLabel }) : null,
+                    providerModels.map((model) => {
+                      return /* @__PURE__ */ jsxs(
+                        "div",
+                        {
+                          className: cn(
+                            "flex min-w-0 items-center gap-2 rounded-[var(--as-radius-sm)] border border-[var(--as-border)] px-3 py-2 text-sm",
+                            model.missing && "opacity-50"
+                          ),
+                          children: [
+                            /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate font-mono text-xs text-[var(--as-fg)]", children: model.externalId }),
+                            model.missing ? /* @__PURE__ */ jsx("span", { className: "text-xs text-[var(--as-warning)]", children: missingLabel }) : null,
+                            /* @__PURE__ */ jsx(
+                              CapabilityChips,
+                              {
+                                variant: "badge",
+                                caps: model.caps.map(descriptorFor),
+                                selected: model.caps
+                              }
+                            ),
+                            /* @__PURE__ */ jsxs(
+                              Button,
+                              {
+                                variant: "outline",
+                                size: "sm",
+                                "aria-label": `${editLabel} ${model.externalId}`,
+                                onClick: () => openEditModal(model),
+                                children: [
+                                  /* @__PURE__ */ jsx(Pencil, { "aria-hidden": true }),
+                                  editLabel
+                                ]
+                              }
+                            ),
+                            /* @__PURE__ */ jsx(
+                              "button",
+                              {
+                                type: "button",
+                                "aria-label": `${removeLabel} ${model.externalId}`,
+                                onClick: () => onDeleteModel(model),
+                                className: "cursor-pointer rounded-[var(--as-radius-sm)] p-1.5 text-[var(--as-muted-fg)] transition-colors hover:bg-[var(--as-muted)] hover:text-[var(--as-fg)] focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-[var(--as-focus-ring)]",
+                                children: /* @__PURE__ */ jsx(X, { className: "size-4", "aria-hidden": true })
+                              }
+                            )
+                          ]
+                        },
+                        model.id
+                      );
+                    }),
+                    /* @__PURE__ */ jsx("div", { className: "pt-1", children: /* @__PURE__ */ jsxs(
+                      Button,
+                      {
+                        variant: "outline",
+                        size: "sm",
+                        "aria-expanded": modal?.mode === "add" && modal.providerId === provider.id,
+                        onClick: () => openAddModal(provider.id),
+                        children: [
+                          /* @__PURE__ */ jsx(Plus, { "aria-hidden": true }),
+                          addLabel
+                        ]
+                      }
+                    ) })
+                  ] }) : null
+                ]
+              },
+              provider.id
+            );
+          }),
+          providers.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2 py-8 text-center", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-sm text-[var(--as-muted-fg)]", children: providersEmptyLabel }),
+            emptyAction
+          ] }) : null,
+          renderModal()
+        ]
+      }
+    );
+  }
+);
+
+export { ModelRegistry };
+//# sourceMappingURL=chunk-QIXRJMCL.js.map
+//# sourceMappingURL=chunk-QIXRJMCL.js.map